/*!
|
Theme Name: Edmonton Ink Extension
|
Theme URI: https://edmonton.ink
|
Description: Jvb-theme child theme, for edmonton.ink.
|
Author: Jake
|
Author URI: https://jakevan.ca/
|
Template: jvb-theme
|
Version: 0.1.0
|
!*/
|
:root{
|
--filter: grayscale(.3) sepia(.4);
|
|
/** Download your Fonts from: https://gwfh.mranftl.com/ **/
|
--font-base: -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
|
--heading: 'Mitr', 'Impact', var(--font-base);
|
--body: 'Courier Prime', var(--font-base);
|
--fw-h: 700;
|
--fw-h-light: 700;
|
--fw-h-bold: regular;
|
--fw-b: 300;
|
--fw-b-bold: 700;
|
--fw-b-light: 300;
|
|
/* Colours
|
For best results, generate colours from base colours using: https://uicolors.app/generate/
|
or sass darken/lighten by 5%: http://scg.ar-ch.org/
|
*/
|
--light-0: #f9f9f9;
|
--light-50: #f0f0f0;
|
--light-100: #e6e6e6;
|
--light-200: #dbdbdb;
|
--light-rgb: 249,249,249;
|
|
--dark-0: #151515;
|
--dark-50: #212121;
|
--dark-100: #2c2c2c;
|
--dark-200: #383838;
|
--dark-rgb: 21,21,21;
|
|
--action-0: #ff0080;
|
--action-50: #ff2492;
|
--action-100: #ff47a4;
|
--action-200: #ff6bb5;
|
--action-rgb: 255,0,128;
|
--action-contrast: var(--light-0);
|
|
--secondary-0: #D69121;
|
--secondary-50: #ffc421;
|
--secondary-100: #ffcd44;
|
--secondary-200: #ffd768;
|
--secondary-rgb: 252,185,0;
|
--secondary-contrast: var(--light-0);
|
|
--success: #20D64E;
|
--successLight: #DBFAE3;
|
--successDark: #05230D;
|
--successBack: var(--successLight);
|
--successText: var(--successDark);
|
--warning: #D69121;
|
--warningLight: #F6E5CB;
|
--warningDark: #231806;
|
--warningBack: var(--warningLight);
|
--warningText: var(--warningDark);
|
--error: #CF1616;
|
--errorLight: #F9C8C8;
|
--errorDark: #4A0808;
|
--errorBack: var(--errorLight);
|
--errorText: var(--errorDark);
|
|
--base: var(--light-0);
|
--base-50: var(--light-50);
|
--base-100: var(--light-100);
|
--base-200: var(--light-200);
|
--base-rgb: var(--light-rgb);
|
|
--contrast: var(--dark-0);
|
--contrast-50: var(--dark-50);
|
--contrast-100: var(--dark-100);
|
--contrast-200: var(--dark-200);
|
--contrast-rgb: var(--dark-rgb);
|
}
|
|
body:has(#theme-switcher:checked){
|
--action-50: #cc0066;
|
--action-100: #99004d;
|
--action-200: #660033;
|
--secondary-50: #d89f00;
|
--secondary-100: #b58500;
|
--secondary-200: #916a00;
|
|
--contrast: var(--light-0);
|
--contrast-50: var(--light-50);
|
--contrast-100: var(--light-100);
|
--contrast-200: var(--light-200);
|
--contrast-rgb: var(--light-rgb);
|
|
--base: var(--dark-0);
|
--base-50: var(--dark-50);
|
--base-100: var(--dark-100);
|
--base-200: var(--dark-200);
|
--base-rgb: var(--dark-rgb);
|
|
--successBack: var(--successDark);
|
--successText: var(--successLight);
|
--warningBack: var(--warningDark);
|
--warningText: var(--warningLight);
|
--errorBack: var(--errorDark);
|
--errorText: var(--errorLight);
|
}
|
/*** FONTS START **/
|
/** Download your Fonts from: https://gwfh.mranftl.com/
|
use ./assets/fonts/ as a base
|
**/
|
@font-face {
|
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
font-family: 'Courier Prime';
|
font-style: normal;
|
font-weight: 400;
|
src: url('./assets/fonts/courier-prime-v9-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
|
url('./assets/fonts/courier-prime-v9-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
|
}
|
/* courier-prime-italic - latin */
|
@font-face {
|
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
font-family: 'Courier Prime';
|
font-style: italic;
|
font-weight: 400;
|
src: url('./assets/fonts/courier-prime-v9-latin-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
|
url('./assets/fonts/courier-prime-v9-latin-italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
|
}
|
/* courier-prime-700 - latin */
|
@font-face {
|
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
font-family: 'Courier Prime';
|
font-style: normal;
|
font-weight: 700;
|
src: url('./assets/fonts/courier-prime-v9-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
|
url('./assets/fonts/courier-prime-v9-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
|
}
|
/* courier-prime-700italic - latin */
|
@font-face {
|
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
font-family: 'Courier Prime';
|
font-style: italic;
|
font-weight: 700;
|
src: url('./assets/fonts/courier-prime-v9-latin-700italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
|
url('./assets/fonts/courier-prime-v9-latin-700italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
|
}
|
|
/* mitr-regular - latin */
|
@font-face {
|
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
font-family: 'Mitr';
|
font-style: normal;
|
font-weight: 400;
|
src: url('./assets/fonts/mitr-v11-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
|
url('./assets/fonts/mitr-v11-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
|
}
|
/* mitr-700 - latin */
|
@font-face {
|
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
font-family: 'Mitr';
|
font-style: normal;
|
font-weight: 700;
|
src: url('./assets/fonts/mitr-v11-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
|
url('./assets/fonts/mitr-v11-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
|
}
|
/*** FONTS END ***/
|
|
header svg.logo {
|
height: var(--chipchip);
|
}
|
|
header svg.logo path:not(#flame) {
|
/*fill: var(--contrast) !important;*/
|
/*fill: var(--light-0)!important;*/
|
}
|
header svg.logo path {
|
paint-order: stroke fill;
|
stroke: var(--dark-0)!important;
|
stroke-width: 1px;
|
}
|
header [rel=home]:hover {
|
background: var(--action-0);
|
}
|
header [rel=home]:hover .logo path#flame {
|
/*fill: var(--dark-0);*/
|
}
|
|
header {
|
--offset: .5rem;
|
padding: 0 var(--offset);
|
display: flex;
|
justify-content: center;
|
}
|
header > #theme-switch {
|
position: absolute;
|
left: var(--offset);
|
}
|
header > nav:not(.mobile) {
|
position: absolute;
|
right: var(--offset);
|
--gap: 0;
|
}
|
|
.toggle.notifications.has .icon-bell,
|
.toggle.notifications .icon-bell-ringing {
|
display: none;
|
}
|
|
.toggle.notifications .icon-bell,
|
.toggle.notifications.has .icon-bell-ringing {
|
display: block;
|
}
|
/*}*/
|
/*header >svg #flame {*/
|
/* paint-order: stroke fill;*/
|
/* stroke: var(--dark-0);*/
|
/* stroke-width: 1px;*/
|
/*}*/
|
|
|
@media (min-width:768px) {
|
footer {
|
padding: 1rem 2rem;
|
}
|
}
|
