diff --git a/src/resources/css/app.css b/src/resources/css/app.css index ee613b4..5222793 100644 --- a/src/resources/css/app.css +++ b/src/resources/css/app.css @@ -48,6 +48,16 @@ --text-danger-color-gradient-end: hsl(344, 100%, 70%); } +@media (prefers-reduced-motion) { + *, *::before, *::after { + animation-duration: 0s !important; + /* additional recommendation */ + transition: none !important; + scroll-behavior: auto !important; + } +} + + body { background-image: linear-gradient(100deg, hsl(0, 0%, 98%), hsl(240, 5.9%, 90%)); color: hsl(240, 5.9%, 10%); @@ -57,6 +67,13 @@ body { overflow: auto; scrollbar-gutter: stable both-edges; text-rendering: optimizeLegibility; + font-size: 1.25rem; + line-height: 1.1; + + /* these will clamp the width between the two values + and keep it at 90% of the max when between them */ + max-width: clamp(320px, 90%, 1280px); + margin: auto; } html, body {