deblan-mirror/thelounge
deblan-mirror/thelounge
1
0
Fork 0
mirror of https://github.com/thelounge/thelounge.git synced 2024-05-20 23:26:36 +02:00
Code Issues Projects Releases Wiki Activity

Do not silence outline of all elements, and add custom outline where possible

Browse source 
- Tweak outlines
- Consolidate focus shadows between inputs and buttons, apply custom focus to whole page (i.e. on "Join a channel" form), cleanup
- Do not add custom outlines on checkboxes/radios as browsers are not doing this too well
- Apply hover effect on all inputs, not just in `#windows`
This commit is contained in:
Jérémie Astori 2017-12-21 19:16:08 -05:00 committed by Pavel Djundik
parent d7ff13a41d
commit e246c06c32
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;
}
input {
outline: 0;
}
button {
border: none;
background: none;
@ -172,7 +168,7 @@ kbd {
margin-bottom: 10px;
padding: 9px 17px;
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;
cursor: pointer; /* This is useful for `<button>` elements */
}
@ -189,8 +185,14 @@ kbd {
opacity: 1;
}
.input:focus,
.btn:active,
.btn:focus {
outline: 0;
box-shadow: 0 0 0 3px rgba(132, 206, 136, 0.5);
}
.btn:active {
box-shadow: none;
opacity: 0.8;
}
@ -877,9 +879,8 @@ background on hover (unless active) */
font-size: 14px;
margin: 2px 0;
margin-bottom: 10px;
outline: 0;
padding: 0 10px;
transition: border-color 0.2s;
transition: border-color 0.2s, box-shadow 0.2s;
width: 100%;
height: 35px;
line-height: 35px;
@ -891,7 +892,7 @@ background on hover (unless active) */
.input:not(:disabled):hover,
.input:not(:disabled):focus {
border-color: #79838c;
border-color: #84ce88;
}
#user-specified-css-input {
@ -2103,7 +2104,7 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
#chat .userlist .user.active {
background-color: #f6f6f6;
transition: none;
outline: 0; /* TODO: Handle focus outlines in PR #1873 */
outline: 0;
}
.context-menu-item::before,