mirrors/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2024-12-23 17:40:23 +03:00
Code Issues Projects Releases Packages Wiki Activity

Improved contrast in border colors for dark theme

Browse source
This commit is contained in:
Alejandro Celaya 2021-02-26 23:03:14 +01:00
parent f97ef8df83
commit c89bcab770
4 changed files with 9 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/common/Home.scss
View file

@ -36,6 +36,6 @@
.home__servers-container { .home__servers-container {
@media (min-width: $mdMin) { @media (min-width: $mdMin) {
border-left: 1px solid rgba(0, 0, 0, .125); border-left: 1px solid var(--border-color);
} }
} }

5
src/index.scss
View file

@ -34,6 +34,7 @@ body,
.card { .card {
box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075); box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
background-color: var(--primary-color); background-color: var(--primary-color);
border-color: var(--border-color);
} }
.list-group { .list-group {
@ -57,7 +58,9 @@ body,
.page-link, .page-link,
.page-link:hover, .page-link:hover,
.page-item.disabled .page-link, .page-item.disabled .page-link,
.dropdown-divider { .dropdown-divider,
.dropdown-menu,
.list-group-item {
border-color: var(--border-color); border-color: var(--border-color);
} }

4
src/servers/ServersListGroup.scss
View file

@ -29,7 +29,7 @@
.servers-list__list-group--embedded.servers-list__list-group--embedded { .servers-list__list-group--embedded.servers-list__list-group--embedded {
border-radius: 0; border-radius: 0;
border-top: 1px solid rgba(0, 0, 0, .125); border-top: 1px solid var(--border-color);
@media (min-width: $mdMin) { @media (min-width: $mdMin) {
max-height: 220px; max-height: 220px;
@ -40,6 +40,6 @@
.servers-list__server-item { .servers-list__server-item {
border: none; border: none;
border-bottom: 1px solid rgba(0, 0, 0, .125); border-bottom: 1px solid var(--border-color);
} }
} }

4
src/theme/theme.scss
View file

@ -19,8 +19,8 @@ $darkPrimaryColor: #161b22;
$darkPrimaryColorAlfa: rgba($darkPrimaryColor, .7); $darkPrimaryColorAlfa: rgba($darkPrimaryColor, .7);
$darkSecondaryColor: #0f131a; $darkSecondaryColor: #0f131a;
$darkTextColor: rgb(201, 209, 217); $darkTextColor: rgb(201, 209, 217);
$darkBorderColor: rgba(0, 0, 0, .2); $darkBorderColor: rgba(255, 255, 255, .15);
$darkTableBorderColor: #12161b; $darkTableBorderColor: #393d43;
$darkActiveColor: $darkSecondaryColor; $darkActiveColor: $darkSecondaryColor;
$darkBrandColor: #0b2d4e; $darkBrandColor: #0b2d4e;
$darkInputColor: darken($darkPrimaryColor, 2%); $darkInputColor: darken($darkPrimaryColor, 2%);