app/assets/stylesheets/scaffolds.scss
html {
font-size: 14px;
}
body {
background-color: #fff;
color: #333;
margin: 33px;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 13px;
line-height: 18px;
padding-top: 60px;
&.dark_mode {
background: #21252c;
color: whitesmoke;
div {
&.navigation-header-light {
background: #464646;
}
}
td, th, div {
a {
color: #44b9d6;
}
color: whitesmoke;
}
span:not(.flatpickr-day), table {
color: whitesmoke;
}
.header a {
color: #fff;
&:visited {
color: #fff;
}
&:hover {
color: #337ab7;
background-color: #fff;
}
}
a.btn {
color: #fff;
}
pre {
color: #f5f5f5;
background: #333;
}
.table-striped {
tbody {
tr {
&:nth-of-type(odd) {
background: #404040;
color: whitesmoke;
&:hover {
background: #585858;
}
}
&:nth-of-type(even) {
background: #10171f;
&:hover {
background: #313131;
}
}
}
}
}
.box_radius {
background: #21252c;
}
.pagination {
li {
a {
background: #000000;
color: #44b9d6;
}
}
.active {
a {
background: #337ab7;
color: #fff;
&:hover {
background: #337ab7;
color: #fff;
}
}
}
.disabled {
a {
background: #000000;
&:hover {
background: #000000;
}
}
}
}
a.badge {
color: #fff;
&:visited {
color: #fff;
}
}
div.modal-content {
background: #21252c;
}
.alert-info {
color: #0c5460;
}
}
div {
&.navigation-header-light {
background: #f8f8f8;
}
&.navigation-header {
border: 1px solid #e7e7e7;
}
&.fixed-top {
border-width: 0 0 1px;
}
.fa-icon {
color: black;
}
}
.bg-primary {
color: #fff;
}
}
.dark-mode-toggle {
width: 3rem;
height: 3rem;
position: fixed;
border-radius: 50%;
border: none;
right: 32px;
bottom: 32px;
left: unset;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
transition: all 0.5s ease;
}
p, ol, ul, td {
font-family: verdana, arial, helvetica, sans-serif;
font-size: 13px;
line-height: 18px;
}
pre {
background-color: #eee;
padding: 10px;
font-size: 11px;
}
td a {
color: #337ab7;
&:visited {
color: #337ab7;
}
}
th {
padding-bottom: 5px;
}
td {
padding: 0 5px 7px;
}
div {
&.field, &.actions {
margin-bottom: 10px;
input.form-control {
width: 80%;
max-width: 400px;
}
}
}
.notice {
color: green;
}
.alert {
color: red;
}
.field_with_errors {
padding: 2px;
}
#error_explanation {
width: 450px;
border: 2px solid red;
padding: 7px 7px 0;
margin-bottom: 20px;
background-color: #f0f0f0;
color: #000000;
h2 {
text-align: left;
font-weight: bold;
padding: 5px 5px 5px 15px;
font-size: 12px;
margin: -7px -7px 0;
background-color: #c00;
color: #fff;
}
ul li {
font-size: 12px;
list-style: square;
}
}
.header a {
color: #fff;
&:visited {
color: #fff;
}
&:hover {
color: #337ab7;
background-color: #fff;
}
}
a.badge {
color: #fff;
&:visited {
color: #fff;
}
&:hover {
color: #fff;
background-color: #337ab7;
}
}
.box_radius {
padding: 0.5em 1em;
margin: 2em 0;
color: #6091d3;
background: #FFF;
border: solid 3px #6091d3;
border-radius: 10px;
}
.vertical > * {
display: block;
}
form.button_to {
display: inline;
}
.break-word-wrap {
word-wrap: break-word;
overflow-wrap: break-word;
}
.font-weight-bold {
font-weight: bold;
}
.kinda-table {
padding-top: 20px;
padding-bottom: 20px;
}
.kinda-table .row {
padding-top: .75rem;
padding-bottom: .75rem;
border: 1px solid #ddd;
}
@for $size from 1 to 100 {
.w-#{$size} {
width: #{$size * 1%} !important;
}
}