0
0
mirror of https://github.com/neon-mmd/websurfx.git synced 2024-11-22 05:58:21 -05:00

💄 feat(UI): provide a theme for the buttons (#427)

This commit is contained in:
neon_arch 2024-11-02 21:49:12 +03:00
parent 276420175a
commit ba0431dc8d

View File

@ -5,7 +5,8 @@
font-weight: 200 600;
font-stretch: 0% 200%;
font-display: swap;
src: url("https://fonts.gstatic.com/s/rubik/v28/iJWKBXyIfDnIV7nErXyi0A.woff2") format('woff2');
src: url('https://fonts.gstatic.com/s/rubik/v28/iJWKBXyIfDnIV7nErXyi0A.woff2')
format('woff2');
}
* {
@ -92,7 +93,7 @@ button {
outline-offset: 3px;
outline: 2px solid transparent;
border: none;
transition: .1s;
transition: 0.1s;
gap: 0;
background-color: var(--color-six);
color: var(--background-color);
@ -248,7 +249,6 @@ button {
/* styles for the footer and header */
header {
width: 100%;
background: var(--background-color);
@ -709,7 +709,8 @@ footer div {
}
.settings_container .user_interface select,
.settings_container .general select {
.settings_container .general select,
.settings_container .general form input {
margin: 0.7rem 0;
width: 20rem;
background-color: var(--color-one);
@ -721,6 +722,38 @@ footer div {
text-transform: capitalize;
}
.settings_container .general form input {
padding: 0rem;
width: 30rem;
text-align: center;
text-transform: none;
}
.settings_container .general form input::file-selector-button {
content: 'Browse';
padding: 1rem 2rem;
font-size: 1.5rem;
background: var(--color-three);
color: var(--background-color);
border-radius: 0.5rem;
border: 2px solid transparent;
font-weight: bold;
transition: all 0.1s ease-out;
cursor: pointer;
box-shadow: 5px 5px;
outline: none;
translate: -1rem 0rem;
}
.settings_container .general form input::file-selector-button:active {
box-shadow: none;
translate: 5px 5px;
}
.settings_container .general .export_btn {
margin-bottom: 1rem;
}
.settings_container .user_interface option:hover,
.settings_container .general option:hover {
background-color: var(--color-one);
@ -793,7 +826,7 @@ footer div {
left: 0.4rem;
bottom: 0.4rem;
background-color: var(--background-color);
transition: .2s;
transition: 0.2s;
}
input:checked + .slider {