From 04f6e58a4fbc96b373570febd8379915189579ac Mon Sep 17 00:00:00 2001
From: Jake Vanderwerf <get@jakevanderwerf.ca>
Date: Tue, 10 Feb 2026 20:32:23 +0000
Subject: [PATCH] =lynsey latest
---
style.css | 332 ++++++++++++++++++++++++++++++++++++++++++++++++------
1 files changed, 292 insertions(+), 40 deletions(-)
diff --git a/style.css b/style.css
index c1720fe..219ad53 100644
--- a/style.css
+++ b/style.css
@@ -6,6 +6,7 @@
Author URI: https://jakevan.ca/
Template: jvb-theme
Version: 0.1.0
+Text Domain: lyns
*/
:root{
/* Layout */
@@ -38,14 +39,14 @@
/** 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: 'Josefin Sans', var(--font-base);
- --body: 'Open Sans', var(--font-base);
+ --heading: 'Source Serif 4', var(--font-base);
+ --body: 'Montserrat', var(--font-base);
--hWeight: 300;
--hlight: 300;
--hBold: 700;
- --bWeight: 500;
- --bBold: 800;
- --bLight: 300;
+ --bWeight: 400;
+ --bBold: 900;
+ --bLight: 200;
/* Font sizes */
--enormous: calc(26vh - 4rem);
@@ -61,44 +62,44 @@
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: #efefef;
- --light-50: #e2e2e2;
- --light-100: #d5d5d5;
- --light-200: #c9c9c9;
- --dark-0: #151515;
- --dark-50: #222222;
- --dark-100: #2e2e2e;
- --dark-200: #3b3b3b;
- --action-0: #ff0080;
- --action-50: #ff2492;
- --action-100: #ff47a4;
- --action-200: #ff6bb5;
- --secondary-0: #D69121;
- --secondary-50: #ffc421;
- --secondary-100: #ffcd44;
- --secondary-200: #ffd768;
+ --light-0: #fff9f5;
+ --light-50: #fff3eb;
+ --light-100: #feede1;
+ --light-200: #fee7d7;
+ --light-rgb: 255,249,24;
+ --dark-0: #140900;
+ --dark-50: #1e0e00;
+ --dark-100: #281200;
+ --dark-200: #331700;
+ --dark-rgb: 20,9,0;
+ --action-0: #c85604;
+ --action-50: #dc5f04;
+ --action-100: #f06705;
+ --action-200: #fa710f;
+ --action-rgb: 200,86,4;
+ --secondary-0: #90D932;
+ --secondary-50: #99dc43;
+ --secondary-100: #a3df54;
+ --secondary-200: #ace366;
+ --secondary-rgb: 131,217,50;
- --success: #20D64E;
- --successLight: #DBFAE3;
- --successDark: #05230D;
+ --success: #7cf067;
+ --successLight: #f4fef2;
+ --successDark: #0d3906;
--successBack: var(--successLight);
--successText: var(--successDark);
- --warning: #D69121;
- --warningLight: #F6E5CB;
- --warningDark: #231806;
+ --warning: #F0B967;
+ --warningLight: #fef9f2;
+ --warningDark: #221503;
--warningBack: var(--warningLight);
--warningText: var(--warningDark);
- --error: #CF1616;
- --errorLight: #F9C8C8;
- --errorDark: #4A0808;
+ --error: #BF3434;
+ --errorLight: #fcf6f6;
+ --errorDark: #471313;
--errorBack: var(--errorLight);
--errorText: var(--errorDark);
--action-contrast: var(--light-0);
--secondary-contrast: var(--light-0);
- --light-rgb: 239,239,239;
- --dark-rgb: 21,21,21;
- --action-rgb: 255,0,128;
- --secondary-rgb: 252,185,0;
--rgba-subtle: rgba(var(--c),.5);
--rgba-subtle-hover: rgba(var(--c),.1);
@@ -186,12 +187,12 @@
}
body:has(#theme-switcher:checked){
- --action-50: #db006e;
- --action-100: #b8005c;
- --action-200: #94004a;
- --secondary-50: #d89f00;
- --secondary-100: #b58500;
- --secondary-200: #916a00;
+ --action-50: #b44d04;
+ --action-100: #a04503;
+ --action-200: #8c3c03;
+ --secondary-50: #86d027;
+ --secondary-100: #7bbf23;
+ --secondary-200: #70ae20;
--contrast: var(--light-0);
--contrast-50: var(--light-50);
--contrast-100: var(--light-100);
@@ -241,4 +242,255 @@
/** Download your Fonts from: https://gwfh.mranftl.com/
use ./assets/fonts/ as a base
**/
+/* montserrat-200 - 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: 'Montserrat';
+ font-style: normal;
+ font-weight: 200;
+ src: url('./assets/fonts/montserrat-v31-latin-200.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ url('./assets/fonts/montserrat-v31-latin-200.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
+}
+/* montserrat-200italic - 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: 'Montserrat';
+ font-style: italic;
+ font-weight: 200;
+ src: url('./assets/fonts/montserrat-v31-latin-200italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ url('./assets/fonts/montserrat-v31-latin-200italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
+}
+/* montserrat-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: 'Montserrat';
+ font-style: normal;
+ font-weight: 400;
+ src: url('./assets/fonts/montserrat-v31-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ url('./assets/fonts/montserrat-v31-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
+}
+/* montserrat-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: 'Montserrat';
+ font-style: italic;
+ font-weight: 400;
+ src: url('./assets/fonts/montserrat-v31-latin-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ url('./assets/fonts/montserrat-v31-latin-italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
+}
+/* montserrat-900 - 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: 'Montserrat';
+ font-style: normal;
+ font-weight: 900;
+ src: url('./assets/fonts/montserrat-v31-latin-900.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ url('./assets/fonts/montserrat-v31-latin-900.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
+}
+/* montserrat-900italic - 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: 'Montserrat';
+ font-style: italic;
+ font-weight: 900;
+ src: url('./assets/fonts/montserrat-v31-latin-900italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ url('./assets/fonts/montserrat-v31-latin-900italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
+}
+
+/* source-serif-4-300 - 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: 'Source Serif 4';
+ font-style: normal;
+ font-weight: 300;
+ src: url('./assets/fonts/source-serif-4-v14-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ url('./assets/fonts/source-serif-4-v14-latin-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
+}
+/* source-serif-4-300italic - 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: 'Source Serif 4';
+ font-style: italic;
+ font-weight: 300;
+ src: url('./assets/fonts/source-serif-4-v14-latin-300italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ url('./assets/fonts/source-serif-4-v14-latin-300italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
+}
+/* source-serif-4-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: 'Source Serif 4';
+ font-style: normal;
+ font-weight: 700;
+ src: url('./assets/fonts/source-serif-4-v14-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ url('./assets/fonts/source-serif-4-v14-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
+}
+/* source-serif-4-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: 'Source Serif 4';
+ font-style: italic;
+ font-weight: 700;
+ src: url('./assets/fonts/source-serif-4-v14-latin-700italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ url('./assets/fonts/source-serif-4-v14-latin-700italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
+}
/*** FONTS END ***/
+
+:root {
+ --bg-blend: luminosity;
+ --blur: 0px;
+ --fg-blend: overlay;
+ --opacity: 0.9028149706380943;
+ --spacing: 0px;
+}
+/*.img-wrapper {*/
+/* background-color: var(--action-0);*/
+/* display: flex;*/
+/* flex: 1 1 100%;*/
+/* height: 100%;*/
+/* overflow: hidden;*/
+/* padding: var(--spacing);*/
+/* position: relative;*/
+/*}*/
+
+/*.img-wrapper img {*/
+/* filter: grayscale(100%) contrast(1) blur(var(--blur));*/
+/* flex: 1 0 100%;*/
+/* height: 100%;*/
+/* max-width: 100%;*/
+/* mix-blend-mode: var(--bg-blend);*/
+/* object-fit: cover;*/
+/* opacity: var(--opacity);*/
+/* position: relative;*/
+/* width: 100%;*/
+/*}*/
+
+/*.img-wrapper::before {*/
+/* background-color: var(--contrast-50);*/
+/* bottom: 0;*/
+/* content: '';*/
+/* height: 100%;*/
+/* left: 0;*/
+/* mix-blend-mode: var(--fg-blend);*/
+/* position: absolute;*/
+/* right: 0;*/
+/* top: 0;*/
+/* width: 100%;*/
+/* z-index: 1;*/
+/*}*/
+
+.wp-site-blocks > header {
+ flex-direction: column;
+ align-items: flex-start!important;
+ justify-content: flex-start!important;
+ height: max-content!important;
+ min-height: var(--height);
+ --gap: 0;
+ padding: 0!important;
+}
+ #theme-switch#theme-switch {
+ position: absolute;
+ top: 1rem;
+ left: 1rem;
+ }
+ .wp-site-blocks > header a[rel=home] {
+ position: relative;
+
+ }
+ .wp-site-blocks > header > div.row {
+ width: 100%;
+ --gap: 0 2rem;
+ --justify: flex-start;
+ --align: center;
+ --w: var(--height);
+ padding: 0 1rem 0 var(--offHeight);
+ height: var(--height);
+ min-height: var(--height);
+ }
+ .icon-logo {
+ background-color: var(--action-0);
+ margin: 0 0 0 2rem;
+ }
+ .wp-site-blocks > header p {
+ margin: 0;
+ width: max-content;
+ }
+ .wp-site-blocks > header p + p {
+ font-size: var(--small);
+ }
+ .wp-site-blocks > header nav {
+ width: 100%;
+ --height: 3rem;
+ background-color: var(--base-200);
+ }
+ .wp-site-blocks > header nav ul {
+ width: 100%;
+ }
+ .wp-site-blocks > header nav li+li::before {
+ display: none;
+ }
+ .wp-site-blocks > header nav a {
+ padding: .25rem .5rem;
+ color: var(--contrast);
+ }
+ .wp-site-blocks > header nav a:hover,
+ .wp-site-blocks > header nav a:focus {
+ color: var(--action-contrast);
+ }
+header .title.title {
+ position: relative;
+ height: fit-content;
+ text-transform: uppercase;
+ font-weight: var(--hWeight);
+ font-family: var(--heading);
+}
+footer {
+ margin: 0!important;
+}
+main > *:last-child {
+ margin-bottom: 0!important;
+}
+
+
+@media (min-width:768px){
+ .wp-site-blocks > header > div.row {
+ --wrap: nowrap;
+ }
+ footer {
+ padding: 1rem 2rem;
+ }
+}
+nav.fixed.bottom.bottom, nav.on-this-page.on-this-page {
+ width: 100vw;
+}
+nav.fixed.bottom .icon {
+ margin: 0 1rem;
+}
+nav.fixed.bottom span {
+ margin-right: 1rem;
+}
+h1:first-of-type {
+ margin-top: 4rem!important;
+}
+.callout p {
+ text-align: center;
+}
+footer nav {
+ margin-bottom: 1rem;
+}
+footer p.font-small.font-small {
+ margin: 0;
+}
+
+
+section:nth-of-type(even) {
+ background-color: var(--base-100);
+ max-width: none;
+ padding: 2rem 0;
+}
+section:nth-of-type(even) > * {
+ max-width: var(--maxWidth);
+}
+
+.cover.cover::before {
+ mix-blend-mode: hue;
+}
--
Gitblit v1.10.0