Make whitespace match convention

Convention according to our EditorConfig.
This commit is contained in:
Midgard 2020-02-29 17:23:20 +01:00
parent 172d5d1e08
commit b44d34003d
Signed by: midgard
GPG key ID: 511C112F1331BBB4
53 changed files with 6623 additions and 6620 deletions

View file

@ -8,6 +8,9 @@ end_of_line = lf
insert_final_newline = true insert_final_newline = true
indent_style = tab indent_style = tab
[*.py] [*.py,*.py.*]
indent_style = space indent_style = space
indent_size = 4 indent_size = 4
[*.el]
indent_style = space

View file

@ -15,30 +15,30 @@ Be lazier today!
There is a special script to get started with the project. Just run it in the root of the project. There is a special script to get started with the project. Just run it in the root of the project.
./first-setup.sh ./first-setup.sh
This will create a virtual environment, install the necessary dependencies and will give you the option to seed the database. This will create a virtual environment, install the necessary dependencies and will give you the option to seed the database.
If you are using a database other then sqlite you will first need to configure the correct URI to the database in the generated 'config.py' file. If you are using a database other then sqlite you will first need to configure the correct URI to the database in the generated 'config.py' file.
Afterwards upgrade the database to the latest version using Afterwards upgrade the database to the latest version using
cd app cd app
python3 app.py db upgrade python3 app.py db upgrade
You can now still seed the database by running You can now still seed the database by running
./populate-db.sh ./populate-db.sh
in the root folder of the project. in the root folder of the project.
Activate the virtual environment using Activate the virtual environment using
source venv/bin/activate source venv/bin/activate
Finally run the webserver with Finally run the webserver with
python3 app/app.py runserver python3 app/app.py runserver
Make sure to use localhost instead of 127.0.0.1 if you want to be able to login. Make sure to use localhost instead of 127.0.0.1 if you want to be able to login.

View file

@ -3,35 +3,35 @@ to automatically generate anything. For the latest version, check the files in a
user user
username username
is_admin is_admin
bias bias
order order
id id
courier_id courier_id
location_id HLDS identifier location_id HLDS identifier
location_name this allows historical orders to keep the same location name location_name this allows historical orders to keep the same location name
starttime starttime
stoptime stoptime
public public
order_item order_item
id id
order_id order_id
user_id user_id
user_name for users who are not logged in user_name for users who are not logged in
dish_id HLDS identifier dish_id HLDS identifier
dish_name ) this allows historical orders to keep their correct name and price dish_name ) this allows historical orders to keep their correct name and price
price ) price )
paid paid
comment comment
hlds_data_version Git commit hash to identify HLDS data version hlds_data_version Git commit hash to identify HLDS data version
order_item_choice order_item_choice
id id
order_item_id order_item_id
choice_id HLDS identifier choice_id HLDS identifier
kind single_choice/multi_choice kind single_choice/multi_choice
name name
value just a textual description of the chosen values value just a textual description of the chosen values

View file

@ -1,366 +1,366 @@
/*! /*!
* Datetimepicker for Bootstrap 3 * Datetimepicker for Bootstrap 3
* ! version : 4.7.14 * ! version : 4.7.14
* https://github.com/Eonasdan/bootstrap-datetimepicker/ * https://github.com/Eonasdan/bootstrap-datetimepicker/
*/ */
.bootstrap-datetimepicker-widget { .bootstrap-datetimepicker-widget {
list-style: none; list-style: none;
} }
.bootstrap-datetimepicker-widget.dropdown-menu { .bootstrap-datetimepicker-widget.dropdown-menu {
margin: 2px 0; margin: 2px 0;
padding: 4px; padding: 4px;
width: 19em; width: 19em;
} }
@media (min-width: 768px) { @media (min-width: 768px) {
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs { .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
width: 38em; width: 38em;
} }
} }
@media (min-width: 992px) { @media (min-width: 992px) {
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs { .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
width: 38em; width: 38em;
} }
} }
@media (min-width: 1200px) { @media (min-width: 1200px) {
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs { .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
width: 38em; width: 38em;
} }
} }
.bootstrap-datetimepicker-widget.dropdown-menu:before, .bootstrap-datetimepicker-widget.dropdown-menu:before,
.bootstrap-datetimepicker-widget.dropdown-menu:after { .bootstrap-datetimepicker-widget.dropdown-menu:after {
content: ''; content: '';
display: inline-block; display: inline-block;
position: absolute; position: absolute;
} }
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:before { .bootstrap-datetimepicker-widget.dropdown-menu.bottom:before {
border-left: 7px solid transparent; border-left: 7px solid transparent;
border-right: 7px solid transparent; border-right: 7px solid transparent;
border-bottom: 7px solid #cccccc; border-bottom: 7px solid #cccccc;
border-bottom-color: rgba(0, 0, 0, 0.2); border-bottom-color: rgba(0, 0, 0, 0.2);
top: -7px; top: -7px;
left: 7px; left: 7px;
} }
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after { .bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
border-left: 6px solid transparent; border-left: 6px solid transparent;
border-right: 6px solid transparent; border-right: 6px solid transparent;
border-bottom: 6px solid white; border-bottom: 6px solid white;
top: -6px; top: -6px;
left: 8px; left: 8px;
} }
.bootstrap-datetimepicker-widget.dropdown-menu.top:before { .bootstrap-datetimepicker-widget.dropdown-menu.top:before {
border-left: 7px solid transparent; border-left: 7px solid transparent;
border-right: 7px solid transparent; border-right: 7px solid transparent;
border-top: 7px solid #cccccc; border-top: 7px solid #cccccc;
border-top-color: rgba(0, 0, 0, 0.2); border-top-color: rgba(0, 0, 0, 0.2);
bottom: -7px; bottom: -7px;
left: 6px; left: 6px;
} }
.bootstrap-datetimepicker-widget.dropdown-menu.top:after { .bootstrap-datetimepicker-widget.dropdown-menu.top:after {
border-left: 6px solid transparent; border-left: 6px solid transparent;
border-right: 6px solid transparent; border-right: 6px solid transparent;
border-top: 6px solid white; border-top: 6px solid white;
bottom: -6px; bottom: -6px;
left: 7px; left: 7px;
} }
.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:before { .bootstrap-datetimepicker-widget.dropdown-menu.pull-right:before {
left: auto; left: auto;
right: 6px; right: 6px;
} }
.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:after { .bootstrap-datetimepicker-widget.dropdown-menu.pull-right:after {
left: auto; left: auto;
right: 7px; right: 7px;
} }
.bootstrap-datetimepicker-widget .list-unstyled { .bootstrap-datetimepicker-widget .list-unstyled {
margin: 0; margin: 0;
} }
.bootstrap-datetimepicker-widget a[data-action] { .bootstrap-datetimepicker-widget a[data-action] {
padding: 6px 0; padding: 6px 0;
} }
.bootstrap-datetimepicker-widget a[data-action]:active { .bootstrap-datetimepicker-widget a[data-action]:active {
box-shadow: none; box-shadow: none;
} }
.bootstrap-datetimepicker-widget .timepicker-hour, .bootstrap-datetimepicker-widget .timepicker-hour,
.bootstrap-datetimepicker-widget .timepicker-minute, .bootstrap-datetimepicker-widget .timepicker-minute,
.bootstrap-datetimepicker-widget .timepicker-second { .bootstrap-datetimepicker-widget .timepicker-second {
width: 54px; width: 54px;
font-weight: bold; font-weight: bold;
font-size: 1.2em; font-size: 1.2em;
margin: 0; margin: 0;
} }
.bootstrap-datetimepicker-widget button[data-action] { .bootstrap-datetimepicker-widget button[data-action] {
padding: 6px; padding: 6px;
} }
.bootstrap-datetimepicker-widget .btn[data-action="incrementHours"]::after { .bootstrap-datetimepicker-widget .btn[data-action="incrementHours"]::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Increment Hours"; content: "Increment Hours";
} }
.bootstrap-datetimepicker-widget .btn[data-action="incrementMinutes"]::after { .bootstrap-datetimepicker-widget .btn[data-action="incrementMinutes"]::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Increment Minutes"; content: "Increment Minutes";
} }
.bootstrap-datetimepicker-widget .btn[data-action="decrementHours"]::after { .bootstrap-datetimepicker-widget .btn[data-action="decrementHours"]::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Decrement Hours"; content: "Decrement Hours";
} }
.bootstrap-datetimepicker-widget .btn[data-action="decrementMinutes"]::after { .bootstrap-datetimepicker-widget .btn[data-action="decrementMinutes"]::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Decrement Minutes"; content: "Decrement Minutes";
} }
.bootstrap-datetimepicker-widget .btn[data-action="showHours"]::after { .bootstrap-datetimepicker-widget .btn[data-action="showHours"]::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Show Hours"; content: "Show Hours";
} }
.bootstrap-datetimepicker-widget .btn[data-action="showMinutes"]::after { .bootstrap-datetimepicker-widget .btn[data-action="showMinutes"]::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Show Minutes"; content: "Show Minutes";
} }
.bootstrap-datetimepicker-widget .btn[data-action="togglePeriod"]::after { .bootstrap-datetimepicker-widget .btn[data-action="togglePeriod"]::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Toggle AM/PM"; content: "Toggle AM/PM";
} }
.bootstrap-datetimepicker-widget .btn[data-action="clear"]::after { .bootstrap-datetimepicker-widget .btn[data-action="clear"]::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Clear the picker"; content: "Clear the picker";
} }
.bootstrap-datetimepicker-widget .btn[data-action="today"]::after { .bootstrap-datetimepicker-widget .btn[data-action="today"]::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Set the date to today"; content: "Set the date to today";
} }
.bootstrap-datetimepicker-widget .picker-switch { .bootstrap-datetimepicker-widget .picker-switch {
text-align: center; text-align: center;
} }
.bootstrap-datetimepicker-widget .picker-switch::after { .bootstrap-datetimepicker-widget .picker-switch::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Toggle Date and Time Screens"; content: "Toggle Date and Time Screens";
} }
.bootstrap-datetimepicker-widget .picker-switch td { .bootstrap-datetimepicker-widget .picker-switch td {
padding: 0; padding: 0;
margin: 0; margin: 0;
height: auto; height: auto;
width: auto; width: auto;
line-height: inherit; line-height: inherit;
} }
.bootstrap-datetimepicker-widget .picker-switch td span { .bootstrap-datetimepicker-widget .picker-switch td span {
line-height: 2.5; line-height: 2.5;
height: 2.5em; height: 2.5em;
width: 100%; width: 100%;
} }
.bootstrap-datetimepicker-widget table { .bootstrap-datetimepicker-widget table {
width: 100%; width: 100%;
margin: 0; margin: 0;
} }
.bootstrap-datetimepicker-widget table td, .bootstrap-datetimepicker-widget table td,
.bootstrap-datetimepicker-widget table th { .bootstrap-datetimepicker-widget table th {
text-align: center; text-align: center;
border-radius: 4px; border-radius: 4px;
} }
.bootstrap-datetimepicker-widget table th { .bootstrap-datetimepicker-widget table th {
height: 20px; height: 20px;
line-height: 20px; line-height: 20px;
width: 20px; width: 20px;
} }
.bootstrap-datetimepicker-widget table th.picker-switch { .bootstrap-datetimepicker-widget table th.picker-switch {
width: 145px; width: 145px;
} }
.bootstrap-datetimepicker-widget table th.disabled, .bootstrap-datetimepicker-widget table th.disabled,
.bootstrap-datetimepicker-widget table th.disabled:hover { .bootstrap-datetimepicker-widget table th.disabled:hover {
background: none; background: none;
color: #777777; color: #777777;
cursor: not-allowed; cursor: not-allowed;
} }
.bootstrap-datetimepicker-widget table th.prev::after { .bootstrap-datetimepicker-widget table th.prev::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Previous Month"; content: "Previous Month";
} }
.bootstrap-datetimepicker-widget table th.next::after { .bootstrap-datetimepicker-widget table th.next::after {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
content: "Next Month"; content: "Next Month";
} }
.bootstrap-datetimepicker-widget table thead tr:first-child th { .bootstrap-datetimepicker-widget table thead tr:first-child th {
cursor: pointer; cursor: pointer;
} }
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover { .bootstrap-datetimepicker-widget table thead tr:first-child th:hover {
background: #eeeeee; background: #eeeeee;
} }
.bootstrap-datetimepicker-widget table td { .bootstrap-datetimepicker-widget table td {
height: 54px; height: 54px;
line-height: 54px; line-height: 54px;
width: 54px; width: 54px;
} }
.bootstrap-datetimepicker-widget table td.cw { .bootstrap-datetimepicker-widget table td.cw {
font-size: .8em; font-size: .8em;
height: 20px; height: 20px;
line-height: 20px; line-height: 20px;
color: #777777; color: #777777;
} }
.bootstrap-datetimepicker-widget table td.day { .bootstrap-datetimepicker-widget table td.day {
height: 20px; height: 20px;
line-height: 20px; line-height: 20px;
width: 20px; width: 20px;
} }
.bootstrap-datetimepicker-widget table td.day:hover, .bootstrap-datetimepicker-widget table td.day:hover,
.bootstrap-datetimepicker-widget table td.hour:hover, .bootstrap-datetimepicker-widget table td.hour:hover,
.bootstrap-datetimepicker-widget table td.minute:hover, .bootstrap-datetimepicker-widget table td.minute:hover,
.bootstrap-datetimepicker-widget table td.second:hover { .bootstrap-datetimepicker-widget table td.second:hover {
background: #eeeeee; background: #eeeeee;
cursor: pointer; cursor: pointer;
} }
.bootstrap-datetimepicker-widget table td.old, .bootstrap-datetimepicker-widget table td.old,
.bootstrap-datetimepicker-widget table td.new { .bootstrap-datetimepicker-widget table td.new {
color: #777777; color: #777777;
} }
.bootstrap-datetimepicker-widget table td.today { .bootstrap-datetimepicker-widget table td.today {
position: relative; position: relative;
} }
.bootstrap-datetimepicker-widget table td.today:before { .bootstrap-datetimepicker-widget table td.today:before {
content: ''; content: '';
display: inline-block; display: inline-block;
border: 0 0 7px 7px solid transparent; border: 0 0 7px 7px solid transparent;
border-bottom-color: #337ab7; border-bottom-color: #337ab7;
border-top-color: rgba(0, 0, 0, 0.2); border-top-color: rgba(0, 0, 0, 0.2);
position: absolute; position: absolute;
bottom: 4px; bottom: 4px;
right: 4px; right: 4px;
} }
.bootstrap-datetimepicker-widget table td.active, .bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover { .bootstrap-datetimepicker-widget table td.active:hover {
background-color: #337ab7; background-color: #337ab7;
color: #ffffff; color: #ffffff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
} }
.bootstrap-datetimepicker-widget table td.active.today:before { .bootstrap-datetimepicker-widget table td.active.today:before {
border-bottom-color: #fff; border-bottom-color: #fff;
} }
.bootstrap-datetimepicker-widget table td.disabled, .bootstrap-datetimepicker-widget table td.disabled,
.bootstrap-datetimepicker-widget table td.disabled:hover { .bootstrap-datetimepicker-widget table td.disabled:hover {
background: none; background: none;
color: #777777; color: #777777;
cursor: not-allowed; cursor: not-allowed;
} }
.bootstrap-datetimepicker-widget table td span { .bootstrap-datetimepicker-widget table td span {
display: inline-block; display: inline-block;
width: 54px; width: 54px;
height: 54px; height: 54px;
line-height: 54px; line-height: 54px;
margin: 2px 1.5px; margin: 2px 1.5px;
cursor: pointer; cursor: pointer;
border-radius: 4px; border-radius: 4px;
} }
.bootstrap-datetimepicker-widget table td span:hover { .bootstrap-datetimepicker-widget table td span:hover {
background: #eeeeee; background: #eeeeee;
} }
.bootstrap-datetimepicker-widget table td span.active { .bootstrap-datetimepicker-widget table td span.active {
background-color: #337ab7; background-color: #337ab7;
color: #ffffff; color: #ffffff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
} }
.bootstrap-datetimepicker-widget table td span.old { .bootstrap-datetimepicker-widget table td span.old {
color: #777777; color: #777777;
} }
.bootstrap-datetimepicker-widget table td span.disabled, .bootstrap-datetimepicker-widget table td span.disabled,
.bootstrap-datetimepicker-widget table td span.disabled:hover { .bootstrap-datetimepicker-widget table td span.disabled:hover {
background: none; background: none;
color: #777777; color: #777777;
cursor: not-allowed; cursor: not-allowed;
} }
.bootstrap-datetimepicker-widget.usetwentyfour td.hour { .bootstrap-datetimepicker-widget.usetwentyfour td.hour {
height: 27px; height: 27px;
line-height: 27px; line-height: 27px;
} }
.input-group.date .input-group-addon { .input-group.date .input-group-addon {
cursor: pointer; cursor: pointer;
} }
.sr-only { .sr-only {
position: absolute; position: absolute;
width: 1px; width: 1px;
height: 1px; height: 1px;
margin: -1px; margin: -1px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
} }

File diff suppressed because it is too large Load diff

File diff suppressed because one or more lines are too long

View file

@ -1,16 +1,16 @@
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#D0D0D8; --dGray0:#D0D0D8;
--dGray1:#8E8E93; --dGray1:#8E8E93;
--dGray2:#636366; --dGray2:#636366;
--dGray3:#48484A; --dGray3:#48484A;
--dGray4:#3A3A3C; --dGray4:#3A3A3C;
--dGray5:#2C2C2E; --dGray5:#2C2C2E;
--dGray6:#1C1C1E; --dGray6:#1C1C1E;
--dBlue:#0A84FF; --dBlue:#0A84FF;
} }
.table-hover tbody tr:hover{ .table-hover tbody tr:hover{
background-color: var(--dGray3); background-color: var(--dGray3);
} }
body{ body{
background-color: var(--dGray5); background-color: var(--dGray5);
@ -20,8 +20,8 @@ a {
color: var(--dBlue); color: var(--dBlue);
} }
.btn-primary { .btn-primary {
color: var(--dGray6); color: var(--dGray6);
background-color: var(--dBlue); background-color: var(--dBlue);
} }
.navbar { .navbar {
@ -59,23 +59,23 @@ h1, h2, h3, h4, h5, h6{
border-bottom: 2px solid var(--dGray2); border-bottom: 2px solid var(--dGray2);
} }
.navbar-toggle .icon-bar { .navbar-toggle .icon-bar {
background-color: var(--dGray0); background-color: var(--dGray0);
opacity: 0.5; opacity: 0.5;
} }
.select2-container--default .select2-selection--single{ .select2-container--default .select2-selection--single{
background-color: var(--dGray3); background-color: var(--dGray3);
color: var(--dGray0); color: var(--dGray0);
} }
.select2-container--default .select2-selection--single .select2-selection__rendered{ .select2-container--default .select2-selection--single .select2-selection__rendered{
color: var(--dGray0); color: var(--dGray0);
} }
.select2-results__option{ .select2-results__option{
background-color: var(--dGray5); background-color: var(--dGray5);
color: var(--dGray0); color: var(--dGray0);
} }
.select2-container--default .select2-results__option--highlighted[aria-selected] { .select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: var(--dGray4); background-color: var(--dGray4);
color: var(--dGray0); color: var(--dGray0);
} }
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
.bootstrap-datetimepicker-widget table td.day:hover, .bootstrap-datetimepicker-widget table td.day:hover,
@ -83,28 +83,28 @@ h1, h2, h3, h4, h5, h6{
.bootstrap-datetimepicker-widget table td.minute:hover, .bootstrap-datetimepicker-widget table td.minute:hover,
.bootstrap-datetimepicker-widget table td span:hover, .bootstrap-datetimepicker-widget table td span:hover,
.bootstrap-datetimepicker-widget table td.second:hover { .bootstrap-datetimepicker-widget table td.second:hover {
background: var(--dGray4); background: var(--dGray4);
} }
.select2-container--default .select2-results__option[aria-selected=true]{ .select2-container--default .select2-results__option[aria-selected=true]{
background-color: var(--dBlue); background-color: var(--dBlue);
color: var(--dGray0); color: var(--dGray0);
} }
.select2-search{ .select2-search{
background-color: var(--dGray2); background-color: var(--dGray2);
} }
.select2-search input{ .select2-search input{
background-color: var(--dGray0); background-color: var(--dGray0);
} }
.dropdown-menu{ .dropdown-menu{
background-color: var(--dGray5); background-color: var(--dGray5);
} }
.form-control{ .form-control{
color: var(--dGray0); color: var(--dGray0);
} }
.form-control::placeholder{ .form-control::placeholder{
color: var(--dGray2); color: var(--dGray2);
} }
.enter_darkmode>a { .enter_darkmode>a {
text-align: center; text-align: center;
} }

File diff suppressed because it is too large Load diff

View file

@ -1,198 +1,198 @@
/* Custom CSS */ /* Custom CSS */
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#D0D0D8; --dGray0:#D0D0D8;
--dGray1:#8E8E93; --dGray1:#8E8E93;
--dGray2:#636366; --dGray2:#636366;
--dGray3:#48484A; --dGray3:#48484A;
--dGray4:#3A3A3C; --dGray4:#3A3A3C;
--dGray5:#2C2C2E; --dGray5:#2C2C2E;
--dGray6:#1C1C1E; --dGray6:#1C1C1E;
--dBlue:#0A84FF; --dBlue:#0A84FF;
--FontFamily:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif; --FontFamily:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
--FontSize:13px; --FontSize:13px;
} }
html { html {
height: 100%; height: 100%;
} }
body { body {
padding-top: 70px; padding-top: 70px;
background-color: var(--dGray5); background-color: var(--dGray5);
color: var(--dGray1); color: var(--dGray1);
height: 100%; height: 100%;
font-family: var(--FontFamily); font-family: var(--FontFamily);
font-size: var(--FontSize); font-size: var(--FontSize);
} }
.background{ .background{
position: absolute; position: absolute;
z-index: -1000; z-index: -1000;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
-webkit-filter: blur(2px) brightness(50%); -webkit-filter: blur(2px) brightness(50%);
-moz-filter: blur(2px) brightness(50%); -moz-filter: blur(2px) brightness(50%);
-o-filter: blur(2px) brightness(50%); -o-filter: blur(2px) brightness(50%);
-ms-filter: blur(2px) brightness(50%); -ms-filter: blur(2px) brightness(50%);
filter: blur(2px) brightness(50%); filter: blur(2px) brightness(50%);
} }
.padding-top { .padding-top {
padding-top: 10px; padding-top: 10px;
} }
.darker { .darker {
background-color: #fafafa; background-color: #fafafa;
margin-top: 10px; margin-top: 10px;
padding-bottom: 5px; padding-bottom: 5px;
} }
@media (min-width: 992px) { @media (min-width: 992px) {
.align-bottom { .align-bottom {
margin-top: 2.5em; margin-top: 2.5em;
} }
} }
.full-width { .full-width {
width: 100%; width: 100%;
} }
.showcase { .showcase {
font-size: 16px; font-size: 16px;
line-height: 1.2; line-height: 1.2;
} }
.showcase { .showcase {
padding: 0; padding: 0;
max-width: 500px; max-width: 500px;
margin: 0 auto; margin: 0 auto;
} }
.showcase h1 { .showcase h1 {
font-size: 200%; font-size: 200%;
margin: 0 ; margin: 0 ;
padding: 0.4em 0 0.2em; padding: 0.4em 0 0.2em;
border-bottom: 1px dashed var(--dGray1); border-bottom: 1px dashed var(--dGray1);
text-align: center; text-align: center;
} }
.showcase h2 { .showcase h2 {
font-size: 110%; font-size: 110%;
font-weight: bold; font-weight: bold;
margin-bottom: 0.6em; margin-bottom: 0.6em;
} }
.showcase .open-order-warning { .showcase .open-order-warning {
font-size: 150%; font-size: 150%;
text-align: center; text-align: center;
padding: 1em 0.5em; padding: 1em 0.5em;
background-color: rgba(255, 0, 0, 0.1); background-color: rgba(255, 0, 0, 0.1);
} }
.showcase .dish { .showcase .dish {
padding: 0 0.5em; padding: 0 0.5em;
} }
@media (min-width: 500px) { @media (min-width: 500px) {
.showcase .dish { .showcase .dish {
padding: 0 1em; padding: 0 1em;
} }
} }
.showcase .quantity { .showcase .quantity {
font-size: 110%; font-size: 110%;
} }
.showcase .comments { .showcase .comments {
padding-left: 2em; padding-left: 2em;
} }
.showcase .comments li { .showcase .comments li {
margin: 0.5em 0 0; margin: 0.5em 0 0;
} }
.showcase .total { .showcase .total {
border-top: 1px dashed var(--dGray1); border-top: 1px dashed var(--dGray1);
text-align: center; text-align: center;
padding: 0.5em 0; padding: 0.5em 0;
margin-top: 1.3em; margin-top: 1.3em;
} }
.order_row { .order_row {
background: var(--dGray4); background: var(--dGray4);
} }
.time_data{ .time_data{
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
@media(min-width: 768px) and (max-width: 991px){ @media(min-width: 768px) and (max-width: 991px){
/* Make sure the small map in the location page has the same with as the block above */ /* Make sure the small map in the location page has the same with as the block above */
.sm-no-side-padding { .sm-no-side-padding {
padding-left: 0px; padding-left: 0px;
padding-right: 0px; padding-right: 0px;
} }
} }
@media(min-width: 992px){ @media(min-width: 992px){
.md-no-right-padding { .md-no-right-padding {
padding-right: 0px; padding-right: 0px;
} }
} }
/* Add clickable box */ /* Add clickable box */
div.box:hover { div.box:hover {
cursor: hand; cursor: hand;
cursor: pointer; cursor: pointer;
opacity: .9; opacity: .9;
box-shadow: 2px 4px 4px -1px #888888; box-shadow: 2px 4px 4px -1px #888888;
} }
a.divLink { a.divLink {
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
top: 0; top: 0;
left: 0; left: 0;
text-decoration: none; text-decoration: none;
/* Makes sure the link doesn't get underlined */ /* Makes sure the link doesn't get underlined */
z-index: 10; z-index: 10;
/* raises anchor tag above everything else in div */ /* raises anchor tag above everything else in div */
background-color: white; background-color: white;
/*workaround to make clickable in IE */ /*workaround to make clickable in IE */
opacity: 0; opacity: 0;
/*workaround to make clickable in IE */ /*workaround to make clickable in IE */
filter: alpha(opacity=0); filter: alpha(opacity=0);
/*workaround to make clickable in IE */ /*workaround to make clickable in IE */
} }
.footerWrapper { .footerWrapper {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between; justify-content: space-between;
margin: 0 -1rem; margin: 0 -1rem;
} }
.footerWrapper>div{ .footerWrapper>div{
margin: 0 1rem; margin: 0 1rem;
} }
.hidden { .hidden {
display: none; display: none;
} }
.table-hover tbody tr:hover{ .table-hover tbody tr:hover{
background-color: var(--dGray3); background-color: var(--dGray3);
} }
a { a {
color: var(--dBlue); color: var(--dBlue);
} }
.btn-primary { .btn-primary {
color: var(--dGray6); color: var(--dGray6);
background-color: var(--dBlue); background-color: var(--dBlue);
} }
.navbar { .navbar {
@ -230,23 +230,23 @@ h1, h2, h3, h4, h5, h6{
border-bottom: 2px solid var(--dGray2); border-bottom: 2px solid var(--dGray2);
} }
.navbar-toggle .icon-bar { .navbar-toggle .icon-bar {
background-color: var(--dGray0); background-color: var(--dGray0);
opacity: 0.5; opacity: 0.5;
} }
.select2-container--default .select2-selection--single{ .select2-container--default .select2-selection--single{
background-color: var(--dGray3); background-color: var(--dGray3);
color: var(--dGray0); color: var(--dGray0);
} }
.select2-container--default .select2-selection--single .select2-selection__rendered{ .select2-container--default .select2-selection--single .select2-selection__rendered{
color: var(--dGray0); color: var(--dGray0);
} }
.select2-results__option{ .select2-results__option{
background-color: var(--dGray5); background-color: var(--dGray5);
color: var(--dGray0); color: var(--dGray0);
} }
.select2-container--default .select2-results__option--highlighted[aria-selected] { .select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: var(--dGray4); background-color: var(--dGray4);
color: var(--dGray0); color: var(--dGray0);
} }
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
.bootstrap-datetimepicker-widget table td.day:hover, .bootstrap-datetimepicker-widget table td.day:hover,
@ -254,39 +254,39 @@ h1, h2, h3, h4, h5, h6{
.bootstrap-datetimepicker-widget table td.minute:hover, .bootstrap-datetimepicker-widget table td.minute:hover,
.bootstrap-datetimepicker-widget table td span:hover, .bootstrap-datetimepicker-widget table td span:hover,
.bootstrap-datetimepicker-widget table td.second:hover { .bootstrap-datetimepicker-widget table td.second:hover {
background: var(--dGray4); background: var(--dGray4);
} }
.select2-container--default .select2-results__option[aria-selected=true]{ .select2-container--default .select2-results__option[aria-selected=true]{
background-color: var(--dBlue); background-color: var(--dBlue);
color: var(--dGray0); color: var(--dGray0);
} }
.select2-search{ .select2-search{
background-color: var(--dGray2); background-color: var(--dGray2);
} }
.select2-selection--multiple .select2-search{ .select2-selection--multiple .select2-search{
background-color: transparent; background-color: transparent;
} }
.select2-selection--multiple .select2-search{ .select2-selection--multiple .select2-search{
background-color: transparent; background-color: transparent;
} }
.select2-selection--multiple .select2-search.select2-search--inline .select2-search__field{ .select2-selection--multiple .select2-search.select2-search--inline .select2-search__field{
border: 1px solid #ccc; border: 1px solid #ccc;
padding-left: 0.3em; padding-left: 0.3em;
box-sizing: content-box; box-sizing: content-box;
} }
.select2-search input{ .select2-search input{
background-color: var(--dGray0); background-color: var(--dGray0);
} }
.dropdown-menu{ .dropdown-menu{
background-color: var(--dGray5); background-color: var(--dGray5);
} }
.form-control{ .form-control{
color: var(--dGray0); color: var(--dGray0);
} }
.form-control::placeholder{ .form-control::placeholder{
color: var(--dGray2); color: var(--dGray2);
} }
.enter_darkmode>a { .enter_darkmode>a {
text-align: center; text-align: center;
} }

View file

@ -1,9 +1,9 @@
.large-map { .large-map {
min-height: 400px; min-height: 400px;
height: 600px; height: 600px;
} }
.small-map { .small-map {
min-height: 150px; min-height: 150px;
height: 250px; height: 250px;
} }

View file

@ -1,15 +1,15 @@
@media print { @media print {
nav, form, footer, .btn, #form, #debts { nav, form, footer, .btn, #form, #debts {
display: none; display: none;
} }
#items { #items {
display: flex; display: flex;
} }
#items-list { #items-list {
order: 2; order: 2;
} }
#items-ordered { #items-ordered {
order: 1; order: 1;
margin-right: 50px; margin-right: 50px;
} }
} }

View file

@ -1,12 +1,12 @@
/*Darkmode*/ /*Darkmode*/
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#D0D0D8; --dGray0:#D0D0D8;
--dGray1:#8E8E93; --dGray1:#8E8E93;
--dGray2:#636366; --dGray2:#636366;
--dGray3:#48484A; --dGray3:#48484A;
--dGray4:#3A3A3C; --dGray4:#3A3A3C;
--dGray5:#2C2C2E; --dGray5:#2C2C2E;
--dGray6:#1C1C1E; --dGray6:#1C1C1E;
--dBlue:#0A84FF; --dBlue:#0A84FF;
} }

View file

@ -1,4 +1,4 @@
.background { .background {
background-image: url("https://kelder.zeus.ugent.be/webcam/video/mjpg.cgi?profileid=2"); background-image: url("https://kelder.zeus.ugent.be/webcam/video/mjpg.cgi?profileid=2");
background-size: contain; background-size: contain;
} }

View file

@ -1,16 +1,16 @@
/*halloween*/ /*halloween*/
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#FFEB65; --dGray0:#FFEB65;
--dGray1:#F28705; --dGray1:#F28705;
--dGray2:#F25C05; --dGray2:#F25C05;
--dGray3:#F27405; --dGray3:#F27405;
--dGray4:#8C3D0F; --dGray4:#8C3D0F;
--dGray5:#260101; --dGray5:#260101;
--dGray6:#260101; --dGray6:#260101;
--dBlue:#D91604; --dBlue:#D91604;
} }
.table-hover tbody tr:hover{ .table-hover tbody tr:hover{
background-image: url("static/images/themes/halloween/Halloween.jpeg"); background-image: url("static/images/themes/halloween/Halloween.jpeg");
} }

View file

@ -11,524 +11,524 @@ Enige discretie is aangeraden.
*/ */
/*high performance kerstmis*/ /*high performance kerstmis*/
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#F28705; --dGray0:#F28705;
--dGray1:white; --dGray1:white;
--dGray2:#590212; --dGray2:#590212;
--dGray3:#590212; --dGray3:#590212;
--dGray4:#274001; --dGray4:#274001;
--dGray5:#274001; --dGray5:#274001;
--dGray6:#F2778D; --dGray6:#F2778D;
--dBlue:#F2778D; } --dBlue:#F2778D; }
body { body {
height: 100%; height: 100%;
font-family: Radikal,Optima,Segoe,Segoe UI,Candara,Calibri,Arial,sans-serif; font-family: Radikal,Optima,Segoe,Segoe UI,Candara,Calibri,Arial,sans-serif;
background-color: #2F0000; } background-color: #2F0000; }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url("static/fonts/radikal_regular.ttf"); src: url("static/fonts/radikal_regular.ttf");
font-weight: normal; } font-weight: normal; }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url("static/fonts/radikal_light.ttf"); src: url("static/fonts/radikal_light.ttf");
font-weight: 200; } font-weight: 200; }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url("static/fonts/radikal_medium.ttf"); src: url("static/fonts/radikal_medium.ttf");
font-weight: medium; } font-weight: medium; }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url("static/fonts/radikal_bold.ttf"); src: url("static/fonts/radikal_bold.ttf");
font-weight: bold; } font-weight: bold; }
.btn { .btn {
border-radius: 5rem; border-radius: 5rem;
color: white; color: white;
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
background-image: linear-gradient(-40deg, #F53030, #F58B9E); } background-image: linear-gradient(-40deg, #F53030, #F58B9E); }
.btn:hover { .btn:hover {
background-image: linear-gradient(-40deg, #A81111, #FF4B33); } background-image: linear-gradient(-40deg, #A81111, #FF4B33); }
.navbar { .navbar {
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
padding: 1.5rem; padding: 1.5rem;
background-color: transparent; background-color: transparent;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
text-transform: capitalize; } text-transform: capitalize; }
.nav > li > a { .nav > li > a {
padding-left: 1vw; padding-left: 1vw;
padding-right: 1vw; } padding-right: 1vw; }
.main { .main {
height: 90vh; height: 90vh;
overflow: scroll; overflow: scroll;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
flex-direction: column; } flex-direction: column; }
.navbar .container { .navbar .container {
width: 100%; width: 100%;
padding: 0 4vw; } padding: 0 4vw; }
@media (min-width: 768px) { @media (min-width: 768px) {
.container { .container {
width: 100%; } } width: 100%; } }
@media (min-width: 992px) { @media (min-width: 992px) {
.main .container, .main .orders { .main .container, .main .orders {
width: 970px; } } width: 970px; } }
@media (min-width: 1200px) { @media (min-width: 1200px) {
.main .container, .main .orders { .main .container, .main .orders {
width: 1170px; } } width: 1170px; } }
.main { .main {
padding-top: 2.5rem; } padding-top: 2.5rem; }
.order_data { .order_data {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
padding: 0 3rem; padding: 0 3rem;
align-items: baseline; } align-items: baseline; }
.order_row { .order_row {
background: transparent; } background: transparent; }
.order_data h5 { .order_data h5 {
max-width: 60%; max-width: 60%;
padding-bottom: 3rem; } padding-bottom: 3rem; }
.expand_button { .expand_button {
padding: 1rem 0rem; padding: 1rem 0rem;
margin-top: -1rem; margin-top: -1rem;
width: 70%; width: 70%;
margin-bottom: 1.5rem; } margin-bottom: 1.5rem; }
.hi_im_haldis h2 { .hi_im_haldis h2 {
display: none; } display: none; }
.hi_im_haldis h3 { .hi_im_haldis h3 {
width: 100%; width: 100%;
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
text-align: center; } text-align: center; }
.hi_im_haldis { .hi_im_haldis {
background: linear-gradient(70deg, rgba(203, 52, 68, 0.8), rgba(135, 32, 44, 0.8)); background: linear-gradient(70deg, rgba(203, 52, 68, 0.8), rgba(135, 32, 44, 0.8));
border-radius: 0; border-radius: 0;
width: 100%; } width: 100%; }
.hi_im_haldis_wrapper { .hi_im_haldis_wrapper {
width: 100%; } width: 100%; }
.darker:nth-child(even) { .darker:nth-child(even) {
background-color: #B62937; background-color: #B62937;
border-radius: 2rem; } border-radius: 2rem; }
.darker:nth-child(odd) { .darker:nth-child(odd) {
background-color: #821C25; background-color: #821C25;
border-radius: 2rem; } border-radius: 2rem; }
.darker { .darker {
padding: 1rem; } padding: 1rem; }
.order_row:nth-child(even) .order_data { .order_row:nth-child(even) .order_data {
background-color: #B62937; background-color: #B62937;
border-radius: 2rem; } border-radius: 2rem; }
.order_row:nth-child(odd) .order_data { .order_row:nth-child(odd) .order_data {
background-color: #821C25; background-color: #821C25;
border-radius: 2rem; } border-radius: 2rem; }
.order_row h5 { .order_row h5 {
font-weight: bold; } font-weight: bold; }
.order_row { .order_row {
margin-bottom: 3rem; } margin-bottom: 3rem; }
h3 { h3 {
padding-bottom: 1rem; } padding-bottom: 1rem; }
.home_sir { .home_sir {
font-weight: bold; font-weight: bold;
color: #F45D68; } color: #F45D68; }
.expand_button_wrapper { .expand_button_wrapper {
margin-top: -1rem; margin-top: -1rem;
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; } justify-content: center; }
.time_data { .time_data {
text-align: right; text-align: right;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-self: right; } justify-self: right; }
.navbar .navbar-nav .active a { .navbar .navbar-nav .active a {
color: #ff9bae; color: #ff9bae;
border-bottom: 1px solid #ff9bae; border-bottom: 1px solid #ff9bae;
padding-bottom: 1rem; } padding-bottom: 1rem; }
.navbar-nav { .navbar-nav {
padding-left: 2rem; } padding-left: 2rem; }
.jumbotron, .darker { .jumbotron, .darker {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
border-radius: 4rem; } border-radius: 4rem; }
.row > div > h5 { .row > div > h5 {
font-weight: bold; font-weight: bold;
padding-top: 1.5rem; padding-top: 1.5rem;
font-size: 2.5rem; } font-size: 2.5rem; }
.row > div > .amount_of_orders { .row > div > .amount_of_orders {
font-weight: lighter; font-weight: lighter;
font-size: 1.6rem; } font-size: 1.6rem; }
.row > div .time { .row > div .time {
font-weight: lighter; } font-weight: lighter; }
.jumbotron { .jumbotron {
background-color: transparent; } background-color: transparent; }
.navbar-default .navbar-nav .active a, .navbar-default .navbar-nav .active a:hover { .navbar-default .navbar-nav .active a, .navbar-default .navbar-nav .active a:hover {
background-color: transparent; } background-color: transparent; }
.background { .background {
-webkit-filter: blur(0px) brightness(80%); -webkit-filter: blur(0px) brightness(80%);
-moz-filter: blur(0px) brightness(80%); -moz-filter: blur(0px) brightness(80%);
-o-filter: blur(0px) brightness(80%); -o-filter: blur(0px) brightness(80%);
-ms-filter: blur(0px) brightness(80%); -ms-filter: blur(0px) brightness(80%);
filter: blur(0px) brightness(80%); filter: blur(0px) brightness(80%);
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; } left: 0; }
footer a { footer a {
color: #69E8FF; } color: #69E8FF; }
footer { footer {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
width: 100%; width: 100%;
background: #CB3444; background: #CB3444;
height: 5rem; height: 5rem;
display: flex; display: flex;
align-items: center; } align-items: center; }
footer > hr { footer > hr {
display: none; } display: none; }
#mapid { #mapid {
width: 100%; } width: 100%; }
.order_overview, .order_order, .order_items, .order_ordered, .order_depts { .order_overview, .order_order, .order_items, .order_ordered, .order_depts {
padding: 1rem 5rem 3rem 5rem; } padding: 1rem 5rem 3rem 5rem; }
.order_overview { .order_overview {
width: 100%; } width: 100%; }
.order_depts { .order_depts {
width: 100%; width: 100%;
margin-bottom: 10rem; } margin-bottom: 10rem; }
.location_data, .location_products { .location_data, .location_products {
width: 100%; } width: 100%; }
.location_products { .location_products {
margin-bottom: 10rem; } margin-bottom: 10rem; }
.locations_locations { .locations_locations {
padding: 1rem 5rem 3rem 5rem; } padding: 1rem 5rem 3rem 5rem; }
.background_wrapper { .background_wrapper {
position: absolute; position: absolute;
left: 0; left: 0;
bottom: 5rem; bottom: 5rem;
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow: hidden; } overflow: hidden; }
.christmas_background { .christmas_background {
z-index: -101; z-index: -101;
width: 300%; width: 300%;
height: 300%; height: 300%;
background: linear-gradient(-45deg, #2F0000, #C20A12); background: linear-gradient(-45deg, #2F0000, #C20A12);
animation: gradientBG 19s ease infinite; } animation: gradientBG 19s ease infinite; }
.sled { .sled {
width: 15rem; width: 15rem;
height: 15rem; height: 15rem;
transition: transform 2s ease-in 5s, rotate 1s ease-in-out 2s; transition: transform 2s ease-in 5s, rotate 1s ease-in-out 2s;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
background-size: contain; background-size: contain;
background-image: url("static/images/themes/kerstmis/sled.svg"); } background-image: url("static/images/themes/kerstmis/sled.svg"); }
.sled_wrapper { .sled_wrapper {
top: 0.5rem; top: 0.5rem;
left: -7.5rem; left: -7.5rem;
position: absolute; position: absolute;
transform: translate(-50vw, 40vh) rotate(0deg); transform: translate(-50vw, 40vh) rotate(0deg);
width: 15rem; width: 15rem;
height: 15rem; height: 15rem;
animation: sled 29s ease-in-out infinite; } animation: sled 29s ease-in-out infinite; }
.train_button:checked ~ .sled_wrapper:hover { .train_button:checked ~ .sled_wrapper:hover {
animation-play-state: paused; } animation-play-state: paused; }
.train_button:checked ~ .sled_wrapper:hover .sled { .train_button:checked ~ .sled_wrapper:hover .sled {
transform: translateY(100vh) rotate(90deg); } transform: translateY(100vh) rotate(90deg); }
.snowman_wrapper { .snowman_wrapper {
height: 17rem; height: 17rem;
width: 10rem; width: 10rem;
position: absolute; position: absolute;
bottom: 15rem; bottom: 15rem;
left: -12rem; left: -12rem;
animation: snowman 37s ease infinite; animation: snowman 37s ease infinite;
transform-origin: right bottom; } transform-origin: right bottom; }
.snowman_head { .snowman_head {
position: absolute; position: absolute;
top: 0; top: 0;
width: 10rem; width: 10rem;
height: 10rem; height: 10rem;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
background-image: url("static/images/themes/kerstmis/snowman_head.svg"); background-image: url("static/images/themes/kerstmis/snowman_head.svg");
animation: snowman_head 2s ease infinite; } animation: snowman_head 2s ease infinite; }
.snowman_body { .snowman_body {
position: absolute; position: absolute;
top: 9.5rem; top: 9.5rem;
left: 0.5rem; left: 0.5rem;
width: 10rem; width: 10rem;
height: 10rem; height: 10rem;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
background-image: url("static/images/themes/kerstmis/snowman_body.svg"); } background-image: url("static/images/themes/kerstmis/snowman_body.svg"); }
.train_button:checked ~ .merry_christmas { .train_button:checked ~ .merry_christmas {
position: absolute; position: absolute;
top: 0; top: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background-position: center; background-position: center;
background-image: url("static/images/themes/kerstmis/merry_christmas.svg"); background-image: url("static/images/themes/kerstmis/merry_christmas.svg");
background-size: 25vw; background-size: 25vw;
background-repeat: no-repeat; background-repeat: no-repeat;
animation: merry_christmas 5s ease infinite; } animation: merry_christmas 5s ease infinite; }
.train_button { .train_button {
position: absolute; position: absolute;
transform: scaleX(20) scaleY(8) translateX(-100rem); transform: scaleX(20) scaleY(8) translateX(-100rem);
bottom: 5.5rem; bottom: 5.5rem;
left: 7rem; left: 7rem;
animation: follow_train 47s linear infinite; animation: follow_train 47s linear infinite;
opacity: 0; } opacity: 0; }
.train_wrapper { .train_wrapper {
position: absolute; position: absolute;
bottom: 0.5rem; bottom: 0.5rem;
transform: translateX(-80vw); transform: translateX(-80vw);
animation: train 47s linear infinite; } animation: train 47s linear infinite; }
.wheel_big, .wheel_small { .wheel_big, .wheel_small {
position: absolute; position: absolute;
bottom: -0.4rem; bottom: -0.4rem;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
background-image: url("static/images/themes/kerstmis/wheel.svg"); } background-image: url("static/images/themes/kerstmis/wheel.svg"); }
.train { .train {
position: absolute; position: absolute;
bottom: 0.5rem; bottom: 0.5rem;
left: 30rem; left: 30rem;
width: 30rem; width: 30rem;
height: 10rem; height: 10rem;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
background-image: url("static/images/themes/kerstmis/train.svg"); background-image: url("static/images/themes/kerstmis/train.svg");
animation: whobble 1s linear alternate-reverse infinite; } animation: whobble 1s linear alternate-reverse infinite; }
.wheel_big { .wheel_big {
width: 3.2rem; width: 3.2rem;
height: 3.2rem; } height: 3.2rem; }
.wheel_small { .wheel_small {
width: 2.5rem; width: 2.5rem;
height: 2.5rem; } height: 2.5rem; }
.train .wheel1 { .train .wheel1 {
animation: turn 2s linear infinite; animation: turn 2s linear infinite;
left: 3.5rem; } left: 3.5rem; }
.train .wheel2 { .train .wheel2 {
animation: turn 2s linear infinite, -0.1s; animation: turn 2s linear infinite, -0.1s;
left: 7rem; } left: 7rem; }
.train .wheel3 { .train .wheel3 {
animation: turn 2s linear infinite -0.3s; animation: turn 2s linear infinite -0.3s;
left: 10.5rem; } left: 10.5rem; }
.train .wheel4 { .train .wheel4 {
animation: turn 1.5s linear infinite -0.5s; animation: turn 1.5s linear infinite -0.5s;
left: 13.9rem; } left: 13.9rem; }
.train .wheel5 { .train .wheel5 {
animation: turn 1.5s linear infinite -0.7s; animation: turn 1.5s linear infinite -0.7s;
left: 16.6rem; } left: 16.6rem; }
.zeus_wagon, .mc_wagon { .zeus_wagon, .mc_wagon {
position: absolute; position: absolute;
bottom: 1.25rem; bottom: 1.25rem;
width: 30rem; width: 30rem;
height: 7.5rem; height: 7.5rem;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
animation: whobble 1s linear alternate-reverse infinite; } animation: whobble 1s linear alternate-reverse infinite; }
.mc_wagon { .mc_wagon {
background-image: url("static/images/themes/kerstmis/mc_wagon.svg"); background-image: url("static/images/themes/kerstmis/mc_wagon.svg");
left: 0rem; } left: 0rem; }
.zeus_wagon { .zeus_wagon {
background-image: url("static/images/themes/kerstmis/zeus_wagon.svg"); background-image: url("static/images/themes/kerstmis/zeus_wagon.svg");
left: 15rem; } left: 15rem; }
.zeus_wagon .wheel1, .mc_wagon .wheel1 { .zeus_wagon .wheel1, .mc_wagon .wheel1 {
animation: turn 2s linear infinite; animation: turn 2s linear infinite;
bottom: -1.1rem; bottom: -1.1rem;
left: 2.2rem; } left: 2.2rem; }
.zeus_wagon .wheel2, .mc_wagon .wheel2 { .zeus_wagon .wheel2, .mc_wagon .wheel2 {
animation: turn 2s linear infinite, -0.1s; animation: turn 2s linear infinite, -0.1s;
bottom: -1.1rem; bottom: -1.1rem;
left: 5.75rem; } left: 5.75rem; }
.zeus_wagon .wheel3, .mc_wagon .wheel3 { .zeus_wagon .wheel3, .mc_wagon .wheel3 {
animation: turn 2s linear infinite -0.3s; animation: turn 2s linear infinite -0.3s;
bottom: -1.1rem; bottom: -1.1rem;
left: 9.3rem; } left: 9.3rem; }
.snow { .snow {
border-radius: 50%; border-radius: 50%;
opacity: 0.8; opacity: 0.8;
position: absolute; position: absolute;
top: -100vh; top: -100vh;
animation-name: fall; animation-name: fall;
animation-timing-function: linear; animation-timing-function: linear;
animation-iteration-count: infinite; } animation-iteration-count: infinite; }
.layer1 { .layer1 {
width: 1rem; width: 1rem;
height: 1rem; height: 1rem;
filter: blur(1.5px); filter: blur(1.5px);
box-shadow: 71vw 89.7vh 0 -0.13rem#fff,37.6vw 73.2vh 0 -0.46rem#fff,31.1vw 76.6vh 0 -0.42rem#fff,41.5vw 94vh 0 -0.3rem#fff,76.7vw 28.6vh 0 -0.18rem#fff,21.7vw 70.7vh 0 -0.34rem#fff,14.6vw 72.9vh 0 -0.04rem#fff,72vw 50vh 0 -0.12rem#fff,89.6vw 90.4vh 0 -0.45rem#fff,49.7vw 21.5vh 0 -0.02rem#fff,15.8vw 87.2vh 0 -0.04rem#fff,46.3vw 85.9vh 0 -0.24rem#fff,91.6vw 7.4vh 0 -0.11rem#fff,83.3vw 60.5vh 0 -0.06rem#fff,15.2vw 3.2vh 0 -0.31rem#fff,52.9vw 54.1vh 0 -0.48rem#fff,58.9vw 42.1vh 0 -0.07rem#fff,40.7vw 10.5vh 0 -0.25rem#fff,53.7vw 74.5vh 0 -0.33rem#fff,89vw 50.9vh 0 -0.2rem#fff,35vw 22.6vh 0 -0.2rem#fff,18.9vw 66.4vh 0 -0.33rem#fff,66.8vw 22.9vh 0 -0.05rem#fff,34.3vw 46.9vh 0 -0.26rem#fff,72.9vw 33.1vh 0 -0.25rem#fff,23.2vw 2.5vh 0 -0.16rem#fff,60.3vw 21.6vh 0 -0.35rem#fff,14.3vw 0.6vh 0 -0.09rem#fff,95.6vw 72.2vh 0 -0.03rem#fff,4vw 28.6vh 0 -0.17rem#fff,40.8vw 67.7vh 0 -0.16rem#fff,85vw 88.1vh 0 -0.41rem#fff,37.4vw 50.1vh 0 -0.07rem#fff,50.8vw 39.8vh 0 -0.01rem#fff,14.4vw 95.1vh 0 -0.23rem#fff,77.7vw 10.2vh 0 -0.14rem#fff,35.1vw 59vh 0 -0.03rem#fff,45.8vw 42.4vh 0 -0.37rem#fff,48.3vw 51.3vh 0 -0.45rem#fff,98.3vw 5.8vh 0 -0.26rem#fff,2.4vw 88vh 0 -0.17rem#fff,16vw 49.1vh 0 -0.39rem#fff,76.6vw 42.6vh 0 -0.25rem#fff,17.2vw 44.5vh 0 -0.1rem#fff,51.2vw 73.7vh 0 -0.33rem#fff,31.7vw 59.2vh 0 -0.47rem#fff,32.4vw 68.9vh 0 -0.07rem#fff,3.7vw 94.8vh 0 -0.33rem#fff,55.3vw 3.8vh 0 -0.24rem#fff,25.3vw 81.2vh 0 -0.21rem#fff,68.2vw 97.6vh 0 -0.27rem#fff,43.4vw 56.5vh 0 -0.06rem#fff,40.6vw 98.7vh 0 -0.49rem#fff,41.2vw 37.2vh 0 -0.22rem#fff,66.7vw 21.2vh 0 -0.32rem#fff,3.6vw 75.9vh 0 -0.04rem#fff,66.2vw 71.2vh 0 -0.33rem#fff,30.6vw 59.9vh 0 -0.02rem#fff,22.6vw 72.1vh 0 -0.02rem#fff,93.9vw 9.7vh 0 -0.19rem#fff,99.1vw 73.3vh 0 -0.07rem#fff,48.4vw 94.2vh 0 -0.33rem#fff,44.1vw 55.1vh 0 -0.35rem#fff,98.3vw 34vh 0 -0.07rem#fff,85.1vw 30.4vh 0 -0.42rem#fff,65.2vw 21.4vh 0 -0.05rem#fff,72.1vw 92.9vh 0 -0.48rem#fff,25.8vw 53.6vh 0 -0.02rem#fff,13.8vw 12.7vh 0 -0.26rem#fff,79.4vw 94.9vh 0 -0.06rem#fff,41.8vw 56.2vh 0 -0.31rem#fff,67.4vw 20.2vh 0 -0.34rem#fff,35.6vw 88.7vh 0 -0.1rem#fff,12.5vw 20.1vh 0 -0.06rem#fff,30.3vw 32.7vh 0 -0.34rem#fff,51.4vw 84.2vh 0 -0.15rem#fff,16.2vw 80.1vh 0 -0.31rem#fff,6.1vw 14.1vh 0 -0.41rem#fff,86.6vw 55.9vh 0 -0.41rem#fff,43.5vw 75.9vh 0 -0.45rem#fff,77.5vw 20.4vh 0 -0.12rem#fff,67.7vw 97.6vh 0 -0.08rem#fff,0.8vw 18.1vh 0 -0.33rem#fff,60.6vw 21.3vh 0 -0.19rem#fff,70.2vw 79.3vh 0 -0.26rem#fff,50.8vw 68.8vh 0 -0.35rem#fff,53.9vw 12.5vh 0 -0.39rem#fff,76.4vw 45.9vh 0 -0.12rem#fff,11.5vw 58.7vh 0 -0.31rem#fff,76.3vw 74.7vh 0 -0.4rem#fff,4.7vw 46.7vh 0 -0.39rem#fff,54.5vw 63.6vh 0 -0.28rem#fff,51.6vw 65.9vh 0 -0.3rem#fff,65.9vw 47.6vh 0 -0.08rem#fff,91.6vw 58.8vh 0 -0.12rem#fff,26.9vw 71.6vh 0 -0.36rem#fff,59.7vw 71.2vh 0 -0.37rem#fff,47.1vw 16.2vh 0 -0.14rem#fff,72.4vw 45.7vh 0 -0.06rem#fff,30.8vw 39.3vh 0 -0.38rem#fff; box-shadow: 71vw 89.7vh 0 -0.13rem#fff,37.6vw 73.2vh 0 -0.46rem#fff,31.1vw 76.6vh 0 -0.42rem#fff,41.5vw 94vh 0 -0.3rem#fff,76.7vw 28.6vh 0 -0.18rem#fff,21.7vw 70.7vh 0 -0.34rem#fff,14.6vw 72.9vh 0 -0.04rem#fff,72vw 50vh 0 -0.12rem#fff,89.6vw 90.4vh 0 -0.45rem#fff,49.7vw 21.5vh 0 -0.02rem#fff,15.8vw 87.2vh 0 -0.04rem#fff,46.3vw 85.9vh 0 -0.24rem#fff,91.6vw 7.4vh 0 -0.11rem#fff,83.3vw 60.5vh 0 -0.06rem#fff,15.2vw 3.2vh 0 -0.31rem#fff,52.9vw 54.1vh 0 -0.48rem#fff,58.9vw 42.1vh 0 -0.07rem#fff,40.7vw 10.5vh 0 -0.25rem#fff,53.7vw 74.5vh 0 -0.33rem#fff,89vw 50.9vh 0 -0.2rem#fff,35vw 22.6vh 0 -0.2rem#fff,18.9vw 66.4vh 0 -0.33rem#fff,66.8vw 22.9vh 0 -0.05rem#fff,34.3vw 46.9vh 0 -0.26rem#fff,72.9vw 33.1vh 0 -0.25rem#fff,23.2vw 2.5vh 0 -0.16rem#fff,60.3vw 21.6vh 0 -0.35rem#fff,14.3vw 0.6vh 0 -0.09rem#fff,95.6vw 72.2vh 0 -0.03rem#fff,4vw 28.6vh 0 -0.17rem#fff,40.8vw 67.7vh 0 -0.16rem#fff,85vw 88.1vh 0 -0.41rem#fff,37.4vw 50.1vh 0 -0.07rem#fff,50.8vw 39.8vh 0 -0.01rem#fff,14.4vw 95.1vh 0 -0.23rem#fff,77.7vw 10.2vh 0 -0.14rem#fff,35.1vw 59vh 0 -0.03rem#fff,45.8vw 42.4vh 0 -0.37rem#fff,48.3vw 51.3vh 0 -0.45rem#fff,98.3vw 5.8vh 0 -0.26rem#fff,2.4vw 88vh 0 -0.17rem#fff,16vw 49.1vh 0 -0.39rem#fff,76.6vw 42.6vh 0 -0.25rem#fff,17.2vw 44.5vh 0 -0.1rem#fff,51.2vw 73.7vh 0 -0.33rem#fff,31.7vw 59.2vh 0 -0.47rem#fff,32.4vw 68.9vh 0 -0.07rem#fff,3.7vw 94.8vh 0 -0.33rem#fff,55.3vw 3.8vh 0 -0.24rem#fff,25.3vw 81.2vh 0 -0.21rem#fff,68.2vw 97.6vh 0 -0.27rem#fff,43.4vw 56.5vh 0 -0.06rem#fff,40.6vw 98.7vh 0 -0.49rem#fff,41.2vw 37.2vh 0 -0.22rem#fff,66.7vw 21.2vh 0 -0.32rem#fff,3.6vw 75.9vh 0 -0.04rem#fff,66.2vw 71.2vh 0 -0.33rem#fff,30.6vw 59.9vh 0 -0.02rem#fff,22.6vw 72.1vh 0 -0.02rem#fff,93.9vw 9.7vh 0 -0.19rem#fff,99.1vw 73.3vh 0 -0.07rem#fff,48.4vw 94.2vh 0 -0.33rem#fff,44.1vw 55.1vh 0 -0.35rem#fff,98.3vw 34vh 0 -0.07rem#fff,85.1vw 30.4vh 0 -0.42rem#fff,65.2vw 21.4vh 0 -0.05rem#fff,72.1vw 92.9vh 0 -0.48rem#fff,25.8vw 53.6vh 0 -0.02rem#fff,13.8vw 12.7vh 0 -0.26rem#fff,79.4vw 94.9vh 0 -0.06rem#fff,41.8vw 56.2vh 0 -0.31rem#fff,67.4vw 20.2vh 0 -0.34rem#fff,35.6vw 88.7vh 0 -0.1rem#fff,12.5vw 20.1vh 0 -0.06rem#fff,30.3vw 32.7vh 0 -0.34rem#fff,51.4vw 84.2vh 0 -0.15rem#fff,16.2vw 80.1vh 0 -0.31rem#fff,6.1vw 14.1vh 0 -0.41rem#fff,86.6vw 55.9vh 0 -0.41rem#fff,43.5vw 75.9vh 0 -0.45rem#fff,77.5vw 20.4vh 0 -0.12rem#fff,67.7vw 97.6vh 0 -0.08rem#fff,0.8vw 18.1vh 0 -0.33rem#fff,60.6vw 21.3vh 0 -0.19rem#fff,70.2vw 79.3vh 0 -0.26rem#fff,50.8vw 68.8vh 0 -0.35rem#fff,53.9vw 12.5vh 0 -0.39rem#fff,76.4vw 45.9vh 0 -0.12rem#fff,11.5vw 58.7vh 0 -0.31rem#fff,76.3vw 74.7vh 0 -0.4rem#fff,4.7vw 46.7vh 0 -0.39rem#fff,54.5vw 63.6vh 0 -0.28rem#fff,51.6vw 65.9vh 0 -0.3rem#fff,65.9vw 47.6vh 0 -0.08rem#fff,91.6vw 58.8vh 0 -0.12rem#fff,26.9vw 71.6vh 0 -0.36rem#fff,59.7vw 71.2vh 0 -0.37rem#fff,47.1vw 16.2vh 0 -0.14rem#fff,72.4vw 45.7vh 0 -0.06rem#fff,30.8vw 39.3vh 0 -0.38rem#fff;
animation-duration: 18s; } animation-duration: 18s; }
.layer1.a { .layer1.a {
animation-delay: -9s; } animation-delay: -9s; }
.layer2 { .layer2 {
width: 0.8rem; width: 0.8rem;
height: 0.8rem; height: 0.8rem;
filter: blur(3px); filter: blur(3px);
box-shadow: 71.8vw 15.9vh 0 -0.3rem#fff,4.2vw 8.1vh 0 -0.41rem#fff,67.5vw 49.2vh 0 -0.28rem#fff,72vw 97.8vh 0 -0.22rem#fff,78.1vw 28vh 0 -0.41rem#fff,34.2vw 51.7vh 0 -0.47rem#fff,37.9vw 76.5vh 0 -0.39rem#fff,92.6vw 36.3vh 0 -0.22rem#fff,59.9vw 8.6vh 0 -0.07rem#fff,32.5vw 74vh 0 -0.07rem#fff,75.7vw 81.6vh 0 -0.12rem#fff,1.7vw 18.5vh 0 -0.2rem#fff,12.3vw 64.7vh 0 -0.37rem#fff,83.9vw 47vh 0 -0.12rem#fff,33.8vw 21.3vh 0 -0.14rem#fff,6.5vw 92.5vh 0 -0.29rem#fff,72.2vw 60.8vh 0 -0.17rem#fff,38.4vw 16vh 0 -0.17rem#fff,23.9vw 58.4vh 0 -0.32rem#fff,40.2vw 52.4vh 0 -0.23rem#fff,48.9vw 74.6vh 0 -0.03rem#fff,61.5vw 36.1vh 0 -0.49rem#fff,60.9vw 94.5vh 0 -0.42rem#fff,2.8vw 59.7vh 0 -0.27rem#fff,62.6vw 32.4vh 0 -0.45rem#fff,91.3vw 18vh 0 -0.09rem#fff,35.9vw 35.5vh 0 -0.11rem#fff,60.2vw 95.5vh 0 -0.21rem#fff,19.8vw 46.5vh 0 -0.09rem#fff,57.7vw 20.7vh 0 -0.03rem#fff,69.8vw 33.8vh 0 -0.34rem#fff,69.1vw 71.5vh 0 -0.45rem#fff,70.5vw 87.9vh 0 -0.5rem#fff,77vw 34.9vh 0 -0.43rem#fff,35.6vw 28.7vh 0 -0.14rem#fff,28.6vw 22.7vh 0 -0.47rem#fff,46.3vw 7.1vh 0 -0.06rem#fff,66.6vw 92.6vh 0 -0.32rem#fff,96.5vw 19.1vh 0 -0.12rem#fff,24.6vw 45.5vh 0 -0.27rem#fff,71.6vw 85.8vh 0 -0.16rem#fff,1.1vw 44.9vh 0 -0.36rem#fff,94.4vw 84.2vh 0 -0.19rem#fff,92.2vw 20.2vh 0 -0.27rem#fff,42.5vw 66.1vh 0 -0.46rem#fff,70.8vw 98.4vh 0 -0.01rem#fff,71.7vw 99vh 0 -0.19rem#fff,0.2vw 34.1vh 0 -0.22rem#fff,87.3vw 30.7vh 0 -0.09rem#fff,80.3vw 93.8vh 0 -0.41rem#fff,72.2vw 8.3vh 0 -0.09rem#fff,27.1vw 46.1vh 0 -0.15rem#fff,10.2vw 93.6vh 0 -0.42rem#fff,76vw 51.5vh 0 -0.26rem#fff,28.7vw 76.3vh 0 -0.11rem#fff,85.1vw 21.2vh 0 -0.46rem#fff,25.9vw 82.2vh 0 -0.34rem#fff,32.3vw 69.8vh 0 -0.29rem#fff,97.3vw 56.8vh 0 -0.26rem#fff,48.2vw 29.6vh 0 -0.28rem#fff,76.2vw 61.9vh 0 -0.1rem#fff,62vw 96vh 0 -0.01rem#fff,76vw 79.9vh 0 -0.36rem#fff,59.9vw 86.8vh 0 -0.22rem#fff,72.8vw 92.3vh 0 -0.02rem#fff,62.7vw 55.9vh 0 -0.46rem#fff,81.1vw 53.3vh 0 -0.09rem#fff,42.4vw 20.2vh 0 -0.15rem#fff,72.7vw 95.8vh 0 -0.26rem#fff,67.6vw 11vh 0 -0.08rem#fff,62.5vw 99vh 0 -0.17rem#fff,52.7vw 46.1vh 0 -0.35rem#fff,49.7vw 73vh 0 -0.33rem#fff,1.9vw 25.1vh 0 -0.06rem#fff,25.6vw 11.6vh 0 -0.43rem#fff,9.7vw 28.4vh 0 -0.11rem#fff,52.1vw 87.4vh 0 -0.45rem#fff,94.6vw 3.6vh 0 -0.37rem#fff,67.5vw 67vh 0 -0.29rem#fff,45.4vw 34.9vh 0 -0.02rem#fff,41.6vw 99.6vh 0 -0.34rem#fff,26.3vw 53vh 0 -0.01rem#fff,41.2vw 73.7vh 0 -0.36rem#fff,6.9vw 29.5vh 0 -0.17rem#fff,25.1vw 39.2vh 0 -0.2rem#fff,93.2vw 58.2vh 0 -0.3rem#fff,93.2vw 58.2vh 0 -0.31rem#fff,91.7vw 29vh 0 -0.01rem#fff,90.1vw 25.4vh 0 -0.23rem#fff,12.2vw 98.7vh 0 -0.33rem#fff,88vw 73.3vh 0 -0.29rem#fff,91.5vw 61vh 0 -0.43rem#fff,96.1vw 70.8vh 0 -0.21rem#fff,98.2vw 55.4vh 0 -0.27rem#fff,15.2vw 59vh 0 -0.34rem#fff,66.3vw 83.5vh 0 -0.05rem#fff,49vw 8.5vh 0 -0.47rem#fff,93.3vw 91.7vh 0 -0.17rem#fff,15.4vw 35.4vh 0 -0.47rem#fff,14.3vw 48.5vh 0 -0.44rem#fff; box-shadow: 71.8vw 15.9vh 0 -0.3rem#fff,4.2vw 8.1vh 0 -0.41rem#fff,67.5vw 49.2vh 0 -0.28rem#fff,72vw 97.8vh 0 -0.22rem#fff,78.1vw 28vh 0 -0.41rem#fff,34.2vw 51.7vh 0 -0.47rem#fff,37.9vw 76.5vh 0 -0.39rem#fff,92.6vw 36.3vh 0 -0.22rem#fff,59.9vw 8.6vh 0 -0.07rem#fff,32.5vw 74vh 0 -0.07rem#fff,75.7vw 81.6vh 0 -0.12rem#fff,1.7vw 18.5vh 0 -0.2rem#fff,12.3vw 64.7vh 0 -0.37rem#fff,83.9vw 47vh 0 -0.12rem#fff,33.8vw 21.3vh 0 -0.14rem#fff,6.5vw 92.5vh 0 -0.29rem#fff,72.2vw 60.8vh 0 -0.17rem#fff,38.4vw 16vh 0 -0.17rem#fff,23.9vw 58.4vh 0 -0.32rem#fff,40.2vw 52.4vh 0 -0.23rem#fff,48.9vw 74.6vh 0 -0.03rem#fff,61.5vw 36.1vh 0 -0.49rem#fff,60.9vw 94.5vh 0 -0.42rem#fff,2.8vw 59.7vh 0 -0.27rem#fff,62.6vw 32.4vh 0 -0.45rem#fff,91.3vw 18vh 0 -0.09rem#fff,35.9vw 35.5vh 0 -0.11rem#fff,60.2vw 95.5vh 0 -0.21rem#fff,19.8vw 46.5vh 0 -0.09rem#fff,57.7vw 20.7vh 0 -0.03rem#fff,69.8vw 33.8vh 0 -0.34rem#fff,69.1vw 71.5vh 0 -0.45rem#fff,70.5vw 87.9vh 0 -0.5rem#fff,77vw 34.9vh 0 -0.43rem#fff,35.6vw 28.7vh 0 -0.14rem#fff,28.6vw 22.7vh 0 -0.47rem#fff,46.3vw 7.1vh 0 -0.06rem#fff,66.6vw 92.6vh 0 -0.32rem#fff,96.5vw 19.1vh 0 -0.12rem#fff,24.6vw 45.5vh 0 -0.27rem#fff,71.6vw 85.8vh 0 -0.16rem#fff,1.1vw 44.9vh 0 -0.36rem#fff,94.4vw 84.2vh 0 -0.19rem#fff,92.2vw 20.2vh 0 -0.27rem#fff,42.5vw 66.1vh 0 -0.46rem#fff,70.8vw 98.4vh 0 -0.01rem#fff,71.7vw 99vh 0 -0.19rem#fff,0.2vw 34.1vh 0 -0.22rem#fff,87.3vw 30.7vh 0 -0.09rem#fff,80.3vw 93.8vh 0 -0.41rem#fff,72.2vw 8.3vh 0 -0.09rem#fff,27.1vw 46.1vh 0 -0.15rem#fff,10.2vw 93.6vh 0 -0.42rem#fff,76vw 51.5vh 0 -0.26rem#fff,28.7vw 76.3vh 0 -0.11rem#fff,85.1vw 21.2vh 0 -0.46rem#fff,25.9vw 82.2vh 0 -0.34rem#fff,32.3vw 69.8vh 0 -0.29rem#fff,97.3vw 56.8vh 0 -0.26rem#fff,48.2vw 29.6vh 0 -0.28rem#fff,76.2vw 61.9vh 0 -0.1rem#fff,62vw 96vh 0 -0.01rem#fff,76vw 79.9vh 0 -0.36rem#fff,59.9vw 86.8vh 0 -0.22rem#fff,72.8vw 92.3vh 0 -0.02rem#fff,62.7vw 55.9vh 0 -0.46rem#fff,81.1vw 53.3vh 0 -0.09rem#fff,42.4vw 20.2vh 0 -0.15rem#fff,72.7vw 95.8vh 0 -0.26rem#fff,67.6vw 11vh 0 -0.08rem#fff,62.5vw 99vh 0 -0.17rem#fff,52.7vw 46.1vh 0 -0.35rem#fff,49.7vw 73vh 0 -0.33rem#fff,1.9vw 25.1vh 0 -0.06rem#fff,25.6vw 11.6vh 0 -0.43rem#fff,9.7vw 28.4vh 0 -0.11rem#fff,52.1vw 87.4vh 0 -0.45rem#fff,94.6vw 3.6vh 0 -0.37rem#fff,67.5vw 67vh 0 -0.29rem#fff,45.4vw 34.9vh 0 -0.02rem#fff,41.6vw 99.6vh 0 -0.34rem#fff,26.3vw 53vh 0 -0.01rem#fff,41.2vw 73.7vh 0 -0.36rem#fff,6.9vw 29.5vh 0 -0.17rem#fff,25.1vw 39.2vh 0 -0.2rem#fff,93.2vw 58.2vh 0 -0.3rem#fff,93.2vw 58.2vh 0 -0.31rem#fff,91.7vw 29vh 0 -0.01rem#fff,90.1vw 25.4vh 0 -0.23rem#fff,12.2vw 98.7vh 0 -0.33rem#fff,88vw 73.3vh 0 -0.29rem#fff,91.5vw 61vh 0 -0.43rem#fff,96.1vw 70.8vh 0 -0.21rem#fff,98.2vw 55.4vh 0 -0.27rem#fff,15.2vw 59vh 0 -0.34rem#fff,66.3vw 83.5vh 0 -0.05rem#fff,49vw 8.5vh 0 -0.47rem#fff,93.3vw 91.7vh 0 -0.17rem#fff,15.4vw 35.4vh 0 -0.47rem#fff,14.3vw 48.5vh 0 -0.44rem#fff;
animation-duration: 24s; } animation-duration: 24s; }
.layer2.a { .layer2.a {
animation-delay: -12s; } animation-delay: -12s; }
.layer3 { .layer3 {
width: 0.6rem; width: 0.6rem;
height: 0.6rem; height: 0.6rem;
filter: blur(6px); filter: blur(6px);
box-shadow: 23.4vw 84.5vh 0 -0.38rem#fff,47.1vw 27.7vh 0 -0.23rem#fff,57.9vw 71.8vh 0 -0.09rem#fff,99vw 88.7vh 0 -0.37rem#fff,69vw 41.3vh 0 -0.14rem#fff,44.7vw 79.1vh 0 -0.4rem#fff,53.2vw 22.3vh 0 -0.5rem#fff,37.8vw 79.6vh 0 -0.08rem#fff,46.1vw 40.6vh 0 -0.2rem#fff,9.8vw 50.6vh 0 -0.05rem#fff,45.6vw 13.3vh 0 -0.02rem#fff,23.3vw 18.3vh 0 -0.32rem#fff,38.4vw 20.4vh 0 -0.22rem#fff,37.5vw 34.1vh 0 -0.21rem#fff,31vw 96.9vh 0 -0.1rem#fff,6.8vw 99vh 0 -0.49rem#fff,19.7vw 13.4vh 0 -0.28rem#fff,24vw 16.4vh 0 -0.09rem#fff,98.6vw 17.6vh 0 -0.08rem#fff,5.2vw 26.8vh 0 -0.35rem#fff,60.5vw 57.7vh 0 -0.34rem#fff,63.4vw 34.1vh 0 -0.46rem#fff,62.2vw 9.9vh 0 -0.13rem#fff,31.8vw 40vh 0 -0.19rem#fff,28vw 68.9vh 0 -0.33rem#fff,74.5vw 21.3vh 0 -0.32rem#fff,30.8vw 29.5vh 0 -0.25rem#fff,80.3vw 28vh 0 -0.12rem#fff,88.7vw 47.8vh 0 -0.33rem#fff,7.9vw 70.8vh 0 -0.46rem#fff,26.6vw 49.2vh 0 -0.04rem#fff,98.4vw 42.8vh 0 -0.09rem#fff,62.5vw 64.5vh 0 -0.48rem#fff,60.7vw 92.5vh 0 -0.13rem#fff,2.8vw 99.2vh 0 -0.49rem#fff,81.4vw 21.3vh 0 -0.4rem#fff,83.4vw 47.1vh 0 -0.46rem#fff,79.2vw 2.6vh 0 -0.17rem#fff,17.7vw 3.1vh 0 -0.12rem#fff,66.4vw 98.4vh 0 -0.34rem#fff,59.5vw 51.1vh 0 -0.2rem#fff,5.8vw 28.2vh 0 -0.41rem#fff,9.7vw 54vh 0 -0.48rem#fff,24.1vw 98.3vh 0 -0.29rem#fff,9.7vw 73.1vh 0 -0.44rem#fff,10vw 53.7vh 0 -0.5rem#fff,37.7vw 16.1vh 0 -0.31rem#fff,43.9vw 51.8vh 0 -0.29rem#fff,70.8vw 54vh 0 -0.19rem#fff,61.5vw 91vh 0 -0.41rem#fff,87.1vw 13.1vh 0 -0.22rem#fff,89.6vw 34.1vh 0 -0.25rem#fff,52.8vw 38.1vh 0 -0.33rem#fff,88.4vw 79.4vh 0 -0.22rem#fff,84.4vw 84.6vh 0 -0.1rem#fff,69.4vw 8.7vh 0 -0.46rem#fff,8.8vw 73.7vh 0 -0.19rem#fff,89.3vw 14.7vh 0 -0.1rem#fff,100vw 72.7vh 0 -0.2rem#fff,16.9vw 93.8vh 0 -0.22rem#fff,90.7vw 36.1vh 0 -0.43rem#fff,46.6vw 49.6vh 0 -0.21rem#fff,57.3vw 72.3vh 0 -0.03rem#fff,49.7vw 2vh 0 -0.15rem#fff,67vw 96.2vh 0 -0.47rem#fff,86vw 71.7vh 0 -0.11rem#fff,66vw 65.8vh 0 -0.32rem#fff,85.2vw 7.6vh 0 -0.12rem#fff,95.9vw 49.4vh 0 -0.15rem#fff,33.2vw 66.6vh 0 -0.14rem#fff,75.4vw 26.3vh 0 -0.02rem#fff,52.7vw 56vh 0 -0.11rem#fff,37.7vw 77vh 0 -0.18rem#fff,26.3vw 59.9vh 0 -0.18rem#fff,88.2vw 74.6vh 0 -0.39rem#fff,89.5vw 61.2vh 0 -0.48rem#fff,62vw 79.5vh 0 -0.4rem#fff,98.7vw 3.9vh 0 -0.01rem#fff,63.3vw 32vh 0 -0.43rem#fff,49.6vw 28.5vh 0 -0.09rem#fff,70vw 87vh 0 -0.05rem#fff,38.3vw 67.3vh 0 -0.49rem#fff,41.8vw 82.5vh 0 -0.36rem#fff,85.8vw 74vh 0 -0.07rem#fff,82.3vw 48.8vh 0 -0.11rem#fff,35.2vw 79.8vh 0 -0.4rem#fff,73.3vw 72.4vh 0 -0.36rem#fff,62.4vw 30.5vh 0 -0.14rem#fff,48.5vw 51.9vh 0 -0.03rem#fff,74.6vw 51.1vh 0 -0.35rem#fff,62.6vw 12.8vh 0 -0.33rem#fff,10vw 72.1vh 0 -0.2rem#fff,59vw 50.5vh 0 -0.04rem#fff,79.1vw 60.1vh 0 -0.34rem#fff,77.5vw 45.1vh 0 -0.23rem#fff,53vw 77.3vh 0 -0.4rem#fff,46.8vw 52.1vh 0 -0.44rem#fff,60.7vw 81vh 0 -0.17rem#fff,86.2vw 53.9vh 0 -0.01rem#fff,85.8vw 79.2vh 0 -0.39rem#fff; box-shadow: 23.4vw 84.5vh 0 -0.38rem#fff,47.1vw 27.7vh 0 -0.23rem#fff,57.9vw 71.8vh 0 -0.09rem#fff,99vw 88.7vh 0 -0.37rem#fff,69vw 41.3vh 0 -0.14rem#fff,44.7vw 79.1vh 0 -0.4rem#fff,53.2vw 22.3vh 0 -0.5rem#fff,37.8vw 79.6vh 0 -0.08rem#fff,46.1vw 40.6vh 0 -0.2rem#fff,9.8vw 50.6vh 0 -0.05rem#fff,45.6vw 13.3vh 0 -0.02rem#fff,23.3vw 18.3vh 0 -0.32rem#fff,38.4vw 20.4vh 0 -0.22rem#fff,37.5vw 34.1vh 0 -0.21rem#fff,31vw 96.9vh 0 -0.1rem#fff,6.8vw 99vh 0 -0.49rem#fff,19.7vw 13.4vh 0 -0.28rem#fff,24vw 16.4vh 0 -0.09rem#fff,98.6vw 17.6vh 0 -0.08rem#fff,5.2vw 26.8vh 0 -0.35rem#fff,60.5vw 57.7vh 0 -0.34rem#fff,63.4vw 34.1vh 0 -0.46rem#fff,62.2vw 9.9vh 0 -0.13rem#fff,31.8vw 40vh 0 -0.19rem#fff,28vw 68.9vh 0 -0.33rem#fff,74.5vw 21.3vh 0 -0.32rem#fff,30.8vw 29.5vh 0 -0.25rem#fff,80.3vw 28vh 0 -0.12rem#fff,88.7vw 47.8vh 0 -0.33rem#fff,7.9vw 70.8vh 0 -0.46rem#fff,26.6vw 49.2vh 0 -0.04rem#fff,98.4vw 42.8vh 0 -0.09rem#fff,62.5vw 64.5vh 0 -0.48rem#fff,60.7vw 92.5vh 0 -0.13rem#fff,2.8vw 99.2vh 0 -0.49rem#fff,81.4vw 21.3vh 0 -0.4rem#fff,83.4vw 47.1vh 0 -0.46rem#fff,79.2vw 2.6vh 0 -0.17rem#fff,17.7vw 3.1vh 0 -0.12rem#fff,66.4vw 98.4vh 0 -0.34rem#fff,59.5vw 51.1vh 0 -0.2rem#fff,5.8vw 28.2vh 0 -0.41rem#fff,9.7vw 54vh 0 -0.48rem#fff,24.1vw 98.3vh 0 -0.29rem#fff,9.7vw 73.1vh 0 -0.44rem#fff,10vw 53.7vh 0 -0.5rem#fff,37.7vw 16.1vh 0 -0.31rem#fff,43.9vw 51.8vh 0 -0.29rem#fff,70.8vw 54vh 0 -0.19rem#fff,61.5vw 91vh 0 -0.41rem#fff,87.1vw 13.1vh 0 -0.22rem#fff,89.6vw 34.1vh 0 -0.25rem#fff,52.8vw 38.1vh 0 -0.33rem#fff,88.4vw 79.4vh 0 -0.22rem#fff,84.4vw 84.6vh 0 -0.1rem#fff,69.4vw 8.7vh 0 -0.46rem#fff,8.8vw 73.7vh 0 -0.19rem#fff,89.3vw 14.7vh 0 -0.1rem#fff,100vw 72.7vh 0 -0.2rem#fff,16.9vw 93.8vh 0 -0.22rem#fff,90.7vw 36.1vh 0 -0.43rem#fff,46.6vw 49.6vh 0 -0.21rem#fff,57.3vw 72.3vh 0 -0.03rem#fff,49.7vw 2vh 0 -0.15rem#fff,67vw 96.2vh 0 -0.47rem#fff,86vw 71.7vh 0 -0.11rem#fff,66vw 65.8vh 0 -0.32rem#fff,85.2vw 7.6vh 0 -0.12rem#fff,95.9vw 49.4vh 0 -0.15rem#fff,33.2vw 66.6vh 0 -0.14rem#fff,75.4vw 26.3vh 0 -0.02rem#fff,52.7vw 56vh 0 -0.11rem#fff,37.7vw 77vh 0 -0.18rem#fff,26.3vw 59.9vh 0 -0.18rem#fff,88.2vw 74.6vh 0 -0.39rem#fff,89.5vw 61.2vh 0 -0.48rem#fff,62vw 79.5vh 0 -0.4rem#fff,98.7vw 3.9vh 0 -0.01rem#fff,63.3vw 32vh 0 -0.43rem#fff,49.6vw 28.5vh 0 -0.09rem#fff,70vw 87vh 0 -0.05rem#fff,38.3vw 67.3vh 0 -0.49rem#fff,41.8vw 82.5vh 0 -0.36rem#fff,85.8vw 74vh 0 -0.07rem#fff,82.3vw 48.8vh 0 -0.11rem#fff,35.2vw 79.8vh 0 -0.4rem#fff,73.3vw 72.4vh 0 -0.36rem#fff,62.4vw 30.5vh 0 -0.14rem#fff,48.5vw 51.9vh 0 -0.03rem#fff,74.6vw 51.1vh 0 -0.35rem#fff,62.6vw 12.8vh 0 -0.33rem#fff,10vw 72.1vh 0 -0.2rem#fff,59vw 50.5vh 0 -0.04rem#fff,79.1vw 60.1vh 0 -0.34rem#fff,77.5vw 45.1vh 0 -0.23rem#fff,53vw 77.3vh 0 -0.4rem#fff,46.8vw 52.1vh 0 -0.44rem#fff,60.7vw 81vh 0 -0.17rem#fff,86.2vw 53.9vh 0 -0.01rem#fff,85.8vw 79.2vh 0 -0.39rem#fff;
animation-duration: 30s; } animation-duration: 30s; }
.layer3.a { .layer3.a {
animation-delay: -15s; } animation-delay: -15s; }
@keyframes fall { @keyframes fall {
100% { 100% {
transform: translateY(200vh); } } transform: translateY(200vh); } }
@keyframes gradientBG { @keyframes gradientBG {
0% { 0% {
transform: translate(-10%, -10%); } transform: translate(-10%, -10%); }
50% { 50% {
transform: translate(-60%, -60%); } transform: translate(-60%, -60%); }
100% { 100% {
transform: translate(-10%, -10%); } } transform: translate(-10%, -10%); } }
@keyframes sled { @keyframes sled {
0% { 0% {
transform: translate(-50rem, 40vh) rotate(0deg); } transform: translate(-50rem, 40vh) rotate(0deg); }
4% { 4% {
transform: translate(-50rem, 40vh) rotate(0deg); } transform: translate(-50rem, 40vh) rotate(0deg); }
20% { 20% {
transform: translate(50vw, 10vh) rotate(20deg); } transform: translate(50vw, 10vh) rotate(20deg); }
36% { 36% {
transform: translate(150vw, 40vh) rotate(40deg); } transform: translate(150vw, 40vh) rotate(40deg); }
100% { 100% {
transform: translate(150vw, 40vh) rotate(40deg); } } transform: translate(150vw, 40vh) rotate(40deg); } }
@keyframes train { @keyframes train {
0% { 0% {
transform: translateX(-80rem); } transform: translateX(-80rem); }
55% { 55% {
transform: translateX(-80rem); } transform: translateX(-80rem); }
85% { 85% {
transform: translateX(100vw); } transform: translateX(100vw); }
100% { 100% {
transform: translateX(100vw); } } transform: translateX(100vw); } }
@keyframes follow_train { @keyframes follow_train {
0% { 0% {
transform: translateX(-80rem) scaleX(20) scaleY(8); } transform: translateX(-80rem) scaleX(20) scaleY(8); }
55% { 55% {
transform: translateX(-80rem) scaleX(20) scaleY(8); } transform: translateX(-80rem) scaleX(20) scaleY(8); }
85% { 85% {
transform: translateX(100vw) scaleX(20) scaleY(8); } transform: translateX(100vw) scaleX(20) scaleY(8); }
100% { 100% {
transform: translateX(100vw) scaleX(20) scaleY(8); } } transform: translateX(100vw) scaleX(20) scaleY(8); } }
@keyframes turn { @keyframes turn {
100% { 100% {
transform: rotate(360deg); } } transform: rotate(360deg); } }
@keyframes whobble { @keyframes whobble {
100% { 100% {
transform: translateY(0.5vh); } } transform: translateY(0.5vh); } }
@keyframes snowman { @keyframes snowman {
0% { 0% {
transform: rotate(0); } transform: rotate(0); }
20% { 20% {
transform: rotate(0); } transform: rotate(0); }
30% { 30% {
transform: rotate(80deg); } transform: rotate(80deg); }
54% { 54% {
transform: rotate(80deg); } transform: rotate(80deg); }
68% { 68% {
transform: rotate(0); } transform: rotate(0); }
100% { 100% {
transform: rotate(0); } } transform: rotate(0); } }
@keyframes snowman_head { @keyframes snowman_head {
0% { 0% {
transform: rotate(-3deg); } transform: rotate(-3deg); }
50% { 50% {
transform: rotate(3deg); } transform: rotate(3deg); }
100% { 100% {
transform: rotate(-3deg); } } transform: rotate(-3deg); } }
@keyframes merry_christmas { @keyframes merry_christmas {
0% { 0% {
opacity: 0.8; } opacity: 0.8; }
50% { 50% {
opacity: 0.6; } opacity: 0.6; }
100% { 100% {
opacity: 0.8; } } opacity: 0.8; } }
/*# sourceMappingURL=kerstmis.css.map */ /*# sourceMappingURL=kerstmis.css.map */

View file

@ -20,71 +20,71 @@ Enige discretie is aangeraden.
--dGray4:#274001; --dGray4:#274001;
--dGray5:#274001; --dGray5:#274001;
--dGray6:#F2778D; --dGray6:#F2778D;
--dBlue:#F2778D; --dBlue:#F2778D;
} }
body{ body{
height: 100%; height: 100%;
font-family: Radikal,Optima,Segoe,Segoe UI,Candara,Calibri,Arial,sans-serif; font-family: Radikal,Optima,Segoe,Segoe UI,Candara,Calibri,Arial,sans-serif;
background-color: #2F0000; background-color: #2F0000;
} }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url('static/fonts/radikal_regular.ttf'); src: url('static/fonts/radikal_regular.ttf');
font-weight: normal; font-weight: normal;
} }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url('static/fonts/radikal_light.ttf'); src: url('static/fonts/radikal_light.ttf');
font-weight: 200; font-weight: 200;
} }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url('static/fonts/radikal_medium.ttf'); src: url('static/fonts/radikal_medium.ttf');
font-weight: medium; font-weight: medium;
} }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url('static/fonts/radikal_bold.ttf'); src: url('static/fonts/radikal_bold.ttf');
font-weight: bold; font-weight: bold;
} }
.btn{ .btn{
border-radius: 5rem; border-radius: 5rem;
color: white; color: white;
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
background-image: linear-gradient(-40deg,#F53030, #F58B9E); background-image: linear-gradient(-40deg,#F53030, #F58B9E);
} }
.btn:hover{ .btn:hover{
background-image: linear-gradient(-40deg, #A81111, #FF4B33); background-image: linear-gradient(-40deg, #A81111, #FF4B33);
} }
.navbar { .navbar {
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
padding: 1.5rem; padding: 1.5rem;
background-color: transparent; background-color: transparent;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
text-transform: capitalize; text-transform: capitalize;
} }
.nav>li>a { .nav>li>a {
padding-left: 1vw; padding-left: 1vw;
padding-right: 1vw; padding-right: 1vw;
} }
.main{ .main{
height: 90vh; height: 90vh;
overflow: scroll; overflow: scroll;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
flex-direction: column; flex-direction: column;
} }
.navbar .container{ .navbar .container{
width: 100%; width: 100%;
padding: 0 4vw; padding: 0 4vw;
} }
@media (min-width: 768px){ @media (min-width: 768px){
.container { .container {
@ -99,143 +99,143 @@ Enige discretie is aangeraden.
@media (min-width: 1200px){ @media (min-width: 1200px){
.main .container, .main .orders { .main .container, .main .orders {
width: 1170px; width: 1170px;
} }
} }
.main{ .main{
padding-top: 2.5rem; padding-top: 2.5rem;
} }
.order_data { .order_data {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
padding: 0 3rem; padding: 0 3rem;
align-items: baseline; align-items: baseline;
} }
.order_row { .order_row {
background: transparent; background: transparent;
} }
.order_data h5{ .order_data h5{
max-width: 60%; max-width: 60%;
padding-bottom: 3rem; padding-bottom: 3rem;
} }
.expand_button{ .expand_button{
padding: 1rem 0rem; padding: 1rem 0rem;
margin-top: -1rem; margin-top: -1rem;
width: 70%; width: 70%;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
} }
.hi_im_haldis h2{ .hi_im_haldis h2{
display: none; display: none;
} }
.hi_im_haldis h3 { .hi_im_haldis h3 {
width: 100%; width: 100%;
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
text-align: center; text-align: center;
} }
.hi_im_haldis { .hi_im_haldis {
background: linear-gradient(70deg,rgba(203, 52, 68,0.8), rgba(135, 32, 44,0.8)); background: linear-gradient(70deg,rgba(203, 52, 68,0.8), rgba(135, 32, 44,0.8));
border-radius: 0; border-radius: 0;
width: 100%; width: 100%;
} }
.hi_im_haldis_wrapper { .hi_im_haldis_wrapper {
width: 100%; width: 100%;
} }
.darker:nth-child(even){ .darker:nth-child(even){
background-color: #B62937; background-color: #B62937;
border-radius: 2rem; border-radius: 2rem;
} }
.darker:nth-child(odd){ .darker:nth-child(odd){
background-color: #821C25; background-color: #821C25;
border-radius: 2rem; border-radius: 2rem;
} }
.darker{ .darker{
padding: 1rem; padding: 1rem;
} }
.order_row:nth-child(even) .order_data { .order_row:nth-child(even) .order_data {
background-color: #B62937; background-color: #B62937;
border-radius: 2rem; border-radius: 2rem;
} }
.order_row:nth-child(odd) .order_data { .order_row:nth-child(odd) .order_data {
background-color: #821C25; background-color: #821C25;
border-radius: 2rem; border-radius: 2rem;
} }
.order_row h5{ .order_row h5{
font-weight: bold; font-weight: bold;
} }
.order_row{ .order_row{
margin-bottom: 3rem; margin-bottom: 3rem;
} }
h3{ h3{
padding-bottom: 1rem; padding-bottom: 1rem;
} }
.home_sir { .home_sir {
font-weight: bold; font-weight: bold;
color: #F45D68; color: #F45D68;
} }
.expand_button_wrapper{ .expand_button_wrapper{
margin-top: -1rem; margin-top: -1rem;
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
.time_data { .time_data {
text-align: right; text-align: right;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-self: right; 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{ .navbar .navbar-nav .active a{
padding-left: 2rem; color: rgb(255, 155, 174);
} border-bottom: 1px solid rgb(255, 155, 174);
padding-bottom: 1rem;
}
.jumbotron, .darker { .navbar-nav{
padding-left: 2rem;
}
.jumbotron, .darker {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
border-radius: 4rem; border-radius: 4rem;
} }
.row>div>h5 { .row>div>h5 {
font-weight: bold; font-weight: bold;
padding-top: 1.5rem; padding-top: 1.5rem;
font-size: 2.5rem; font-size: 2.5rem;
} }
.row>div>.amount_of_orders{ .row>div>.amount_of_orders{
font-weight: lighter; font-weight: lighter;
font-size: 1.6rem; font-size: 1.6rem;
} }
.row>div .time{ .row>div .time{
font-weight: lighter; font-weight: lighter;
} }
.jumbotron { .jumbotron {
background-color: transparent; background-color: transparent;
} }
.navbar-default .navbar-nav .active a, .navbar-default .navbar-nav .active a:hover{ .navbar-default .navbar-nav .active a, .navbar-default .navbar-nav .active a:hover{
background-color: transparent; background-color: transparent;
} }
.background { .background {
-webkit-filter: blur(0px) brightness(80%); -webkit-filter: blur(0px) brightness(80%);
-moz-filter: blur(0px) brightness(80%); -moz-filter: blur(0px) brightness(80%);
-o-filter: blur(0px) brightness(80%); -o-filter: blur(0px) brightness(80%);
@ -493,53 +493,53 @@ $s1:"";
$s2:""; $s2:"";
$s3:""; $s3:"";
@for $i from 1 through 100 { @for $i from 1 through 100 {
$s1: $s1 + random(1000)*0.1vw + " " + random(1000)*0.1vh + " " + 0 + " " + random(50)*-0.01rem + #fff; $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; $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; $s3: $s3 + random(1000)*0.1vw + " " + random(1000)*0.1vh + " " + 0 + " " + random(50)*-0.01rem + #fff;
@if $i < 100 { @if $i < 100 {
$s1: $s1 + ","; $s1: $s1 + ",";
$s2: $s2 + ","; $s2: $s2 + ",";
$s3: $s3 + ","; $s3: $s3 + ",";
} }
} }
.snow { .snow {
border-radius: 50%; border-radius: 50%;
opacity: 0.8; opacity: 0.8;
position: absolute; position: absolute;
top:-100vh; top:-100vh;
animation-name: fall; animation-name: fall;
animation-timing-function: linear; animation-timing-function: linear;
animation-iteration-count: infinite; animation-iteration-count: infinite;
} }
.layer1 { .layer1 {
width: 1rem; width: 1rem;
height: 1rem; height: 1rem;
filter:blur(1.5px); filter:blur(1.5px);
box-shadow: #{$s1}; box-shadow: #{$s1};
animation-duration: 18s; animation-duration: 18s;
} }
.layer1.a { .layer1.a {
animation-delay: -9s; animation-delay: -9s;
} }
.layer2 { .layer2 {
width: 0.8rem; width: 0.8rem;
height: 0.8rem; height: 0.8rem;
filter:blur(3px); filter:blur(3px);
box-shadow: #{$s2}; box-shadow: #{$s2};
animation-duration: 24s; animation-duration: 24s;
} }
.layer2.a { .layer2.a {
animation-delay: -12s; animation-delay: -12s;
} }
.layer3 { .layer3 {
width: 0.6rem; width: 0.6rem;
height: 0.6rem; height: 0.6rem;
filter:blur(6px); filter:blur(6px);
box-shadow: #{$s3}; box-shadow: #{$s3};
animation-duration: 30s; animation-duration: 30s;
} }
.layer3.a { .layer3.a {
animation-delay: -15s; animation-delay: -15s;
} }
@keyframes fall { @keyframes fall {
100% {transform: translateY(200vh); } 100% {transform: translateY(200vh); }

View file

@ -1,12 +1,12 @@
/*lightmode*/ /*lightmode*/
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#444444; --dGray0:#444444;
--dGray1:#666666; --dGray1:#666666;
--dGray2:#212121; --dGray2:#212121;
--dGray3:#ffffff; --dGray3:#ffffff;
--dGray4:#f9f9f9; --dGray4:#f9f9f9;
--dGray5:#ffffff; --dGray5:#ffffff;
--dGray6:#ffffff; --dGray6:#ffffff;
--dBlue:#0A84FF; --dBlue:#0A84FF;
} }

View file

@ -1,16 +1,16 @@
/*sinterklaas*/ /*sinterklaas*/
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#F2EB80; --dGray0:#F2EB80;
--dGray1:#F2EF05; --dGray1:#F2EF05;
--dGray2:#F2EF05; --dGray2:#F2EF05;
--dGray3:#177EBF; --dGray3:#177EBF;
--dGray4:#0C6AA6; --dGray4:#0C6AA6;
--dGray5:#F20505; --dGray5:#F20505;
--dGray6:#F50B00; --dGray6:#F50B00;
--dBlue:#35F546; --dBlue:#35F546;
} }
.background{ .background{
background-image: url("static/images/themes/sinterklaas/Sinterklaas.jpg"); background-image: url("static/images/themes/sinterklaas/Sinterklaas.jpg");
} }

View file

@ -1,12 +1,12 @@
/*Darkmode*/ /*Darkmode*/
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#D0D0D8; --dGray0:#D0D0D8;
--dGray1:#8E8E93; --dGray1:#8E8E93;
--dGray2:#636366; --dGray2:#636366;
--dGray3:#48484A; --dGray3:#48484A;
--dGray4:#3A3A3C; --dGray4:#3A3A3C;
--dGray5:#2C2C2E; --dGray5:#2C2C2E;
--dGray6:#1C1C1E; --dGray6:#1C1C1E;
--dBlue:#0A84FF; --dBlue:#0A84FF;
} }

View file

@ -1,4 +1,4 @@
.background { .background {
background-image: url("https://kelder.zeus.ugent.be/webcam/video/mjpg.cgi?profileid=2"); background-image: url("https://kelder.zeus.ugent.be/webcam/video/mjpg.cgi?profileid=2");
background-size: contain; background-size: contain;
} }

View file

@ -1,16 +1,16 @@
/*halloween*/ /*halloween*/
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#FFEB65; --dGray0:#FFEB65;
--dGray1:#F28705; --dGray1:#F28705;
--dGray2:#F25C05; --dGray2:#F25C05;
--dGray3:#F27405; --dGray3:#F27405;
--dGray4:#8C3D0F; --dGray4:#8C3D0F;
--dGray5:#260101; --dGray5:#260101;
--dGray6:#260101; --dGray6:#260101;
--dBlue:#D91604; --dBlue:#D91604;
} }
.table-hover tbody tr:hover{ .table-hover tbody tr:hover{
background-image: url("static/images/themes/halloween/Halloween.jpeg"); background-image: url("static/images/themes/halloween/Halloween.jpeg");
} }

View file

@ -11,432 +11,432 @@ Enige discretie is aangeraden.
*/ */
/*low performance kerstmis*/ /*low performance kerstmis*/
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#F28705; --dGray0:#F28705;
--dGray1:white; --dGray1:white;
--dGray2:#590212; --dGray2:#590212;
--dGray3:#590212; --dGray3:#590212;
--dGray4:#274001; --dGray4:#274001;
--dGray5:#274001; --dGray5:#274001;
--dGray6:#F2778D; --dGray6:#F2778D;
--dBlue:#F2778D; } --dBlue:#F2778D; }
body { body {
height: 100%; height: 100%;
font-family: Radikal,Optima,Segoe,Segoe UI,Candara,Calibri,Arial,sans-serif; font-family: Radikal,Optima,Segoe,Segoe UI,Candara,Calibri,Arial,sans-serif;
background-color: #2F0000; } background-color: #2F0000; }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url("static/fonts/radikal_regular.ttf"); src: url("static/fonts/radikal_regular.ttf");
font-weight: normal; } font-weight: normal; }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url("static/fonts/radikal_light.ttf"); src: url("static/fonts/radikal_light.ttf");
font-weight: 200; } font-weight: 200; }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url("static/fonts/radikal_bold.ttf"); src: url("static/fonts/radikal_bold.ttf");
font-weight: bold; } font-weight: bold; }
.btn { .btn {
border-radius: 5rem; border-radius: 5rem;
color: white; color: white;
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
background-image: linear-gradient(-40deg, #F53030, #F58B9E); } background-image: linear-gradient(-40deg, #F53030, #F58B9E); }
.btn:hover { .btn:hover {
background-image: linear-gradient(-40deg, #A81111, #FF4B33); } background-image: linear-gradient(-40deg, #A81111, #FF4B33); }
.navbar { .navbar {
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
padding: 1.5rem; padding: 1.5rem;
background-color: transparent; background-color: transparent;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
text-transform: capitalize; } text-transform: capitalize; }
.nav > li > a { .nav > li > a {
padding-left: 1vw; padding-left: 1vw;
padding-right: 1vw; } padding-right: 1vw; }
.main { .main {
height: 90vh; height: 90vh;
overflow: scroll; overflow: scroll;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
flex-direction: column; } flex-direction: column; }
.navbar .container { .navbar .container {
width: 100%; width: 100%;
padding: 0 4vw; } padding: 0 4vw; }
@media (min-width: 768px) { @media (min-width: 768px) {
.container { .container {
width: 100%; } } width: 100%; } }
@media (min-width: 992px) { @media (min-width: 992px) {
.main .container, .main .orders { .main .container, .main .orders {
width: 970px; } } width: 970px; } }
@media (min-width: 1200px) { @media (min-width: 1200px) {
.main .container, .main .orders { .main .container, .main .orders {
width: 1170px; } } width: 1170px; } }
.main { .main {
padding-top: 2.5rem; } padding-top: 2.5rem; }
.order_data { .order_data {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
padding: 0 3rem; padding: 0 3rem;
align-items: baseline; } align-items: baseline; }
.order_data h5 { .order_data h5 {
max-width: 60%; max-width: 60%;
padding-bottom: 3rem; } padding-bottom: 3rem; }
.expand_button { .expand_button {
padding: 1rem 0rem; padding: 1rem 0rem;
margin-top: -1rem; margin-top: -1rem;
width: 70%; width: 70%;
margin-bottom: 1.5rem; } margin-bottom: 1.5rem; }
.hi_im_haldis h2 { .hi_im_haldis h2 {
display: none; } display: none; }
.hi_im_haldis h3 { .hi_im_haldis h3 {
width: 100%; width: 100%;
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
text-align: center; } text-align: center; }
.hi_im_haldis { .hi_im_haldis {
background: linear-gradient(70deg, rgba(203, 52, 68, 0.8), rgba(135, 32, 44, 0.8)); background: linear-gradient(70deg, rgba(203, 52, 68, 0.8), rgba(135, 32, 44, 0.8));
border-radius: 0; border-radius: 0;
width: 100%; } width: 100%; }
.hi_im_haldis_wrapper { .hi_im_haldis_wrapper {
width: 100%; } width: 100%; }
.darker:nth-child(even) { .darker:nth-child(even) {
background-color: #B62937; background-color: #B62937;
border-radius: 2rem; } border-radius: 2rem; }
.darker:nth-child(odd) { .darker:nth-child(odd) {
background-color: #821C25; background-color: #821C25;
border-radius: 2rem; } border-radius: 2rem; }
.darker { .darker {
padding: 1rem; } padding: 1rem; }
.order_row:nth-child(even) .order_data { .order_row:nth-child(even) .order_data {
background-color: #B62937; background-color: #B62937;
border-radius: 2rem; } border-radius: 2rem; }
.order_row { .order_row {
background: transparent; } background: transparent; }
.order_row:nth-child(odd) .order_data { .order_row:nth-child(odd) .order_data {
background-color: #821C25; background-color: #821C25;
border-radius: 2rem; } border-radius: 2rem; }
.order_row h5 { .order_row h5 {
font-weight: bold; } font-weight: bold; }
.order_row { .order_row {
margin-bottom: 3rem; } margin-bottom: 3rem; }
h3 { h3 {
padding-bottom: 1rem; } padding-bottom: 1rem; }
.home_sir { .home_sir {
font-weight: bold; font-weight: bold;
color: #F45D68; } color: #F45D68; }
.expand_button_wrapper { .expand_button_wrapper {
margin-top: -1rem; margin-top: -1rem;
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; } justify-content: center; }
.time_data { .time_data {
text-align: right; text-align: right;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-self: right; } justify-self: right; }
.navbar .navbar-nav .active a { .navbar .navbar-nav .active a {
color: #ff9bae; color: #ff9bae;
border-bottom: 1px solid #ff9bae; border-bottom: 1px solid #ff9bae;
padding-bottom: 1rem; } padding-bottom: 1rem; }
.navbar-nav { .navbar-nav {
padding-left: 2rem; } padding-left: 2rem; }
.jumbotron, .darker { .jumbotron, .darker {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
border-radius: 4rem; } border-radius: 4rem; }
.row > div > h5 { .row > div > h5 {
font-weight: bold; font-weight: bold;
padding-top: 1.5rem; padding-top: 1.5rem;
font-size: 2.5rem; } font-size: 2.5rem; }
.row > div > .amount_of_orders { .row > div > .amount_of_orders {
font-weight: lighter; font-weight: lighter;
font-size: 1.6rem; } font-size: 1.6rem; }
.row > div .time { .row > div .time {
font-weight: lighter; } font-weight: lighter; }
.jumbotron { .jumbotron {
background-color: transparent; } background-color: transparent; }
.navbar-default .navbar-nav .active a, .navbar-default .navbar-nav .active a:hover { .navbar-default .navbar-nav .active a, .navbar-default .navbar-nav .active a:hover {
background-color: transparent; } background-color: transparent; }
.background { .background {
-webkit-filter: blur(0px) brightness(80%); -webkit-filter: blur(0px) brightness(80%);
-moz-filter: blur(0px) brightness(80%); -moz-filter: blur(0px) brightness(80%);
-o-filter: blur(0px) brightness(80%); -o-filter: blur(0px) brightness(80%);
-ms-filter: blur(0px) brightness(80%); -ms-filter: blur(0px) brightness(80%);
filter: blur(0px) brightness(80%); filter: blur(0px) brightness(80%);
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; } left: 0; }
footer a { footer a {
color: #69E8FF; } color: #69E8FF; }
footer { footer {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
width: 100%; width: 100%;
background: #CB3444; background: #CB3444;
height: 5rem; height: 5rem;
display: flex; display: flex;
align-items: center; } align-items: center; }
footer > hr { footer > hr {
display: none; } display: none; }
#mapid { #mapid {
width: 100%; } width: 100%; }
.order_overview, .order_order, .order_items, .order_ordered, .order_depts { .order_overview, .order_order, .order_items, .order_ordered, .order_depts {
padding: 1rem 5rem 3rem 5rem; } padding: 1rem 5rem 3rem 5rem; }
.order_overview { .order_overview {
width: 100%; } width: 100%; }
.order_depts { .order_depts {
width: 100%; width: 100%;
margin-bottom: 10rem; } margin-bottom: 10rem; }
.location_data, .location_products { .location_data, .location_products {
width: 100%; } width: 100%; }
.location_products { .location_products {
margin-bottom: 10rem; } margin-bottom: 10rem; }
.locations_locations { .locations_locations {
padding: 1rem 5rem 3rem 5rem; } padding: 1rem 5rem 3rem 5rem; }
.background_wrapper { .background_wrapper {
position: absolute; position: absolute;
left: 0; left: 0;
bottom: 5rem; bottom: 5rem;
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow: hidden; } overflow: hidden; }
.christmas_background { .christmas_background {
z-index: -101; z-index: -101;
width: 300%; width: 300%;
height: 300%; height: 300%;
background: linear-gradient(-45deg, #2F0000, #C20A12); } background: linear-gradient(-45deg, #2F0000, #C20A12); }
.sled { .sled {
width: 15rem; width: 15rem;
height: 15rem; height: 15rem;
transition: transform 2s ease-in 5s, rotate 1s ease-in-out 2s; transition: transform 2s ease-in 5s, rotate 1s ease-in-out 2s;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
background-size: contain; background-size: contain;
background-image: url("static/images/themes/kerstmis/sled.svg"); } background-image: url("static/images/themes/kerstmis/sled.svg"); }
.sled_wrapper { .sled_wrapper {
top: 0.5rem; top: 0.5rem;
left: -7.5rem; left: -7.5rem;
position: absolute; position: absolute;
transform: translate(-50vw, 40vh) rotate(0deg); transform: translate(-50vw, 40vh) rotate(0deg);
width: 15rem; width: 15rem;
height: 15rem; height: 15rem;
animation: sled 29s ease-in-out infinite; } animation: sled 29s ease-in-out infinite; }
.snowman_wrapper { .snowman_wrapper {
height: 17rem; height: 17rem;
width: 10rem; width: 10rem;
position: absolute; position: absolute;
bottom: 15rem; bottom: 15rem;
left: -12rem; left: -12rem;
animation: snowman 37s ease infinite; animation: snowman 37s ease infinite;
transform-origin: right bottom; } transform-origin: right bottom; }
.snowman_head { .snowman_head {
position: absolute; position: absolute;
top: 0; top: 0;
width: 10rem; width: 10rem;
height: 10rem; height: 10rem;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
background-image: url("static/images/themes/kerstmis/snowman_head.svg"); background-image: url("static/images/themes/kerstmis/snowman_head.svg");
animation: snowman_head 2s ease infinite; } animation: snowman_head 2s ease infinite; }
.snowman_body { .snowman_body {
position: absolute; position: absolute;
top: 9.5rem; top: 9.5rem;
left: 0.5rem; left: 0.5rem;
width: 10rem; width: 10rem;
height: 10rem; height: 10rem;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
background-image: url("static/images/themes/kerstmis/snowman_body.svg"); } background-image: url("static/images/themes/kerstmis/snowman_body.svg"); }
.train_button { .train_button {
visibility: hidden; } visibility: hidden; }
.train_wrapper { .train_wrapper {
position: absolute; position: absolute;
bottom: 0.5rem; bottom: 0.5rem;
transform: translateX(-80vw); transform: translateX(-80vw);
animation: train 47s linear infinite; } animation: train 47s linear infinite; }
.wheel_big, .wheel_small { .wheel_big, .wheel_small {
position: absolute; position: absolute;
bottom: -0.4rem; bottom: -0.4rem;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
background-image: url("static/images/themes/kerstmis/wheel.svg"); } background-image: url("static/images/themes/kerstmis/wheel.svg"); }
.train { .train {
position: absolute; position: absolute;
bottom: 0.5rem; bottom: 0.5rem;
left: 30rem; left: 30rem;
width: 30rem; width: 30rem;
height: 10rem; height: 10rem;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
background-image: url("static/images/themes/kerstmis/train.svg"); background-image: url("static/images/themes/kerstmis/train.svg");
animation: whobble 1s linear alternate-reverse infinite; } animation: whobble 1s linear alternate-reverse infinite; }
.wheel_big { .wheel_big {
width: 3.2rem; width: 3.2rem;
height: 3.2rem; } height: 3.2rem; }
.wheel_small { .wheel_small {
width: 2.5rem; width: 2.5rem;
height: 2.5rem; } height: 2.5rem; }
.train .wheel1 { .train .wheel1 {
animation: turn 2s linear infinite; animation: turn 2s linear infinite;
left: 3.5rem; } left: 3.5rem; }
.train .wheel2 { .train .wheel2 {
animation: turn 2s linear infinite, -0.1s; animation: turn 2s linear infinite, -0.1s;
left: 7rem; } left: 7rem; }
.train .wheel3 { .train .wheel3 {
animation: turn 2s linear infinite -0.3s; animation: turn 2s linear infinite -0.3s;
left: 10.5rem; } left: 10.5rem; }
.train .wheel4 { .train .wheel4 {
animation: turn 1.5s linear infinite -0.5s; animation: turn 1.5s linear infinite -0.5s;
left: 13.9rem; } left: 13.9rem; }
.train .wheel5 { .train .wheel5 {
animation: turn 1.5s linear infinite -0.7s; animation: turn 1.5s linear infinite -0.7s;
left: 16.6rem; } left: 16.6rem; }
.zeus_wagon, .mc_wagon { .zeus_wagon, .mc_wagon {
position: absolute; position: absolute;
bottom: 1.25rem; bottom: 1.25rem;
width: 30rem; width: 30rem;
height: 7.5rem; height: 7.5rem;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
animation: whobble 1s linear alternate-reverse infinite; } animation: whobble 1s linear alternate-reverse infinite; }
.mc_wagon { .mc_wagon {
background-image: url("static/images/themes/kerstmis/mc_wagon.svg"); background-image: url("static/images/themes/kerstmis/mc_wagon.svg");
left: 0rem; } left: 0rem; }
.zeus_wagon { .zeus_wagon {
background-image: url("static/images/themes/kerstmis/zeus_wagon.svg"); background-image: url("static/images/themes/kerstmis/zeus_wagon.svg");
left: 15rem; } left: 15rem; }
.zeus_wagon .wheel1, .mc_wagon .wheel1 { .zeus_wagon .wheel1, .mc_wagon .wheel1 {
animation: turn 2s linear infinite; animation: turn 2s linear infinite;
bottom: -1.1rem; bottom: -1.1rem;
left: 2.2rem; } left: 2.2rem; }
.zeus_wagon .wheel2, .mc_wagon .wheel2 { .zeus_wagon .wheel2, .mc_wagon .wheel2 {
animation: turn 2s linear infinite, -0.1s; animation: turn 2s linear infinite, -0.1s;
bottom: -1.1rem; bottom: -1.1rem;
left: 5.75rem; } left: 5.75rem; }
.zeus_wagon .wheel3, .mc_wagon .wheel3 { .zeus_wagon .wheel3, .mc_wagon .wheel3 {
animation: turn 2s linear infinite -0.3s; animation: turn 2s linear infinite -0.3s;
bottom: -1.1rem; bottom: -1.1rem;
left: 9.3rem; } left: 9.3rem; }
@keyframes sled { @keyframes sled {
0% { 0% {
transform: translate(-50rem, 40vh) rotate(0deg); } transform: translate(-50rem, 40vh) rotate(0deg); }
4% { 4% {
transform: translate(-50rem, 40vh) rotate(0deg); } transform: translate(-50rem, 40vh) rotate(0deg); }
20% { 20% {
transform: translate(50vw, 10vh) rotate(20deg); } transform: translate(50vw, 10vh) rotate(20deg); }
36% { 36% {
transform: translate(150vw, 40vh) rotate(40deg); } transform: translate(150vw, 40vh) rotate(40deg); }
100% { 100% {
transform: translate(150vw, 40vh) rotate(40deg); } } transform: translate(150vw, 40vh) rotate(40deg); } }
@keyframes train { @keyframes train {
0% { 0% {
transform: translateX(-80rem); } transform: translateX(-80rem); }
55% { 55% {
transform: translateX(-80rem); } transform: translateX(-80rem); }
85% { 85% {
transform: translateX(100vw); } transform: translateX(100vw); }
100% { 100% {
transform: translateX(100vw); } } transform: translateX(100vw); } }
@keyframes turn { @keyframes turn {
100% { 100% {
transform: rotate(360deg); } } transform: rotate(360deg); } }
@keyframes whobble { @keyframes whobble {
100% { 100% {
transform: translateY(0.5vh); } } transform: translateY(0.5vh); } }
@keyframes snowman { @keyframes snowman {
0% { 0% {
transform: rotate(0); } transform: rotate(0); }
20% { 20% {
transform: rotate(0); } transform: rotate(0); }
30% { 30% {
transform: rotate(80deg); } transform: rotate(80deg); }
54% { 54% {
transform: rotate(80deg); } transform: rotate(80deg); }
68% { 68% {
transform: rotate(0); } transform: rotate(0); }
100% { 100% {
transform: rotate(0); } } transform: rotate(0); } }
@keyframes snowman_head { @keyframes snowman_head {
0% { 0% {
transform: rotate(-3deg); } transform: rotate(-3deg); }
50% { 50% {
transform: rotate(3deg); } transform: rotate(3deg); }
100% { 100% {
transform: rotate(-3deg); } } transform: rotate(-3deg); } }
/*# sourceMappingURL=kerstmis.css.map */ /*# sourceMappingURL=kerstmis.css.map */

View file

@ -20,66 +20,66 @@ Enige discretie is aangeraden.
--dGray4:#274001; --dGray4:#274001;
--dGray5:#274001; --dGray5:#274001;
--dGray6:#F2778D; --dGray6:#F2778D;
--dBlue:#F2778D; --dBlue:#F2778D;
} }
body{ body{
height: 100%; height: 100%;
font-family: Radikal,Optima,Segoe,Segoe UI,Candara,Calibri,Arial,sans-serif; font-family: Radikal,Optima,Segoe,Segoe UI,Candara,Calibri,Arial,sans-serif;
background-color: #2F0000; background-color: #2F0000;
} }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url('static/fonts/radikal_regular.ttf'); src: url('static/fonts/radikal_regular.ttf');
font-weight: normal; font-weight: normal;
} }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url('static/fonts/radikal_light.ttf'); src: url('static/fonts/radikal_light.ttf');
font-weight: 200; font-weight: 200;
} }
@font-face { @font-face {
font-family: Radikal; font-family: Radikal;
src: url('static/fonts/radikal_bold.ttf'); src: url('static/fonts/radikal_bold.ttf');
font-weight: bold; font-weight: bold;
} }
.btn{ .btn{
border-radius: 5rem; border-radius: 5rem;
color: white; color: white;
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
background-image: linear-gradient(-40deg,#F53030, #F58B9E); background-image: linear-gradient(-40deg,#F53030, #F58B9E);
} }
.btn:hover{ .btn:hover{
background-image: linear-gradient(-40deg, #A81111, #FF4B33); background-image: linear-gradient(-40deg, #A81111, #FF4B33);
} }
.navbar { .navbar {
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
padding: 1.5rem; padding: 1.5rem;
background-color: transparent; background-color: transparent;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
text-transform: capitalize; text-transform: capitalize;
} }
.nav>li>a { .nav>li>a {
padding-left: 1vw; padding-left: 1vw;
padding-right: 1vw; padding-right: 1vw;
} }
.main{ .main{
height: 90vh; height: 90vh;
overflow: scroll; overflow: scroll;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
flex-direction: column; flex-direction: column;
} }
.navbar .container{ .navbar .container{
width: 100%; width: 100%;
padding: 0 4vw; padding: 0 4vw;
} }
@media (min-width: 768px){ @media (min-width: 768px){
.container { .container {
@ -94,145 +94,145 @@ Enige discretie is aangeraden.
@media (min-width: 1200px){ @media (min-width: 1200px){
.main .container, .main .orders { .main .container, .main .orders {
width: 1170px; width: 1170px;
} }
} }
.main{ .main{
padding-top: 2.5rem; padding-top: 2.5rem;
} }
.order_data { .order_data {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
padding: 0 3rem; padding: 0 3rem;
align-items: baseline; align-items: baseline;
} }
.order_data h5{ .order_data h5{
max-width: 60%; max-width: 60%;
padding-bottom: 3rem; padding-bottom: 3rem;
} }
.expand_button{ .expand_button{
padding: 1rem 0rem; padding: 1rem 0rem;
margin-top: -1rem; margin-top: -1rem;
width: 70%; width: 70%;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
} }
.hi_im_haldis h2{ .hi_im_haldis h2{
display: none; display: none;
} }
.hi_im_haldis h3 { .hi_im_haldis h3 {
width: 100%; width: 100%;
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif; font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
text-align: center; text-align: center;
} }
.hi_im_haldis { .hi_im_haldis {
background: linear-gradient(70deg,rgba(203, 52, 68,0.8), rgba(135, 32, 44,0.8)); background: linear-gradient(70deg,rgba(203, 52, 68,0.8), rgba(135, 32, 44,0.8));
border-radius: 0; border-radius: 0;
width: 100%; width: 100%;
} }
.hi_im_haldis_wrapper { .hi_im_haldis_wrapper {
width: 100%; width: 100%;
} }
.darker:nth-child(even){ .darker:nth-child(even){
background-color: #B62937; background-color: #B62937;
border-radius: 2rem; border-radius: 2rem;
} }
.darker:nth-child(odd){ .darker:nth-child(odd){
background-color: #821C25; background-color: #821C25;
border-radius: 2rem; border-radius: 2rem;
} }
.darker{ .darker{
padding: 1rem; padding: 1rem;
} }
.order_row:nth-child(even) .order_data { .order_row:nth-child(even) .order_data {
background-color: #B62937; background-color: #B62937;
border-radius: 2rem; border-radius: 2rem;
} }
.order_row { .order_row {
background: transparent; background: transparent;
} }
.order_row:nth-child(odd) .order_data { .order_row:nth-child(odd) .order_data {
background-color: #821C25; background-color: #821C25;
border-radius: 2rem; border-radius: 2rem;
} }
.order_row h5{ .order_row h5{
font-weight: bold; font-weight: bold;
} }
.order_row{ .order_row{
margin-bottom: 3rem; margin-bottom: 3rem;
} }
h3{ h3{
padding-bottom: 1rem; padding-bottom: 1rem;
} }
.home_sir { .home_sir {
font-weight: bold; font-weight: bold;
color: #F45D68; color: #F45D68;
} }
.expand_button_wrapper{ .expand_button_wrapper{
margin-top: -1rem; margin-top: -1rem;
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
.time_data { .time_data {
text-align: right; text-align: right;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-self: right; 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{ .navbar .navbar-nav .active a{
padding-left: 2rem; color: rgb(255, 155, 174);
} border-bottom: 1px solid rgb(255, 155, 174);
padding-bottom: 1rem;
}
.jumbotron, .darker { .navbar-nav{
padding-left: 2rem;
}
.jumbotron, .darker {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
border-radius: 4rem; border-radius: 4rem;
} }
.row>div>h5 { .row>div>h5 {
font-weight: bold; font-weight: bold;
padding-top: 1.5rem; padding-top: 1.5rem;
font-size: 2.5rem; font-size: 2.5rem;
} }
.row>div>.amount_of_orders{ .row>div>.amount_of_orders{
font-weight: lighter; font-weight: lighter;
font-size: 1.6rem; font-size: 1.6rem;
} }
.row>div .time{ .row>div .time{
font-weight: lighter; font-weight: lighter;
} }
.jumbotron { .jumbotron {
background-color: transparent; background-color: transparent;
} }
.navbar-default .navbar-nav .active a, .navbar-default .navbar-nav .active a:hover{ .navbar-default .navbar-nav .active a, .navbar-default .navbar-nav .active a:hover{
background-color: transparent; background-color: transparent;
} }
.background { .background {
-webkit-filter: blur(0px) brightness(80%); -webkit-filter: blur(0px) brightness(80%);
-moz-filter: blur(0px) brightness(80%); -moz-filter: blur(0px) brightness(80%);
-o-filter: blur(0px) brightness(80%); -o-filter: blur(0px) brightness(80%);

View file

@ -1,12 +1,12 @@
/*lightmode*/ /*lightmode*/
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#444444; --dGray0:#444444;
--dGray1:#666666; --dGray1:#666666;
--dGray2:#212121; --dGray2:#212121;
--dGray3:#ffffff; --dGray3:#ffffff;
--dGray4:#f9f9f9; --dGray4:#f9f9f9;
--dGray5:#ffffff; --dGray5:#ffffff;
--dGray6:#ffffff; --dGray6:#ffffff;
--dBlue:#0A84FF; --dBlue:#0A84FF;
} }

View file

@ -1,16 +1,16 @@
/*sinterklaas*/ /*sinterklaas*/
:root { :root {
/*Darkmode colors*/ /*Darkmode colors*/
--dGray0:#F2EB80; --dGray0:#F2EB80;
--dGray1:#F2EF05; --dGray1:#F2EF05;
--dGray2:#F2EF05; --dGray2:#F2EF05;
--dGray3:#177EBF; --dGray3:#177EBF;
--dGray4:#0C6AA6; --dGray4:#0C6AA6;
--dGray5:#F20505; --dGray5:#F20505;
--dGray6:#F50B00; --dGray6:#F50B00;
--dBlue:#35F546; --dBlue:#35F546;
} }
.background{ .background{
background-image: url("static/images/themes/sinterklaas/Sinterklaas.jpg"); background-image: url("static/images/themes/sinterklaas/Sinterklaas.jpg");
} }

View file

@ -285,4 +285,4 @@
<glyph unicode="&#x1f511;" d="M250 1200h600q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-150v-500l-255 -178q-19 -9 -32 -1t-13 29v650h-150q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5zM400 1100v-100h300v100h-300z" /> <glyph unicode="&#x1f511;" d="M250 1200h600q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-150v-500l-255 -178q-19 -9 -32 -1t-13 29v650h-150q-21 0 -35.5 14.5t-14.5 35.5v400q0 21 14.5 35.5t35.5 14.5zM400 1100v-100h300v100h-300z" />
<glyph unicode="&#x1f6aa;" d="M250 1200h750q39 0 69.5 -40.5t30.5 -84.5v-933l-700 -117v950l600 125h-700v-1000h-100v1025q0 23 15.5 49t34.5 26zM500 525v-100l100 20v100z" /> <glyph unicode="&#x1f6aa;" d="M250 1200h750q39 0 69.5 -40.5t30.5 -84.5v-933l-700 -117v950l600 125h-700v-1000h-100v1025q0 23 15.5 49t34.5 26zM500 525v-100l100 20v100z" />
</font> </font>
</defs></svg> </defs></svg>

Before

Width:  |  Height:  |  Size: 106 KiB

After

Width:  |  Height:  |  Size: 106 KiB

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -1,11 +1,11 @@
function changeTheme() { function changeTheme() {
// Get the selected theme for the dropdown // Get the selected theme for the dropdown
var themes_select = document.getElementById("themes_select"); var themes_select = document.getElementById("themes_select");
var selected_theme = themes_select.options[themes_select.selectedIndex].text; var selected_theme = themes_select.options[themes_select.selectedIndex].text;
// Update the theme cookie // Update the theme cookie
document.cookie = "theme=" + escape(selected_theme) + "; Path=/;" document.cookie = "theme=" + escape(selected_theme) + "; Path=/;"
// Finally reload the page to let the new theme take effect // Finally reload the page to let the new theme take effect
location.reload(); location.reload();
} }

File diff suppressed because one or more lines are too long

View file

@ -1,69 +1,69 @@
var map = L.map('mapid'); var map = L.map('mapid');
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map); }).addTo(map);
let base_request_uri = "https://photon.komoot.de/api/?limit=1&q="; let base_request_uri = "https://photon.komoot.de/api/?limit=1&q=";
function performRequest(url, location, success_callback) { function performRequest(url, location, success_callback) {
var request = new XMLHttpRequest(); var request = new XMLHttpRequest();
request.open('GET', url, true); request.open('GET', url, true);
request.onload = function() { request.onload = function() {
if (this.status >= 200 && this.status < 400) { if (this.status >= 200 && this.status < 400) {
// Success! // Success!
var data = JSON.parse(this.response); var data = JSON.parse(this.response);
success_callback(location, data); success_callback(location, data);
} else { } else {
// We reached our target server, but it returned an error // We reached our target server, but it returned an error
} }
}; };
request.onerror = function() { request.onerror = function() {
console.log("Error requestion location coordinates"); console.log("Error requestion location coordinates");
// There was a connection error of some sort // There was a connection error of some sort
}; };
request.send(); request.send();
} }
let marker_icon = L.icon({ let marker_icon = L.icon({
iconUrl: "/static/images/marker-icon.png", iconUrl: "/static/images/marker-icon.png",
shadowUrl: "/static/images/marker-shadow.png", shadowUrl: "/static/images/marker-shadow.png",
iconAnchor: [12, 41] iconAnchor: [12, 41]
}); });
let callback = function OSMCallBack(location, data) { let callback = function OSMCallBack(location, data) {
let lat, lon; let lat, lon;
if (data.features.length >= 1) { if (data.features.length >= 1) {
let place = data.features[0].properties; let place = data.features[0].properties;
lat = data.features[0].geometry.coordinates[1]; lat = data.features[0].geometry.coordinates[1];
lon = data.features[0].geometry.coordinates[0]; lon = data.features[0].geometry.coordinates[0];
let marker = L.marker([lat, lon], { let marker = L.marker([lat, lon], {
icon: marker_icon icon: marker_icon
}).addTo(map) }).addTo(map)
.bindPopup(location.name + ', ' + location.address, {offset: new L.Point(0, -16)}).on('click', function () { .bindPopup(location.name + ', ' + location.address, {offset: new L.Point(0, -16)}).on('click', function () {
let win = window.open(location.url, '_blank'); let win = window.open(location.url, '_blank');
win.focus(); win.focus();
}); });
marker.on('mouseover', function(env) { marker.on('mouseover', function(env) {
marker.openPopup(); marker.openPopup();
}); });
marker.on('mouseout', function(env) { marker.on('mouseout', function(env) {
marker.closePopup(); marker.closePopup();
}); });
if (location.center) { if (location.center) {
map.setView([lat, lon], 14); map.setView([lat, lon], 14);
} }
} else { } else {
console.log(`Location ${JSON.stringify(location, null, 2)} returned no features, are you sure this is a valid address?`); console.log(`Location ${JSON.stringify(location, null, 2)} returned no features, are you sure this is a valid address?`);
} }
}; };
function loadmap(locations) { function loadmap(locations) {
for (let loc of locations) { for (let loc of locations) {
let request_uri = base_request_uri + loc.address; let request_uri = base_request_uri + loc.address;
performRequest(request_uri, loc, callback); performRequest(request_uri, loc, callback);
} }
} }

View file

@ -1,14 +1,13 @@
{ {
const init = () =>{ const init = () =>{
document.cookie.split('; ').forEach(itCookie = cookie =>{ //I know that this is a shitty way of fixing things... But I'll try to fix it in the future. document.cookie.split('; ').forEach(itCookie = cookie =>{ // TODO (Arnhoudt) Fix shitty way of doing things
if(cookie.split("=")[0] == "theme" && cookie.split("=")[1] == "darkmode"){ if(cookie.split("=")[0] == "theme" && cookie.split("=")[1] == "darkmode"){
document.querySelector(".toggleDarkmode").innerHTML = "<a>Enter lightmode</a>" document.querySelector(".toggleDarkmode").innerHTML = "<a>Enter lightmode</a>"
document.querySelector(".toggleDarkmode").id = "lightmode"; document.querySelector(".toggleDarkmode").id = "lightmode";
} }
if(cookie.split("=")[0] == "theme" && cookie.split("=")[1] == "customTheme"){ if(cookie.split("=")[0] == "theme" && cookie.split("=")[1] == "customTheme"){
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.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>';
} }
if(cookie.split("=")[0] == "performance" && cookie.split("=")[1] == "highPerformance" && document.querySelector(".changePerformance")){ if(cookie.split("=")[0] == "performance" && cookie.split("=")[1] == "highPerformance" && document.querySelector(".changePerformance")){
document.querySelector(".changePerformance").innerHTML = "enable low performance"; document.querySelector(".changePerformance").innerHTML = "enable low performance";
@ -20,16 +19,16 @@
} }
const handleClickChangePerformance = e => { const handleClickChangePerformance = e => {
document.cookie = "performance = "+e.currentTarget.id+";path=/"; document.cookie = "performance = "+e.currentTarget.id+";path=/";
location.reload(); location.reload();
} }
const handleClickChangeTheme = e =>{ const handleClickChangeTheme = e =>{
document.cookie = "theme = "+e.currentTarget.id+";path=/"; document.cookie = "theme = "+e.currentTarget.id+";path=/";
location.reload(); location.reload();
} }
init(); init();
} }

View file

@ -1,36 +1,36 @@
/** /**
* Created by feliciaan on 30/03/15. * Created by feliciaan on 30/03/15.
*/ */
$.ready(function(){ $.ready(function(){
$('.time').each(function() { $('.time').each(function() {
var timeEl = $( this ); var timeEl = $( this );
var time = timeEl.text().split(' ')[0].split(':'); var time = timeEl.text().split(' ')[0].split(':');
if (timeEl.text().indexOf('closed') < 0) { if (timeEl.text().indexOf('closed') < 0) {
window.setInterval(function () { window.setInterval(function () {
time = my_tick(time); time = my_tick(time);
if (time !== "closed") { if (time !== "closed") {
timeS = ("0" + time[0]).slice(-2) + ":" + ("0" + time[1]).slice(-2) + ":" + ("0" + time[2]).slice(-2) + " left"; timeS = ("0" + time[0]).slice(-2) + ":" + ("0" + time[1]).slice(-2) + ":" + ("0" + time[2]).slice(-2) + " left";
} else { } else {
timeS = "closed" timeS = "closed"
} }
timeEl.html(timeS); timeEl.html(timeS);
}, 1000); }, 1000);
} }
}); });
function my_tick(time) { function my_tick(time) {
if (time[2] > 0) { if (time[2] > 0) {
time[2] = time[2] - 1; time[2] = time[2] - 1;
} else if(time[1] > 0) { } else if(time[1] > 0) {
time[2] = 59; time[2] = 59;
time[1] = time[1] - 1; time[1] = time[1] - 1;
} else if(time[0] > 0) { } else if(time[0] > 0) {
time[1] = 59; time[1] = 59;
time[0] = time[0] - 1; time[0] = time[0] - 1;
} else { } else {
return "closed"; return "closed";
} }
return time; return time;
} }
}()); }());

View file

@ -2,6 +2,6 @@
{% set active_page = "about" -%} {% set active_page = "about" -%}
{% block container %} {% block container %}
<h1>About</h1> <h1>About</h1>
<p>Haldis is your friendly neighbourhood servant. He exists so lazy fucks like you and me don't need to keep tabs of who is ordering what from where.</p> <p>Haldis is your friendly neighbourhood servant. He exists so lazy fucks like you and me don't need to keep tabs of who is ordering what from where.</p>
{% endblock %} {% endblock %}

View file

@ -1,9 +1,9 @@
{% extends "layout.html" -%} {% extends "layout.html" -%}
{% block container %} {% block container %}
<div class="jumbotron"> <div class="jumbotron">
<h1>Unauthorized</h1> <h1>Unauthorized</h1>
<p>You're not authorized to look to this page!</p> <p>You're not authorized to look to this page!</p>
<p><a href="{{ url_for('general_bp.home') }}">Go somewhere nice</a></p> <p><a href="{{ url_for('general_bp.home') }}">Go somewhere nice</a></p>
</div> </div>
{% endblock %} {% endblock %}

View file

@ -1,9 +1,9 @@
{% extends "layout.html" -%} {% extends "layout.html" -%}
{% block container %} {% block container %}
<div class="jumbotron"> <div class="jumbotron">
<h1>Page Not Found</h1> <h1>Page Not Found</h1>
<p>What you were looking for is just not there.</p> <p>What you were looking for is just not there.</p>
<p><a href="{{ url_for('general_bp.home') }}">Go somewhere nice</a></p> <p><a href="{{ url_for('general_bp.home') }}">Go somewhere nice</a></p>
</div> </div>
{% endblock %} {% endblock %}

View file

@ -4,35 +4,35 @@
{% import "utils.html" as util -%} {% import "utils.html" as util -%}
{% block container %} {% block container %}
<div class="row hi_im_haldis_wrapper"> <div class="row hi_im_haldis_wrapper">
<div class="jumbotron hi_im_haldis"> <div class="jumbotron hi_im_haldis">
<h2>Hi, I'm Haldis</h2> <h2>Hi, I'm Haldis</h2>
<h3>What would you like to <span class="home_sir">eat</span>?</h3> <h3>What would you like to <span class="home_sir">eat</span>?</h3>
</div> </div>
</div> </div>
<div class="row container"> <div class="row container">
<div class="col-sm-5"> <div class="col-sm-5">
{% if orders|count > 0 -%} {% if orders|count > 0 -%}
<h3>Open orders:</h3> <h3>Open orders:</h3>
{% for order in orders %} {% for order in orders %}
{{ util.render_order(order) }} {{ util.render_order(order) }}
{% endfor %} {% endfor %}
{% else %} {% else %}
<h4>No orders available.</h4> <h4>No orders available.</h4>
{% if not current_user.is_anonymous() %} {% if not current_user.is_anonymous() %}
To create an order, fill in the form <a href="{{ url_for("order_bp.orders") }}">here</a>. To create an order, fill in the form <a href="{{ url_for("order_bp.orders") }}">here</a>.
{% else %} {% else %}
Login to create an order, or ask someone else. Login to create an order, or ask someone else.
{% endif %} {% endif %}
{%- endif %} {%- endif %}
</div> </div>
<div class="col-sm-5 col-sm-push-2"> <div class="col-sm-5 col-sm-push-2">
{% if recently_closed|count > 0 -%} {% if recently_closed|count > 0 -%}
<h3>Recently closed orders:</h3> <h3>Recently closed orders:</h3>
{% for order in recently_closed %} {% for order in recently_closed %}
{{ util.render_order(order) }} {{ util.render_order(order) }}
{% endfor %} {% endfor %}
{%- endif %} {%- endif %}
</div> </div>
</div> </div>
{% endblock %} {% endblock %}

View file

@ -2,87 +2,87 @@
{% import "bootstrap/utils.html" as utils %} {% import "bootstrap/utils.html" as utils %}
{% set navbar = [ {% set navbar = [
('general_bp.home', 'Home'), ('general_bp.home', 'Home'),
('order_bp.orders', 'Orders'), ('order_bp.orders', 'Orders'),
('general_bp.locations', 'Locations'), ('general_bp.locations', 'Locations'),
('general_bp.map_view', 'Map'), ('general_bp.map_view', 'Map'),
('general_bp.about', 'About'), ('general_bp.about', 'About'),
('stats_blueprint.stats', 'Stats'), ('stats_blueprint.stats', 'Stats'),
] -%} ] -%}
{% set active_page = active_page|default('index') -%} {% set active_page = active_page|default('index') -%}
{% block title %} {% block title %}
Haldis - {{ active_page|capitalize }} Haldis - {{ active_page|capitalize }}
{% if title %} {% if title %}
- {{ title }} - {{ title }}
{% endif %} {% endif %}
{% endblock %} {% endblock %}
{% block styles %} {% block styles %}
{{ super() }} {{ super() }}
<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}" media="screen"> <link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}" media="screen">
<link rel="stylesheet" href="/css" media="screen"> <link rel="stylesheet" href="/css" media="screen">
<link rel="stylesheet" href="{{ url_for('static', filename='css/print.css') }}" media="print"> <link rel="stylesheet" href="{{ url_for('static', filename='css/print.css') }}" media="print">
{% endblock %} {% endblock %}
{% block scripts %} {% block scripts %}
{{ super() }} {{ super() }}
<script type="text/javascript" src="{{ url_for('static', filename='js/theme.js') }}"></script> <script type="text/javascript" src="{{ url_for('static', filename='js/theme.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static', filename='js/timer.js') }}"></script> <script type="text/javascript" src="{{ url_for('static', filename='js/timer.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static', filename='js/customThemes.js') }}"></script> <script type="text/javascript" src="{{ url_for('static', filename='js/customThemes.js') }}"></script>
{% endblock %} {% endblock %}
{% block navbar %} {% block navbar %}
<div class="background"></div> <div class="background"></div>
<div class="foreground"></div> <div class="foreground"></div>
<nav class="navbar navbar-default navbar-fixed-top"> <nav class="navbar navbar-default navbar-fixed-top">
<div class="container"> <div class="container">
<div class="navbar-header"> <div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span> <span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span> <span class="icon-bar"></span>
<span class="icon-bar"></span> <span class="icon-bar"></span>
<span class="icon-bar"></span> <span class="icon-bar"></span>
</button> </button>
<a class="navbar-brand" href="{{ url_for('general_bp.home') }}">HALDIS</a> <a class="navbar-brand" href="{{ url_for('general_bp.home') }}">HALDIS</a>
</div> </div>
<div id="navbar" class="navbar-collapse collapse"> <div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav"> <ul class="nav navbar-nav">
{% for id, text in navbar -%} {% for id, text in navbar -%}
<li class="{{ 'active' if active_page in id else '' }}"> <li class="{{ 'active' if active_page in id else '' }}">
<a href="{{ url_for(id) }}">{{ text|e }}</a> <a href="{{ url_for(id) }}">{{ text|e }}</a>
</li> </li>
{% endfor -%} {% endfor -%}
</ul> </ul>
<ul class="nav navbar-nav navbar-right"> <ul class="nav navbar-nav navbar-right">
{% if current_user.is_anonymous() %} {% if current_user.is_anonymous() %}
<li><a href="{{ url_for('auth_bp.login') }}">Login</a></li> <li><a href="{{ url_for('auth_bp.login') }}">Login</a></li>
{% else %} {% else %}
<li><a href="{{ url_for('general_bp.profile') }}">{{ current_user.username }}</a></li> <li><a href="{{ url_for('general_bp.profile') }}">{{ current_user.username }}</a></li>
<li><a href="{{ url_for('auth_bp.logout') }}">Logout</a></li> <li><a href="{{ url_for('auth_bp.logout') }}">Logout</a></li>
{% endif %} {% endif %}
</ul> </ul>
</div><!--/.nav-collapse --> </div><!--/.nav-collapse -->
</div> </div>
</nav> </nav>
{% endblock %} {% endblock %}
{% block content -%} {% block content -%}
{{ utils.flashed_messages(container=True) }} {{ utils.flashed_messages(container=True) }}
<div class="container main"> <div class="container main">
{% block container -%} {% block container -%}
{%- endblock %} {%- endblock %}
</div> </div>
<footer> <footer>
<hr> <hr/>
<div class="container"> <div class="container">
<div class="footerWrapper"> <div class="footerWrapper">
<div class="pull-left">Made with ❤ by <a href="http://zeus.ugent.be">Zeus WPI</a></div> <div class="pull-left">Made with ❤ by <a href="http://zeus.ugent.be">Zeus WPI</a></div>
<div class="changeThemeButton toggleDarkmode" id="darkmode"><a>Enter darkmode</a></div> <div class="changeThemeButton toggleDarkmode" id="darkmode"><a>Enter darkmode</a></div>
<div class="pull-right"><a href="http://github.com/ZeusWPI/Haldis">© {{ ""|year }}</a></div> <div class="pull-right"><a href="http://github.com/ZeusWPI/Haldis">© {{ ""|year }}</a></div>
</div> </div>
</div> </div>
</footer> </footer>
{%- endblock %} {%- endblock %}

View file

@ -5,40 +5,40 @@
{% block container %} {% block container %}
<div class="row location_data" xmlns="http://www.w3.org/1999/html"> <div class="row location_data" xmlns="http://www.w3.org/1999/html">
<div class="col-md-push-1 col-md-5 darker"> <div class="col-md-push-1 col-md-5 darker">
<h3>{{ location.name }}</h3> <h3>{{ location.name }}</h3>
{% if location.address %}<span class="glyphicon glyphicon-home"></span> {{ location.address }}<br/>{% endif %} {% if location.address %}<span class="glyphicon glyphicon-home"></span> {{ location.address }}<br/>{% endif %}
{% if location.telephone %}<span class="glyphicon glyphicon-phone"></span>{{ location.telephone }}<br/>{% endif %} {% if location.telephone %}<span class="glyphicon glyphicon-phone"></span>{{ location.telephone }}<br/>{% endif %}
{% if location.website %}<span class="glyphicon glyphicon-link"></span> <a href="{{ location.website}}">{{ location.website }}</a> <br/>{% endif %} {% if location.website %}<span class="glyphicon glyphicon-link"></span> <a href="{{ location.website}}">{{ location.website }}</a> <br/>{% endif %}
{% if location.osm %}<span class="glyphicon glyphicon-map-marker"></span> <a href="{{ location.osm}}">{{ location.osm }}</a> <br/>{% endif %} {% if location.osm %}<span class="glyphicon glyphicon-map-marker"></span> <a href="{{ location.osm}}">{{ location.osm }}</a> <br/>{% endif %}
{% if not current_user.is_anonymous() %} {% if not current_user.is_anonymous() %}
<a href="{{ url_for("order_bp.orders", location_id=location.id) }}" class="btn btn-primary btn-sm">Create order</a> <a href="{{ url_for("order_bp.orders", location_id=location.id) }}" class="btn btn-primary btn-sm">Create order</a>
{% endif %} {% endif %}
</div> </div>
<div class="col-md-push-1 col-md-5 padding-top sm-no-side-padding md-no-right-padding"> <div class="col-md-push-1 col-md-5 padding-top sm-no-side-padding md-no-right-padding">
{% if location.address %} {% if location.address %}
<div class="small-map" id="mapid"></div> <div class="small-map" id="mapid"></div>
{% endif %} {% endif %}
</div> </div>
</div> </div>
<div class="row location_products"> <div class="row location_products">
<div class="col-md-push-1 col-md-10 darker"> <div class="col-md-push-1 col-md-10 darker">
<h3 id="order-title">Products</h3> <h3 id="order-title">Products</h3>
<table class="table table-hover table-condensed"> <table class="table table-hover table-condensed">
<thead> <thead>
<tr><th style="min-width: 20%">Name</th><th>Description</th><th>Price</th></tr> <tr><th style="min-width: 20%">Name</th><th>Description</th><th>Price</th></tr>
</thead> </thead>
<tbody> <tbody>
{% for dish in location.dishes -%} {% for dish in location.dishes -%}
<tr> <tr>
<td>{{ dish.name or dish.id }}</td> <td>{{ dish.name or dish.id }}</td>
<td>{{ dish.description or "" }}</td> <td>{{ dish.description or "" }}</td>
<td style="white-space: nowrap;">{{ dish.price|euro }}<td> <td style="white-space: nowrap;">{{ dish.price|euro }}<td>
</tr> </tr>
{%- endfor %} {%- endfor %}
</tbody> </tbody>
</table> </table>
</div> </div>
</div> </div>
{% endblock %} {% endblock %}
@ -49,23 +49,19 @@
{% endblock %} {% endblock %}
{% block scripts %} {% block scripts %}
{{super()}} {{ super() }}
{% if location.address %} {% if location.address %}
<script src="{{ url_for('static', filename='js/leaflet.js')}}"></script> <script src="{{ url_for('static', filename='js/leaflet.js')}}"></script>
<script src="{{ url_for('static', filename='js/map.js' ) }}"></script> <script src="{{ url_for('static', filename='js/map.js' ) }}"></script>
<script> <script>
let locations = []; let locations = [{
"address": "{{location.address}}",
loc = { "name": "{{location.name}}",
"address": "{{location.address}}", "url": "{{location.website}}",
"name": "{{location.name}}", "center": true,
"url": "{{location.website}}", }];
"center": true, loadmap(locations);
}; </script>
locations.push(loc);
loadmap(locations);
</script>
{% endif %} {% endif %}
{% endblock %} {% endblock %}

View file

@ -5,27 +5,27 @@
{% block container %} {% block container %}
<div class="row"> <div class="row">
<div class="col-md-push-1 col-md-10 darker locations_locations"> <div class="col-md-push-1 col-md-10 darker locations_locations">
<h3>Locations</h3> <h3>Locations</h3>
<table class="table table-hover table-condensed"> <table class="table table-hover table-condensed">
<thead> <thead>
<tr><th>Name</th><th>Address</th><th></th><th></th><th></th></tr> <tr><th>Name</th><th>Address</th><th></th><th></th><th></th></tr>
</thead> </thead>
<tbody> <tbody>
{% for loc in locations -%} {% for loc in locations -%}
<tr> <tr>
<td><a href="{{ url_for('general_bp.location', location_id=loc.id) }}">{{ loc.name }}</a></td> <td><a href="{{ url_for('general_bp.location', location_id=loc.id) }}">{{ loc.name }}</a></td>
<td>{{ loc.address }}<td> <td>{{ loc.address }}<td>
<td><a href="{{ loc.website }}"><span class="glyphicon glyphicon-link"></span> {{ loc.website }}</a></td> <td><a href="{{ loc.website }}"><span class="glyphicon glyphicon-link"></span> {{ loc.website }}</a></td>
<td> <td>
{% if not current_user.is_anonymous() %} {% if not current_user.is_anonymous() %}
<a href="{{ url_for("order_bp.orders", location_id=loc.id) }}" class="btn btn-primary btn-xs">Create order</a> <a href="{{ url_for("order_bp.orders", location_id=loc.id) }}" class="btn btn-primary btn-xs">Create order</a>
{% endif %} {% endif %}
</td> </td>
</tr> </tr>
{%- endfor %} {%- endfor %}
</tbody> </tbody>
</table> </table>
</div> </div>
</div> </div>
{% endblock %} {% endblock %}

View file

@ -20,23 +20,20 @@
<script src="{{ url_for('static', filename='js/leaflet.js')}}"></script> <script src="{{ url_for('static', filename='js/leaflet.js')}}"></script>
<script src="{{ url_for('static', filename='js/map.js' ) }}"></script> <script src="{{ url_for('static', filename='js/map.js' ) }}"></script>
<script> <script>
let locations = []; let locations = [];
let loc = {};
{% for loc in locations -%} {% for loc in locations -%}
{% if loc.address %} {% if loc.address %}
loc = { locations.push({
"address": "{{loc.address}}", "address": "{{loc.address}}",
"name": "{{loc.name}}", "name": "{{loc.name}}",
"url": "{{ url_for('general_bp.location', location_id=loc.id) }}" "url": "{{ url_for('general_bp.location', location_id=loc.id) }}"
}; });
locations.push(loc); {% endif %}
{%- endfor %}
{% endif %} map.setView([51.0231119, 3.7102741], 14);
{%- endfor %}
map.setView([51.0231119, 3.7102741], 14); loadmap(locations);
loadmap(locations);
</script> </script>
{% endblock %} {% endblock %}

View file

@ -7,190 +7,200 @@
{% block container %} {% block container %}
<div class="row"> <div class="row">
<div class="col-md-push-1 col-md-10 darker order_overview" id="info"><!-- Shitty html --> <div class="col-md-push-1 col-md-10 darker order_overview" id="info"><!-- Shitty html -->
<h3 id="order-title">Order {{ order.id }} <h3 id="order-title">Order {{ order.id }}
<div class="pull-right"> <div class="pull-right">
{% if order.can_close(current_user.id) -%} {% if order.can_close(current_user.id) -%}
<form action="{{ url_for('order_bp.close_order', order_id=order.id) }}" method="post" style="display:inline"> <form action="{{ url_for('order_bp.close_order', order_id=order.id) }}" method="post" style="display:inline">
<input type="submit" class="btn btn-danger" value="Close"></input> <input type="submit" class="btn btn-danger" value="Close"></input>
</form> </form>
{% endif %}{% if courier_or_admin %} {% endif %}{% if courier_or_admin %}
<a class="btn btn-warning" href="{{ url_for('order_bp.order_edit', order_id=order.id) }}">Edit</a> <a class="btn btn-warning" href="{{ url_for('order_bp.order_edit', order_id=order.id) }}">Edit</a>
{%- endif %} {%- endif %}
</div></h3> </div></h3>
courier: {{ order.courier.username }} courier: {{ order.courier.username }}
{% if order.courier == None and not current_user.is_anonymous() %} {% if order.courier == None and not current_user.is_anonymous() %}
<form action="{{ url_for('order_bp.volunteer', order_id=order.id) }}" method="post" style="display:inline"> <form action="{{ url_for('order_bp.volunteer', order_id=order.id) }}" method="post" style="display:inline">
<input type="submit" class="btn btn-primary btn-sm" value="Volunteer"></input> <input type="submit" class="btn btn-primary btn-sm" value="Volunteer"></input>
</form> </form>
{% endif %} {% endif %}
<br/> <br/>
location: {% if order.location %} location: {% if order.location %}
<a href="{{ url_for('general_bp.location', location_id=order.location_id) }}">{{ order.location_name }}</a> <a href="{{ url_for('general_bp.location', location_id=order.location_id) }}">{{ order.location_name }}</a>
{% else %} {% else %}
{{ order.location_name }} {{ order.location_name }}
{% endif %}<br/> {% endif %}<br/>
{% if order.location.telephone != None %} {% if order.location.telephone != None %}
telephone: <a href="tel://{{ order.location.telephone }}">{{ order.location.telephone }}</a><br/> telephone: <a href="tel://{{ order.location.telephone }}">{{ order.location.telephone }}</a><br/>
{% endif %} {% endif %}
start: {{ order.starttime.strftime("%d/%m/%Y %H:%M") }}<br> start: {{ order.starttime.strftime("%d/%m/%Y %H:%M") }}<br>
{% if order.stoptime %} {% if order.stoptime %}
closing time: {{ order.stoptime.strftime("%H:%M") }} (<span class="time">{{ order.stoptime|countdown }}</span>) closing time: {{ order.stoptime.strftime("%H:%M") }} (<span class="time">{{ order.stoptime|countdown }}</span>)
{% else %}open{% endif %}<br/> {% else %}open{% endif %}<br/>
total price: {{ total_price|euro }} {% if courier_or_admin %}- remaining debts: {{ debts|euro }}{% endif %} total price: {{ total_price|euro }} {% if courier_or_admin %}- remaining debts: {{ debts|euro }}{% endif %}
</div> </div>
{% if form -%} {% if form -%}
<div class="col-md-push-1 col-md-10 darker order_order" id="form"> <div class="col-md-push-1 col-md-10 darker order_order" id="form">
<h4>Order:</h4> <h4>Order:</h4>
<form method="post" action="{{ url_for('order_bp.order_item_create', order_id=order.id) }}"> <form method="post" action="{{ url_for('order_bp.order_item_create', order_id=order.id) }}">
<span class="pull-right"> <span class="pull-right">
<a class="btn btn-primary" onclick="chooseRandom()">Choose for me</a> <a class="btn btn-primary" onclick="chooseRandom()">Choose for me</a>
</span> </span>
{{ form.csrf_token }} {{ form.csrf_token }}
<div class="form-group select2-container select2 {{ 'has-errors' if form.dish_id.errors}}"> <div class="form-group select2-container select2 {{ 'has-errors' if form.dish_id.errors}}">
{{ form.dish_id.label(class='control-label') }}<br> {{ form.dish_id.label(class='control-label') }}<br>
{{ form.dish_id(class='form-control select') }} {{ form.dish_id(class='form-control select') }}
{{ util.render_form_field_errors(form.dish_id) }} {{ util.render_form_field_errors(form.dish_id) }}
</div> </div>
<input type="hidden" name="form_for_dish" value="{{ dish.id }}" /> {% if dish and dish.choices %}
{% if dish and dish.choices %} <input type="hidden" name="form_for_dish" value="{{ dish.id }}" />
{% for (choice_type, choice) in dish.choices %} {% for (choice_type, choice) in dish.choices %}
<div class="form-group select2-container select2"> <div class="form-group select2-container select2">
<label class="control-label" for="choice_{{ choice.id }}">{{ choice.name }}</label><br/> <label class="control-label" for="choice_{{ choice.id }}">{{ choice.name }}</label><br/>
<select <select
{{ "multiple=multiple" if choice_type=="multi_choice" else "required=required" }} {{ "multiple=multiple" if choice_type=="multi_choice" else "required=required" }}
name="choice_{{ choice.id }}" name="choice_{{ choice.id }}"
class="form-control select"> class="form-control select">
{% for option in choice.options %} {% for option in choice.options %}
<option value="{{ option.id }}"><!-- <option value="{{ option.id }}"><!--
-->{{ option.name }}{{ ": " + option.price|euro if option.price else "" }}<!-- -->{{ option.name }}{{ ": " + option.price|euro if option.price else "" }}<!--
-->{{ " (" + option.description + ")" if option.description else "" }}<!-- -->{{ " (" + option.description + ")" if option.description else "" }}<!--
--></option> --></option>
{% endfor %} {% endfor %}
</select> </select>
</div> </div>
{% endfor %} {% endfor %}
{% endif %} {% endif %}
<div class="form-group {{ 'has-errors' if form.dish_id.errors }}"> <div class="form-group {{ 'has-errors' if form.dish_id.errors }}">
{{ form.comment.label(class='control-label') }}<br> {{ form.comment.label(class='control-label') }}<br>
{{ form.comment(class='form-control', placeholder='Fill in comment, when applicable') }} {{ form.comment(class='form-control', placeholder='Fill in comment, when applicable') }}
{{ util.render_form_field_errors(form.comment) }} {{ util.render_form_field_errors(form.comment) }}
</div> </div>
{% if current_user.is_anonymous() %} {% if current_user.is_anonymous() %}
<div class="form-group{{ ' has-error' if form.user_name.errors }}{{ ' required' if form.user_name.flags.required }}"> <div class="form-group{{ ' has-error' if form.user_name.errors }}{{ ' required' if form.user_name.flags.required }}">
{{ form.user_name.label(class='control-label') }} {{ form.user_name.label(class='control-label') }}
{{ form.user_name(class='form-control', placeholder='Fill in your name...') }} {{ form.user_name(class='form-control', placeholder='Fill in your name...') }}
{{ util.render_form_field_errors(form.user_name) }} {{ util.render_form_field_errors(form.user_name) }}
</div> </div>
{% endif %} {% endif %}
<div class="form-group" style="padding-top: 8px;"> <div class="form-group" style="padding-top: 8px;">
{{ form.submit_button(class='btn btn-primary') }} {{ form.submit_button(class='btn btn-primary') }}
{% if not dish %} {% if not dish %}
<div id="submit-reveals-options-msg">If the chosen dish has options, they will be shown when you press submit, before adding the item to the order.</div> <div id="submit-reveals-options-msg">If the chosen dish has options, they will be shown when you press submit, before adding the item to the order.</div>
{% endif %} {% endif %}
</div> </div>
</form> </form>
</div> </div>
{%- endif %} {%- endif %}
</div> </div>
<div class="row" id="items"> <div class="row" id="items">
<div class="col-md-push-1 col-md-5 darker order_items" id="items-list"> <div class="col-md-push-1 col-md-5 darker order_items" id="items-list">
<h3>Items</h3> <h3>Items</h3>
<table class="table table-hover table-condensed"> <table class="table table-hover table-condensed">
<thead> <thead>
<tr><th>Name</th><th>Item</th><th>Price</th>{% if courier_or_admin %}<th>Paid?</th>{% endif %}<th>Delete</th></tr> <tr><th>Name</th><th>Item</th><th>Price</th>{% if courier_or_admin %}<th>Paid?</th>{% endif %}<th>Delete</th></tr>
</thead> </thead>
<tbody> <tbody>
{% for item in order.items -%} {% for item in order.items -%}
<tr> <tr>
<td>{{ item.get_name() }}</td> <td>{{ item.get_name() }}</td>
<td><span title="{{ item.comment if item.comment }}">{{ item.dish_name }}{{ "*" if item.comment }}</span></td> <td><span title="{{ item.comment if item.comment }}">{{ item.dish_name }}{{ "*" if item.comment }}</span></td>
<td>{{ item.price|euro }}</td> <td>{{ item.price|euro }}</td>
{% if courier_or_admin %}<td>{% if not item.paid %} {% if courier_or_admin %}
<form action="{{ url_for('order_bp.item_paid', order_id=order.id, item_id=item.id) }}" method="post" style="display:inline"> <td>
<input type="submit" class="btn btn-xs btn-primary" value="Pay"></input> {% if not item.paid %}
</form> <form action="{{ url_for('order_bp.item_paid', order_id=order.id, item_id=item.id) }}" method="post" style="display:inline">
{% else %} <span class="glyphicon glyphicon-chevron-down"></span> <input type="submit" class="btn btn-xs btn-primary" value="Pay"></input>
{% endif %}</td> </form>
{% endif %} {% else %} <span class="glyphicon glyphicon-chevron-down"></span>
<td>{% if item.can_delete(order.id, current_user.id, session.get('anon_name', '')) -%} {% endif %}
<form action="{{ url_for('order_bp.delete_item', order_id=order.id, item_id=item.id) }}" method="post" style="display:inline"> </td>
<button class="btn btn-link" type="submit"><span class="glyphicon glyphicon-remove"></span></button> {% endif %}
</form> <td>
{%- endif %}<br/></td> {% if item.can_delete(order.id, current_user.id, session.get('anon_name', '')) -%}
</tr> <form action="{{ url_for('order_bp.delete_item', order_id=order.id, item_id=item.id) }}" method="post" style="display:inline">
{%- endfor %} <button class="btn btn-link" type="submit"><span class="glyphicon glyphicon-remove"></span></button>
</tbody> </form>
</table> {%- endif %}<br/></td>
</div> </tr>
<div class="col-md-push-2 col-md-4 darker box order_ordered" id="items-ordered"> {%- endfor %}
<h3>Ordered dishes: {{ order.items.count() }}</h3> </tbody>
<a class="divLink" href="{{ url_for('order_bp.items_showcase', order_id=order.id) }}"></a> </table>
{% for key, value in order.group_by_dish().items() -%} </div>
<div class="product"> <div class="col-md-push-2 col-md-4 darker box order_ordered" id="items-ordered">
{{ key }}: {{ value["count"] }} <h3>Ordered dishes: {{ order.items.count() }}</h3>
{% if value["comments"]|any -%} <a class="divLink" href="{{ url_for('order_bp.items_showcase', order_id=order.id) }}"></a>
<ul class="comments"> {% for key, value in order.group_by_dish().items() -%}
{% for comment in value["comments"] -%} <div class="product">
<li>{% if comment %}{{ comment }} {{ key }}: {{ value["count"] }}
{% else %}<i>No comment</i> {% if value["comments"]|any -%}
{% endif %}</li> <ul class="comments">
{% endfor %} {% for comment in value["comments"] -%}
</ul> <li>{% if comment %}{{ comment }}
{%- endif %} {% else %}<i>No comment</i>
</div> {% endif %}</li>
{%- endfor %} {% endfor %}
</div> </ul>
{%- endif %}
</div>
{%- endfor %}
</div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-push-1 col-md-5 darker order_depts" id="debts"> <div class="col-md-push-1 col-md-5 darker order_depts" id="debts">
<h3>Debts</h3> <h3>Debts</h3>
<table class="table table-hover table-condensed"> <table class="table table-hover table-condensed">
<thead> <thead>
<tr><th>Name</th><th>Total</th><th>To pay</th>{% if courier_or_admin %}<th>Paid?</th>{% endif %}</tr> <tr><th>Name</th><th>Total</th><th>To pay</th>{% if courier_or_admin %}<th>Paid?</th>{% endif %}</tr>
</thead> </thead>
<tbody> <tbody>
{% for key, value in order_items.items() -%} {% for key, value in order_items.items() -%}
<tr> <tr>
<td>{{ key }}</td> <td>{{ key }}</td>
<td>{{ value["total"]|euro }}</td> <td>{{ value["total"]|euro }}</td>
<td>{{ value["to_pay"]|euro }}</td> <td>{{ value["to_pay"]|euro }}</td>
{% if courier_or_admin %}<td>{% if not value["to_pay"] == 0 %} {% if courier_or_admin %}
<form action="{{ url_for('order_bp.items_user_paid', order_id=order.id, user_name=key) }}" method="post" style="display:inline"> <td>
<input type="submit" class="btn btn-xs btn-primary" value="Pay"></input> {% if not value["to_pay"] == 0 %}
</form> <form action="{{ url_for('order_bp.items_user_paid', order_id=order.id, user_name=key) }}" method="post" style="display:inline">
{% else %} <span class="glyphicon glyphicon-chevron-down"></span> {% endif %}</td>{% endif %} <input type="submit" class="btn btn-xs btn-primary" value="Pay"></input>
</tr> </form>
{%- endfor %} {% else %}
</tbody> <span class="glyphicon glyphicon-chevron-down"></span>
</table> {% endif %}
</div> </td>
{% endif %}
</tr>
{%- endfor %}
</tbody>
</table>
</div>
</div> </div>
{% endblock %} {% endblock %}
{% block styles %} {% block styles %}
{{ super() }} {{ super() }}
<link rel="stylesheet" href="{{ url_for('static', filename='css/select2.min.css') }}" /> <link rel="stylesheet" href="{{ url_for('static', filename='css/select2.min.css') }}" />
<link rel="stylesheet" href="{{ url_for('static', filename='css/select2-bootstrap.min.css') }}"> <link rel="stylesheet" href="{{ url_for('static', filename='css/select2-bootstrap.min.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/print.css') }}"> <link rel="stylesheet" href="{{ url_for('static', filename='css/print.css') }}">
{% endblock %} {% endblock %}
{% block scripts %} {% block scripts %}
{{ super() }} {{ super() }}
<script src="{{ url_for('static', filename='js/select2.min.js') }}"></script> <script src="{{ url_for('static', filename='js/select2.min.js') }}"></script>
<script type="text/javascript"> <script type="text/javascript">
var select = $('.select').select2({ var select = $('.select').select2({
'sorter': function(results) { 'sorter': function(results) {
return results.sort(); return results.sort();
} }
}); });
var options = select[0].options; var options = select[0].options;
function chooseRandom() { function chooseRandom() {
var index = Math.floor((Math.random() * options.length)) var index = Math.floor((Math.random() * options.length))
var choice = options[index] var choice = options[index]
select.val(choice.value).trigger("change") select.val(choice.value).trigger("change")
} }
</script> </script>
{% endblock %} {% endblock %}

View file

@ -5,76 +5,75 @@
{% import "utils.html" as util -%} {% import "utils.html" as util -%}
{% block container %} {% block container %}
<div class="row"> <div class="row">
{% if not current_user.is_anonymous() %} {% if not current_user.is_anonymous() %}
<div class="col-md-push-4 col-md-6"> <div class="col-md-push-4 col-md-6">
<h3>Edit order:</h3> <h3>Edit order:</h3>
<div class="row darker"> <div class="row darker">
<div class="col-sm-12"> <div class="col-sm-12">
<form method="post" action="{{ url_for('.order_edit', order_id=order_id) }}"> <form method="post" action="{{ url_for('.order_edit', order_id=order_id) }}">
{{ form.csrf_token }} {{ form.csrf_token }}
<div class="form-group select2 {{ 'has-errors' if form.courier_id.errors else ''}}"> <div class="form-group select2 {{ 'has-errors' if form.courier_id.errors else ''}}">
{{ form.courier_id.label(class='control-label') }}<br> {{ form.courier_id.label(class='control-label') }}<br>
{{ form.courier_id(class='form-control select') }} {{ form.courier_id(class='form-control select') }}
{{ util.render_form_field_errors(form.courier_id) }} {{ util.render_form_field_errors(form.courier_id) }}
</div> </div>
<div class="form-group select2 {{ 'has-errors' if form.location_id.errors else ''}}{{ ' required' if form.location_id.flags.required }}"> <div class="form-group select2 {{ 'has-errors' if form.location_id.errors else ''}}{{ ' required' if form.location_id.flags.required }}">
{{ form.location_id.label(class='control-label') }} {{ form.location_id.label(class='control-label') }}
{{ form.location_id(class='form-control select') }} {{ form.location_id(class='form-control select') }}
{{ util.render_form_field_errors(form.location_id) }} {{ util.render_form_field_errors(form.location_id) }}
</div> </div>
{% if current_user.is_admin() %} {% if current_user.is_admin() %}
<div class="form-group{{ ' has-error' if form.starttime.errors }}{{ ' required' if form.starttime.flags.required }}{{ ' hidden' if not current_user.is_admin() }}"> <div class="form-group{{ ' has-error' if form.starttime.errors }}{{ ' required' if form.starttime.flags.required }}{{ ' hidden' if not current_user.is_admin() }}">
{{ form.starttime.label(class='control-label') }} {{ form.starttime.label(class='control-label') }}
<div class='input-group date' class='datetimepicker'> <div class='input-group date' class='datetimepicker'>
{{ form.starttime(class='form-control datetimepicker') }} {{ form.starttime(class='form-control datetimepicker') }}
<span class="input-group-addon"> <span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span> <span class="glyphicon glyphicon-calendar"></span>
</span> </span>
</div> </div>
{{ util.render_form_field_errors(form.starttime) }} {{ util.render_form_field_errors(form.starttime) }}
</div> </div>
{% endif %} {% endif %}
<div class="form-group{{ ' has-error' if form.stoptime.errors }}{{ ' required' if form.stoptime.flags.required }}"> <div class="form-group{{ ' has-error' if form.stoptime.errors }}{{ ' required' if form.stoptime.flags.required }}">
{{ form.stoptime.label(class='control-label') }} {{ form.stoptime.label(class='control-label') }}
<div class='input-group date' class='datetimepicker'> <div class='input-group date' class='datetimepicker'>
{{ form.stoptime(class='form-control datetimepicker') }} {{ form.stoptime(class='form-control datetimepicker') }}
<span class="input-group-addon"> <span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span> <span class="glyphicon glyphicon-calendar"></span>
</span> </span>
</div> </div>
{{ util.render_form_field_errors(form.stoptime) }} {{ util.render_form_field_errors(form.stoptime) }}
</div> </div>
<div class="form-group"> <div class="form-group">
{{ form.submit_button(class='btn btn-primary') }} {{ form.submit_button(class='btn btn-primary') }}
</div> </div>
</form> </form>
</div> </div>
</div> </div>
</div> </div>
{% endif %} {% endif %}
</div> </div>
</div>
{% endblock %} {% endblock %}
{% block styles -%} {% block styles -%}
{{ super() }} {{ super() }}
<link rel="stylesheet" href="{{ url_for('static', filename='css/select2.min.css') }}" /> <link rel="stylesheet" href="{{ url_for('static', filename='css/select2.min.css') }}" />
<link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap-datetimepicker.min.css') }}" /> <link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap-datetimepicker.min.css') }}" />
<link rel="stylesheet" href="{{ url_for('static', filename='css/select2-bootstrap.min.css') }}" /> <link rel="stylesheet" href="{{ url_for('static', filename='css/select2-bootstrap.min.css') }}" />
{%- endblock %} {%- endblock %}
{% block scripts -%} {% block scripts -%}
{{ super() }} {{ super() }}
<script src="{{ url_for('static', filename='js/select2.min.js') }}"></script> <script src="{{ url_for('static', filename='js/select2.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/moment.min.js') }}"></script> <script src="{{ url_for('static', filename='js/moment.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/bootstrap-datetimepicker.min.js') }}"></script> <script src="{{ url_for('static', filename='js/bootstrap-datetimepicker.min.js') }}"></script>
<script type="text/javascript"> <script type="text/javascript">
$.ready(function(){ $.ready(function(){
$('.select').select2(); $('.select').select2();
$('.datetimepicker').datetimepicker({ $('.datetimepicker').datetimepicker({
format: 'DD-MM-YYYY HH:mm' format: 'DD-MM-YYYY HH:mm'
}); });
}()); }());
</script> </script>
{%- endblock %} {%- endblock %}

View file

@ -6,47 +6,47 @@ Haldis - Order {{ order.id }}
{% endblock %} {% endblock %}
{% block styles %} {% block styles %}
{{ super() }} {{ super() }}
<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}" media="screen"> <link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}" media="screen">
<link rel="stylesheet" href="/css" media="screen"> <link rel="stylesheet" href="/css" media="screen">
<link rel="stylesheet" href="{{ url_for('static', filename='css/print.css') }}" media="print"> <link rel="stylesheet" href="{{ url_for('static', filename='css/print.css') }}" media="print">
{% endblock %} {% endblock %}
{% block scripts %} {% block scripts %}
{{ super() }} {{ super() }}
<script async defer id="github-bjs" src="https://buttons.github.io/buttons.js"></script> <script async defer id="github-bjs" src="https://buttons.github.io/buttons.js"></script>
<script type="text/javascript" src="{{ url_for('static', filename='js/timer.js') }}"></script> <script type="text/javascript" src="{{ url_for('static', filename='js/timer.js') }}"></script>
{% endblock %} {% endblock %}
{% block content -%} {% block content -%}
{{ utils.flashed_messages(container=True) }} {{ utils.flashed_messages(container=True) }}
<div class="darker showcase" id="items-ordered"> <div class="darker showcase" id="items-ordered">
<h1>Haldis order {{ order.id }}</h1> <h1>Haldis order {{ order.id }}</h1>
{% if not order.is_closed() %} {% if not order.is_closed() %}
<div class="open-order-warning"> <div class="open-order-warning">
<span class="time">{{ order.stoptime|countdown }}</span><br/> <span class="time">{{ order.stoptime|countdown }}</span><br/>
Refresh page when closed! Refresh page when closed!
</div> </div>
{% endif %} {% endif %}
{% for key, value in order.group_by_dish().items() -%} {% for key, value in order.group_by_dish().items() -%}
<div class="dish"> <div class="dish">
<h2><span class="quantity">{{ value["count"] }}</span> × {{ key }}</h2> <h2><span class="quantity">{{ value["count"] }}</span> × {{ key }}</h2>
{% if value["comments"]|any -%} {% if value["comments"]|any -%}
<ul class="comments"> <ul class="comments">
{% for comment in value["comments"] -%} {% for comment in value["comments"] -%}
<li>{% if comment %}{{ comment }} <li>{% if comment %}{{ comment }}
{% else %}<i>No comment</i> {% else %}<i>No comment</i>
{% endif %}</li> {% endif %}</li>
{% endfor %} {% endfor %}
</ul> </ul>
{%- endif %} {%- endif %}
</p> </p>
</div> </div>
{%- endfor %} {%- endfor %}
<div class="total">Total {{ order.items.count() }} items — {{ total_price|euro }}</div> <div class="total">Total {{ order.items.count() }} items — {{ total_price|euro }}</div>
</div> </div>
{%- endblock %} {%- endblock %}

View file

@ -5,90 +5,89 @@
{% import "utils.html" as util -%} {% import "utils.html" as util -%}
{% block container %} {% block container %}
<div class="row orders"> <div class="row orders">
<div class="col-md-5"> <div class="col-md-5">
{% if orders|count > 0 -%} {% if orders|count > 0 -%}
<h3>Open orders:</h3> <h3>Open orders:</h3>
{% for order in orders %} {% for order in orders %}
{{ util.render_order(order) }} {{ util.render_order(order) }}
{% endfor %} {% endfor %}
{% else %} {% else %}
<h4>No orders available.</h4> <h4>No orders available.</h4>
{% if not current_user.is_anonymous() %} {% if not current_user.is_anonymous() %}
To create an order, fill in the form on the right. To create an order, fill in the form on the right.
{% else %} {% else %}
Login to create an order, or ask someone else. Login to create an order, or ask someone else.
{% endif %} {% endif %}
{%- endif %} {%- endif %}
</div> </div>
{% if not current_user.is_anonymous() %} {% if not current_user.is_anonymous() %}
<div class="col-md-push-1 col-md-6"> <div class="col-md-push-1 col-md-6">
<h3>Create new order:</h3> <h3>Create new order:</h3>
<div class="row darker"> <div class="row darker">
<div class="col-sm-12"> <div class="col-sm-12">
<form method="post" action="{{ url_for('order_bp.order_create') }}"> <form method="post" action="{{ url_for('order_bp.order_create') }}">
{{ form.csrf_token }} {{ form.csrf_token }}
<div class="form-group select2 {{ 'has-errors' if form.courier_id.errors else ''}}"> <div class="form-group select2 {{ 'has-errors' if form.courier_id.errors else ''}}">
{{ form.courier_id.label(class='control-label') }}<br> {{ form.courier_id.label(class='control-label') }}<br>
{{ form.courier_id(class='form-control select') }} {{ form.courier_id(class='form-control select') }}
{{ util.render_form_field_errors(form.courier_id) }} {{ util.render_form_field_errors(form.courier_id) }}
</div> </div>
<div class="form-group select2 {{ 'has-errors' if form.location_id.errors else ''}}{{ ' required' if form.location_id.flags.required }}"> <div class="form-group select2 {{ 'has-errors' if form.location_id.errors else ''}}{{ ' required' if form.location_id.flags.required }}">
{{ form.location_id.label(class='control-label') }} {{ form.location_id.label(class='control-label') }}
{{ form.location_id(class='form-control select') }} {{ form.location_id(class='form-control select') }}
{{ util.render_form_field_errors(form.location_id) }} {{ util.render_form_field_errors(form.location_id) }}
</div> </div>
{% if current_user.is_admin() %} {% if current_user.is_admin() %}
<div class="form-group{{ ' has-error' if form.starttime.errors }}{{ ' required' if form.starttime.flags.required }}{{ ' hidden' if not current_user.is_admin() }}"> <div class="form-group{{ ' has-error' if form.starttime.errors }}{{ ' required' if form.starttime.flags.required }}{{ ' hidden' if not current_user.is_admin() }}">
{{ form.starttime.label(class='control-label') }} {{ form.starttime.label(class='control-label') }}
<div class='input-group date' class='datetimepicker'> <div class='input-group date' class='datetimepicker'>
{{ form.starttime(class='form-control datetimepicker') }} {{ form.starttime(class='form-control datetimepicker') }}
<span class="input-group-addon"> <span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span> <span class="glyphicon glyphicon-calendar"></span>
</span> </span>
</div> </div>
{{ util.render_form_field_errors(form.starttime) }} {{ util.render_form_field_errors(form.starttime) }}
</div> </div>
{% endif %} {% endif %}
<div class="form-group{{ ' has-error' if form.stoptime.errors }}{{ ' required' if form.stoptime.flags.required }}"> <div class="form-group{{ ' has-error' if form.stoptime.errors }}{{ ' required' if form.stoptime.flags.required }}">
{{ form.stoptime.label(class='control-label') }} {{ form.stoptime.label(class='control-label') }}
<div class='input-group date' class='datetimepicker'> <div class='input-group date' class='datetimepicker'>
{{ form.stoptime(class='form-control datetimepicker') }} {{ form.stoptime(class='form-control datetimepicker') }}
<span class="input-group-addon"> <span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span> <span class="glyphicon glyphicon-calendar"></span>
</span> </span>
</div> </div>
{{ util.render_form_field_errors(form.stoptime) }} {{ util.render_form_field_errors(form.stoptime) }}
</div> </div>
<div class="form-group"> <div class="form-group">
{{ form.submit_button(class='btn btn-primary') }} {{ form.submit_button(class='btn btn-primary') }}
</div> </div>
</form> </form>
</div> </div>
</div> </div>
</div> </div>
{% endif %} {% endif %}
</div> </div>
</div>
{% endblock %} {% endblock %}
{% block styles -%} {% block styles -%}
{{ super() }} {{ super() }}
<link rel="stylesheet" href="{{ url_for('static', filename='css/select2.min.css') }}" /> <link rel="stylesheet" href="{{ url_for('static', filename='css/select2.min.css') }}" />
<link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap-datetimepicker.min.css') }}" /> <link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap-datetimepicker.min.css') }}" />
<link rel="stylesheet" href="{{ url_for('static', filename='css/select2-bootstrap.min.css') }}" /> <link rel="stylesheet" href="{{ url_for('static', filename='css/select2-bootstrap.min.css') }}" />
{%- endblock %} {%- endblock %}
{% block scripts -%} {% block scripts -%}
{{ super() }} {{ super() }}
<script src="{{ url_for('static', filename='js/select2.min.js') }}"></script> <script src="{{ url_for('static', filename='js/select2.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/moment.min.js') }}"></script> <script src="{{ url_for('static', filename='js/moment.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/bootstrap-datetimepicker.min.js') }}"></script> <script src="{{ url_for('static', filename='js/bootstrap-datetimepicker.min.js') }}"></script>
<script type="text/javascript"> <script type="text/javascript">
$.ready(function(){ $.ready(function(){
$('.select').select2(); $('.select').select2();
$('.datetimepicker').datetimepicker({ $('.datetimepicker').datetimepicker({
format: 'DD-MM-YYYY HH:mm' format: 'DD-MM-YYYY HH:mm'
}); });
}()); }());
</script> </script>
{%- endblock %} {%- endblock %}

View file

@ -2,17 +2,17 @@
{% set active_page = "profile" -%} {% set active_page = "profile" -%}
{% block container %} {% block container %}
<h1>{{ current_user.username }}</h1> <h1>{{ current_user.username }}</h1>
<h3>Themes</h3> <h3>Themes</h3>
<p><a class="changeThemeButton" id="customTheme">enable custom themes</a></p> <p><a class="changeThemeButton" id="customTheme">enable custom themes</a></p>
<p><a class="changePerformance" id="highPerformance">enable high performance</a></p> <p><a class="changePerformance" id="highPerformance">enable high performance</a></p>
<p> <p>
<!-- Style attribute due to missing css --> <!-- Style attribute due to missing css -->
<select name="themes" id="themes_select" onchange="changeTheme()" style="width: 300px;"> <select name="themes" id="themes_select" onchange="changeTheme()" style="width: 300px;">
<option disabled selected value> -- select a theme -- </option> <option disabled selected value> -- select a theme -- </option>
{% for theme in themes_list %} {% for theme in themes_list %}
<option value="{{ theme.optid }}">{{ theme }}</option> <option value="{{ theme.optid }}">{{ theme }}</option>
{% endfor %} {% endfor %}
</select> </select>
</p> </p>
{% endblock %} {% endblock %}

View file

@ -1,14 +1,14 @@
{% extends "layout.html" -%} {% extends "layout.html" -%}
{% set active_page = "stats" -%} {% set active_page = "stats" -%}
{% block container %} {% block container %}
<h2>Stats bruh</h2> <h2>Stats bruh</h2>
<div class="jumbotron"> <div class="jumbotron">
<h5> <h5>
Over Over
<strong>{{ data.amount.orders }}</strong> orders, <strong>{{ data.amount.orders }}</strong> orders,
<strong>{{ data.amount.users }}</strong> users have ordered <strong>{{ data.amount.users }}</strong> users have ordered
<strong>{{ data.amount.orderitems }}</strong> items in <strong>{{ data.amount.orderitems }}</strong> items in
<strong>{{ data.amount.locations }}</strong> locations. <strong>{{ data.amount.locations }}</strong> locations.
</h5> </h5>
</div> </div>
{% endblock %} {% endblock %}

View file

@ -1,25 +1,25 @@
{% macro render_order(order) -%} {% macro render_order(order) -%}
<div class="row darke order_row"> <div class="row darke order_row">
<div class="col-md-8 col-lg-9 order_data"> <div class="col-md-8 col-lg-9 order_data">
<h5>{{ order.location_name }}</h5> <h5>{{ order.location_name }}</h5>
<b class="amount_of_orders">{{ order.items.count() }} orders</b></p> <b class="amount_of_orders">{{ order.items.count() }} orders</b></p>
<p class="time_data"> <p class="time_data">
{% if order.stoptime %} {% if order.stoptime %}
<span><b>Closes </b>{{ order.stoptime.strftime("%H:%M") }}</span><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/> {% else %}open{% endif %}<br/>
</div> </div>
<div class="col-md-4 col-lg-3 expand_button_wrapper"> <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> <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>
</div> </div>
{%- endmacro %} {%- endmacro %}
{% macro render_form_field_errors(field) %} {% macro render_form_field_errors(field) %}
{%- if field.errors %} {%- if field.errors %}
{%- for error in field.errors %} {%- for error in field.errors %}
<p class="help-block">{{error}}</p> <p class="help-block">{{error}}</p>
{%- endfor %} {%- endfor %}
{%- elif field.description -%} {%- elif field.description -%}
<p class="help-block">{{field.description|safe}}</p> <p class="help-block">{{field.description|safe}}</p>
{%- endif %} {%- endif %}
{% endmacro %} {% endmacro %}

View file

@ -1,22 +1,22 @@
# Seasonal themes for Haldis # Seasonal themes for Haldis
- lightmode: - lightmode:
file: lightmode.css file: lightmode.css
type: default type: default
- darkmode: - darkmode:
file: darkmode.css file: darkmode.css
type: default type: default
- halloween: - halloween:
file: halloween.css file: halloween.css
type: static-date type: static-date
start: 21/10 start: 21/10
end: 10/11 end: 10/11
- sinterklaas: - sinterklaas:
file: sinterklaas.css file: sinterklaas.css
type: static-date type: static-date
start: 28/11 start: 28/11
end: 5/12 end: 5/12
- kerstmis: - kerstmis:
file: kerstmis.css file: kerstmis.css
type: static-date type: static-date
start: 6/12 start: 6/12
end: 06/01 end: 06/01

View file

@ -1,30 +1,30 @@
{ {
"comments": { "comments": {
// symbol used for single line comment. Remove this entry if your language does not support line comments // symbol used for single line comment. Remove this entry if your language does not support line comments
"lineComment": "//", "lineComment": "//",
// symbols used for start and end a block comment. Remove this entry if your language does not support block comments // symbols used for start and end a block comment. Remove this entry if your language does not support block comments
"blockComment": [ "=============================================", "=============================================" ] "blockComment": [ "=============================================", "=============================================" ]
}, },
// symbols used as brackets // symbols used as brackets
"brackets": [ "brackets": [
["{", "}"], ["{", "}"],
["[", "]"], ["[", "]"],
["(", ")"] ["(", ")"]
], ],
// symbols that are auto closed when typing // symbols that are auto closed when typing
"autoClosingPairs": [ "autoClosingPairs": [
["{", "}"], ["{", "}"],
["[", "]"], ["[", "]"],
["(", ")"], ["(", ")"],
["\"", "\""], ["\"", "\""],
["'", "'"] ["'", "'"]
], ],
// symbols that can be used to surround a selection // symbols that can be used to surround a selection
"surroundingPairs": [ "surroundingPairs": [
["{", "}"], ["{", "}"],
["[", "]"], ["[", "]"],
["(", ")"], ["(", ")"],
["\"", "\""], ["\"", "\""],
["'", "'"] ["'", "'"]
] ]
} }

View file

@ -1,31 +1,31 @@
{ {
"name": "hlds", "name": "hlds",
"publisher": "Silvius", "publisher": "Silvius",
"displayName": "Syntax highlighting for haldis (hlds) files.", "displayName": "Syntax highlighting for haldis (hlds) files.",
"description": "hlds", "description": "hlds",
"repository": "https://git.zeus.gent/midgard/haldis", "repository": "https://git.zeus.gent/midgard/haldis",
"version": "0.0.2", "version": "0.0.2",
"engines": { "engines": {
"vscode": "^1.30.0" "vscode": "^1.30.0"
}, },
"categories": [ "categories": [
"Programming Languages" "Programming Languages"
], ],
"contributes": { "contributes": {
"languages": [{ "languages": [{
"id": "hlds", "id": "hlds",
"aliases": ["HLDS", "hlds"], "aliases": ["HLDS", "hlds"],
"extensions": [".hlds"], "extensions": [".hlds"],
"configuration": "./language-configuration.json" "configuration": "./language-configuration.json"
}], }],
"grammars": [{ "grammars": [{
"language": "hlds", "language": "hlds",
"scopeName": "source.hlds", "scopeName": "source.hlds",
"path": "./syntaxes/hlds.tmLanguage.json" "path": "./syntaxes/hlds.tmLanguage.json"
}, { }, {
"path": "./syntaxes/injections.json", "path": "./syntaxes/injections.json",
"scopeName": "comment.injection", "scopeName": "comment.injection",
"injectTo": ["source.hlds"] "injectTo": ["source.hlds"]
}] }]
} }
} }

View file

@ -1,36 +1,36 @@
{ {
"scopeName": "comment.injection", "scopeName": "comment.injection",
"injectionSelector": "L:embedded.meta.tag", "injectionSelector": "L:embedded.meta.tag",
"patterns": [ "patterns": [
{ {
"include": "#comment" "include": "#comment"
}, },
{ {
"include": "#header" "include": "#header"
}, },
{ {
"include": "#links" "include": "#links"
}, },
{ {
"include": "#brackets" "include": "#brackets"
} }
], ],
"repository": { "repository": {
"comment": { "comment": {
"match": "#.*$", "match": "#.*$",
"name": "comment" "name": "comment"
}, },
"header": { "header": {
"match": "^[a-zA-Z0-9_].*$", "match": "^[a-zA-Z0-9_].*$",
"name": "keyword.todo" "name": "keyword.todo"
}, },
"links": { "links": {
"match": "^\\t[a-zA-Z0-9-_]*", "match": "^\\t[a-zA-Z0-9-_]*",
"name": "keyword.todo" "name": "keyword.todo"
}, },
"brackets": { "brackets": {
"match": "=", "match": "=",
"name": "variable.other" "name": "variable.other"
} }
} }
} }

View file

@ -9,8 +9,8 @@ B="\n${bold}"
E="${normal}" E="${normal}"
if [ ! -d "venv" ]; then if [ ! -d "venv" ]; then
echo -e "${B} No venv found, creating a new one ${E}" echo -e "${B} No venv found, creating a new one ${E}"
python3 -m venv venv python3 -m venv venv
fi fi
source venv/bin/activate source venv/bin/activate
@ -29,4 +29,4 @@ cd ..
echo -e "${B} Seeding database ${E}" echo -e "${B} Seeding database ${E}"
./populate-db.sh ./populate-db.sh
echo -e "${B} Activate your venv using 'source venv/bin/activate'.\nThen run the server with 'python app/app.py runserver' ${E}" echo -e "${B} Activate your venv using 'source venv/bin/activate'.\nThen run the server with 'python app/app.py runserver' ${E}"