Styled the home page for the christmas theme + little tweaks
This commit is contained in:
kindtanton
parent
608e708a1d
commit
eb61d3286b
26 changed files with 628 additions and 523 deletions
|
|
@ -73,7 +73,6 @@ def register_plugins(app: Flask) -> Manager:
|
|||
app_manager = Manager(app)
|
||||
app_manager.add_command("db", MigrateCommand)
|
||||
app_manager.add_command("runserver", Server(port=8000))
|
||||
|
||||
# Add admin interface
|
||||
init_admin(app, db)
|
||||
|
||||
|
|
|
|||
|
|
@ -1,22 +1,12 @@
|
|||
/* Custom CSS */
|
||||
:root {
|
||||
/*Darkmode colors*/
|
||||
--dGray0:#D0D0D8;
|
||||
--dGray1:#8E8E93;
|
||||
--dGray2:#636366;
|
||||
--dGray3:#48484A;
|
||||
--dGray4:#3A3A3C;
|
||||
--dGray5:#2C2C2E;
|
||||
--dGray6:#1C1C1E;
|
||||
--dBlue:#0A84FF;
|
||||
}
|
||||
html {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
padding-top: 70px;
|
||||
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray1);
|
||||
height: 100%;
|
||||
}
|
||||
.background{
|
||||
|
|
@ -117,3 +107,99 @@ a.divLink {
|
|||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.table-hover tbody tr:hover{
|
||||
background-color: var(--dGray3);
|
||||
}
|
||||
a {
|
||||
color: var(--dBlue);
|
||||
}
|
||||
.btn-primary {
|
||||
color: var(--dGray6);
|
||||
background-color: var(--dBlue);
|
||||
}
|
||||
|
||||
.navbar {
|
||||
background-color: var(--dGray6);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a{
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a:hover{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.navbar-default .navbar-nav li a,.navbar-default .navbar-brand{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav li a:hover,.navbar-default .navbar-brand:hover{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
hr{
|
||||
border-top: 1px solid var(--dGray2);
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
|
||||
.jumbotron, .darker {
|
||||
background-color: var(--dGray4);
|
||||
}
|
||||
.table tbody tr td {
|
||||
border-top: 1px solid var(--dGray3);
|
||||
}
|
||||
.table thead tr th {
|
||||
border-bottom: 2px solid var(--dGray2);
|
||||
}
|
||||
.navbar-toggle .icon-bar {
|
||||
background-color: var(--dGray0);
|
||||
opacity: 0.5;
|
||||
}
|
||||
.select2-container--default .select2-selection--single{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-selection--single .select2-selection__rendered{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-results__option{
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
|
||||
.bootstrap-datetimepicker-widget table td.day:hover,
|
||||
.bootstrap-datetimepicker-widget table td.hour:hover,
|
||||
.bootstrap-datetimepicker-widget table td.minute:hover,
|
||||
.bootstrap-datetimepicker-widget table td span:hover,
|
||||
.bootstrap-datetimepicker-widget table td.second:hover {
|
||||
background: var(--dGray4);
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-selected=true]{
|
||||
background-color: var(--dBlue);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-search{
|
||||
background-color: var(--dGray2);
|
||||
}
|
||||
.select2-search input{
|
||||
background-color: var(--dGray0);
|
||||
}
|
||||
.dropdown-menu{
|
||||
background-color: var(--dGray5);
|
||||
}
|
||||
.form-control{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.form-control::placeholder{
|
||||
color: var(--dGray2);
|
||||
}
|
||||
.enter_darkmode>a {
|
||||
text-align: center;
|
||||
}
|
||||
Binary file not shown.
|
|
@ -10,102 +10,3 @@
|
|||
--dGray6:#1C1C1E;
|
||||
--dBlue:#0A84FF;
|
||||
}
|
||||
.table-hover tbody tr:hover{
|
||||
background-color: var(--dGray3);
|
||||
}
|
||||
body{
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray1);
|
||||
}
|
||||
a {
|
||||
color: var(--dBlue);
|
||||
}
|
||||
.btn-primary {
|
||||
color: var(--dGray6);
|
||||
background-color: var(--dBlue);
|
||||
}
|
||||
|
||||
.navbar {
|
||||
background-color: var(--dGray6);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a{
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a:hover{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.navbar-default .navbar-nav li a,.navbar-default .navbar-brand{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav li a:hover,.navbar-default .navbar-brand:hover{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
hr{
|
||||
border-top: 1px solid var(--dGray2);
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
|
||||
.jumbotron, .darker {
|
||||
background-color: var(--dGray4);
|
||||
}
|
||||
.table tbody tr td {
|
||||
border-top: 1px solid var(--dGray3);
|
||||
}
|
||||
.table thead tr th {
|
||||
border-bottom: 2px solid var(--dGray2);
|
||||
}
|
||||
.navbar-toggle .icon-bar {
|
||||
background-color: var(--dGray0);
|
||||
opacity: 0.5;
|
||||
}
|
||||
.select2-container--default .select2-selection--single{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-selection--single .select2-selection__rendered{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-results__option{
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
|
||||
.bootstrap-datetimepicker-widget table td.day:hover,
|
||||
.bootstrap-datetimepicker-widget table td.hour:hover,
|
||||
.bootstrap-datetimepicker-widget table td.minute:hover,
|
||||
.bootstrap-datetimepicker-widget table td span:hover,
|
||||
.bootstrap-datetimepicker-widget table td.second:hover {
|
||||
background: var(--dGray4);
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-selected=true]{
|
||||
background-color: var(--dBlue);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-search{
|
||||
background-color: var(--dGray2);
|
||||
}
|
||||
.select2-search input{
|
||||
background-color: var(--dGray0);
|
||||
}
|
||||
.dropdown-menu{
|
||||
background-color: var(--dGray5);
|
||||
}
|
||||
.form-control{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.form-control::placeholder{
|
||||
color: var(--dGray2);
|
||||
}
|
||||
.enter_darkmode>a {
|
||||
text-align: center;
|
||||
}
|
||||
4
app/static/css/themes/dataPrivacy.css
Normal file
4
app/static/css/themes/dataPrivacy.css
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
.background {
|
||||
background-image: url("https://kelder.zeus.ugent.be/webcam/video/mjpg.cgi?profileid=2");
|
||||
background-size: contain;
|
||||
}
|
||||
|
|
@ -11,105 +11,6 @@
|
|||
--dGray6:#260101;
|
||||
--dBlue:#D91604;
|
||||
}
|
||||
.background{
|
||||
background-image: url("static/images/Halloween.jpeg");
|
||||
}
|
||||
.table-hover tbody tr:hover{
|
||||
background-color: var(--dGray3);
|
||||
}
|
||||
body{
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray1);
|
||||
}
|
||||
a {
|
||||
color: var(--dBlue);
|
||||
}
|
||||
.btn-primary {
|
||||
color: var(--dGray6);
|
||||
background-color: var(--dBlue);
|
||||
}
|
||||
|
||||
.navbar {
|
||||
background-color: var(--dGray6);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a{
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a:hover{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.navbar-default .navbar-nav li a,.navbar-default .navbar-brand{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav li a:hover,.navbar-default .navbar-brand:hover{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
hr{
|
||||
border-top: 1px solid var(--dGray2);
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
|
||||
.jumbotron, .darker {
|
||||
background-color: var(--dGray4);
|
||||
}
|
||||
.table tbody tr td {
|
||||
border-top: 1px solid var(--dGray3);
|
||||
}
|
||||
.table thead tr th {
|
||||
border-bottom: 2px solid var(--dGray2);
|
||||
}
|
||||
.navbar-toggle .icon-bar {
|
||||
background-color: var(--dGray0);
|
||||
opacity: 0.5;
|
||||
}
|
||||
.select2-container--default .select2-selection--single{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-selection--single .select2-selection__rendered{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-results__option{
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
|
||||
.bootstrap-datetimepicker-widget table td.day:hover,
|
||||
.bootstrap-datetimepicker-widget table td.hour:hover,
|
||||
.bootstrap-datetimepicker-widget table td.minute:hover,
|
||||
.bootstrap-datetimepicker-widget table td span:hover,
|
||||
.bootstrap-datetimepicker-widget table td.second:hover {
|
||||
background: var(--dGray4);
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-selected=true]{
|
||||
background-color: var(--dBlue);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-search{
|
||||
background-color: var(--dGray2);
|
||||
}
|
||||
.select2-search input{
|
||||
background-color: var(--dGray0);
|
||||
}
|
||||
.dropdown-menu{
|
||||
background-color: var(--dGray5);
|
||||
}
|
||||
.form-control{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.form-control::placeholder{
|
||||
color: var(--dGray2);
|
||||
}
|
||||
.enter_darkmode>a {
|
||||
text-align: center;
|
||||
background-image: url("static/images/themes/halloween/Halloween.jpeg");
|
||||
}
|
||||
|
|
@ -1,100 +0,0 @@
|
|||
/*kerstmis*/
|
||||
.table-hover tbody tr:hover{
|
||||
background-color: var(--dGray3);
|
||||
}
|
||||
body{
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray1);
|
||||
}
|
||||
a {
|
||||
color: var(--dBlue);
|
||||
}
|
||||
.btn-primary {
|
||||
color: var(--dGray6);
|
||||
background-color: var(--dBlue);
|
||||
}
|
||||
|
||||
.navbar {
|
||||
background-color: var(--dGray6);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a{
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a:hover{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.navbar-default .navbar-nav li a,.navbar-default .navbar-brand{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav li a:hover,.navbar-default .navbar-brand:hover{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
hr{
|
||||
border-top: 1px solid var(--dGray2);
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
|
||||
.jumbotron, .darker {
|
||||
background-color: var(--dGray4);
|
||||
}
|
||||
.table tbody tr td {
|
||||
border-top: 1px solid var(--dGray3);
|
||||
}
|
||||
.table thead tr th {
|
||||
border-bottom: 2px solid var(--dGray2);
|
||||
}
|
||||
.navbar-toggle .icon-bar {
|
||||
background-color: var(--dGray0);
|
||||
opacity: 0.5;
|
||||
}
|
||||
.select2-container--default .select2-selection--single{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-selection--single .select2-selection__rendered{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-results__option{
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
|
||||
.bootstrap-datetimepicker-widget table td.day:hover,
|
||||
.bootstrap-datetimepicker-widget table td.hour:hover,
|
||||
.bootstrap-datetimepicker-widget table td.minute:hover,
|
||||
.bootstrap-datetimepicker-widget table td span:hover,
|
||||
.bootstrap-datetimepicker-widget table td.second:hover {
|
||||
background: var(--dGray4);
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-selected=true]{
|
||||
background-color: var(--dBlue);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-search{
|
||||
background-color: var(--dGray2);
|
||||
}
|
||||
.select2-search input{
|
||||
background-color: var(--dGray0);
|
||||
}
|
||||
.dropdown-menu{
|
||||
background-color: var(--dGray5);
|
||||
}
|
||||
.form-control{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.form-control::placeholder{
|
||||
color: var(--dGray2);
|
||||
}
|
||||
.enter_darkmode>a {
|
||||
text-align: center;
|
||||
}
|
||||
7
app/static/css/themes/kerstmis.css.map
Normal file
7
app/static/css/themes/kerstmis.css.map
Normal file
File diff suppressed because one or more lines are too long
495
app/static/css/themes/kerstmis.scss
Normal file
495
app/static/css/themes/kerstmis.scss
Normal file
|
|
@ -0,0 +1,495 @@
|
|||
/*lightmode*/
|
||||
:root {
|
||||
/*Darkmode colors*/
|
||||
--dGray0:#F28705;
|
||||
--dGray1:white;
|
||||
--dGray2:#590212;
|
||||
--dGray3:#590212;
|
||||
--dGray4:#274001;
|
||||
--dGray5:#274001;
|
||||
--dGray6:#F2778D;
|
||||
--dBlue:#F2778D;
|
||||
}
|
||||
body{
|
||||
height: 100%;
|
||||
font-family: Optima,Segoe,Segoe UI,Candara,Calibri,Arial,sans-serif;
|
||||
}
|
||||
.btn{
|
||||
border-radius: 5rem;
|
||||
color: white;
|
||||
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
|
||||
background-image: linear-gradient(-40deg,#F53030, #F58B9E);
|
||||
}
|
||||
.navbar {
|
||||
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
|
||||
padding: 1.5rem;
|
||||
background-color: transparent;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.main{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.navbar .container{
|
||||
width: 100%;
|
||||
padding: 0 8rem;
|
||||
}
|
||||
body .container{
|
||||
padding-top: 2.5rem;
|
||||
}
|
||||
.order_data {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
justify-content: space-around;
|
||||
align-items: baseline;
|
||||
}
|
||||
.expand_button{
|
||||
padding: 1rem 0rem;
|
||||
margin-top: -1rem;
|
||||
width: 70%;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
.hi_im_haldis h2{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hi_im_haldis h3 {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.hi_im_haldis {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.home_sir {
|
||||
font-weight: bold;
|
||||
background: linear-gradient(-40deg,#F53030, #F58B9E);
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
.expand_button_wrapper{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.time_data {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-self: right;
|
||||
}
|
||||
|
||||
.navbar .navbar-nav .active a{
|
||||
color: rgb(255, 155, 174);
|
||||
border-bottom: 1px solid rgb(255, 155, 174);
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
.navbar-nav{
|
||||
padding-left: 2rem;
|
||||
}
|
||||
.jumbotron, .darker {
|
||||
background: linear-gradient(-40deg,rgba(240, 192, 157, 0.5), #F58B9E);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-radius: 4rem;
|
||||
}
|
||||
.row>div>h5 {
|
||||
font-weight: bold;
|
||||
padding-top: 1rem;
|
||||
}
|
||||
.jumbotron {
|
||||
background-color: transparent; }
|
||||
|
||||
.navbar-default .navbar-nav .active a, .navbar-default .navbar-nav .active a:hover{
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.background {
|
||||
-webkit-filter: blur(0px) brightness(80%);
|
||||
-moz-filter: blur(0px) brightness(80%);
|
||||
-o-filter: blur(0px) brightness(80%);
|
||||
-ms-filter: blur(0px) brightness(80%);
|
||||
filter: blur(0px) brightness(80%);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0; }
|
||||
|
||||
|
||||
.background_wrapper {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.christmas_background{
|
||||
z-index: -101;
|
||||
width: 300%;
|
||||
height: 300%;
|
||||
background: linear-gradient(-45deg, #2F0000, #C20A12);
|
||||
animation: gradientBG 19s ease infinite;
|
||||
}
|
||||
|
||||
.sled {
|
||||
width: 15rem;
|
||||
height: 15rem;
|
||||
transition: transform 2s ease-in 5s, rotate 1s ease-in-out 2s;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
background-image: url("static/images/themes/kerstmis/sled.svg");
|
||||
}
|
||||
|
||||
.sled_wrapper{
|
||||
top: 0.5rem;
|
||||
left: -7.5rem;
|
||||
position: absolute;
|
||||
transform: translate(-50vw, 40vh) rotate(0deg);
|
||||
width: 15rem;
|
||||
height: 15rem;
|
||||
animation: sled 29s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.train_button:checked ~ .sled_wrapper:hover{
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
.train_button:checked ~ .sled_wrapper:hover .sled{
|
||||
transform: translateY(100vh) rotate(90deg);
|
||||
}
|
||||
|
||||
.snowman_wrapper{
|
||||
height: 17rem;
|
||||
width: 10rem;
|
||||
position: absolute;
|
||||
bottom: 15rem;
|
||||
left: -12rem;
|
||||
animation: snowman 37s ease infinite;
|
||||
transform-origin: right bottom;
|
||||
}
|
||||
|
||||
|
||||
.snowman_head{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 10rem;
|
||||
height: 10rem;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-image: url("static/images/themes/kerstmis/snowman_head.svg");
|
||||
animation: snowman_head 2s ease infinite;
|
||||
}
|
||||
.snowman_body{
|
||||
position: absolute;
|
||||
top: 9.5rem;
|
||||
left: 0.5rem;
|
||||
width: 10rem;
|
||||
height: 10rem;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-image: url("static/images/themes/kerstmis/snowman_body.svg")
|
||||
}
|
||||
|
||||
.train_button:checked ~ .merry_christmas{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-position: center;;
|
||||
background-image: url("static/images/themes/kerstmis/merry_christmas.svg");
|
||||
background-size: 25vw;
|
||||
background-repeat: no-repeat;
|
||||
animation: merry_christmas 5s ease infinite;
|
||||
}
|
||||
|
||||
.train_button {
|
||||
position: absolute;
|
||||
transform: scaleX(20) scaleY(8) translateX(-100rem);
|
||||
bottom: 5.5rem;
|
||||
left: 7rem;
|
||||
animation: follow_train 47s linear infinite;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.train_wrapper{
|
||||
position: absolute;
|
||||
bottom: 0.5rem;
|
||||
transform: translateX(-80vw);
|
||||
animation: train 47s linear infinite;
|
||||
}
|
||||
.wheel_big, .wheel_small {
|
||||
position: absolute;
|
||||
bottom: -0.4rem;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-image: url("static/images/themes/kerstmis/wheel.svg");
|
||||
//transform: translate(0vw, 60vh);
|
||||
}
|
||||
.train {
|
||||
position: absolute;
|
||||
bottom: 0.5rem;
|
||||
left: 30rem;
|
||||
width: 30rem;
|
||||
height: 10rem;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-image: url("static/images/themes/kerstmis/train.svg");
|
||||
animation: whobble 1s linear alternate-reverse infinite;
|
||||
}
|
||||
|
||||
.wheel_big {
|
||||
width: 3.2rem;
|
||||
height: 3.2rem;
|
||||
}
|
||||
|
||||
.wheel_small {
|
||||
width: 2.5rem;
|
||||
height: 2.5rem;
|
||||
}
|
||||
|
||||
.train .wheel1 {
|
||||
animation: turn 2s linear infinite;
|
||||
left: 3.5rem;
|
||||
}
|
||||
|
||||
.train .wheel2{
|
||||
animation: turn 2s linear infinite, -0.1s;
|
||||
left: 7rem;
|
||||
}
|
||||
|
||||
.train .wheel3{
|
||||
animation: turn 2s linear infinite -0.3s;
|
||||
left: 10.5rem;
|
||||
}
|
||||
|
||||
.train .wheel4{
|
||||
animation: turn 1.5s linear infinite -0.5s;
|
||||
left: 13.9rem;
|
||||
}
|
||||
|
||||
.train .wheel5{
|
||||
animation: turn 1.5s linear infinite -0.7s;
|
||||
left: 16.6rem;
|
||||
}
|
||||
|
||||
.zeus_wagon, .mc_wagon {
|
||||
position: absolute;
|
||||
bottom: 1.25rem;
|
||||
width: 30rem;
|
||||
height: 7.5rem;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
animation: whobble 1s linear alternate-reverse infinite;
|
||||
}
|
||||
|
||||
.mc_wagon {
|
||||
background-image: url("static/images/themes/kerstmis/mc_wagon.svg");
|
||||
left: 0rem;
|
||||
}
|
||||
|
||||
.zeus_wagon {
|
||||
background-image: url("static/images/themes/kerstmis/zeus_wagon.svg");
|
||||
left: 15rem;
|
||||
}
|
||||
|
||||
.zeus_wagon .wheel1, .mc_wagon .wheel1 {
|
||||
animation: turn 2s linear infinite;
|
||||
bottom: -1.1rem;
|
||||
left: 2.2rem;
|
||||
}
|
||||
|
||||
.zeus_wagon .wheel2, .mc_wagon .wheel2{
|
||||
animation: turn 2s linear infinite, -0.1s;
|
||||
bottom: -1.1rem;
|
||||
left: 5.75rem;
|
||||
}
|
||||
|
||||
.zeus_wagon .wheel3, .mc_wagon .wheel3{
|
||||
animation: turn 2s linear infinite -0.3s;
|
||||
bottom: -1.1rem;
|
||||
left: 9.3rem;
|
||||
}
|
||||
|
||||
$s1:"";
|
||||
$s2:"";
|
||||
$s3:"";
|
||||
@for $i from 1 through 100 {
|
||||
$s1: $s1 + random(1000)*0.1vw + " " + random(1000)*0.1vh + " " + 0 + " " + random(50)*-0.01rem + #fff;
|
||||
$s2: $s2 + random(1000)*0.1vw + " " + random(1000)*0.1vh + " " + 0 + " " + random(50)*-0.01rem + #fff;
|
||||
$s3: $s3 + random(1000)*0.1vw + " " + random(1000)*0.1vh + " " + 0 + " " + random(50)*-0.01rem + #fff;
|
||||
@if $i < 100 {
|
||||
$s1: $s1 + ",";
|
||||
$s2: $s2 + ",";
|
||||
$s3: $s3 + ",";
|
||||
}
|
||||
}
|
||||
.snow {
|
||||
border-radius: 50%;
|
||||
opacity: 0.8;
|
||||
position: absolute;
|
||||
top:-100vh;
|
||||
animation-name: fall;
|
||||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
.layer1 {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
filter:blur(1.5px);
|
||||
box-shadow: #{$s1};
|
||||
animation-duration: 18s;
|
||||
}
|
||||
.layer1.a {
|
||||
animation-delay: -9s;
|
||||
}
|
||||
.layer2 {
|
||||
width: 0.8rem;
|
||||
height: 0.8rem;
|
||||
filter:blur(3px);
|
||||
box-shadow: #{$s2};
|
||||
animation-duration: 24s;
|
||||
}
|
||||
.layer2.a {
|
||||
animation-delay: -12s;
|
||||
}
|
||||
.layer3 {
|
||||
width: 0.6rem;
|
||||
height: 0.6rem;
|
||||
filter:blur(6px);
|
||||
box-shadow: #{$s3};
|
||||
animation-duration: 30s;
|
||||
}
|
||||
.layer3.a {
|
||||
animation-delay: -15s;
|
||||
}
|
||||
@keyframes fall {
|
||||
100% {transform: translateY(200vh); }
|
||||
}
|
||||
@keyframes gradientBG {
|
||||
0% {
|
||||
transform: translate(-10%,-10%);
|
||||
}
|
||||
50% {
|
||||
transform: translate(-60%,-60%);
|
||||
}
|
||||
100% {
|
||||
transform: translate(-10%,-10%);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes sled {
|
||||
0% {
|
||||
transform: translate(-50rem, 40vh) rotate(0deg);
|
||||
}
|
||||
4% {
|
||||
transform: translate(-50rem, 40vh) rotate(0deg);
|
||||
}
|
||||
20% {
|
||||
transform: translate(50vw,10vh) rotate(20deg);
|
||||
}
|
||||
36% {
|
||||
transform: translate(150vw,40vh) rotate(40deg);
|
||||
}
|
||||
100% {
|
||||
transform: translate(150vw,40vh) rotate(40deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes train {
|
||||
0%{
|
||||
transform: translateX(-80rem);
|
||||
}
|
||||
55%{
|
||||
transform: translateX(-80rem);
|
||||
}
|
||||
85% {
|
||||
transform: translateX(100vw);
|
||||
}
|
||||
100%{
|
||||
transform: translateX(100vw);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes follow_train {
|
||||
0%{
|
||||
transform: translateX(-80rem) scaleX(20) scaleY(8);
|
||||
}
|
||||
55%{
|
||||
transform: translateX(-80rem) scaleX(20) scaleY(8);
|
||||
}
|
||||
85%{
|
||||
transform: translateX(100vw) scaleX(20) scaleY(8);
|
||||
}
|
||||
100% {
|
||||
transform: translateX(100vw) scaleX(20) scaleY(8);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@keyframes turn {
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes whobble {
|
||||
100% {
|
||||
transform: translateY(0.5vh);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes snowman {
|
||||
0%{
|
||||
transform: rotate(-0);
|
||||
}
|
||||
20%{
|
||||
transform: rotate(-0);
|
||||
}
|
||||
30%{
|
||||
transform: rotate(80deg);
|
||||
}
|
||||
54%{
|
||||
transform: rotate(80deg);
|
||||
}
|
||||
68%{
|
||||
transform: rotate(-0);
|
||||
}
|
||||
100%{
|
||||
transform: rotate(-0);
|
||||
}
|
||||
}
|
||||
@keyframes snowman_head {
|
||||
0%{
|
||||
transform: rotate(-3deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(3deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(-3deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes merry_christmas {
|
||||
0%{
|
||||
opacity: 0.8;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.6;
|
||||
}
|
||||
100% {
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
|
|
@ -10,103 +10,3 @@
|
|||
--dGray6:#ffffff;
|
||||
--dBlue:#0A84FF;
|
||||
}
|
||||
|
||||
.table-hover tbody tr:hover{
|
||||
background-color: var(--dGray3);
|
||||
}
|
||||
body{
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray1);
|
||||
}
|
||||
a {
|
||||
color: var(--dBlue);
|
||||
}
|
||||
.btn-primary {
|
||||
color: var(--dGray6);
|
||||
background-color: var(--dBlue);
|
||||
}
|
||||
|
||||
.navbar {
|
||||
background-color: var(--dGray6);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a{
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a:hover{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.navbar-default .navbar-nav li a,.navbar-default .navbar-brand{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav li a:hover,.navbar-default .navbar-brand:hover{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
hr{
|
||||
border-top: 1px solid var(--dGray2);
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
|
||||
.jumbotron, .darker {
|
||||
background-color: var(--dGray4);
|
||||
}
|
||||
.table tbody tr td {
|
||||
border-top: 1px solid var(--dGray3);
|
||||
}
|
||||
.table thead tr th {
|
||||
border-bottom: 2px solid var(--dGray2);
|
||||
}
|
||||
.navbar-toggle .icon-bar {
|
||||
background-color: var(--dGray0);
|
||||
opacity: 0.5;
|
||||
}
|
||||
.select2-container--default .select2-selection--single{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-selection--single .select2-selection__rendered{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-results__option{
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
|
||||
.bootstrap-datetimepicker-widget table td.day:hover,
|
||||
.bootstrap-datetimepicker-widget table td.hour:hover,
|
||||
.bootstrap-datetimepicker-widget table td.minute:hover,
|
||||
.bootstrap-datetimepicker-widget table td span:hover,
|
||||
.bootstrap-datetimepicker-widget table td.second:hover {
|
||||
background: var(--dGray4);
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-selected=true]{
|
||||
background-color: var(--dBlue);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-search{
|
||||
background-color: var(--dGray2);
|
||||
}
|
||||
.select2-search input{
|
||||
background-color: var(--dGray0);
|
||||
}
|
||||
.dropdown-menu{
|
||||
background-color: var(--dGray5);
|
||||
}
|
||||
.form-control{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.form-control::placeholder{
|
||||
color: var(--dGray2);
|
||||
}
|
||||
.enter_darkmode>a {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
@ -11,105 +11,6 @@
|
|||
--dBlue:#35F546;
|
||||
}
|
||||
|
||||
.table-hover tbody tr:hover{
|
||||
background-color: var(--dGray3);
|
||||
}
|
||||
.background{
|
||||
background-image: url("static/images/Sinterklaas.jpg");
|
||||
}
|
||||
body{
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray1);
|
||||
}
|
||||
a {
|
||||
color: var(--dBlue);
|
||||
}
|
||||
.btn-primary {
|
||||
color: var(--dGray6);
|
||||
background-color: var(--dBlue);
|
||||
}
|
||||
|
||||
.navbar {
|
||||
background-color: var(--dGray6);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a{
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav .active a:hover{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.navbar-default .navbar-nav li a,.navbar-default .navbar-brand{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
.navbar-default .navbar-nav li a:hover,.navbar-default .navbar-brand:hover{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
hr{
|
||||
border-top: 1px solid var(--dGray2);
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6{
|
||||
color: var(--dGray1);
|
||||
}
|
||||
|
||||
.jumbotron, .darker {
|
||||
background-color: var(--dGray4);
|
||||
}
|
||||
.table tbody tr td {
|
||||
border-top: 1px solid var(--dGray3);
|
||||
}
|
||||
.table thead tr th {
|
||||
border-bottom: 2px solid var(--dGray2);
|
||||
}
|
||||
.navbar-toggle .icon-bar {
|
||||
background-color: var(--dGray0);
|
||||
opacity: 0.5;
|
||||
}
|
||||
.select2-container--default .select2-selection--single{
|
||||
background-color: var(--dGray3);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-selection--single .select2-selection__rendered{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-results__option{
|
||||
background-color: var(--dGray5);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: var(--dGray4);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
|
||||
.bootstrap-datetimepicker-widget table td.day:hover,
|
||||
.bootstrap-datetimepicker-widget table td.hour:hover,
|
||||
.bootstrap-datetimepicker-widget table td.minute:hover,
|
||||
.bootstrap-datetimepicker-widget table td span:hover,
|
||||
.bootstrap-datetimepicker-widget table td.second:hover {
|
||||
background: var(--dGray4);
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-selected=true]{
|
||||
background-color: var(--dBlue);
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.select2-search{
|
||||
background-color: var(--dGray2);
|
||||
}
|
||||
.select2-search input{
|
||||
background-color: var(--dGray0);
|
||||
}
|
||||
.dropdown-menu{
|
||||
background-color: var(--dGray5);
|
||||
}
|
||||
.form-control{
|
||||
color: var(--dGray0);
|
||||
}
|
||||
.form-control::placeholder{
|
||||
color: var(--dGray2);
|
||||
}
|
||||
.enter_darkmode>a {
|
||||
text-align: center;
|
||||
background-image: url("static/images/themes/sinterklaas/Sinterklaas.jpg");
|
||||
}
|
||||
|
Before Width: | Height: | Size: 993 KiB After Width: | Height: | Size: 993 KiB |
1
app/static/images/themes/kerstmis/mc_wagon.svg
Normal file
1
app/static/images/themes/kerstmis/mc_wagon.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 10 KiB |
1
app/static/images/themes/kerstmis/merry_christmas.svg
Normal file
1
app/static/images/themes/kerstmis/merry_christmas.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 24 KiB |
1
app/static/images/themes/kerstmis/sled.svg
Normal file
1
app/static/images/themes/kerstmis/sled.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 18 KiB |
1
app/static/images/themes/kerstmis/snowman_body.svg
Normal file
1
app/static/images/themes/kerstmis/snowman_body.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 578.64 581.47"><defs><style>.cls-1{fill:#fff;}</style></defs><title>snowman_body</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M276.6,533.73c-33.55-3.29-64.43-11.45-93.73-25.32Q103.48,470.8,59.6,394.66C40.92,362.13,30,327,26,289.79a173.71,173.71,0,0,1-1.35-22.93c.09-3.45,1.33-4.21,4.23-2.42,12.28,7.57,23.83,16,31.78,28.38,4.88,7.62,6.69,15.8,4.38,24.82-1.19,4.62-2.91,10.17,2.1,13.27s9.63-.51,13.57-3.57c14.39-11.16,25.46-25.39,35.8-40.14,17.38-24.82,32.18-51,40.24-80.51.83-3.05,1.39-6.17,2.09-9.25,1-4.46,1.83-4.71,5.45-1.69a63.52,63.52,0,0,1,19.48,70.62c-.85,2.41-3.51,5.48-1.73,7.23s4.82-1,7.27-1.75c14.64-4.78,29.5-8.34,45-8.05,12.83.24,24.13,3.31,30.05,16.42,1.25,2.76,3.5,5,7.1,4.48,3.34-.46,4.56-3,5.55-5.76a50.56,50.56,0,0,0,2.61-14.7c1.09-22.76-.7-45.28-6.36-67.4-1.05-4.1-.76-5.52,4.15-5.32,45.53,1.89,90.91.95,135.69-8.78,29.52-6.41,57.78-16.05,83-33.27,13.47-9.22,25.46-20,33.55-34.4,2.18-3.88,3.35-3.52,5.56-.13,16.7,25.67,29.17,53.28,35.8,83.13,20.63,92.88-.29,175.54-63.87,246.4C462.94,493.68,407,521.93,341.74,532c-4.43.69-8.91,1-13.37,1.73M352.9,313.11a26.85,26.85,0,0,0-1.72-2.12c-10.34-10.63-20.75-21.19-31-31.9-2.15-2.25-3.49-2.11-5.63,0-10.28,10.21-20.6,20.4-31.14,30.33-2.91,2.74-2.39,4.25.11,6.75,9.53,9.54,18.79,19.37,28.35,28.89,2.75,2.73,2.91,4.37,0,7.18C299.59,364,287.66,376.15,275.43,388c-2.85,2.75-2.78,4.42,0,7.19,12.13,12.13,23.95,24.58,36.1,36.69,3.22,3.22,3.89,5.2.13,8.7C301.54,450,292,460,282,469.53c-2.69,2.58-2.73,4.22-.08,6.87q15,15,29.63,30.42c2.54,2.67,4.16,2.8,6.83.1q14.92-15.1,30.32-29.75c2.77-2.62,2.84-4.13.2-6.77-10-10-19.72-20.32-29.76-30.3-2.83-2.81-2.77-4.51.07-7.23,12.74-12.22,25.21-24.74,38-36.91,3-2.82,2.68-4.36,0-7.07-11.88-11.91-23.44-24.15-35.38-36-3.38-3.36-3-5.34.26-8.4,9.7-9.14,19.12-18.57,28.63-27.9C351.61,315.68,352.8,314.91,352.9,313.11Zm180.21,268-.06.35.32-.15Z"/><path class="cls-1" d="M145.76,0c20.38.69,36.93,8.71,52.05,20.33a161.06,161.06,0,0,1,19.25,18.14c1.45,1.55,2.91,3.39-.39,4.43-15.79,5-24.4,17.3-31.5,31-9.72,18.79-15.12,39.07-20,59.52-4.37,18.47-8,37.1-11.1,55.82-3.37,20.1-10.42,38.87-20,56.76-14,26.15-30.57,50.39-51.66,71.38a44.18,44.18,0,0,1-8.52,6.9c-.82.5-1.7,1.32-2.74.78-1.36-.72-.79-2.07-.64-3.14.63-4.6,2-9.1,1.63-13.84-1-15-9.72-25.5-20.28-34.86-14.26-12.64-31-21.17-48.25-28.9-1.32-.59-3.35-.66-3.63-2.26-.35-2,1.87-2.51,3.14-3.39,22-15.19,33.71-36.1,35.71-62.8,1.25-16.6,1.16-33.25,2.57-49.85,2.89-34,16.5-63.12,38.45-88.76C91.52,23.7,104.63,12.08,121.37,5.13A73.07,73.07,0,0,1,145.76,0Z"/><path class="cls-1" d="M314,170c-14.85-.77-31.18-.69-47.41-2.68-2.09-.26-3.89-.68-5-2.69-13.61-24.63-28.2-48.79-37-75.75-2.48-7.61-4.29-15.4-4-23.53a27.43,27.43,0,0,1,2.58-11.11c3.21-6.63,7.18-8.09,13.75-4.8,16.51,8.26,33.81,14.2,52.11,16.7,52.73,7.23,99.75-5.86,140.4-40.49,11.29-9.62,11-9.79,23.27-1.49a257.43,257.43,0,0,1,65.13,63.5c3.28,4.55,3.33,7.89,0,12.35-11.59,15.57-26.55,27-43.28,36.38-28.48,15.92-59.48,23.95-91.44,28.84C360.74,168.67,338.11,169.45,314,170Z"/><path class="cls-1" d="M217.37,50C209.48,74,219.05,94.31,228,114.58a381.92,381.92,0,0,0,23.17,44.23c12.55,20.72,18.19,43.48,21,67.16,1.63,13.89,2.6,27.84,1,41.83-.33,2.91.2,7.21-2.47,8.1s-3.08-3.58-4.58-5.58c-7.62-10.1-18.6-12.37-30.14-12.9-13.27-.61-26.15,2.12-38.91,5.49-5.73,1.52-5.77,1.48-4.56-4.19,3.76-17.65,1.1-34.11-9.28-49.06-5.4-7.79-10.52-15.82-18.12-21.81-2.15-1.68-3.76-3.69-3.17-6.82,5.89-30.92,11.47-61.92,23-91.4,4.74-12.15,10.5-23.81,20.43-32.79C208.57,53.85,212,51.05,217.37,50Z"/></g></g></svg>
|
||||
|
After Width: | Height: | Size: 3.5 KiB |
1
app/static/images/themes/kerstmis/snowman_head.svg
Normal file
1
app/static/images/themes/kerstmis/snowman_head.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 474.09 518.52"><defs><style>.cls-1{fill:#fff;}</style></defs><title>snowman_head</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M169.27,0c9.59,19.05,19.57,37.86,31.47,55.63,22.86,34.1,51.08,63.1,83.3,88.36,2.95,2.31,5.55,2.84,9.12,1.5,8.59-3.22,17.34-6.09,26.74-4.83,8.65,1.15,12.68,6.89,11.14,15.58-1.77,9.9-6.57,18.48-12,26.71-16.11,24.37-36.42,45.05-57.92,64.56-25.23,22.88-52.15,43.61-81.5,61-17.37,10.28-35.06,20-55.15,24.07a37.56,37.56,0,0,1-6.94.71c-13.51.21-18.73-6.71-15-19.87,2.67-9.43,7.54-17.8,13.23-25.63,2.61-3.58,2.83-6.27.82-10.29C89.75,223.7,52,179.14,4,143.08c-5.15-3.88-5.18-3.94-1-9A530.69,530.69,0,0,1,157.81,5.58C161,3.81,164.12,1.86,167.27,0Z"/><path class="cls-1" d="M141.2,352c0-4.66-.08-9.33,0-14,.06-2.41.73-4.45,3.41-5.51,35.76-14.09,66.81-35.85,96.54-59.67,27.25-21.82,52.51-45.7,73.9-73.43,2.55-3.3,4.94-6.72,7.19-10.21,1.64-2.55,3.5-3.41,6.64-3,75.22,10.14,133.9,68.65,143.73,143.45,12,91.32-52.1,175.3-143,187.38S154.47,465,142.22,374.46A107.1,107.1,0,0,1,141.2,352Zm278,13.86a13.37,13.37,0,0,0-2-1.15c-31.27-9.34-62.57-18.61-93.82-28-4.36-1.32-6.9.42-9.23,3.75-7.76,11.09-8.11,32.92-.77,44.39,2.38,3.73,5,4.87,9.55,3.77,23.29-5.7,46.66-11.06,70-16.54ZM315.63,462.46a7.05,7.05,0,0,0,1.61-.74,119.77,119.77,0,0,0,15.49-14.11c1.74-1.91.28-2.94-1.13-4-4.87-3.5-9.73-7-13.89-11.38-1.89-2-3.33-1.5-5,.22-4,4.08-8.61,7.33-13.11,10.76-2.52,1.92-4.42,1.7-6.32-.79-2.53-3.3-5.29-6.43-7.75-9.78-1.44-2-2.79-2.46-5-1.24-3.94,2.16-8,4.17-12,6.1-2.31,1.1-3,2.42-1.38,4.63,2.76,3.75,5.57,7.47,8.19,11.32,1.82,2.67,3.77,2.7,6.31,1.12,3.82-2.38,7.81-4.47,11.57-6.93,2.27-1.49,3.7-1.12,5.56.76,4.11,4.12,8.49,8,12.79,11.9A6.34,6.34,0,0,0,315.63,462.46ZM295.18,293.59c.06-10.32-7.65-18.23-17.81-18.26A17.7,17.7,0,0,0,259.45,293c-.09,10.39,7.44,18.36,17.59,18.6A17.79,17.79,0,0,0,295.18,293.59Zm56.54-18.27a18.15,18.15,0,1,0,18.18,18.09A18.42,18.42,0,0,0,351.72,275.32Zm49.53,156.41c1.79.46,3.22-.81,3.88-3,.91-2.92,3.89-6.13,1.94-8.75-2.09-2.82-6.48-1.85-9.85-2.45-2.63-.47-2.9,2.25-3.63,4-3.48,8.24-3.46,8.25-11.82,5.59a9.71,9.71,0,0,1-1.4-.5c-3.46-1.72-5.61-.85-7.53,2.69-5.51,10.13-5.62,9.92,5.51,13.33,3.6,1.1,5.77.44,7-3.1,2.45-7.26,6.22-12,14.77-8A5.27,5.27,0,0,0,401.25,431.73Zm-51.88-1.22a2.65,2.65,0,0,0-2.5,1.34c-3.25,4-6.47,8-9.76,12-1.51,1.83-.24,2.69,1.11,3.48,4.31,2.51,8.65,5,13,7.46,1.83,1.05,3.46,1.06,4.81-.8,2.92-4.05,5.88-8.08,8.76-12.15.75-1.07,1.78-2.59.16-3.47C359.82,435.62,354.57,433.11,349.37,430.51Zm-94.14-4.6c-4,1.71-10.14,1.12-11.9,4.94s2.65,7.69,4.7,11.39c.85,1.54,2.35,1.52,3.93,1.23,11.19-2,12.24-4,7.06-13.65-.47-.88-.89-1.78-1.4-2.63S256.36,425.43,255.23,425.91Zm-24.66,5.78c2.57-1.74,7.72.83,9.24-3.68,1-3-4.61-11.18-6.36-10.4-3.31,1.46-8.91-1.57-9.9,3.87C222.74,426,227.1,431.72,230.57,431.69Z"/></g></g></svg>
|
||||
|
After Width: | Height: | Size: 2.8 KiB |
1
app/static/images/themes/kerstmis/train.svg
Normal file
1
app/static/images/themes/kerstmis/train.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 465 221"><defs><style>.cls-1{fill:#fff;}</style></defs><title>train</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M18,25h89a0,0,0,0,1,0,0V43a0,0,0,0,1,0,0H0a0,0,0,0,1,0,0v0A18,18,0,0,1,18,25Z"/><rect class="cls-1" x="107" y="35" width="13" height="4"/><rect class="cls-1" x="117" y="35" width="4" height="17"/><rect class="cls-1" x="114" y="51" width="10" height="29"/><polygon class="cls-1" points="57 51 57 65.04 71.23 51 57 51"/><polygon class="cls-1" points="87 90 87 66.14 64.76 90 87 90"/><polygon class="cls-1" points="87 51 76.99 51 57 71.94 57 84.99 87 54.93 87 51"/><path class="cls-1" d="M11,43V98H25V47H47V98h55V43ZM91,94H53V48H91Z"/><rect class="cls-1" x="147" y="11" width="3" height="12"/><rect class="cls-1" x="145" y="22" width="5" height="58"/><rect class="cls-1" x="265" width="38" height="80"/><rect class="cls-1" x="262" width="44" height="5"/><rect class="cls-1" x="262" y="16" width="44" height="4"/><rect class="cls-1" x="303" y="50" width="3" height="10"/><rect class="cls-1" x="306" y="53" width="38" height="4"/><rect class="cls-1" x="340" y="56" width="3" height="24"/><rect class="cls-1" x="362" y="80" width="8" height="66"/><polygon class="cls-1" points="405 113.35 375 80.7 375 146 405 113.35"/><rect class="cls-1" x="47" y="145" width="97" height="7"/><path class="cls-1" d="M102,80V98h43v9H47v13h98v6H47v9h98v5h10V113H144v-5h91v2a9,9,0,0,1,9-9v45h-9v7H356V80Zm99,14V88H165V98H151V94h10V84h44v7h53v7h-3V94Zm58,52H249V101h10Zm15,0H264V101h10Zm15,0H279V101h10Zm15,0H294V101h10Zm15,0H309V101h10Zm15,0h-9V101a9,9,0,0,1,9,9Z"/><rect class="cls-1" x="177" y="112" width="12" height="27"/><rect class="cls-1" x="160" y="112" width="12" height="27"/><rect class="cls-1" x="194" y="112" width="12" height="27"/><rect class="cls-1" x="228" y="112" width="7" height="27"/><rect class="cls-1" x="211" y="112" width="12" height="27"/><rect class="cls-1" x="144" y="139" width="1" height="6"/><path class="cls-1" d="M11,105H25a0,0,0,0,1,0,0v63.8a4.2,4.2,0,0,1-4.2,4.2H15.2a4.2,4.2,0,0,1-4.2-4.2V105a0,0,0,0,1,0,0Z"/><rect class="cls-1" x="25" y="145" width="72" height="12"/><rect class="cls-1" x="59" y="157" width="4" height="64"/><rect class="cls-1" x="33" y="157" width="4" height="64"/><rect class="cls-1" x="37" y="157" width="22" height="54"/><rect class="cls-1" x="306" y="153" width="50" height="4"/><rect class="cls-1" x="344" y="153" width="61" height="20"/><path class="cls-1" d="M387,173h43a3,3,0,0,1,3,3v0a3,3,0,0,1-3,3H387a0,0,0,0,1,0,0v-6a0,0,0,0,1,0,0Z"/><path class="cls-1" d="M386,214h76a3,3,0,0,1,3,3v0a3,3,0,0,1-3,3H386a0,0,0,0,1,0,0v-6A0,0,0,0,1,386,214Z"/><rect class="cls-1" x="387" y="179" width="6" height="35"/><polygon class="cls-1" points="406 214 402 214 398 179 402 179 406 214"/><polyline class="cls-1" points="410.45 179 419.45 214 415.45 214 406.45 179"/><polygon class="cls-1" points="434.45 214 430.45 214 416.45 179 420.45 179 434.45 214"/><polyline class="cls-1" points="429.1 179 453.1 214 449.1 214 425.1 179"/></g></g></svg>
|
||||
|
After Width: | Height: | Size: 3 KiB |
1
app/static/images/themes/kerstmis/wheel.svg
Normal file
1
app/static/images/themes/kerstmis/wheel.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 54.13 54.13"><defs><style>.cls-1,.cls-2{fill:none;stroke:#fff;stroke-miterlimit:10;}.cls-1{stroke-width:3.95px;}.cls-2{stroke-width:2.32px;}</style></defs><title>wheel</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><circle class="cls-1" cx="27.06" cy="27.06" r="25.09"/><circle class="cls-2" cx="27.26" cy="27.45" r="6.95"/><line class="cls-2" x1="27.26" y1="1.98" x2="27.26" y2="20.5"/><line class="cls-2" x1="9.24" y1="9.44" x2="22.34" y2="22.54"/><line class="cls-2" x1="1.78" y1="27.45" x2="20.31" y2="27.45"/><line class="cls-2" x1="9.24" y1="45.46" x2="22.34" y2="32.36"/><line class="cls-2" x1="27.26" y1="52.92" x2="27.26" y2="34.4"/><line class="cls-2" x1="45.27" y1="45.46" x2="32.17" y2="32.36"/><line class="cls-2" x1="52.73" y1="27.45" x2="34.2" y2="27.45"/><line class="cls-2" x1="45.27" y1="9.44" x2="32.17" y2="22.54"/></g></g></svg>
|
||||
|
After Width: | Height: | Size: 936 B |
1
app/static/images/themes/kerstmis/zeus_wagon.svg
Normal file
1
app/static/images/themes/kerstmis/zeus_wagon.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 157.5"><defs><style>.cls-1{fill:#fff;}</style></defs><title>zeus_wagon</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><rect class="cls-1" y="60.5" width="15" height="97" rx="6.3"/><rect class="cls-1" y="127" width="36" height="16.5"/><path class="cls-1" d="M279,123.45h16.25a0,0,0,0,1,0,0v20.34a5.71,5.71,0,0,1-5.71,5.71h-4.84a5.71,5.71,0,0,1-5.71-5.71V123.45A0,0,0,0,1,279,123.45Z"/><path class="cls-1" d="M140.85,43.93q-1.65-1.77-5.13-1.77a8.26,8.26,0,0,0-5.32,1.67c-1.39,1.12-2.17,2.92-2.33,5.38h14.52A7.9,7.9,0,0,0,140.85,43.93Z"/><path class="cls-1" d="M185.75,81.66a9,9,0,0,0-2.51.37,10.21,10.21,0,0,0-2.47,1.07V96.64a6.87,6.87,0,0,0,1.84.43c.66.06,1.3.1,1.94.1a6.27,6.27,0,0,0,5.1-2q1.68-2,1.68-6T190,83.43A5,5,0,0,0,185.75,81.66Z"/><path class="cls-1" d="M279.12,0H20.88A20.88,20.88,0,0,0,0,20.88V128H300V20.88A20.88,20.88,0,0,0,279.12,0ZM153.82,36.25H165V53.56c0,1.77.06,3.23.17,4.4a7.72,7.72,0,0,0,.79,2.91,3.57,3.57,0,0,0,1.79,1.68,8.53,8.53,0,0,0,3.34.53,11.1,11.1,0,0,0,3.17-.53A13.43,13.43,0,0,0,177.66,61V36.25h11.22V71.16H177.66V67.3A32.33,32.33,0,0,1,172,70.89a14.17,14.17,0,0,1-6.15,1.23q-5.78,0-8.89-3.32T153.82,59Zm-25,47.34H77.07V72.06L107.73,34H78.56V22.05h48.56V33.79l-6.18,7.64a16.46,16.46,0,0,1,1.15-1.22q5.3-5,14.53-5.05,8.52,0,12.8,4.31t4.29,12.38v3.92H128.1a8.08,8.08,0,0,0,3.12,6.28q2.88,2.17,8.47,2.18A19,19,0,0,0,146.56,63a21.78,21.78,0,0,0,5.26-2.73h1.24v9a41.55,41.55,0,0,1-7.15,2.21,37.74,37.74,0,0,1-7.43.68q-10.5,0-16.1-4.72t-5.59-13.46q0-7.38,3.87-12.13L96.47,71.69h32.3ZM199.22,95a13.27,13.27,0,0,1-2.68,4.51,11.71,11.71,0,0,1-3.9,2.84,11.53,11.53,0,0,1-4.68,1,13.42,13.42,0,0,1-3.91-.5,17.71,17.71,0,0,1-3.28-1.38V112.7H172.1V76.63l-7.36,26.16h-8.33l-5-18.17-4.93,18.17h-8.41l-7.53-26.95h8.24L143,94.42l5.22-18.58h7l5,18.58,4.13-18.58h16.5v2.81a21.15,21.15,0,0,1,4.06-2.57,11,11,0,0,1,4.79-1,9.24,9.24,0,0,1,7.82,3.69q2.81,3.7,2.8,10.16A17.26,17.26,0,0,1,199.22,95Zm10.12,7.78h-8.66v-27h8.66Zm8.09-34q-4.86,3.31-13.28,3.31a37.9,37.9,0,0,1-8.45-.87,31.65,31.65,0,0,1-6.09-1.93v-9.2h1q.84.6,2,1.29a19.07,19.07,0,0,0,3.12,1.51,25.25,25.25,0,0,0,4,1.23,20.89,20.89,0,0,0,4.72.51,12.2,12.2,0,0,0,4.88-.73,2.33,2.33,0,0,0,1.59-2.16,2,2,0,0,0-.93-1.85,12.38,12.38,0,0,0-3.55-1.1c-.83-.19-2-.39-3.37-.61a37,37,0,0,1-3.87-.79,13.78,13.78,0,0,1-7.06-3.87,9.59,9.59,0,0,1-2.3-6.55q0-5,4.77-8.37t13-3.34a34.58,34.58,0,0,1,7.51.79,30.76,30.76,0,0,1,5.61,1.69V46.6h-1a22.68,22.68,0,0,0-5.67-2.78,20,20,0,0,0-6.46-1.07,12.35,12.35,0,0,0-4.55.74c-1.23.5-1.85,1.2-1.85,2.12A2.24,2.24,0,0,0,202,47.5a11.44,11.44,0,0,0,4,1.31c1.14.23,2.37.45,3.68.67s2.64.49,4,.82a12.45,12.45,0,0,1,6.52,3.62,9.17,9.17,0,0,1,2.12,6.17A10.12,10.12,0,0,1,217.43,68.81Z"/><path class="cls-1" d="M120.94,41.43c-.1.11-.19.23-.28.35Z"/><polygon class="cls-1" points="172.1 75.85 172.1 76.63 172.32 75.85 172.1 75.85"/></g></g></svg>
|
||||
|
After Width: | Height: | Size: 2.9 KiB |
|
Before Width: | Height: | Size: 1.3 MiB After Width: | Height: | Size: 1.3 MiB |
|
|
@ -6,6 +6,9 @@
|
|||
document.querySelector(".toggleDarkmode").innerHTML = "<a>Enter lightmode</a>"
|
||||
document.querySelector(".toggleDarkmode").id = "lightmode"
|
||||
}
|
||||
if(cookie.split("=")[0] == "theme" && cookie.split("=")[1] == "kerstmis"){
|
||||
document.querySelector(".background").innerHTML = '<div class="background_wrapper"><div class="christmas_background"></div><div class="snow layer1 a"></div><div class="snow layer1"></div> <div class="snow layer2 a"></div><div class="snow layer2"></div><div class="snow layer3 a"></div><div class="snow layer3"></div><div class="snowman_wrapper"><div class="snowman_head"></div><div class="snowman_body"></div></div><div class="train_wrapper"><div class="whole_train"><div class="mc_wagon"><div class="wheel_big wheel1"></div><div class="wheel_big wheel2"></div><div class="wheel_big wheel3"></div></div><div class="zeus_wagon"><div class="wheel_big wheel1"></div><div class="wheel_big wheel2"></div><div class="wheel_big wheel3"></div></div><div class="train"><div class="wheel_big wheel1"></div><div class="wheel_big wheel2"></div><div class="wheel_big wheel3"></div><div class="wheel_small wheel4"></div><div class="wheel_small wheel5"></div></div></div></div><input type="checkbox" class="train_button"><div class="merry_christmas"></div><div class="sled_wrapper"><div class="sled"></div></div></div>';
|
||||
}
|
||||
});
|
||||
document.querySelectorAll('.changeThemeButton').forEach(changeThemeButton= e => {e.addEventListener(`click`, handleClickChangeTheme)});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,12 +5,12 @@
|
|||
|
||||
{% block container %}
|
||||
<div class="row">
|
||||
<div class="jumbotron">
|
||||
<div class="jumbotron hi_im_haldis">
|
||||
<h2>Hi, I'm Haldis</h2>
|
||||
<h3>What would you like to eat, sir?</h3>
|
||||
<h3>What would you like to eat, <span class="home_sir">sir</span>?</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="row container">
|
||||
<div class="col-sm-5">
|
||||
{% if orders|count > 0 -%}
|
||||
<h3>Open orders:</h3>
|
||||
|
|
|
|||
|
|
@ -71,7 +71,7 @@ Haldis - {{ active_page|capitalize }}
|
|||
{% block content -%}
|
||||
{{ utils.flashed_messages(container=True) }}
|
||||
|
||||
<div class="container">
|
||||
<div class="container main">
|
||||
{% block container -%}
|
||||
{%- endblock %}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
{% macro render_order(order) -%}
|
||||
<div class="row darker">
|
||||
<div class="col-md-8 col-lg-9">
|
||||
<div class="col-md-8 col-lg-9 order_data">
|
||||
<h5>{{ order.location.name }}</h5>
|
||||
<p>
|
||||
<b>{{ order.items.count() }} orders</b></p>
|
||||
<p class="time_data">
|
||||
{% if order.stoptime %}
|
||||
<b>Closing time: </b>{{ order.stoptime.strftime("%H:%M") }} (<span class="time">{{ order.stoptime|countdown }}</span>)
|
||||
<span><b>Closes </b>{{ order.stoptime.strftime("%H:%M") }}</span><span class="time">{{ order.stoptime|countdown }}</span>
|
||||
{% else %}open{% endif %}<br/>
|
||||
<b>Orders:</b> {{ order.items.count() }}</p>
|
||||
</div>
|
||||
<div class="col-md-4 col-lg-3">
|
||||
<a class="btn btn-primary btn-block align-bottom" href="{{ url_for('order_bp.order_from_id', order_id=order.id) }}">Expand</a>
|
||||
<div class="col-md-4 col-lg-3 expand_button_wrapper">
|
||||
<a class="btn btn-primary btn-block align-bottom expand_button" href="{{ url_for('order_bp.order_from_id', order_id=order.id) }}">Expand</a>
|
||||
</div>
|
||||
</div>
|
||||
{%- endmacro %}
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@ def css():
|
|||
else:
|
||||
f = open("app/static/css/themes/"+request.cookies['theme']+".css")
|
||||
else:
|
||||
f = open("app/static/css/main.css")
|
||||
f = open("app/static/css/lightmode.css")
|
||||
response = make_response(f.read())
|
||||
response.headers['Content-Type'] = 'text/css'
|
||||
return response
|
||||
|
|
|
|||
Loading…
Reference in a new issue