codePugHacKEr/pages235
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

make buttons slightly bigger on mobile

Browse source
This commit is contained in:
Vitaly Turovsky 2023-10-10 21:04:39 +03:00
commit ff476c05e4
1 changed files with 9 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/react/button.module.css
View file

@ -1,8 +1,9 @@
.button {
--scale: 1;
--txrV: 66px;
position: relative;
width: 200px;
height: 20px;
height: calc(20px * var(--scale));
font-family: minecraft, mojangles, monospace;
font-size: 10px;
color: white;
@ -33,16 +34,16 @@
position: absolute;
top: 0;
width: 50%;
height: 20px;
height: calc(20px * var(--scale));
background: var(--widgets-gui-atlas);
background-size: 256px;
background-position-y: calc(var(--txrV) * -1);
background-size: calc(256px * var(--scale));
background-position-y: calc(var(--txrV) * -1 * var(--scale));
z-index: -1;
}
.button::before {
left: 50%;
background-position-x: calc(-200px + 100%);
background-position-x: calc((-200px * var(--scale)) + 100%);
}
.button::after {
@ -58,8 +59,8 @@
font-size: 14px;
}
/* @media (pointer: coarse) {
@media (pointer: coarse) {
.button {
height: 30px;
--scale: 1.3;
}
} */
}