Compare commits

...

1 Commits

Author SHA1 Message Date
Pujit Mehrotra
f184711ff7 fix(css): rm overrides for webgui rules
Because these overrides were underspecified (ie didn't apply to third
party component css), and because the webgui currently doesn't use css
layering, exclusions have been made in the webgui's
default-base.css so they apply broadly, rendering these overrides incorrect and unnecessary.
2025-12-09 14:14:48 -05:00

View File

@@ -1,4 +1,4 @@
/*
/*
* Tailwind v4 configuration with Nuxt UI v3
* Using scoped selectors to prevent breaking Unraid WebGUI
*/
@@ -9,7 +9,7 @@
/* Import theme and utilities only - no global preflight */
@import "tailwindcss/theme.css" layer(theme);
@import "tailwindcss/utilities.css" layer(utilities);
/* @import "@nuxt/ui"; temporarily disabled */
@import "@nuxt/ui";
@import 'tw-animate-css';
@import '../../../@tailwind-shared/index.css';
@@ -17,7 +17,7 @@
@source "../**/*.{vue,ts,js,tsx,jsx}";
@source "../../../unraid-ui/src/**/*.{vue,ts,js,tsx,jsx}";
/*
/*
* Scoped base styles for .unapi elements only
* Import Tailwind's preflight into our custom layer and scope it
*/
@@ -28,122 +28,13 @@
@import "tailwindcss/preflight.css";
}
/* Override Unraid's button styles for Nuxt UI components */
.unapi button {
/* Reset Unraid's button styles */
margin: 0 !important;
padding: 0;
border: none;
background: none;
}
/* Accessible focus styles for keyboard navigation */
.unapi button:focus-visible {
outline: 2px solid #ff8c2f;
outline-offset: 2px;
}
/* Restore button functionality while removing Unraid's forced styles */
.unapi button:not([role="switch"]) {
display: inline-flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.2s;
}
/* Ensure Nuxt UI modal/slideover close buttons work properly */
.unapi [role="dialog"] button,
.unapi [data-radix-collection-item] button {
margin: 0 !important;
background: transparent !important;
border: none !important;
}
/* Focus styles for dialog buttons */
.unapi [role="dialog"] button:focus-visible,
.unapi [data-radix-collection-item] button:focus-visible {
outline: 2px solid #ff8c2f;
outline-offset: 2px;
}
/* Reset figure element for logo */
.unapi figure {
margin: 0;
padding: 0;
}
/* Reset heading elements - only margin/padding */
.unapi h1,
.unapi h2,
.unapi h3,
.unapi h4,
.unapi h5 {
margin: 0;
padding: 0;
}
/* Reset paragraph element */
.unapi p {
margin: 0;
padding: 0;
text-align: unset;
}
/* Reset UL styles to prevent default browser styling */
.unapi ul {
padding-inline-start: 0;
list-style-type: none;
}
/* Reset toggle/switch button backgrounds */
.unapi button[role="switch"],
.unapi button[role="switch"][data-state="checked"],
.unapi button[role="switch"][data-state="unchecked"] {
background-color: transparent;
background: transparent;
border: 1px solid #ccc;
}
/* Style for checked state */
.unapi button[role="switch"][data-state="checked"] {
background-color: #ff8c2f; /* Unraid orange */
}
/* Style for unchecked state */
.unapi button[role="switch"][data-state="unchecked"] {
background-color: #e5e5e5;
}
/* Dark mode toggle styles */
.unapi.dark button[role="switch"][data-state="unchecked"],
.dark .unapi button[role="switch"][data-state="unchecked"] {
background-color: #333;
border-color: #555;
}
/* Toggle thumb/handle */
.unapi button[role="switch"] span {
background-color: white;
}
}
/* Override link styles inside .unapi */
.unapi a,
.unapi a:link,
.unapi a:visited {
color: inherit;
text-decoration: none;
}
.unapi a:hover,
.unapi a:focus {
text-decoration: underline;
color: inherit;
}
/* Note: Tailwind utilities will apply globally but should be used with .unapi prefix in HTML */
/* Ensure unraid-modals container has extremely high z-index */
unraid-modals.unapi {
position: relative;