jcarr
/
noVNC
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use the same background gradient on all buttons 

Before, we have had two different gradiant versions, one where the two
colors meet in the middle, and one where only the top part of the
element was the darker shade. This was easily missed. Let's standardize
on the latter alternative. This commit introduces a variable to make it
easier.
This commit is contained in:
Samuel Mannehed 2022-12-13 14:43:03 +01:00
parent 837cc75a8c
commit 98364c3daa
1 changed files with 5 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/styles/input.css
View File

@ -20,7 +20,8 @@ input, input::file-selector-button, button, select, textarea {
border: 1px solid rgb(192, 192, 192);
border-radius: 5px;
color: black;
background-image: linear-gradient(to top, rgb(255, 255, 255) 80%, rgb(240, 240, 240));
--bg-gradient: linear-gradient(to top, rgb(255, 255, 255) 80%, rgb(240, 240, 240));
background-image: var(--bg-gradient);
}
/*
@ -54,8 +55,7 @@ select {
stroke="rgb(31,31,31)" fill="none" \
stroke-linecap="round" stroke-linejoin="round" /> \
</svg>');
background-image: var(--select-arrow),
linear-gradient(to top, rgb(255, 255, 255), rgb(240, 240, 240));
background-image: var(--select-arrow), var(--bg-gradient);
background-position: calc(100% - 7px), left top;
background-repeat: no-repeat;
padding-right: calc(2*7px + 8px);
@ -244,7 +244,7 @@ textarea:disabled {
:root:not(.noVNC_touch) input:disabled::file-selector-button,
:root:not(.noVNC_touch) button:disabled,
:root:not(.noVNC_touch) select:disabled {
background-image: linear-gradient(to top, rgb(255, 255, 255), rgb(240, 240, 240));
background-image: var(--bg-gradient);
border-bottom-width: 2px;
margin-top: 0;
}
@ -252,8 +252,7 @@ input[type=file]:disabled {
background-image: none;
}
:root:not(.noVNC_touch) select:disabled {
background-image: var(--select-arrow),
linear-gradient(to top, rgb(255, 255, 255), rgb(240, 240, 240));
background-image: var(--select-arrow), var(--bg-gradient);
}
input[type=image]:disabled {
/* See Firefox bug: