From 0afb2c0046b55c123eafb4ab9ee77efa68d12463 Mon Sep 17 00:00:00 2001
From: Jake Vanderwerf <get@jakevanderwerf.ca>
Date: Sat, 06 Jun 2026 17:15:31 +0000
Subject: [PATCH] =Starting the Favourites.js setup, converting previous Northeh stuff to new Registrar, fixing up Square.php integration to match
---
src/video/style.scss | 141 +++++++++++++++++++++++++++++-----------------
1 files changed, 89 insertions(+), 52 deletions(-)
diff --git a/src/video/style.scss b/src/video/style.scss
index 223f434..c28a44f 100644
--- a/src/video/style.scss
+++ b/src/video/style.scss
@@ -1,65 +1,122 @@
-.video-cover-wrapper {
+/** style.scss **/
+.video-cover {
position: relative;
width: 100%;
- min-height: 400px;
+ min-height: 75vh;
overflow: hidden;
display: flex;
-
- // Video background
- .video-cover-bg {
+ .wrap {
+ background-color: rgb(var(--contrast-200));
+ //&::before {
+ // position: absolute;
+ // top: 0;
+ // bottom: 0;
+ // left: 0;
+ // right: 0;
+ // background-color: rgb(var(--base));
+ // mix-blend-mode: lighten;
+ // content: '';
+ // z-index: 1;
+ //}
+ }
+ /* Video background */
+ .video-container {
position: absolute;
- top: 50%;
- left: 50%;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
min-width: 100%;
min-height: 100%;
- width: auto;
- height: auto;
- transform: translate(-50%, -50%);
- object-fit: cover;
z-index: 0;
+ display: flex;
+ background-color: rgb(var(--action-50));
&.fade {
animation: fadeIn 1s ease-in;
}
+
+ video {
+ pointer-events: none;
+ opacity: .85;
+ mix-blend-mode: multiply;
+ filter: grayscale(100%) contrast(1);
+ flex: 1 0 100%;
+ object-fit: cover;
+ }
}
- // Dark overlay
- .video-cover-overlay {
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- background: rgba(0, 0, 0, 1);
- z-index: 1;
- }
-
- // Content container
- .video-cover-content {
+ .inner-wrap {
position: relative;
z-index: 2;
width: 100%;
padding: 2rem;
- color: white;
+ color: rgb(var(--action-contrast));
- // Better text readability
+ /* Better text readability */
h1, h2, h3, h4, h5, h6 {
- color: white;
+ word-spacing: 100vw;
+ color: rgb(var(--action-contrast));
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
+ margin: 2rem 0 0;
}
p {
- color: white;
+ text-transform: uppercase;
+ letter-spacing: 2px;
+ margin: 0;
+ color: rgb(var(--action-contrast));
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
- // Button styles
+ .media-text {
+ }
+ .media-text figure {
+ max-width: 50%;
+ }
+ @media (min-width: 768px) {
+ .media-text {
+ --align: flex-start;
+ gap: 3rem;
+ max-width: var(--content);
+ }
+ }
+ .media-text > div {
+ width: fit-content;
+ }
+ .buttons a {
+ font-weight: var(--fw-h-bold);
+ color: rgb(var(--action-contrast));
+ border-color: rgb(var(--action-contrast));
+ &:visited {
+ color: rgb(var(--action-contrast));
+ &:hover {
+ color: rgb(var(--action-contrast));
+ }
+ }
+ &:hover {
+ background-color: rgb(var(--action-0));
+ color: rgb(var(--action-contrast));
+ }
+ }
+
+ .outline a {
+ background-color: rgba(var(--base), rgba(var(--base),var(--op-3)));
+ }
+ .buttons {
+ margin: 3rem 0;
+ max-width: var(--wide);
+ li {
+ background-color: rgba(var(--action-0), var(--op-4));
+ }
+ }
+ /* Button styles */
.wp-block-button__link {
text-shadow: none;
}
}
- // Alignment classes
+ /* Alignment classes */
&.align-top-left {
align-items: flex-start;
justify-content: flex-start;
@@ -97,7 +154,7 @@
justify-content: flex-end;
}
- // Full-width alignment
+ /* Full-width alignment */
&.alignfull {
width: 100vw;
max-width: none;
@@ -105,7 +162,7 @@
margin-right: calc(50% - 50vw);
}
- // Wide alignment
+ /* Wide alignment */
&.alignwide {
max-width: 1200px;
}
@@ -120,23 +177,3 @@
}
}
-// Responsive adjustments
-@media (max-width: 768px) {
- .video-cover-wrapper {
- min-height: 300px;
-
- .video-cover-content {
- padding: 1.5rem;
- }
- }
-}
-
-@media (max-width: 480px) {
- .video-cover-wrapper {
- min-height: 250px;
-
- .video-cover-content {
- padding: 1rem;
- }
- }
-}
--
Gitblit v1.10.0