mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2024-12-23 09:30:31 +03:00
179 lines
2.9 KiB
SCSS
179 lines
2.9 KiB
SCSS
@import './utils/base';
|
|
@import 'node_modules/bootstrap/scss/bootstrap.scss';
|
|
@import './common/react-tagsinput.scss';
|
|
@import './theme/theme';
|
|
|
|
* {
|
|
outline: none !important;
|
|
}
|
|
|
|
html,
|
|
body,
|
|
#root {
|
|
height: 100%;
|
|
background: var(--secondary-color);
|
|
color: var(--text-color);
|
|
}
|
|
|
|
@media (min-width: $smMin) {
|
|
#root {
|
|
transition: filter 300ms;
|
|
}
|
|
|
|
.modal-open #root {
|
|
filter: blur(1.5px);
|
|
}
|
|
}
|
|
|
|
.bg-main {
|
|
background-color: $mainColor !important;
|
|
}
|
|
|
|
.card-body,
|
|
.card-header,
|
|
.list-group-item {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.card-footer {
|
|
background-color: var(--primary-color-alfa);
|
|
}
|
|
|
|
.card {
|
|
box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
|
|
background-color: var(--primary-color);
|
|
}
|
|
|
|
.list-group {
|
|
background-color: var(--primary-color);
|
|
}
|
|
|
|
.modal-content,
|
|
.page-link,
|
|
.page-item.disabled .page-link,
|
|
.dropdown-menu {
|
|
background-color: var(--primary-color);
|
|
}
|
|
|
|
.modal-header,
|
|
.modal-footer,
|
|
.card-header,
|
|
.card-footer,
|
|
.table thead th,
|
|
.table th,
|
|
.table td,
|
|
.page-link,
|
|
.page-link:hover,
|
|
.page-item.disabled .page-link,
|
|
.dropdown-divider {
|
|
border-color: var(--border-color);
|
|
}
|
|
|
|
.page-link:hover {
|
|
background-color: var(--secondary-color);
|
|
}
|
|
|
|
.page-item.active .page-link {
|
|
background-color: var(--brand-color);
|
|
border-color: var(--brand-color);
|
|
}
|
|
|
|
.pagination .page-link {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.container-xl {
|
|
@media (min-width: $xlgMin) {
|
|
max-width: 1320px;
|
|
}
|
|
|
|
@media (max-width: $smMax) {
|
|
padding-right: 0;
|
|
padding-left: 0;
|
|
}
|
|
}
|
|
|
|
.dropdown-item {
|
|
color: var(--text-color);
|
|
}
|
|
|
|
.dropdown-item:not(:disabled) {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.dropdown-item:focus:not(:disabled),
|
|
.dropdown-item:hover:not(:disabled),
|
|
.dropdown-item.active:not(:disabled),
|
|
.dropdown-item:active:not(:disabled) {
|
|
background-color: var(--active-color) !important;
|
|
color: var(--text-color) !important;
|
|
}
|
|
|
|
.badge-main {
|
|
color: #ffffff;
|
|
background-color: var(--brand-color);
|
|
}
|
|
|
|
.table,
|
|
.table-hover tbody tr:hover {
|
|
color: var(--text-color);
|
|
}
|
|
|
|
.table-hover tbody tr:hover {
|
|
background-color: var(--secondary-color);
|
|
}
|
|
|
|
.form-control,
|
|
.form-control:focus {
|
|
background-color: var(--primary-color);
|
|
border-color: var(--input-border-color);
|
|
}
|
|
|
|
.form-control.disabled,
|
|
.form-control:disabled {
|
|
background-color: var(--input-disabled-color);
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.card .form-control:not(:disabled),
|
|
.card .form-control:not(:disabled):hover {
|
|
background-color: var(--input-color);
|
|
}
|
|
|
|
.navbar-brand {
|
|
@media (max-width: $smMax) {
|
|
margin: 0 auto !important;
|
|
}
|
|
}
|
|
|
|
.indivisible {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.pointer {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.text-ellipsis {
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.progress-bar {
|
|
background-color: $mainColor;
|
|
}
|
|
|
|
.btn-xs-block {
|
|
@media (max-width: $xsMax) {
|
|
width: 100%;
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
.btn-md-block {
|
|
@media (max-width: $mdMax) {
|
|
width: 100%;
|
|
display: block;
|
|
}
|
|
}
|