smedmunds/TriggerFrontend
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

Theme changes

Browse Source
This commit is contained in:
Sean Edmunds
2025-04-28 15:59:56 -05:00
parent 19b793fbf9
commit 416c8611ec
53 changed files with 392 additions and 428 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
src/styles/Select.module.css
View File

@@ -1,60 +1,60 @@
.menuSelectLabel {
margin-bottom: 5px !important;
color: var(--color-text-pri) !important;
color: var(--mantine-color-primary-0) !important;
font-size: 14px !important;
}
.menuSelectInput {
border-color: var(--color-border) !important;
background-color: var(--color-background) !important;
color: var(--color-text-pri) !important;
border-color: var(--mantine-color-border-0) !important;
background-color: var(--mantine-color-background-0) !important;
color: var(--mantine-color-primary-0) !important;
&:focus {
border-color: var(--color-text-pri) !important;
border-color: var(--mantine-color-primary-0) !important;
}
display: flex !important;
overflow: clip !important;
height: 36px !important;
&::placeholder {
color: var(--color-text-acc) !important;
color: var(--mantine-color-accent-0) !important;
}
}
.menuSelectOptions {
color: var(--color-text-pri) !important;
color: var(--mantine-color-primary-0) !important;
}
.menuSelectOption {
color: var(--color-text-pri) !important;
color: var(--mantine-color-primary-0) !important;
font-size: 14px !important;
&[data-checked] {
background-color: var(--color-text-acc) !important;
color: var(--color-background) !important;
background-color: var(--mantine-color-accent-0) !important;
color: var(--mantine-color-background-0) !important;
&:hover {
background-color: var(--color-text-acc) !important;
color: var(--color-background) !important;
background-color: var(--mantine-color-accent-0) !important;
color: var(--mantine-color-background-0) !important;
}
}
&:hover {
background-color: var(--color-text-pri) !important;
color: var(--color-background) !important;
background-color: var(--mantine-color-primary-0) !important;
color: var(--mantine-color-background-0) !important;
}
}
.dropdown {
border: none !important;
background-color: var(--color-search-background) !important;
background-color: var(--mantine-color-search-0) !important;
backdrop-filter: blur(10px) !important;
}
.options {
.option {
transition: all .1s ease !important;
color: var(--color-text-acc);
color: var(--mantine-color-accent-0);
font-size: 18px;
&[data-combobox-selected="true"] {
background-color: var(--color-background);
background-color: var(--mantine-color-background-0);
}
&:hover {
background-color: var(--color-background);
background-color: var(--mantine-color-background-0);
}
}
}
@@ -64,9 +64,9 @@
justify-content: center;
.input {
border: 0;
border-bottom: thin solid var(--color-border);
border-bottom: thin solid var(--mantine-color-border-0);
background-color: transparent;
color: var(--color-text-pri);
color: var(--mantine-color-primary-0);
font-style: italic;
font-size: 0.8em;
height: 3.5em;
@@ -76,14 +76,10 @@
padding-right: 1em;
text-align: center;
&[data-active="true"] {
background-color: color-mix(
in srgb,
var(--color-search-background),
transparent 50%
);
border-color: var(--color-border);
background-color: color-mix(in srgb, var(--mantine-color-search-0), transparent 50%);
border-color: var(--mantine-color-border-0);
outline: none;
color: var(--color-text-pri);
color: var(--mantine-color-primary-0);
font-style: normal;
font-weight: 500;
font-size: 1.2em;
@@ -97,7 +93,7 @@
}
.section {
transition: opacity 0.1s 0s ease;
color: var(--color-border);
color: var(--mantine-color-border-0);
width: auto;
padding-left: .5rem;
opacity: 0;
@@ -105,10 +101,10 @@
}
.wrapper:focus-within {
.input {
background-color: var(--color-search-background);
border-color: var(--color-border);
background-color: var(--mantine-color-search-0);
border-color: var(--mantine-color-border-0);
outline: none;
color: var(--color-text-pri);
color: var(--mantine-color-primary-0);
font-style: normal;
font-weight: 500;
font-size: 1.2em;
@@ -119,10 +115,10 @@
border-bottom-left-radius: .25em;
border-bottom-right-radius: .25em;
&[data-active="true"] {
background-color: var(--color-search-background);
border-color: var(--color-border);
background-color: var(--mantine-color-search-0);
border-color: var(--mantine-color-border-0);
outline: none;
color: var(--color-text-pri);
color: var(--mantine-color-primary-0);
font-style: normal;
font-weight: 500;
font-size: 1.2em;
@@ -136,7 +132,7 @@
}
.section {
transition: opacity 0.4s 0.4s ease;
color: var(--color-border);
color: var(--mantine-color-border-0);
width: auto;
padding-left: .5rem;
opacity: 1;