many improvements + restructure

2022-02-21 13:53:13 +00:00
parent cbe99ea3d8
commit 0c795e518b
17 changed files with 653 additions and 1927 deletions
@@ -0,0 +1,227 @@
+html {
+
+    /* color: red; */
+}
+
+table {
+    /* margin-top: 50px; */
+    padding-top: 100px;
+    text-align: center;
+    /* table-layout : fixed; */
+    /* width:150px */
+    /* width: 200%; */
+    /* overflow-x: auto;
+    display: block;
+    position: relative; */
+    border-collapse: separate;
+    border-spacing: 0;
+
+}
+
+.table-div {
+    /* overflow-x: auto; */
+    width: 80%;
+    overflow-x: scroll;
+    margin-left: 200px;
+    overflow-y: visible;
+    padding: 0;
+}
+
+.table-div th {
+    text-align: center;
+    white-space: nowrap;
+    transform: rotate(90deg) translateX(-100px);
+    position: sticky;
+    top: 0;
+
+}
+
+.table-div th p {
+    margin: 0 -100%;
+    display: inline-block;
+}
+
+.table-div th p:before {
+    content: '';
+    width: 0;
+    padding-top: 110%;
+    /* takes width as reference, + 10% for faking some extra padding */
+    display: inline-block;
+    vertical-align: middle;
+}
+
+.table-div td,
+th {
+    max-width: 10px;
+    padding: 0px;
+}
+
+.table-div tr {
+    padding: 0px;
+}
+
+.table-div tr:hover {
+    background-color: lightblue;
+}
+
+.table-div tr:hover .unavailable {
+
+    background-color: lightgray;
+}
+
+.Sat {
+    /* opacity: 30%; */
+    /* background-color: lightsteelblue; */
+    border-left: solid 1px lightsteelblue;
+}
+
+.Sun {
+    border-right: solid 1px lightsteelblue;
+
+}
+
+.bank-holiday {
+    border-bottom: dotted 1px blue;
+
+}
+
+/* th.worker {
+    max-width: 100%;
+    width: 200px;
+} */
+
+.plymouth {
+    color: #9169FF;
+}
+
+.exeter {
+    color: #5F60E8;
+}
+
+.truro {
+    color: #0074D9;
+}
+
+.torquay {
+    color: #5FA8E8;
+}
+
+.unavailable {
+    color: lightgray;
+}
+
+.shift-requested {
+    color: green;
+}
+
+.worker-summary {
+    position: absolute;
+    display: none;
+    overflow-x: visible;
+    width: 100%;
+    text-align: left;
+}
+
+.site-summary {
+    display: inline-flex;
+}
+
+.site-summary .site {
+    border: 1px solid black;
+    padding: 5px;
+    margin: 20px;
+}
+
+.site-name {
+    font-weight: bold;
+}
+
+.worker-summary span {
+    min-width: 160px;
+    display: inline-flex;
+}
+
+.training-days-lost {
+    padding-top: 5px;
+}
+
+.tdl-settings {
+    padding: 2px;
+}
+
+.table-div+pre {
+    display: none;
+}
+
+.shift-breakdown-button+pre {
+    display: none;
+}
+
+.shift-breakdown-button {
+    display: block;
+}
+
+.nwd {
+    color: brown;
+}
+
+.th {}
+
+.table-div th.worker,
+td.worker {
+    position: absolute;
+    width: 200px;
+    max-width: 200px;
+    left: 0;
+    top: auto;
+    border-top-width: 1px;
+    /*only relevant for first row*/
+    margin-top: -1px;
+    /*compensate for top border*/
+}
+
+.hidden {
+    opacity: 0%;
+}
+
+.tsummary {
+    max-width: auto;
+}
+
+.header th {
+    max-width: 200px;
+
+}
+
+[data-night-at-derriford="0"] {
+    border: 1px dotted orange;
+    /* Attribute has this exact value */
+}
+
+th.site-title {
+    transform: unset;
+}
+
+.name {
+    max-width: 90px;
+    display: inline-flex;
+    white-space: nowrap;
+    overflow: hidden;
+    /*text-overflow: ellipsis;*/
+}
+
+.shift-highlight {
+    background-color: palegreen;
+}
+
+.pair-match {
+    background-color: red;
+}
+
+summary h2 {
+    display: inline;
+}
+
+.derriford-night.shift-highlight {
+    background-color: yellow;
+}