From b0194e10a87e16797a568d8a30d53ebecd27d8a4 Mon Sep 17 00:00:00 2001
From: Jake Vanderwerf <get@jakevanderwerf.ca>
Date: Sat, 18 Oct 2025 15:04:51 +0000
Subject: [PATCH] =DataStore.js and UploaderManager.js overhaul
---
src/video/style.scss | 145 ++++++++++++++++++++++++++++++++++++++++++------
1 files changed, 126 insertions(+), 19 deletions(-)
diff --git a/src/video/style.scss b/src/video/style.scss
index c31a76f..223f434 100644
--- a/src/video/style.scss
+++ b/src/video/style.scss
@@ -1,11 +1,113 @@
-.video-cover {
+.video-cover-wrapper {
+ position: relative;
width: 100%;
- height: auto;
- display: block;
- object-fit: cover;
+ min-height: 400px;
+ overflow: hidden;
+ display: flex;
- &.fade {
- animation: fadeIn 1s ease-in;
+ // Video background
+ .video-cover-bg {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ min-width: 100%;
+ min-height: 100%;
+ width: auto;
+ height: auto;
+ transform: translate(-50%, -50%);
+ object-fit: cover;
+ z-index: 0;
+
+ &.fade {
+ animation: fadeIn 1s ease-in;
+ }
+ }
+
+ // 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 {
+ position: relative;
+ z-index: 2;
+ width: 100%;
+ padding: 2rem;
+ color: white;
+
+ // Better text readability
+ h1, h2, h3, h4, h5, h6 {
+ color: white;
+ text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
+ }
+
+ p {
+ color: white;
+ text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
+ }
+
+ // Button styles
+ .wp-block-button__link {
+ text-shadow: none;
+ }
+ }
+
+ // Alignment classes
+ &.align-top-left {
+ align-items: flex-start;
+ justify-content: flex-start;
+ }
+ &.align-top-center {
+ align-items: flex-start;
+ justify-content: center;
+ }
+ &.align-top-right {
+ align-items: flex-start;
+ justify-content: flex-end;
+ }
+ &.align-center-left {
+ align-items: center;
+ justify-content: flex-start;
+ }
+ &.align-center {
+ align-items: center;
+ justify-content: center;
+ }
+ &.align-center-right {
+ align-items: center;
+ justify-content: flex-end;
+ }
+ &.align-bottom-left {
+ align-items: flex-end;
+ justify-content: flex-start;
+ }
+ &.align-bottom-center {
+ align-items: flex-end;
+ justify-content: center;
+ }
+ &.align-bottom-right {
+ align-items: flex-end;
+ justify-content: flex-end;
+ }
+
+ // Full-width alignment
+ &.alignfull {
+ width: 100vw;
+ max-width: none;
+ margin-left: calc(50% - 50vw);
+ margin-right: calc(50% - 50vw);
+ }
+
+ // Wide alignment
+ &.alignwide {
+ max-width: 1200px;
}
}
@@ -18,18 +120,23 @@
}
}
+// Responsive adjustments
+@media (max-width: 768px) {
+ .video-cover-wrapper {
+ min-height: 300px;
-.video-cover video {
- pointer-events: none;
- position: absolute;
- top: 0;
- left: 50%;
- opacity: 0.85;
- mix-blend-mode: multiply;
- transform: translate(-40%,-10%);
- height: 105vh;
- width: 300vw!important;
- filter: grayscale(100%) contrast(1);
- flex: 1 0 100%;
- max-width: none;
+ .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