supernets/hardlounge
supernets/hardlounge
4
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #1873 from thelounge/astorije/outlines

Browse Source 
Add custom focus outlines for inputs and green buttons
This commit is contained in:
Pavel Djundik 2019-07-19 16:45:15 +03:00 committed by GitHub
commit ba356ae34c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 11 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
client/css/style.css
View File

@ -100,10 +100,6 @@ h3 {
margin: 0; margin: 0;
} }
input {
outline: 0;
}
button { button {
border: none; border: none;
background: none; background: none;
@ -172,7 +168,7 @@ kbd {
margin-bottom: 10px; margin-bottom: 10px;
padding: 9px 17px; padding: 9px 17px;
text-transform: uppercase; text-transform: uppercase;
transition: background 0.2s, border-color 0.2s, color 0.2s; transition: background 0.2s, border-color 0.2s, color 0.2s, box-shadow 0.2s;
word-spacing: 3px; word-spacing: 3px;
cursor: pointer; /* This is useful for `<button>` elements */ cursor: pointer; /* This is useful for `<button>` elements */
} }
@ -189,8 +185,14 @@ kbd {
opacity: 1; opacity: 1;
} }
.input:focus,
.btn:active,
.btn:focus {
outline: 0;
box-shadow: 0 0 0 3px rgba(132, 206, 136, 0.5);
}
.btn:active { .btn:active {
box-shadow: none;
opacity: 0.8; opacity: 0.8;
} }
@ -877,9 +879,8 @@ background on hover (unless active) */
font-size: 14px; font-size: 14px;
margin: 2px 0; margin: 2px 0;
margin-bottom: 10px; margin-bottom: 10px;
outline: 0;
padding: 0 10px; padding: 0 10px;
transition: border-color 0.2s; transition: border-color 0.2s, box-shadow 0.2s;
width: 100%; width: 100%;
height: 35px; height: 35px;
line-height: 35px; line-height: 35px;
@ -891,7 +892,7 @@ background on hover (unless active) */
.input:not(:disabled):hover, .input:not(:disabled):hover,
.input:not(:disabled):focus { .input:not(:disabled):focus {
border-color: #79838c; border-color: #84ce88;
} }
#user-specified-css-input { #user-specified-css-input {
@ -2105,7 +2106,7 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
#chat .userlist .user.active { #chat .userlist .user.active {
background-color: #f6f6f6; background-color: #f6f6f6;
transition: none; transition: none;
outline: 0; /* TODO: Handle focus outlines in PR #1873 */ outline: 0;
} }
.context-menu-item::before, .context-menu-item::before,