cccb-website-team/www
1
1
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

improved calendar and fixed url temporarily

Browse source
This commit is contained in:
Marek Krug 2025-03-12 16:06:29 +01:00
parent 4a60651ce7
commit 4068fab565
9 changed files with 610 additions and 608 deletions
Download patch file Download diff file Expand all files Collapse all files

113
assets/css/calendar.css Normal file
View file

@ -0,0 +1,113 @@
.calendar-container {
display: flex;
flex-wrap: wrap;
width: 100%;
gap: 20px;
}
#calendar {
flex: 1;
min-width: 300px;
}
#event-panel {
flex: 1;
min-width: 30%;
background-color: var(--color-bg-secondary);
padding: 15px;
border-radius: 5px;
min-height: 300px;
display: none;
}
#calendar-controls {
text-align: center;
margin-bottom: 10px;
display: flex;
justify-content: space-between;
align-items: center;
}
#calendar-controls button {
background: none;
border: none;
font-size: 2em;
cursor: pointer;
padding: 5px 15px;
}
#calendar-table {
width: 100%;
border-collapse: collapse;
}
#calendar-table th, #calendar-table td {
border: 1px;
padding: 5px;
text-align: center;
vertical-align: top;
height: 50px;
width: 15%;
}
#calendar-table th
#calendar-table td {
position: relative;
cursor: pointer;
}
#calendar-table td:hover {
background-color: rgba(255, 255, 255, 0.2);
box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
}
.event-dot-greenyellow {
height: 8px;
width: 8px;
background-color: #9acd32;
border-radius: 50%;
display: block;
margin: 5px auto 0;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}
.event-dot-orange {
height: 8px;
width: 8px;
background-color: #ffa500;
border-radius: 50%;
display: block;
margin: 5px auto 0;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}
.event-dot-red {
height: 8px;
width: 8px;
background-color: #ff4500;
border-radius: 50%;
display: block;
margin: 5px auto 0;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}
.selected-day {
background-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
border-radius: 8px;
width: 20px;
height: 20px;
border: 5px solid grey;
font-weight: lighter;
position: relative;
z-index: 1;
}
#event-date {
font-size: 1.2em;
margin-bottom: 15px;
}
.event-item {
margin-bottom: 15px;
padding-bottom: 15px;
border-bottom: 1px solid var(--color-border);
}
.event-title {
font-weight: bold;
margin-bottom: 5px;
}
.event-time, .event-description {
font-size: 0.9em;
margin-bottom: 5px;
}
.no-events {
font-style: italic;
color: var(--color-text-secondary);
}