More updates

This commit is contained in:
2024-07-12 23:35:29 -04:00
parent c10125b41d
commit ef9b937d2e
36 changed files with 1311 additions and 12020 deletions

View File

@@ -1,47 +1,58 @@
/*
* Variables
*/
/* Core Code
This file is generates _core.scss using information in ../pg/_config.pug.
Please make your changes in your _config.pug file so that they are not
overwritten.
*/
@import url("https://fonts.googleapis.com/css2?family=Kalam:wght@300;400;700&display=swap");
:root {
--color-blue: #2e51a1;
--color-blue-l: #5c7abf;
--color-blue-xl: #b2c3ec;
--color-blue-d: #133176;
--color-blue-xd: #031235;
--color-oj: #f0b031;
--color-oj-l: #ffcc67;
--color-oj-xl: #ffe4ad;
--color-oj-d: #cb8906;
--color-oj-xd: #9d6900;
--color-raspberry: #da2c5b;
--color-raspberry-l: #ed5e85;
--color-raspberry-xl: #f9a4bb;
--color-raspberry-d: #9f0c34;
--color-raspberry-xd: #400011;
--color-lime: #cde92f;
--color-lime-l: #e2f963;
--color-lime-xl: #effca6;
--color-lime-d: #9bb40b;
--color-lime-xd: #607100;
--color-grey: #7f7f7f;
--color-grey-l: #b2b2b2;
--color-grey-xl: #d8d8d8;
--color-grey-xxl: #f0f0f0;
--color-white: #fff;
--color-page: #fff;
--color-light: #fff;
--color-grey-d: #4c4c4c;
--color-grey-xd: #4c4c4c;
--color-black: #000;
--color-dark: #000;
--color-error: #a00109;
--color-error-text: #fff;
--color-warn: #a38301;
--color-warn-text: #fff;
--color-notify: #599601;
--color-notify-text: #fff;
--color-info: #b2c3ec;
--color-info-text: #000;
--colour-blue: #2e51a1;
--colour-blue-l: #5c7abf;
--colour-blue-xl: #b2c3ec;
--colour-blue-d: #133176;
--colour-blue-xd: #031235;
--colour-grey: #7f7f7f;
--colour-grey-l: #b2b2b2;
--colour-grey-xl: #d8d8d8;
--colour-grey-xxl: #f0f0f0;
--colour-white: #fff;
--colour-page: #fff;
--colour-light: #fff;
--colour-grey-d: #4c4c4c;
--colour-grey-xd: #4c4c4c;
--colour-black: #000;
--colour-dark: #000;
}
h1[class^=status]::after, h2[class^=status]::after, span[class^=status]::after {
border-radius: 50%;
border: 1px solid #CCC;
content: " ";
display: inline-block;
height: 1.5rem;
margin-left: 0.5rem;
position: relative;
top: 2px;
width: 1.5rem;
}
.status-not-started::after {
background-color: transparent;
}
.status-in-progress::after {
background-color: #f0b031;
}
.status-complete::after {
background-color: #2e51a1;
}
.status-deprecated::after {
background-color: #da2c5b;
}
/* Position Options
@@ -65,32 +76,6 @@ html {
}
}
div.status-report p.heading, div.status-report td[colspan="2"] {
font-size: 1.125rem;
font-weight: bolder !important;
grid-column: 1/-1;
margin: 2rem 0 0.5rem 0;
padding-top: 1.5rem !important;
}
div.status-report td:not([colspan="2"]) span {
display: -ms-grid;
display: grid;
-ms-grid-columns: auto 1rem;
grid-template-columns: auto 1rem;
margin: 0 1rem 0 0;
}
div.status-report td:not([colspan="2"]) span span[class^=status]::after {
height: 1rem !important;
width: 1rem !important;
margin-right: 1rem;
}
div.status-report td:not([colspan="2"]) a {
margin: 0 1rem 0 0;
}
div.status-report td:not([colspan="2"]).indent a {
margin: 0 1rem 0 1.5rem;
}
#copystatus {
left: 50%;
position: absolute;
@@ -660,6 +645,32 @@ sticky-note-wrapper:has(sticky-note.green:hover) {
background-color: #bbfbc0;
}
div.status-report p.heading, div.status-report td[colspan="2"] {
font-size: 1.125rem;
font-weight: bolder !important;
grid-column: 1/-1;
margin: 2rem 0 0.5rem 0;
padding-top: 1.5rem !important;
}
div.status-report td:not([colspan="2"]) span {
display: -ms-grid;
display: grid;
-ms-grid-columns: auto 1rem;
grid-template-columns: auto 1rem;
margin: 0 1rem 0 0;
}
div.status-report td:not([colspan="2"]) span span[class^=status]::after {
height: 1rem !important;
width: 1rem !important;
margin-right: 1rem;
}
div.status-report td:not([colspan="2"]) a {
margin: 0 1rem 0 0;
}
div.status-report td:not([colspan="2"]).indent a {
margin: 0 1rem 0 1.5rem;
}
body {
margin: 0;
padding: 0;
@@ -700,7 +711,7 @@ body .container header svg text {
font-size: 10rem;
font-weight: 1000;
font-family: elvetica, Arial, sans-serif;
fill: var(--color-grey-xl);
fill: var(--colour-grey-xxl);
}
body .container header > div {
-ms-grid-row: 2;
@@ -730,7 +741,7 @@ body .container header > div .header-title h1 a, body .container header > div .h
text-decoration: none;
}
body .container nav {
background-color: var(--color-blue);
background-color: var(--colour-blue);
-ms-grid-column: 2;
-ms-grid-column-span: 2;
grid-column: 2/4;
@@ -744,7 +755,7 @@ body .container nav ul li {
margin-right: 1rem;
}
body .container nav a {
color: white;
color: var(--colour-white);
text-decoration: none;
}
@media (min-width: 768px) {
@@ -753,18 +764,18 @@ body .container nav a {
}
}
body .container p.deprecated-switch {
-ms-grid-row: 3;
grid-row: 3;
-ms-grid-column: 2;
-ms-grid-column-span: 2;
grid-column: 2/4;
-ms-grid-row: 3;
grid-row: 3;
text-align: right;
}
body .container p.deprecated-switch [role=switch] {
display: -ms-inline-grid;
display: inline-grid;
border: 1px solid #2e51a1;
background-color: #e9e9ea;
border: 1px solid var(--colour-blue);
background-color: var(--colour-grey-xl);
border-radius: 0.75rem;
height: 1.5rem;
width: 3rem;
@@ -781,17 +792,17 @@ body .container p.deprecated-switch [role=switch] > span {
transition: all 500ms;
}
body .container p.deprecated-switch [role=switch][aria-checked=true] {
background-color: #2e51a1;
background-color: var(--colour-blue);
}
body .container p.deprecated-switch [role=switch][aria-checked=true] > span {
margin-left: calc(1.5rem - 5%);
}
body .container main {
display: block;
grid-column: 1/-1;
-ms-grid-row: 4;
grid-row: 4;
display: block;
padding: 0 1rem;
grid-column: 1/-1;
}
@media (max-width: 768px) {
body .container main {
@@ -820,8 +831,8 @@ body .container main article {
-ms-grid-column: 2;
-ms-grid-column-span: 2;
grid-column: 2/4;
min-width: 0;
margin-top: 2rem;
min-width: 0;
}
body .container main article.status-deprecated {
display: none;
@@ -837,8 +848,8 @@ body .container main article tabset > ul, body .container main article .tab-grou
padding: 0;
}
body .container main article tabset > ul li.separator, body .container main article .tab-group > ul li.separator {
border-bottom: 1px solid var(--color-grey);
border-left: 1px solid var(--color-grey);
border-bottom: 1px solid var(--colour-grey);
border-left: 1px solid var(--colour-grey);
display: inline-block;
margin: 0.45rem 0 0 0;
width: 100%;
@@ -847,9 +858,9 @@ body .container main article tabset .tab-hidden, body .container main article .t
display: none;
}
body .container main article tabset [role=tab], body .container main article .tab-group [role=tab] {
background-color: var(--color-white);
border-left: 1px solid var(--color-grey);
border-top: 1px solid var(--color-grey);
background-color: var(--colour-white);
border-left: 1px solid var(--colour-grey);
border-top: 1px solid var(--colour-grey);
border-radius: 0.5rem 0.5rem 0 0;
cursor: pointer;
margin: 0;
@@ -858,19 +869,19 @@ body .container main article tabset [role=tab], body .container main article .ta
z-index: 2;
}
body .container main article tabset [role=tab]:last-of-type, body .container main article .tab-group [role=tab]:last-of-type {
border-right: 1px solid var(--color-grey);
border-right: 1px solid var(--colour-grey);
}
body .container main article tabset [role=tab]:not(.selected), body .container main article .tab-group [role=tab]:not(.selected) {
background-color: var(--color-grey-xxl);
border-bottom: 1px solid var(--color-grey);
background-color: var(--colour-grey-xxl);
border-bottom: 1px solid var(--colour-grey);
}
body .container main article tabset [role=tab] span, body .container main article .tab-group [role=tab] span {
display: block;
margin: 0 0 0.5rem 0;
}
body .container main article tabset [role=tabpanel], body .container main article .tab-group [role=tabpanel] {
background-color: var(--color-white);
border: 1px solid var(--color-grey);
background-color: var(--colour-white);
border: 1px solid var(--colour-grey);
border-top: none;
padding: 1rem;
z-index: 1;
@@ -897,8 +908,8 @@ body .container main article p.switch {
body .container main article p.switch [role=switch] {
display: -ms-inline-grid;
display: inline-grid;
border: 1px solid #2e51a1;
background-color: #e9e9ea;
border: 1px solid var(--colour-blue);
background-color: var(--colour-grey-xl);
border-radius: 0.75rem;
height: 1.5rem;
width: 3rem;
@@ -915,7 +926,7 @@ body .container main article p.switch [role=switch] > span {
transition: all 500ms;
}
body .container main article p.switch [role=switch][aria-checked=true] {
background-color: #2e51a1;
background-color: var(--colour-blue);
}
body .container main article p.switch [role=switch][aria-checked=true] > span {
margin-left: calc(1.5rem - 5%);