granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix select colors in FilterBar

Browse source
This commit is contained in:
Justin Edmund 2022-12-06 15:54:39 -08:00
parent 1b13f8d51e
commit 0b021629d7
4 changed files with 15 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
components/FilterBar/index.scss
View file

@ -32,10 +32,15 @@
// background-position-y: center; // background-position-y: center;
// background-position-x: 95%; // background-position-x: 95%;
// background-size: $unit * 1.5; // background-size: $unit * 1.5;
background-color: var(--select-contained-bg);
color: $grey-55; color: $grey-55;
font-size: $font-small; font-size: $font-small;
margin: 0; margin: 0;
max-width: 200px; max-width: 200px;
&:hover {
background-color: var(--select-contained-bg-hover);
}
} }
.SelectTrigger { .SelectTrigger {

6
pages/new/index.tsx
View file

@ -32,11 +32,7 @@ const NewRoute: React.FC<Props> = (props: Props) => {
appState.jobSkills = props.jobSkills appState.jobSkills = props.jobSkills
} }
return ( return <Party new={true} raids={props.sortedRaids} pushHistory={callback} />
<div id="Content">
<Party new={true} raids={props.sortedRaids} pushHistory={callback} />
</div>
)
} }
export const getServerSidePaths = async () => { export const getServerSidePaths = async () => {

6
styles/themes.scss
View file

@ -33,6 +33,8 @@
// Light - Selects // Light - Selects
--select-bg: #{$select--bg--light}; --select-bg: #{$select--bg--light};
--select-contained-bg: #{$select--contained--bg--light};
--select-contained-bg-hover: #{$select--contained--bg--light--hover};
--select-separator: #{$select--separator--light}; --select-separator: #{$select--separator--light};
--option-bg-hover: #{$option--bg--light--hover}; --option-bg-hover: #{$option--bg--light--hover};
@ -103,9 +105,9 @@
// Dark - Buttons // Dark - Buttons
--button-bg: #{$button--bg--dark}; --button-bg: #{$button--bg--dark};
--button-bg-hover: #{$button--bg--dark--hover}; --button-bg-hover: #{$button--bg--dark--hover};
--button-contained-bg-hover: #{$button--contained--bg--dark--hover};
--button-bg-disabled: #{$button--bg--dark--disabled}; --button-bg-disabled: #{$button--bg--dark--disabled};
--button-contained-bg: #{$button--contained--bg--dark}; --button-contained-bg: #{$button--contained--bg--dark};
--button-contained-bg-hover: #{$button--contained--bg--dark--hover};
--button-text: #{$button--text--dark}; --button-text: #{$button--text--dark};
--button-text-hover: #{$button--text--dark--hover}; --button-text-hover: #{$button--text--dark--hover};
@ -119,6 +121,8 @@
// Dark - Selects // Dark - Selects
--select-bg: #{$select--bg--dark}; --select-bg: #{$select--bg--dark};
--select-contained-bg: #{$select--contained--bg--dark};
--select-contained-bg-hover: #{$select--contained--bg--dark--hover};
--select-separator: #{$select--separator--dark}; --select-separator: #{$select--separator--dark};
--option-bg-hover: #{$option--bg--dark--hover}; --option-bg-hover: #{$option--bg--dark--hover};

4
styles/variables.scss
View file

@ -159,6 +159,10 @@ $input--bound--bg--dark--hover: $grey-25;
// Color Definitions: Select // Color Definitions: Select
$select--bg--light: $grey-100; $select--bg--light: $grey-100;
$select--bg--dark: $grey-05; $select--bg--dark: $grey-05;
$select--contained--bg--light: $grey-90;
$select--contained--bg--dark: $grey-05;
$select--contained--bg--light--hover: $grey-80;
$select--contained--bg--dark--hover: $grey-00;
$select--separator--light: $grey-90; $select--separator--light: $grey-90;
$select--separator--dark: $grey-00; $select--separator--dark: $grey-00;
$option--bg--light--hover: $grey-90; $option--bg--light--hover: $grey-90;