btclock_v3/data/src/css/style.scss
2023-11-13 14:01:20 +01:00

156 lines
No EOL
3.1 KiB
SCSS

// @import "../node_modules/bootstrap/scss/bootstrap";
@import "../node_modules/bootstrap/scss/functions";
@import "../node_modules/bootstrap/scss/variables";
@import "../node_modules/bootstrap/scss/variables-dark";
$form-range-track-bg: #fff;
@import "../node_modules/bootstrap/scss/mixins";
@import "../node_modules/bootstrap/scss/maps";
@import "../node_modules/bootstrap/scss/utilities";
@import "../node_modules/bootstrap/scss/root";
@import "../node_modules/bootstrap/scss/reboot";
@import "../node_modules/bootstrap/scss/type";
@import "../node_modules/bootstrap/scss/containers";
@import "../node_modules/bootstrap/scss/grid";
@import "../node_modules/bootstrap/scss/forms";
@import "../node_modules/bootstrap/scss/buttons";
@import "../node_modules/bootstrap/scss/button-group";
@import "../node_modules/bootstrap/scss/navbar";
@import "../node_modules/bootstrap/scss/nav";
@import "../node_modules/bootstrap/scss/card";
@import "../node_modules/bootstrap/scss/progress";
@import "../node_modules/bootstrap/scss/helpers";
@import "../node_modules/bootstrap/scss/utilities/api";
@font-face {
font-display: swap;
/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Oswald';
font-style: normal;
font-weight: 400;
src: url('oswald.woff2') format('woff2'),
/* Chrome 36+, Opera 23+, Firefox 39+ */
url('oswald.woff') format('woff');
/* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
nav {
margin-bottom: 15px;
}
.splitText div:first-child::after {
display: block;
content: '';
margin-top: 0px;
border-bottom: 2px solid;
margin-bottom: 3px;
}
#btcclock-wrapper {
margin: 0 auto;
}
div#output .btclock {
border: 1px solid darkgray;
background: #000;
border-radius: 5px;
padding: 10px;
max-width: 700px;
margin: 0 auto;
.digit,
.splitText
{
border: 2px solid gold;
border-radius: 8px;
min-width: 70px;
text-align: center;
}
}
.btclock {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
align-content: stretch;
font-family: 'Oswald', sans-serif;
}
.btclock>div {
padding: 5px;
}
.fg-ffff .btclock>div {
color: #fff;
border-color: #fff;
}
.bg-ffff .btclock>div {
background: #fff;
}
.fg-f800 .btclock>div {
color: #f00;
border-color: #f00;
}
.bg-f800 .btclock>div {
background: #f00;
}
.fg-0 .btclock>div {
color: #000;
border-color: #000;
}
.bg-0 .btclock>div {
background: #000;
}
.splitText {
font-size: 1.8rem;
padding-top: 19px !important;
padding-bottom: 20px !important;
text-align: center;
}
.mediumText {
font-size: 3rem;
padding-left: 5px;
padding-right: 5px;
padding-top: 20px !important;
padding-bottom: 20px !important;
}
.digit {
font-size: 5rem;
padding-left: 10px;
padding-right: 10px;
}
.digit-blank {
content: "abc";
}
#customText {
text-transform: uppercase;
}
#toggleTimerArea {
cursor: pointer;
}
#system_info {
padding: 0;
li {
list-style: none;
}
}