58 lines
1.2 KiB
CSS
Executable File
58 lines
1.2 KiB
CSS
Executable File
/* Add any app-specific styles here */
|
|
|
|
/* Use the GM Kit banner as a subtle site-wide background. */
|
|
.App {
|
|
/* layered: dark gradient overlay will be applied inline in App.js to avoid webpack resolving /gmkit at build time */
|
|
background-repeat: no-repeat;
|
|
background-position: center top;
|
|
background-size: cover;
|
|
background-attachment: fixed;
|
|
background-blend-mode: overlay;
|
|
}
|
|
|
|
/* Ensure overlaying content remains readable on top of the image */
|
|
.App .mx-auto, .App .max-w-6xl {
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
|
|
.mobile-nav {
|
|
-webkit-overflow-scrolling: touch;
|
|
scrollbar-width: thin;
|
|
}
|
|
|
|
.mobile-nav-item {
|
|
flex: 0 0 auto;
|
|
padding: 0.5rem 0.85rem;
|
|
font-size: 0.875rem;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.App input,
|
|
.App select,
|
|
.App textarea,
|
|
.App button {
|
|
max-width: 100%;
|
|
}
|
|
|
|
/* Low-level fallback for very small screens: reduce background intensity */
|
|
@media (max-width: 640px) {
|
|
.App {
|
|
background-attachment: scroll;
|
|
background-position: center center;
|
|
background-size: auto 120%;
|
|
}
|
|
|
|
.mobile-nav {
|
|
margin-left: -0.75rem;
|
|
margin-right: -0.75rem;
|
|
padding-left: 0.75rem;
|
|
padding-right: 0.75rem;
|
|
}
|
|
|
|
.mobile-nav-item {
|
|
padding: 0.45rem 0.7rem;
|
|
font-size: 0.8125rem;
|
|
}
|
|
}
|