Final changes for now

This commit is contained in:
Neshura 2022-12-18 23:19:21 +01:00
parent 08ac36c7fc
commit 7a99bd2dda
No known key found for this signature in database
GPG key ID: ACDF5B6EBECF6B0A
2 changed files with 21 additions and 9 deletions

View file

@ -12,16 +12,14 @@ interface ActivePropType {
export const ThemeDropDown = styled.div`
margin-left: 1%;
min-width: 180px;
color: ${({ theme }) => theme.colors.primary}
display: flex;
flex-direction: column;
color: ${({ theme }) => theme.colors.primary};
`
export const ThemeDropDownButton = styled.button<DisplayPropType>`
width: 160px;
border: 2px solid;
border-radius: 5px;
background-color: ${props => props.focus ?
background-color: ${ props => props.focus ?
({ theme }) => theme.invertButtons ? theme.colors.secondary : theme.colors.background :
({ theme }) => theme.colors.background};
padding: 2px 6px;
@ -30,7 +28,7 @@ export const ThemeDropDownButton = styled.button<DisplayPropType>`
theme.colors.text ? theme.colors.text : theme.colors.primary : theme.colors.secondary :
({ theme }) => theme.colors.primary};
transition-property: color, border-bottom-left-radius, border-bottom-right-radius, background;
transition-property: color, border-bottom-left-radius, border-bottom-right-radius, background-color;
transition-timing-function: ease;
transition-duration: 0.15s;
transition-delay: 0s, ${ props => props.show ? "0s, 0s" : "0.6s, 0.6s" }, 0s;
@ -52,8 +50,6 @@ export const ThemeDropDownButton = styled.button<DisplayPropType>`
export const ThemeDropDownOptions = styled.div<DisplayPropType>`
position: absolute;
color: ${({ theme }) => theme.colors.primary};
background-color: ${({ theme }) => theme.colors.background};
background-image: ${({ theme }) => theme.backgroundImage ?
"linear-gradient("
+ theme.colors.background + "," + theme.colors.background +
@ -70,7 +66,7 @@ export const ThemeDropDownOptions = styled.div<DisplayPropType>`
border-radius: 5px;
border-top-left-radius: 0px; border-top-right-radius: 0px;
z-index: 1;
overflow: hidden;
overflow: ${ props => props.show ? "scroll" : "hidden" };
max-height: ${ props => props.show ? "20%" : "0%" };
visibility: ${ props => props.show ? "visible" : "hidden" };

View file

@ -49,7 +49,7 @@
}
},
{
"themeName": "Norrsken",
"themeName": "Nordlys",
"themeId": 4,
"backgroundImage": "https://images4.alphacoders.com/112/1123390.jpg",
"invertButtons": true,
@ -63,6 +63,22 @@
"loading": "#0063C7",
"offline": "#ff0000"
}
},
{
"themeName": "dev",
"themeId": 5,
"backgroundImage": "https://images4.alphacoders.com/112/1123390.jpg",
"invertButtons": true,
"colors": {
"background": "#0000",
"backgroundAlt": "#0000",
"primary": "#ccc",
"secondary": "#00C7C7",
"text": "#000",
"online": "#00ff00",
"loading": "#0063C7",
"offline": "#ff0000"
}
}
]
}