Moved css to general.css, first step in theming

This commit is contained in:
Andreas Kristiansen
2024-12-06 11:16:01 +01:00
parent 82affc4646
commit 69f91eeeff
3 changed files with 79 additions and 79 deletions

View File

@@ -74,7 +74,6 @@
</div>
<div class="tab-pane fade" id="punchcard" role="tabpanel" aria-labelledby="punchcard-tab">
<link rel="stylesheet" href="<?php echo base_url();?>assets/css/glanceyear.css">
<br/>
<select class="form-select form-select-sm me-2 w-auto" id="yr" name="yr">
<?php

View File

@@ -1087,3 +1087,82 @@ label {
display: block !important;
}
}
/* ============ Glanceyear ============ */
.glanceyear-container {
border: 1px solid #D8D8D8;
border-radius: 5px;
max-width: 683px;
}
.glanceyear-header {
position: relative;
background-color: #F5F5F5;
border-bottom: 1px solid #D8D8D8;
border-radius: 5px 5px 0 0;
color: #000;
font-size: 15px;
font-weight: bold;
margin: 0;
padding: 7px 10px;
}
.glanceyear-quantity {
position: absolute;
right: 10px;
top: 10px;
color:#aaa;
font-size: 10px;
}
.glanceyear-content { padding: 10px; }
.glanceyear-text {
color: #aaa;
font-size: 12px;
font-weight: normal;
margin: 0 0;
padding: 0;
}
.glanceyear-summary { color: #aaa; font-size: 12px; margin: 0 10px 10px; }
.glanceyear-legend {
color: #aaa;
float: right;
font-size: 12px;
text-align: middle;
text-wrap: none;
}
.glanceyear-legend span { display: inline-block; height: 10px; width: 10px; }
svg rect.day { fill: #eee; shape-rendering: crispedges; }
svg rect.day:hover { stroke: #aaa; stroke-width: 1px; }
svg rect.day[data-col] { fill: #3d9692; }
svg rect.day[data-col='1'] { fill: #c3dbda; }
svg rect.day[data-col='3'] { fill: #5caeaa; }
svg rect.day[data-col='6'] { fill: #277672; }
svg rect.day[data-col='12'] { fill: #176662; }
svg rect.day[data-col='24'] { fill: #075652; }
svg rect.day[data-col='48'] { fill: #004642; }
svg text { fill: #CCC; font-size: 9px; }
svg text.month { fill: #AAA; }
.svg-tag {
background-color: rgba(0,0,0,0.8);
border-radius: 3px;
color: #eee;
font-size: 12px;
line-height: 15px;
padding: 5px 15px;
position: absolute;
text-align: center;
}
.svg-tag:after {
border-color: rgba(0,0,0,0.8) transparent transparent transparent;
border-style: solid;
border-width: 5px 5px 0 5px;
bottom: -5px;
content: "";
height: 0;
left: 50%;
margin-left: -5px;
position: absolute;
width: 0;
}

View File

@@ -1,78 +0,0 @@
body { font-family: Arial, serif; }
.glanceyear-container {
border: 1px solid #D8D8D8;
border-radius: 5px;
max-width: 683px;
}
.glanceyear-header {
position: relative;
background-color: #F5F5F5;
border-bottom: 1px solid #D8D8D8;
border-radius: 5px 5px 0 0;
color: #000;
font-size: 15px;
font-weight: bold;
margin: 0;
padding: 7px 10px;
}
.glanceyear-quantity {
position: absolute;
right: 10px;
top: 10px;
color:#aaa;
font-size: 10px;
}
.glanceyear-content { padding: 10px; }
.glanceyear-text {
color: #aaa;
font-size: 12px;
font-weight: normal;
margin: 0 0;
padding: 0;
}
.glanceyear-summary { color: #aaa; font-size: 12px; margin: 0 10px 10px; }
.glanceyear-legend {
color: #aaa;
float: right;
font-size: 12px;
text-align: middle;
text-wrap: none;
}
.glanceyear-legend span { display: inline-block; height: 10px; width: 10px; }
svg rect.day { fill: #eee; shape-rendering: crispedges; }
svg rect.day:hover { stroke: #aaa; stroke-width: 1px; }
svg rect.day[data-col] { fill: #3d9692; }
svg rect.day[data-col='1'] { fill: #c3dbda; }
svg rect.day[data-col='3'] { fill: #5caeaa; }
svg rect.day[data-col='6'] { fill: #277672; }
svg rect.day[data-col='12'] { fill: #176662; }
svg rect.day[data-col='24'] { fill: #075652; }
svg rect.day[data-col='48'] { fill: #004642; }
svg text { fill: #CCC; font-size: 9px; }
svg text.month { fill: #AAA; }
.svg-tag {
background-color: rgba(0,0,0,0.8);
border-radius: 3px;
color: #eee;
font-size: 12px;
line-height: 15px;
padding: 5px 15px;
position: absolute;
text-align: center;
}
.svg-tag:after {
border-color: rgba(0,0,0,0.8) transparent transparent transparent;
border-style: solid;
border-width: 5px 5px 0 5px;
bottom: -5px;
content: "";
height: 0;
left: 50%;
margin-left: -5px;
position: absolute;
width: 0;
}