SoftwareEngineering/DualHub
4
1
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

Plan prep frontend

Browse Source
This commit is contained in:
Paul Martin
2023-12-12 23:43:29 +01:00
parent b302ce4d49
commit ae8b0206fc
3 changed files with 424 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

252
static/cal.css
View File

@ -1,7 +1,9 @@
:root {
--numDays: 5;
--numHours: 10;
--numHours: 13;
--numHalfHours: 23;
--timeHeight: 60px;
--halfTimeHeight: 30px;
--calBgColor: #fff1f8;
--eventBorderColor: #f2d3d8;
--eventColor1: #ffd6d1;
@ -17,9 +19,27 @@
margin: 2rem;
}
select {
width: 300px;
height: 40px;
border-radius: 5px;
border-color: transparent;
background-color: var(--eventColor4);
text-align: center;
}
form {
margin-top: 5px;
}
option {
width: 300px;
font-size: 1rem;
}
.timeline {
display: grid;
grid-template-rows: repeat(var(--numHours), var(--timeHeight));
grid-template-rows: repeat(12, 58px);
}
.days {
@ -31,50 +51,22 @@
.events {
display: grid;
grid-template-rows: repeat(var(--numHours), var(--timeHeight));
grid-template-rows: repeat(var(--numHalfHours), var(--halfTimeHeight));
border-radius: 5px;
background: var(--calBgColor);
}
.start-1000 {
grid-row-start: 2;
}
.start-1200 {
grid-row-start: 4;
}
.start-1300 {
grid-row-start: 5;
}
.start-1400 {
grid-row-start: 6;
}
.end-1200 {
grid-row-end: 4;
}
.end-1300 {
grid-row-end: 5;
}
.end-1500 {
grid-row-end: 7;
}
.end-1600 {
grid-row-end: 8;
}
.end-1700 {
grid-row-end: 9;
}
.title {
font-weight: 600;
margin-bottom: 0.25rem;
margin-top: 0px;
margin-bottom: 0px;
}
.room,
.time {
display: block;
margin-top: 0px;
margin-bottom: 0px;
}
.event {
@ -87,7 +79,7 @@
.space,
.date {
height: 60px;
height: 100px;
}
body {
@ -111,7 +103,7 @@ body {
}
.date {
display: flex;
margin-bottom: 1em;
gap: 1em;
}
@ -127,4 +119,180 @@ body {
font-weight: 100;
}
.start-0730 {
grid-row-start: 2;
}
.start-0830 {
grid-row-start: 2;
}
.start-0900 {
grid-row-start: 3;
}
.start-0930 {
grid-row-start: 4;
}
.start-1000 {
grid-row-start: 5;
}
.start-1030 {
grid-row-start: 6;
}
.start-1100 {
grid-row-start: 7;
}
.start-1130 {
grid-row-start: 8;
}
.start-1200 {
grid-row-start: 9;
}
.start-1230 {
grid-row-start: 10;
}
.start-1300 {
grid-row-start: 11;
}
.start-1330 {
grid-row-start: 12;
}
.start-1400 {
grid-row-start: 13;
}
.start-1430 {
grid-row-start: 14;
}
.start-1500 {
grid-row-start: 15;
}
.start-1530 {
grid-row-start: 16;
}
.start-1600 {
grid-row-start: 17;
}
.start-1630 {
grid-row-start: 18;
}
.start-1700 {
grid-row-start: 19;
}
.start-1730 {
grid-row-start: 20;
}
.start-1800 {
grid-row-start: 21;
}
.start-1830 {
grid-row-start: 22;
}
.end-0830 {
grid-row-end: 2;
}
.end-0900 {
grid-row-end: 3;
}
.end-0930 {
grid-row-end: 4;
}
.end-1000 {
grid-row-end: 5;
}
.end-1030 {
grid-row-end: 6;
}
.end-1100 {
grid-row-end: 7;
}
.end-1130 {
grid-row-end: 8;
}
.end-1200 {
grid-row-end: 9;
}
.end-1230 {
grid-row-end: 10;
}
.end-1300 {
grid-row-end: 11;
}
.end-1330 {
grid-row-end: 12;
}
.end-1400 {
grid-row-end: 13;
}
.end-1430 {
grid-row-end: 14;
}
.end-1500 {
grid-row-end: 15;
}
.end-1530 {
grid-row-end: 16;
}
.end-1600 {
grid-row-end: 17;
}
.end-1630 {
grid-row-end: 18;
}
.end-1700 {
grid-row-end: 19;
}
.end-1730 {
grid-row-end: 20;
}
.end-1800 {
grid-row-end: 21;
}
.end-1830 {
grid-row-end: 22;
}
.end-1900 {
grid-row-end: 23;
}
/*# sourceMappingURL=cal.css.map */

2
static/cal.css.map
View File

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["cal.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAIF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAKF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;;;AAKF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA","file":"cal.css"}
{"version":3,"sourceRoot":"","sources":["cal.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;;;AAMF;EACE;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;;;AAKF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAMF;EACE;;;AAGF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAMF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE","file":"cal.css"}

256
static/cal.scss
View File

@ -1,7 +1,9 @@
:root {
--numDays: 5;
--numHours: 10;
--numHours: 13;
--numHalfHours: 23;
--timeHeight: 60px;
--halfTimeHeight: 30px;
--calBgColor: #fff1f8;
--eventBorderColor: #f2d3d8;
--eventColor1: #ffd6d1;
@ -17,9 +19,27 @@
margin: 2rem;
}
select {
width: 300px;
height: 40px;
border-radius: 5px;
border-color: transparent;
background-color: var(--eventColor4);
text-align: center;
}
form {
margin-top: 5px;
}
option {
width: 300px;
font-size: 1rem;
}
.timeline {
display: grid;
grid-template-rows: repeat(var(--numHours), var(--timeHeight));
grid-template-rows: repeat(12, 58px);
}
.days {
@ -28,56 +48,27 @@
gap: 5px;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}
.events {
display: grid;
grid-template-rows: repeat(var(--numHours), var(--timeHeight));
grid-template-rows: repeat(var(--numHalfHours), var(--halfTimeHeight));
border-radius: 5px;
background: var(--calBgColor);
}
// Place on Timeline
.start-1000 {
grid-row-start: 2;
}
.start-1200 {
grid-row-start: 4;
}
.start-1300 {
grid-row-start: 5;
}
.start-1400 {
grid-row-start: 6;
}
.end-1200 {
grid-row-end: 4;
}
.end-1300 {
grid-row-end: 5;
}
.end-1500 {
grid-row-end: 7;
}
.end-1600 {
grid-row-end: 8;
}
.end-1700 {
grid-row-end: 9;
}
// Events
.title {
font-weight: 600;
margin-bottom: 0.25rem;
margin-top: 0px;
margin-bottom: 0px;
}
.room,
.time {
display: block;
margin-top: 0px;
margin-bottom: 0px;
}
.event {
@ -90,7 +81,7 @@
.space,
.date {
height: 60px
height: 100px
}
// Global / Etc
@ -116,7 +107,7 @@ body {
}
.date {
display: flex;
margin-bottom: 1em;
gap: 1em;
}
@ -130,4 +121,183 @@ body {
display: inline;
font-size: 3rem;
font-weight: 100;
}
// Place on Timeline
// STARTS
.start-0730 {
grid-row-start: 2;
}
.start-0830 {
grid-row-start: 2;
}
.start-0900 {
grid-row-start: 3;
}
.start-0930 {
grid-row-start: 4;
}
.start-1000 {
grid-row-start: 5;
}
.start-1030 {
grid-row-start: 6;
}
.start-1100 {
grid-row-start: 7;
}
.start-1130 {
grid-row-start: 8;
}
.start-1200 {
grid-row-start: 9;
}
.start-1230 {
grid-row-start: 10;
}
.start-1300 {
grid-row-start: 11;
}
.start-1330 {
grid-row-start: 12;
}
.start-1400 {
grid-row-start: 13;
}
.start-1430 {
grid-row-start: 14;
}
.start-1500 {
grid-row-start: 15;
}
.start-1530 {
grid-row-start: 16;
}
.start-1600 {
grid-row-start: 17;
}
.start-1630 {
grid-row-start: 18;
}
.start-1700 {
grid-row-start: 19;
}
.start-1730 {
grid-row-start: 20;
}
.start-1800 {
grid-row-start: 21;
}
.start-1830 {
grid-row-start: 22;
}
// ENDS
.end-0830 {
grid-row-end: 2;
}
.end-0900 {
grid-row-end: 3;
}
.end-0930 {
grid-row-end: 4;
}
.end-1000 {
grid-row-end: 5;
}
.end-1030 {
grid-row-end: 6;
}
.end-1100 {
grid-row-end: 7;
}
.end-1130 {
grid-row-end: 8;
}
.end-1200 {
grid-row-end: 9;
}
.end-1230 {
grid-row-end: 10;
}
.end-1300 {
grid-row-end: 11;
}
.end-1330 {
grid-row-end: 12;
}
.end-1400 {
grid-row-end: 13;
}
.end-1430 {
grid-row-end: 14;
}
.end-1500 {
grid-row-end: 15;
}
.end-1530 {
grid-row-end: 16;
}
.end-1600 {
grid-row-end: 17;
}
.end-1630 {
grid-row-end: 18;
}
.end-1700 {
grid-row-end: 19;
}
.end-1730 {
grid-row-end: 20;
}
.end-1800 {
grid-row-end: 21;
}
.end-1830 {
grid-row-end: 22;
}
.end-1900 {
grid-row-end: 23;
}