lifning/ws4kp
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

switch from css zoom to transform-scale

Browse source
This commit is contained in:
Matt Walsh 2023-05-31 22:57:36 -05:00
parent 3b050073ed
commit 2c010a9a32
6 changed files with 11 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
server/scripts/modules/navigation.mjs
View file

@ -274,9 +274,9 @@ const resize = () => {
const scale = Math.min(widthZoomPercent, heightZoomPercent);
if (scale < 1.0 || document.fullscreenElement) {
document.querySelector('#container').style.zoom = scale;
document.querySelector('#container').style.transform = `scale(${scale})`;
} else {
document.querySelector('#container').style.zoom = 1;
document.querySelector('#container').style.transform = 'unset';
}
};

4
server/scripts/modules/regionalforecast.mjs
View file

@ -167,9 +167,7 @@ class RegionalForecast extends WeatherDisplay {
// draw the map
const scale = 640 / (offsetXY.x * 2);
const map = this.elem.querySelector('.map');
map.style.zoom = scale;
map.style.top = `-${sourceXY.y}px`;
map.style.left = `-${sourceXY.x}px`;
map.style.transform = `scale(${scale}) translate(-${sourceXY.x}px, -${sourceXY.y}px)`;
const cities = data.map((city) => {
const fill = {};

2
server/styles/main.css
View file

File diff suppressed because one or more lines are too long

2
server/styles/main.css.map
View file

File diff suppressed because one or more lines are too long

5
server/styles/scss/_page.scss
View file

@ -97,6 +97,7 @@ body {
}
.autocomplete-suggestions {
background-color: #ffffff;
border: 1px solid #000000;
@ -284,6 +285,7 @@ body {
height: 480px;
overflow: hidden;
background-image: url(../images/BackGround1_1.png);
transform-origin: 0 0;
}
@ -291,6 +293,7 @@ body {
background-image: none;
width: unset;
height: unset;
transform-origin: unset;
}
#loading {
@ -373,7 +376,7 @@ body {
}
#divTwcBottom img {
zoom: 75%;
transform: scale(0.75);
}
#divTwc:fullscreen {

1
server/styles/scss/_regional-forecast.scss
View file

@ -12,6 +12,7 @@
.map {
position: absolute;
transform-origin: 0 0;
}
.location {