Matrix-Programs
/
Scylla
1
0
Fork 0
Code Issues 9 Pull Requests Releases Wiki Activity

Get rid of some inconsistent shadows and borders.

This commit is contained in:
Danila Fedorin 2019-05-19 01:34:14 -07:00
parent 8560f15047
commit 6e5702290a
1 changed files with 11 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
static/scss/style.scss
View File

@ -10,12 +10,10 @@ $background-color-dark: darken($background-color, 4%);
$error-color: #f01d43;
$error-color-dark: darken(#f01d43, 10%);
$active-input-color: lighten($background-color-light, 2%);
$active-input-border-color: $primary-color;
$inactive-input-color: $background-color-light;
$inactive-input-border-color: darken($inactive-input-color, 10%);
$inactive-input-color: lighten($background-color-light, 5%);
$active-input-color: lighten($inactive-input-color, 5%);
$transition-duration: .125s;
$transition-duration: .250s;
$inset-shadow: inset 0px 0px 5px rgba(0, 0, 0, .25);
@ -36,20 +34,24 @@ body {
border-radius: 3px;
outline: none;
transition: background-color $transition-duration;
font-family: inherit;
font-size: inherit;
&:focus {
transition: background-color $transition-duration;
}
}
input, textarea {
@include input-common();
overflow-x: hidden;
background-color: $inactive-input-color;
color: white;
border: .5px solid $inactive-input-border-color;
border: none;
padding: 10px;
&:focus {
background-color: $active-input-color;
border-color: $active-input-border-color;
}
}
@ -105,7 +107,6 @@ div.errors-wrapper {
div.error-wrapper {
pointer-events: auto;
width: 400px;
box-shadow: 0px 0px 5px rgba(0, 0, 0, .25);
padding: 5px;
background-color: $error-color;
border: 1px solid $error-color-dark;
@ -175,7 +176,6 @@ div.reconnect-wrapper {
display: flex;
align-items: center;
background-color: $inactive-input-color;
border: 1px solid $inactive-input-border-color;
border-radius: 3px;
.feather-icon {
@ -191,13 +191,12 @@ div.room-wrapper {
display: flex;
height: 100%;
flex-direction: column;
box-shadow: $inset-shadow;
padding: 5px;
}
div.typing-wrapper {
padding: 5px;
height: 12px;
height: 1em;
flex-shrink: 0;
}
@ -217,7 +216,6 @@ div.message-wrapper {
margin: 3px;
height: 40px;
width: 40px;
border-radius: 50px;
}
}