mirror of
https://github.com/unraid/api.git
synced 2026-04-29 03:29:34 -05:00
Eli Bosley
aa9648105f
- Modified the CSS patching script to enhance compatibility by updating echo statements and adjusting the patching logic. - Removed unnecessary layer wrapping in the CSS content, simplifying the structure while maintaining style specificity. - Updated comments for clarity on the purpose of the compatibility patch and its impact on CSS management.
165 lines
4.3 KiB
CSS
165 lines
4.3 KiB
CSS
/*
|
|
* Tailwind v4 configuration without global preflight
|
|
* This prevents Tailwind from applying global resets that affect webgui
|
|
*/
|
|
|
|
/* Define layers for Tailwind v4 */
|
|
@layer theme, base, components, utilities;
|
|
|
|
/* Import only the parts of Tailwind we need - NO PREFLIGHT */
|
|
@import 'tailwindcss/theme.css' layer(theme);
|
|
@import 'tailwindcss/utilities.css' layer(utilities);
|
|
@import 'tw-animate-css';
|
|
@import '../../@tailwind-shared/index.css';
|
|
@import '@nuxt/ui';
|
|
|
|
/* Scan unraid-ui package from linked directory for class usage */
|
|
@source "../../unraid-ui/dist/**/*.{js,mjs}";
|
|
@source "../../unraid-ui/src/**/*.{vue,ts}";
|
|
@source "../**/*.{vue,ts,js}";
|
|
|
|
/*
|
|
* Scoped resets - only apply within our components
|
|
* This replaces Tailwind's global preflight
|
|
* Using high specificity to override webgui styles
|
|
*/
|
|
@layer base {
|
|
/* Container with proper isolation */
|
|
.unraid-reset {
|
|
isolation: isolate;
|
|
display: contents;
|
|
|
|
/* Set base typography that webgui can't override */
|
|
font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
font-size: 16px;
|
|
line-height: 1.5;
|
|
color: rgb(17 24 39);
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
|
|
/* Scoped box-sizing reset */
|
|
.unraid-reset *,
|
|
.unraid-reset *::before,
|
|
.unraid-reset *::after {
|
|
box-sizing: border-box;
|
|
border-width: 0;
|
|
border-style: solid;
|
|
border-color: currentColor;
|
|
}
|
|
|
|
/* Scoped margin reset */
|
|
.unraid-reset blockquote,
|
|
.unraid-reset dl,
|
|
.unraid-reset dd,
|
|
.unraid-reset h1,
|
|
.unraid-reset h2,
|
|
.unraid-reset h3,
|
|
.unraid-reset h4,
|
|
.unraid-reset h5,
|
|
.unraid-reset h6,
|
|
.unraid-reset hr,
|
|
.unraid-reset figure,
|
|
.unraid-reset p,
|
|
.unraid-reset pre {
|
|
margin: 0;
|
|
}
|
|
|
|
/* Dark mode */
|
|
.dark .unraid-reset {
|
|
color: rgb(243 244 246);
|
|
}
|
|
|
|
/* Inherit typography through all elements */
|
|
.unraid-reset * {
|
|
font-family: inherit;
|
|
font-size: inherit;
|
|
line-height: inherit;
|
|
color: inherit;
|
|
}
|
|
|
|
/* Override webgui button styles with higher specificity */
|
|
.unraid-reset button,
|
|
.unraid-reset button[type="button"],
|
|
.unraid-reset button[type="submit"],
|
|
.unraid-reset button[type="reset"],
|
|
.unraid-reset input[type="button"],
|
|
.unraid-reset input[type="submit"],
|
|
.unraid-reset input[type="reset"],
|
|
.unraid-reset a.button {
|
|
/* Reset ALL webgui button properties including CSS variables */
|
|
font-family: inherit !important;
|
|
font-size: inherit !important;
|
|
font-weight: normal !important;
|
|
letter-spacing: normal !important;
|
|
text-transform: none !important;
|
|
min-width: auto !important;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
text-align: center !important;
|
|
text-decoration: none !important;
|
|
white-space: nowrap !important;
|
|
cursor: pointer !important;
|
|
outline: none !important;
|
|
border-radius: 0 !important;
|
|
border: none !important;
|
|
color: inherit !important;
|
|
background: transparent !important;
|
|
background-size: auto !important;
|
|
appearance: none !important;
|
|
box-sizing: border-box !important;
|
|
|
|
/* Override CSS variables from webgui */
|
|
--button-border: none !important;
|
|
--button-text-color: inherit !important;
|
|
--button-background: transparent !important;
|
|
--button-background-size: auto !important;
|
|
}
|
|
|
|
/* Form elements */
|
|
.unraid-reset input:not([type="button"]):not([type="submit"]):not([type="reset"]),
|
|
.unraid-reset select,
|
|
.unraid-reset textarea {
|
|
font-family: inherit;
|
|
font-size: inherit;
|
|
color: inherit;
|
|
appearance: none;
|
|
background: transparent;
|
|
border: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
/* Links */
|
|
.unraid-reset a:not(.button) {
|
|
color: inherit;
|
|
text-decoration: none;
|
|
cursor: pointer;
|
|
}
|
|
|
|
/* SVG icons */
|
|
.unraid-reset svg {
|
|
fill: currentColor;
|
|
}
|
|
|
|
/* Hidden elements */
|
|
.unraid-reset [hidden] {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
|
|
/* Modal z-index management - scoped to Unraid containers */
|
|
.unraid [role="dialog"],
|
|
.unraid [data-headlessui-portal],
|
|
.unraid #teleports > *,
|
|
.unraid #modals > *,
|
|
.unraid unraid-modals > * {
|
|
z-index: 99999 !important;
|
|
}
|
|
|
|
/* Modal backdrops - scoped to Unraid containers */
|
|
.unraid .fixed.inset-0[aria-hidden="true"],
|
|
.unraid [data-headlessui-portal] .fixed.inset-0 {
|
|
z-index: 99998 !important;
|
|
} |