jaculabilis/danbooru
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

css: refactor <button> and <input> element styling.

Browse Source 
* Style <button> and <input> elements explicitly instead of relying on browser defaults.
* Style jquery ui buttons the same way as regular buttons.
* Add color variables so we can restyle form inputs in dark mode.
This commit is contained in:
evazion
2019-09-19 02:12:03 -05:00
parent 162ca0782a
commit 9359797a00
3 changed files with 50 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
app/javascript/src/styles/base/020_base.scss
View File

@@ -56,6 +56,31 @@ img {
vertical-align: middle;
}
input, select, textarea {
background: var(--form-input-background);
border: var(--form-input-border);
color: var(--form-input-text-color);
}
input[type="button"], input[type="submit"], button {
border-radius: 3px;
padding: 0.25em 1em;
background: var(--form-button-background);
border: var(--form-button-border);
color: var(--form-button-text-color);
&:hover {
box-shadow: var(--form-button-hover-box-shadow);
background: var(--form-button-hover-background);
}
&:active {
box-shadow: var(--form-button-hover-box-shadow);
background: var(--form-button-active-background);
}
}
menu {
margin: 0;
padding: 0;