monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2024-09-20 15:26:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: replace set columns with repeat auto-fit and minmax

Browse source
This commit is contained in:
Miodec 2023-09-25 13:48:30 +01:00
parent 0aab73ad67
commit df98b84a5d
2 changed files with 2 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
frontend/src/styles/settings.scss
View file

@ -212,8 +212,7 @@
.buttons {
display: grid;
grid-auto-flow: column;
grid-auto-columns: 1fr;
grid-template-columns: repeat(auto-fit, minmax(4.5rem, 1fr));
gap: 0.5rem;
grid-area: buttons;
&.vertical {
@ -452,17 +451,11 @@
.buttons {
margin-left: 0;
grid-auto-flow: dense;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-template-columns: repeat(auto-fit, minmax(13.5rem, 1fr));
gap: 0.5rem;
}
}
&.randomTheme .buttons,
&.highlightMode .buttons {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
}
}

22
frontend/src/styles/z_media-queries.scss
View file

@ -60,9 +60,6 @@
#quoteSearchPopupWrapper #quoteSearchPopup #quoteSearchControlsWrapper {
grid-template-columns: 1fr 1fr max-content;
}
// .pageSettings .section.themes .buttons {
// grid-template-columns: 1fr 1fr 1fr;
// }
#customTextPopupWrapper #customTextPopup .buttonsTop {
grid-template-columns: 1fr 1fr;
}
@ -79,12 +76,6 @@
font-size: 0.75rem;
}
}
.pageSettings .section.fullWidth .buttons {
grid-template-columns: 1fr 1fr 1fr;
}
// .pageSettings .section.themes .buttons {
// grid-template-columns: 1fr 1fr;
// }
#quoteSearchPopupWrapper #quoteSearchPopup #quoteSearchControlsWrapper {
grid-template-columns: 1fr;
}
@ -676,13 +667,6 @@
}
}
}
.pageSettings .section.fullWidth .buttons {
grid-template-columns: 1fr 1fr;
}
// .pageSettings .section.themes .buttons {
// grid-template-columns: 1fr;
// }
}
//600px
@ -855,12 +839,6 @@
}
.pageSettings {
.section.fullWidth .buttons {
grid-template-columns: 1fr;
}
.section .buttons {
grid-auto-flow: row;
}
.section.customBackgroundFilter .groups .group {
grid-template-columns: auto 1fr;
.title {