More updates
This commit is contained in:
@@ -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%);
|
||||
|
Reference in New Issue
Block a user