tsc-vfl/hugo-page
3
0
Fork 1
Code Issues 7 Pull Requests Actions Packages Projects 1 Releases 2 Wiki Activity

Clean up code a bit and remove old implementation

Browse Source
This commit is contained in:
Christian Wolf
2025-01-20 09:08:41 +01:00
parent 9f8f8a96df
commit 9d21f14959
4 changed files with 32 additions and 291 deletions
Download Patch File Download Diff File Expand all files Collapse all files

203
themes/tsc_vfl/assets/css/_schedule.scss
View File

@@ -1,16 +1,19 @@
@use './responsive.scss' as r;
@use './colors.scss' as *;
$calendar-height-row: 60px;
.calendar-schedule {
$calendar-height-row: 60px;
$border-style: solid lightgray 1px;
display: grid;
font-size: xx-small;
@include r.media-large {
& {
font-size: x-small;
font-size: small;
}
}
@@ -18,7 +21,9 @@ $calendar-height-row: 60px;
display: contents;
font-weight: bold;
div {
justify-self: center;
width: 100%;
text-align: center;
box-sizing: border-box;
}
.rooms {
display: flex;
@@ -29,24 +34,31 @@ $calendar-height-row: 60px;
text-align: center;
}
}
}
.times {
display: contents;
div {
height: 60px;
.main-column {
border-right: $border-style;
}
}
.table-row {
height: $calendar-height-row;
box-sizing: border-box;
border-top: solid lightgray 1px;
border-top: $border-style;
}
.times-left {
border-right: $border-style;
}
.times-left, .times-right{
width: 100%;
padding: 0 5px;
}
.main-entry {
position: relative;
border-right: $border-style;
.event {
position: absolute;
z-index: 1;
@@ -55,62 +67,8 @@ $calendar-height-row: 60px;
height: calc($calendar-height-row * var(--duration) / 60.0);
width: 30%;
box-sizing: border-box;
padding: 1px 0;
// overflow: hidden;
--fg-color: black;
&.room-vorne {
--bg-color: var(--color-vhvorne);
left: 2.5%;
}
&.room-mitte {
--bg-color: var(--color-vhmitte);
left: 35%
}
&.room-hinten {
--bg-color: var(--color-vhhinten);
--fg-color: white;
left: 67.5%;
}
div {
width: 100%;
height: 100%;
box-sizing: border-box;
padding: 3px;
border-radius: 4px;
color: var(--fg-color);
background-color: var(--bg-color);
}
}
}
.cal-main-content {
grid-row: 3 / 100;
position: relative;
&.day-0 {
grid-column: 2;
}
&.day-1 {
grid-column: 3;
}
&.day-2 {
grid-column: 4;
}
// grid-column: 2;
.event {
position: absolute;
width: 30%;
// height: 100%;
box-sizing: border-box;
padding: 1px 0;
overflow: hidden;
--fg-color: black;
@@ -139,131 +97,16 @@ $calendar-height-row: 60px;
color: var(--fg-color);
background-color: var(--bg-color);
}
}
}
}
.calendar-grid-2-days {
grid-template-columns: auto repeat(2, 1fr) auto;
.cal-main-content {
// grid-column-end: span 2;
}
}
.calendar-grid-3-days {
grid-template-columns: auto repeat(3, 1fr) auto;
.cal-main-content {
// grid-column-end: span 3;
}
}
// Legacy styling
.calendar-manual {
font-size: xx-small;
@include r.media-large {
font-size: small;
}
tr {
height: 20px;
&.first-min {
border-top: solid lightgray 1px;
}
&:nth-of-type(n) {
background-color: unset;
}
.time {
vertical-align: top;
}
.time:last-of-type, .first-col-of-room {
border-left: solid lightgray 1px;
}
.day-title {
text-align: center;
}
}
.calendar-block {
position: relative;
.calendar-block-entity {
position: absolute;
top: 0;
left: 0;
width: 100%;
padding: 1.5px;
box-sizing: border-box;
&.height-1 {
height: 20px;
}
&.height-2 {
height: 40px;
}
&.height-3 {
height: 60px;
}
&.height-4 {
height: 80px;
}
&.height-5 {
height: 100px;
}
&.height-6 {
height: 120px;
}
&.height-7 {
height: 140px;
}
&.height-8 {
height: 160px;
}
&.height-9 {
height: 180px;
}
&.height-10 {
height: 200px;
}
.room-block {
width: 100%;
height: 100%;
box-sizing: border-box;
padding: 3px;
overflow: hidden;
}
.room-vorne {
background-color: var(--color-vhvorne);
}
.room-mitte {
background-color: var(--color-vhmitte);
}
.room-hinten {
background-color: var(--color-vhhinten);
color: white;
}
}
}
}