Merged css and js

compressed-week-view
Antonio De Lucreziis 2 years ago
commit f90b60fbd9

@ -103,7 +103,10 @@ const App = ({}) => {
setEventi(eventi) setEventi(eventi)
}, [source]) }, [source])
const [theme, setTheme] = useState(localStorage.getItem('theme') ?? 'light') const [theme, setTheme] = useState(
localStorage.getItem('theme') ??
(window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light')
)
document.body.classList.toggle('dark-mode', theme === 'dark') document.body.classList.toggle('dark-mode', theme === 'dark')
localStorage.setItem('theme', theme) localStorage.setItem('theme', theme)

@ -49,6 +49,12 @@ $device-s-width: 600px;
// Elements // Elements
a,
a:visited {
color: var(--text-500);
font-weight: 400;
}
code { code {
font-size: 90%; font-size: 90%;
} }
@ -175,6 +181,7 @@ button,
select { select {
border: none; border: none;
background: none; background: none;
color: var(--text-500);
appearance: none; appearance: none;
font-family: inherit; font-family: inherit;
@ -366,8 +373,7 @@ body {
gap: 0.75rem; gap: 0.75rem;
@media screen and (max-width: $device-s-width) and (orientation: portrait), @media screen and (max-width: $device-s-width), (pointer: coarse) {
screen and (max-height: $device-s-width) and (orientation: landscape) {
display: none; display: none;
} }
} }
@ -677,8 +683,7 @@ body {
border-top: 1px solid var(--border-500); border-top: 1px solid var(--border-500);
@media screen and (max-width: $device-s-width) and (orientation: portrait), @media screen and (max-width: $device-s-width), (pointer: coarse) {
screen and (max-height: $device-s-width) and (orientation: landscape) {
writing-mode: vertical-lr; writing-mode: vertical-lr;
} }
@ -903,8 +908,7 @@ body {
// not on mobile // not on mobile
@media screen and (min-width: $device-s-width) and (orientation: portrait), @media screen and (min-width: $device-s-width) and (pointer: fine) {
screen and (min-height: $device-s-width) and (orientation: landscape) {
.mobile { .mobile {
display: none; display: none;
} }
@ -916,8 +920,7 @@ body {
// on mobile // on mobile
@media screen and (max-width: $device-s-width) and (orientation: portrait), @media screen and (max-width: $device-s-width), (pointer: coarse) {
screen and (max-height: $device-s-width) and (orientation: landscape) {
.toolbar { .toolbar {
padding: 0.75rem 1rem 0.75rem 0.75rem; padding: 0.75rem 1rem 0.75rem 0.75rem;
} }

Loading…
Cancel
Save