diff --git a/src/assets/icons/link.svg b/src/assets/icons/link.svg new file mode 100644 index 0000000..ce487f1 --- /dev/null +++ b/src/assets/icons/link.svg @@ -0,0 +1,63 @@ + + + + + +Created by potrace 1.10, written by Peter Selinger 2001-2011 + + + image/svg+xml + + + + + + + + diff --git a/src/assets/images/link.png b/src/assets/images/link.png deleted file mode 100644 index b7a7a1f..0000000 Binary files a/src/assets/images/link.png and /dev/null differ diff --git a/src/components/map/control/LinkControl.vue b/src/components/map/control/LinkControl.vue index 700d747..8015827 100644 --- a/src/components/map/control/LinkControl.vue +++ b/src/components/map/control/LinkControl.vue @@ -1,32 +1,23 @@ - - \ No newline at end of file diff --git a/src/leaflet/control/LinkControl.ts b/src/leaflet/control/LinkControl.ts index 5dbb432..a36ace9 100644 --- a/src/leaflet/control/LinkControl.ts +++ b/src/leaflet/control/LinkControl.ts @@ -1,5 +1,6 @@ import L, {ControlOptions} from 'leaflet'; import {useStore} from "@/store"; +import linkIcon from '@/assets/icons/link.svg'; export class LinkControl extends L.Control { // @ts-ignore @@ -16,6 +17,11 @@ export class LinkControl extends L.Control { linkButton.type = 'button'; linkButton.title = 'Link'; + linkButton.innerHTML = ` + + + `; + linkButton.addEventListener('click', () => { const projection = useStore().state.currentProjection; console.log(projection.latLngToLocation(this._map!.getCenter(), 64)); diff --git a/src/scss/leaflet/_controls.scss b/src/scss/leaflet/_controls.scss index a2b9af9..28b1e0a 100644 --- a/src/scss/leaflet/_controls.scss +++ b/src/scss/leaflet/_controls.scss @@ -57,7 +57,6 @@ @extend %button; width: 5rem; height: 5rem; - background: $global-background url('../assets/images/link.png') no-repeat center; background-size: 3.2rem 3.2rem; }