Removed all style elements which aren't color or text styling

This commit is contained in:
Kevin Veen-Birkenbach 2025-02-07 15:07:43 +01:00
parent b9d29ee06d
commit 26ffabf0a5

View File

@ -1,4 +1,4 @@
/* Global Theming Styles Overrides Application Defaults */ /* Global Theming Styles Color and Shadow Variables */
:root { :root {
--primary-color: {{ global_theming.css.colors.primary }}; --primary-color: {{ global_theming.css.colors.primary }};
--secondary-color: {{ global_theming.css.colors.secondary }}; --secondary-color: {{ global_theming.css.colors.secondary }};
@ -16,7 +16,7 @@
--border-color: {{ global_theming.css.colors.border }}; --border-color: {{ global_theming.css.colors.border }};
} }
/* Bootstrap Overrides */ /* Bootstrap Overrides (Color/Shadow Variables Only) */
:root { :root {
--bs-primary: var(--primary-color); --bs-primary: var(--primary-color);
--bs-secondary: var(--secondary-color); --bs-secondary: var(--secondary-color);
@ -30,48 +30,34 @@
--bs-btn-color: var(--button-text-color); --bs-btn-color: var(--button-text-color);
} }
/* Ensure Styles Take Priority */ /* Global Defaults (Colors Only) */
*,
*::before,
*::after {
all: unset;
all: revert;
}
/* Global Defaults */
body { body {
background-color: var(--background-color) !important; background-color: var(--background-color) !important;
color: var(--text-color) !important; color: var(--text-color) !important;
/* Use the corporate-design font family */ /* Use the corporate-design font family */
font-family: "Liberation Sans", Arial, sans-serif; font-family: "Liberation Sans", Arial, sans-serif;
line-height: 1.6;
} }
/* Links */ /* Links (Color Only) */
a { a {
color: var(--link-color) !important; color: var(--link-color) !important;
text-decoration: none;
}
a:hover {
text-decoration: underline;
} }
/* Buttons */ /* Buttons (Background, Text, Border, and Shadow) */
button, .btn { button, .btn {
background-color: var(--primary-color) !important; background-color: var(--primary-color) !important;
color: var(--button-text-color) !important; color: var(--button-text-color) !important;
border: 1px solid var(--border-color) !important; border: 1px solid var(--border-color) !important;
box-shadow: 2px 2px 5px var(--shadow-color) !important; box-shadow: 2px 2px 5px var(--shadow-color) !important;
padding: 10px 15px;
border-radius: 5px;
font-weight: bold;
cursor: pointer; cursor: pointer;
} }
button:hover, .btn:hover { button:hover, .btn:hover {
filter: brightness(0.9); filter: brightness(0.9);
} }
/* Success, Warning, Error States */
/* States: Success, Warning, Error, Info (Background and Text Colors) */
.success, .alert-success { .success, .alert-success {
background-color: var(--success-color) !important; background-color: var(--success-color) !important;
color: var(--text-color) !important; color: var(--text-color) !important;
@ -89,21 +75,18 @@ button:hover, .btn:hover {
color: var(--text-color) !important; color: var(--text-color) !important;
} }
/* Inputs & Forms */ /* Inputs & Forms (Background, Text, Border, and Focus Shadow) */
input, textarea, select { input, textarea, select {
background-color: var(--background-color) !important; background-color: var(--background-color) !important;
color: var(--text-color) !important; color: var(--text-color) !important;
border: 1px solid var(--border-color) !important; border-color: var(--border-color) !important;
padding: 8px;
border-radius: 4px;
} }
input:focus, textarea:focus, select:focus { input:focus, textarea:focus, select:focus {
border-color: var(--primary-color) !important; border-color: var(--primary-color) !important;
outline: none;
box-shadow: 0 0 5px var(--shadow-color); box-shadow: 0 0 5px var(--shadow-color);
} }
/* Navigation */ /* Navigation (Background and Text Colors) */
.navbar, .navbar-light, .navbar-dark { .navbar, .navbar-light, .navbar-dark {
background-color: var(--primary-color) !important; background-color: var(--primary-color) !important;
color: var(--button-text-color) !important; color: var(--button-text-color) !important;
@ -112,13 +95,8 @@ input:focus, textarea:focus, select:focus {
color: var(--button-text-color) !important; color: var(--button-text-color) !important;
} }
/* Tables */ /* Tables (Borders and Header Colors) */
table {
width: 100%;
border-collapse: collapse;
}
th, td { th, td {
padding: 10px;
border: 1px solid var(--border-color); border: 1px solid var(--border-color);
} }
thead { thead {
@ -126,15 +104,14 @@ thead {
color: var(--button-text-color); color: var(--button-text-color);
} }
/* Cards / Containers */ /* Cards / Containers (Background, Border, and Shadow) */
.card { .card {
background-color: var(--background-color) !important; background-color: var(--background-color) !important;
box-shadow: 2px 2px 10px var(--shadow-color) !important; box-shadow: 2px 2px 10px var(--shadow-color) !important;
border: 1px solid var(--border-color); border: 1px solid var(--border-color);
border-radius: 8px;
} }
/* Headings */ /* Headings (Text Color) */
h1, h2 { h1, h2 {
color: var(--text-color); color: var(--text-color);
} }
@ -146,7 +123,7 @@ h1, h2 {
} }
} }
/* Dark Mode */ /* Dark Mode Adjustments (Background and Text Colors) */
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
body { body {
background-color: var(--background-dark-color) !important; background-color: var(--background-dark-color) !important;
@ -158,13 +135,7 @@ h1, h2 {
} }
} }
/* Enforce Style Priority */ /* Dropdown Menu and Submenu (Background, Text, and Shadow) */
html, body, * {
/* No additional !important directives */
}
/* Dropdown Menu and Submenu */
.navbar .dropdown-menu, .navbar .dropdown-menu,
.nav-item .dropdown-menu { .nav-item .dropdown-menu {
background-color: var(--background-color) !important; background-color: var(--background-color) !important;
@ -175,20 +146,15 @@ html, body, * {
.dropdown-item { .dropdown-item {
color: var(--text-color) !important; color: var(--text-color) !important;
background-color: var(--background-color) !important; background-color: var(--background-color) !important;
padding: 8px 12px;
} }
.dropdown-item:hover, .dropdown-item:hover,
.dropdown-item:focus { .dropdown-item:focus {
background-color: var(--secondary-color) !important; background-color: var(--secondary-color) !important;
color: var(--text-color) !important; color: var(--text-color) !important;
text-decoration: none;
} }
/** Portfolio Specific **/ /* Portfolio Specific: Input Field Text Color */
/* Always use a light text color in the input field */
#dynamicModalContent { #dynamicModalContent {
color: var(--button-text-color) !important; color: var(--button-text-color) !important;
} }