Use newest version of leaflet fork with stripped down styling. Simplify leaflet-related LiveAtlas styling.

This commit is contained in:
James Lyne 2021-08-27 01:58:05 +01:00
parent 379b4978ae
commit 959db53b11
3 changed files with 30 additions and 63 deletions

10
package-lock.json generated
View File

@ -11,7 +11,7 @@
"dependencies": {
"@kyvg/vue3-notification": "2.3.0",
"@soerenmartius/vue3-clipboard": "^0.1",
"leaflet": "git+https://github.com/JLyne/leaflet.git",
"leaflet": "git+https://github.com/JLyne/leaflet.git#7a83c3590b5b06f38a88fc2a48d5720b33751360",
"normalize-scss": "^7.0",
"vue": "^3.2.6",
"vuex": "^4.0"
@ -2265,7 +2265,8 @@
},
"node_modules/leaflet": {
"version": "1.7.1",
"resolved": "git+ssh://git@github.com/JLyne/leaflet.git#a4e5d4b4b68000a5bce7e7251959aec09bb9dd50",
"resolved": "git+ssh://git@github.com/JLyne/leaflet.git#7a83c3590b5b06f38a88fc2a48d5720b33751360",
"integrity": "sha512-UsgVVEEpu+hsctTlrEuSQeNUqMP8X2cfWc5yac4PLFDVeYSpXrH0NODj47kmT16VybOVKGSykA4UYRcNV4iAMg==",
"license": "BSD-2-Clause"
},
"node_modules/levn": {
@ -5595,8 +5596,9 @@
}
},
"leaflet": {
"version": "git+ssh://git@github.com/JLyne/leaflet.git#a4e5d4b4b68000a5bce7e7251959aec09bb9dd50",
"from": "leaflet@git+https://github.com/JLyne/leaflet.git"
"version": "git+ssh://git@github.com/JLyne/leaflet.git#7a83c3590b5b06f38a88fc2a48d5720b33751360",
"integrity": "sha512-UsgVVEEpu+hsctTlrEuSQeNUqMP8X2cfWc5yac4PLFDVeYSpXrH0NODj47kmT16VybOVKGSykA4UYRcNV4iAMg==",
"from": "leaflet@git+https://github.com/JLyne/leaflet.git#7a83c3590b5b06f38a88fc2a48d5720b33751360"
},
"levn": {
"version": "0.4.1",

View File

@ -13,7 +13,7 @@
"dependencies": {
"@kyvg/vue3-notification": "2.3.0",
"@soerenmartius/vue3-clipboard": "^0.1",
"leaflet": "git+https://github.com/JLyne/leaflet.git",
"leaflet": "git+https://github.com/JLyne/leaflet.git#7a83c3590b5b06f38a88fc2a48d5720b33751360",
"normalize-scss": "^7.0",
"vue": "^3.2.6",
"vuex": "^4.0"

View File

@ -49,6 +49,17 @@
border-radius: 0;
border-bottom: 0.1rem solid var(--border-color);
&:first-child {
border-top-left-radius: var(--border-radius);
border-top-right-radius: var(--border-radius);
}
&:last-child {
border-bottom-left-radius: var(--border-radius);
border-bottom-right-radius: var(--border-radius);
border-bottom: none;
}
&.leaflet-disabled {
background-color: var(--background-disabled);
cursor: not-allowed;
@ -69,41 +80,22 @@
}
}
.leaflet-touch {
.leaflet-bar, .leaflet-control-layers {
border: none;
}
.leaflet-control-layers-toggle {
background-image: none;
.leaflet-control-button,
.leaflet-control-layers-toggle,
.leaflet-control-logo,
.leaflet-bar a {
@extend %button;
line-height: 3.5rem;
width: var(--ui-button-size);
height: var(--ui-button-size);
}
.leaflet-top {
.leaflet-bar a {
height: var(--ui-button-size);
width: var(--ui-button-size);
line-height: var(--ui-button-size);
&:first-child {
border-top-left-radius: var(--border-radius);
border-top-right-radius: var(--border-radius);
}
&:last-child {
border-bottom-left-radius: var(--border-radius);
border-bottom-right-radius: var(--border-radius);
}
}
}
}
.leaflet-control-button,
.leaflet-control-layers-toggle {
@extend %button;
width: var(--ui-button-size);
height: var(--ui-button-size);
.leaflet-control-zoom {
flex-shrink: 0;
a {
font-family: sans-serif; /* +/- look better */
}
}
.leaflet-control-coordinates {
@ -191,8 +183,6 @@
}
.leaflet-control-logo {
width: var(--ui-button-size);
height: var(--ui-button-size);
flex-shrink: 0;
a {
@ -211,18 +201,10 @@
.leaflet-left {
padding-left: var(--ui-element-spacing);
.leaflet-control {
margin: 0;
}
}
.leaflet-right {
padding-right: var(--ui-element-spacing);
.leaflet-control {
margin: 0;
}
}
.leaflet-top {
@ -250,17 +232,6 @@
.leaflet-bar {
flex-direction: column;
box-shadow: var(--box-shadow);
a {
width: var(--ui-button-size);
height: var(--ui-button-size);
line-height: var(--ui-button-size);
}
}
.leaflet-control-layers {
box-shadow: var(--box-shadow);
}
.leaflet-control-logo {
@ -293,12 +264,6 @@
}
.leaflet-control-zoom {
flex-shrink: 0;
a {
font-family: sans-serif; /* +/- look better */
}
@media (max-width: 480px) and (pointer: coarse), (max-height: 480px) and (pointer: coarse), (max-height: 400px) {
display: none;