Display category children & Add calendar stats

This commit is contained in:
2021-04-30 14:48:42 +02:00
parent e8e8f535c2
commit c3870bcded
22 changed files with 759 additions and 338 deletions

View File

@ -28,21 +28,40 @@ a:hover {
}
ul.striped_list {
max-width: 40em;
max-width: 40rem;
list-style-type: none;
margin: auto;
padding: 0;
}
ul.striped_list > li:nth-of-type(odd) {
background-color: #3f4a53;
}
ul.striped_list > li:nth-child(even) { background-color:#302f3b }
ul.striped_list > li:nth-child(odd) { background-color:#3f4a53 }
ul.striped_list > li:nth-child(even) ul li:nth-child(even) { background-color:#302f3b }
ul.striped_list > li:nth-child(even) ul li:nth-child(odd) { background-color:#3f4a53 }
ul.striped_list > li:nth-child(odd) ul li:nth-child(even) { background-color:#3f4a53 }
ul.striped_list > li:nth-child(odd) ul li:nth-child(odd) { background-color:#302f3b;}
.category_entry {
}
.category_header {
display: flex;
flex-direction: row;
}
.category_children {
display: flex;
flex-direction: column;
margin-left: 2.5em !important;
border-left: groove 1em;
border-top: groove 1em;
border-bottom: dotted;
border-color: #696969;
font-size: 0.8em;
}
.category_name {
font-size: 3em;
margin: auto;
@ -70,11 +89,11 @@ ul.striped_list > li:nth-of-type(odd) {
}
.category_button_container {
margin: 0.1em;
margin: 0.1rem;
background-color: #a4829c;
border-radius: 3.5em;
width: 7em;
height: 7em;
border-radius: 3.5rem;
width: 7rem;
height: 7rem;
}
.category_button {
@ -131,3 +150,43 @@ ul.striped_list > li:nth-of-type(odd) {
background-color: #aaaaaa;
margin: auto;
}
.tooltip {
position: relative;
display: inline-block;
border-bottom: 1px dotted black;
}
.tooltip .tooltiptext {
visibility: hidden;
width: 120px;
background-color: #000;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;
position: absolute;
z-index: 1;
bottom: 110%;
left: 50%;
margin-left: -60px;
opacity: 0;
transition: opacity 0.3s;
}
.tooltip .tooltiptext::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #000 transparent transparent transparent;
}
.tooltip:hover .tooltiptext {
visibility: visible;
opacity: 1;
}