Spookie/assets/styles/app.scss

114 lines
1.8 KiB
SCSS

/*
jet black (tiefschwarz) - RAL 9005: #0e0e10, rgba(14, 14, 16, 1.0);
mango: #FF8040, rgba(255, 130, 67, 1.0);
gray: #a1a1a1, rgba(161, 161, 161, 1.0)
*/
/*
@media (prefers-color-scheme: light) {}
@media (prefers-color-scheme: dark) {}
*/
/* debug */
* {
//border: 1px solid gray;
}
// customize some Bootstrap variables
$primary: #FF8040;
$jet-black: #0e0e10;
//$body-bg: red;
$body-color: #8f8f8f;
@import 'bootstrap-dark-5/dist/css/bootstrap-night.min.css';
html, body {
margin: 0;
padding: 0;
//background: linear-gradient(90deg, rgba(14,14,16,1) 0%, rgba(255,128,64,1) 35%, rgba(14,14,16,1) 100%);
background: #0e0e10;
}
///
// sidebar
#sidebar {
min-width: 180px;
max-width: 180px;
height: 100%;
display: inline;
white-space: nowrap;
overflow: hidden;
float: left;
background-color: $jet-black;
transition: min-width 0.5s, max-width 0.5s;
}
#sidebar.active {
min-width: 60px;
max-width: 60px;
}
#content {
}
#sidebar.active .menuText {
display: none;
}
#main_content {
overflow-y: auto;
height: calc(100vh - 180px); // 74px header, 64px header
}
.form-signin {
width: 100%;
max-width: 330px;
padding: 15px;
margin: 50px auto auto;
}
.form-signin .checkbox {
font-weight: 400;
}
.form-signin .form-control {
position: relative;
box-sizing: border-box;
height: auto;
padding: 10px;
font-size: 16px;
}
.form-signin .form-control:focus {
z-index: 2;
}
.form-signin input {
border-radius: 0;
}
.form-signin input[id="registration_form_username"] {
margin-bottom: -1px;
border-radius: 0.375rem 0.375rem 0 0;
}
.form-signin input[id="registration_form_password_second"] {
margin-bottom: 10px;
border-radius: 0 0 0.375rem 0.375rem;
}
.quote-box {
border-left: 1px solid #ff8844;
color: #ff8844;
}
.project-image {
width: 200px;
margin: 15px;
}