|
|
@ -1,5 +1,4 @@
|
|
|
|
:root {
|
|
|
|
:root {
|
|
|
|
--alternate-row-color: #e8e8e8;
|
|
|
|
|
|
|
|
--body-margin: 8px; /* Default value in browsers */
|
|
|
|
--body-margin: 8px; /* Default value in browsers */
|
|
|
|
--max-font-size-unitless: 18;
|
|
|
|
--max-font-size-unitless: 18;
|
|
|
|
|
|
|
|
|
|
|
@ -36,8 +35,38 @@
|
|
|
|
--dynamic-columns-width: var(--expanded-dynamic-columns-width);
|
|
|
|
--dynamic-columns-width: var(--expanded-dynamic-columns-width);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
html {
|
|
|
|
|
|
|
|
--primary-color: hsl(0, 0%, 100%);
|
|
|
|
|
|
|
|
--secondary-color: hsl(0, 0%, 0%);
|
|
|
|
|
|
|
|
--secondary-color-heading: hsl(0, 0%, 17%);
|
|
|
|
|
|
|
|
--secondary-color-shaded: hsl(0, 0%, 9%);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
html.light-theme {
|
|
|
|
|
|
|
|
--primary-color: hsl(0, 0%, 0%);
|
|
|
|
|
|
|
|
--secondary-color: hsl(0, 0%, 100%);
|
|
|
|
|
|
|
|
--secondary-color-heading: hsl(0, 0%, 83%);
|
|
|
|
|
|
|
|
--secondary-color-shaded: hsl(0, 0%, 91%);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
a, .anchorstyle {
|
|
|
|
|
|
|
|
color: hsl(210, 100%, 60%);
|
|
|
|
|
|
|
|
text-decoration: underline;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
html.light-theme :is(a, .anchorstyle) {
|
|
|
|
|
|
|
|
color: hsl(210, 100%, 40%);
|
|
|
|
|
|
|
|
text-decoration: underline;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
*, *::after, *::before {
|
|
|
|
|
|
|
|
transition: color 3s, background-color 2s;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
html {
|
|
|
|
html {
|
|
|
|
font-size: clamp(10px, 2vw, var(--max-font-size-unitless) * 1px);
|
|
|
|
font-size: clamp(10px, 2vw, var(--max-font-size-unitless) * 1px);
|
|
|
|
|
|
|
|
color: var(--primary-color);
|
|
|
|
|
|
|
|
background-color: var(--secondary-color);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
body {
|
|
|
|
body {
|
|
|
@ -52,11 +81,6 @@ html.js .noscript, .hidden {
|
|
|
|
cursor: pointer;
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.anchorstyle {
|
|
|
|
|
|
|
|
color: rgb(0, 102, 204);
|
|
|
|
|
|
|
|
text-decoration: underline;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
html:not(.js) .js-only {
|
|
|
|
html:not(.js) .js-only {
|
|
|
|
display: none;
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
}
|
|
|
@ -70,6 +94,11 @@ header {
|
|
|
|
padding-inline: var(--body-margin);
|
|
|
|
padding-inline: var(--body-margin);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
#header-start, #header-end {
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
gap: 0.5em;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
#headline {
|
|
|
|
#headline {
|
|
|
|
text-align: center;
|
|
|
|
text-align: center;
|
|
|
|
flex-grow: 1;
|
|
|
|
flex-grow: 1;
|
|
|
@ -133,16 +162,21 @@ header {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
#tbl_communities th {
|
|
|
|
#tbl_communities th {
|
|
|
|
background-color: lightgray;
|
|
|
|
background-color: var(--secondary-color-heading);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
#tbl_communities tr {
|
|
|
|
|
|
|
|
background-color: var(--row-color);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
#tbl_communities tr:nth-child(even) {
|
|
|
|
#tbl_communities tr:nth-child(even) {
|
|
|
|
--row-color: white;
|
|
|
|
background-color: var(--secondary-color);
|
|
|
|
|
|
|
|
--row-color: var(--secondary-color);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
#tbl_communities tr:nth-child(odd) {
|
|
|
|
#tbl_communities tr:nth-child(odd) {
|
|
|
|
--row-color: var(--alternate-row-color);
|
|
|
|
background-color: var(--secondary-color-shaded);
|
|
|
|
background-color: var(--alternate-row-color);
|
|
|
|
--row-color: var(--secondary-color-shaded);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/* Particular columns */
|
|
|
|
/* Particular columns */
|
|
|
@ -228,9 +262,21 @@ header {
|
|
|
|
text-shadow: 0 0 0.5em #0003;
|
|
|
|
text-shadow: 0 0 0.5em #0003;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
a[href^="http:"] .protocol-indicator { background-color:lightgray }
|
|
|
|
a[href^="http:"] .protocol-indicator {
|
|
|
|
|
|
|
|
background-color: hsl(0, 0%, 17%);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
a[href^="https:"] .protocol-indicator { background-color:lightblue }
|
|
|
|
html.light-theme a[href^="http:"] .protocol-indicator {
|
|
|
|
|
|
|
|
background-color: hsl(0, 0%, 83%);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
a[href^="https:"] .protocol-indicator {
|
|
|
|
|
|
|
|
background-color: hsl(195, 53%, 21%);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
html.light-theme a[href^="https:"] .protocol-indicator {
|
|
|
|
|
|
|
|
background-color: hsl(195, 53%, 79%)
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
a[href^="http:"] .protocol-indicator::after {
|
|
|
|
a[href^="http:"] .protocol-indicator::after {
|
|
|
|
content: "HTTP";
|
|
|
|
content: "HTTP";
|
|
|
@ -317,7 +363,10 @@ a[href^="https:"] .protocol-indicator::after {
|
|
|
|
|
|
|
|
|
|
|
|
.copy_button {
|
|
|
|
.copy_button {
|
|
|
|
font-size: 1.1em;
|
|
|
|
font-size: 1.1em;
|
|
|
|
|
|
|
|
background-color: var(--secondary-color);
|
|
|
|
|
|
|
|
color: var(--primary-color);
|
|
|
|
padding: var(--cell-padding);
|
|
|
|
padding: var(--cell-padding);
|
|
|
|
|
|
|
|
border-radius: 10%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/* --- Footer --- */
|
|
|
|
/* --- Footer --- */
|
|
|
@ -361,9 +410,11 @@ label[for=toggle-show-room-ids]::after {
|
|
|
|
margin-right: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
width: 50%;
|
|
|
|
width: 50%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.qr-code-icon {
|
|
|
|
.qr-code-icon {
|
|
|
|
cursor: pointer;
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.qr-code-modal {
|
|
|
|
.qr-code-modal {
|
|
|
|
display: none; /* Hidden by default */
|
|
|
|
display: none; /* Hidden by default */
|
|
|
|
position: fixed; /* Stay in place */
|
|
|
|
position: fixed; /* Stay in place */
|