nick/CatherineLynwood
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Save

Browse Source
This commit is contained in:
Nick 2025-06-10 23:02:16 +01:00
parent 8a8431f329
commit 1f429c7e83
19 changed files with 78 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
CatherineLynwood/CatherineLynwood.csproj
View File

@ -43,6 +43,9 @@
<Content Update="web.config"> <Content Update="web.config">
<CopyToPublishDirectory>Never</CopyToPublishDirectory> <CopyToPublishDirectory>Never</CopyToPublishDirectory>
</Content> </Content>
<Content Update="wwwroot\js\plyr.js">
<CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
</Content>
</ItemGroup> </ItemGroup>
<ItemGroup> <ItemGroup>

31
CatherineLynwood/Views/Home/Index.cshtml
View File

@ -17,14 +17,18 @@
<div class="col-md-5 text-center"> <div class="col-md-5 text-center">
<a asp-controller="TheAlphaFlame" asp-action="Discovery"> <a asp-controller="TheAlphaFlame" asp-action="Discovery">
<div class="hero-video-container"> <div class="hero-video-container">
<video autoplay muted loop playsinline poster="/images/the-alpha-flame-discovery-blank.png"> <video id="heroVideo" autoplay muted loop playsinline preload="none" poster="/images/webp/the-alpha-flame-discovery-blank-400.webp">
<source src="/videos/background-5.mp4" type="video/mp4"> <!-- Source will be injected later -->
Your browser does not support the video tag.
</video> </video>
<!-- New overlay image --> <!-- Overlay image remains untouched -->
<responsive-image src="the-alpha-flame-discovery-overlay.png" class="hero-overlay-image" alt="The Alpha Flame: Discovery by Catherine Lynwood" display-width-percentage="50"></responsive-image> <responsive-image src="the-alpha-flame-discovery-overlay.png"
class="hero-overlay-image"
alt="The Alpha Flame: Discovery by Catherine Lynwood"
display-width-percentage="50">
</responsive-image>
</div> </div>
</a> </a>
</div> </div>
@ -129,4 +133,21 @@
] ]
} }
</script> </script>
<script>
window.addEventListener("load", () => {
setTimeout(() => {
const video = document.getElementById("heroVideo");
const source = document.createElement("source");
source.src = "/videos/background-5.mp4";
source.type = "video/mp4";
video.appendChild(source);
video.load(); // Triggers actual file load
video.play().catch(err => {
console.warn("Autoplay failed:", err);
});
}, 2000); // Adjust delay (e.g., 1000–3000ms) based on your needs
});
</script>
} }

31
CatherineLynwood/Views/Shared/_Layout.cshtml
View File

@ -54,14 +54,20 @@
<body class="bg-primary text-white"> <body class="bg-primary text-white">
<div id="background-wrapper"> <div id="background-wrapper">
<div class="video-background"> <div class="video-background">
<video autoplay muted loop playsinline poster="/images/webp/maggie-5-1920.webp"> <video id="siteBackgroundVideo"
<source src="/videos/background-3.mp4" type="video/mp4"> autoplay
Your browser does not support the video tag. muted
loop
playsinline
preload="none"
poster="/images/webp/the-alpha-flame-discovery-blank-400.webp">
<!-- Source will be injected by JS -->
</video> </video>
<div class="video-overlay"></div> <div class="video-overlay"></div>
</div> </div>
</div> </div>
<div class="content"> <div class="content">
<!-- Content wrapper to keep everything on top of the background --> <!-- Content wrapper to keep everything on top of the background -->
<header> <header>
@ -146,15 +152,30 @@
<script src="~/js/site.js" asp-append-version="true"></script> <script src="~/js/site.js" asp-append-version="true"></script>
<script src="~/lib/jquery-validation/dist/jquery.validate.min.js"></script> <script src="~/lib/jquery-validation/dist/jquery.validate.min.js"></script>
<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script> <script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
<script src="~/js/plyr.js"></script>
<script src="https://cdn.plyr.io/3.7.2/plyr.polyfilled.js"></script>
<script> <script>
const player = new Plyr('audio'); const player = new Plyr('audio');
</script> </script>
@RenderSection("Scripts", required: false) @RenderSection("Scripts", required: false)
<script>
window.addEventListener("load", () => {
setTimeout(() => {
const video = document.getElementById("siteBackgroundVideo");
const source = document.createElement("source");
source.src = "/videos/background-3.mp4";
source.type = "video/mp4";
video.appendChild(source);
video.load(); // Initiates download
video.play().catch(err => {
console.warn("Background video autoplay failed:", err);
});
}, 1500); // Adjust delay as needed (e.g. 1000–3000ms)
});
</script>
<script> <script>
if ('serviceWorker' in navigator) { if ('serviceWorker' in navigator) {
window.addEventListener('load', function () { window.addEventListener('load', function () {

2
CatherineLynwood/Views/TheAlphaFlame/Discovery.cshtml
View File

@ -239,4 +239,4 @@
</script> </script>
} }

18
CatherineLynwood/bundleconfig.json
View File

@ -34,5 +34,23 @@
"inputFiles": [ "inputFiles": [
"wwwroot/css/bootstrap.css" "wwwroot/css/bootstrap.css"
] ]
},
{
"outputFileName": "wwwroot/js/plyr.polyfilled.min.js",
"inputFiles": [
"wwwroot/js/plyr.polyfilled.js"
]
},
{
"outputFileName": "wwwroot/js/site.min.js",
"inputFiles": [
"wwwroot/js/site.js"
]
},
{
"outputFileName": "wwwroot/js/plyr.min.js",
"inputFiles": [
"wwwroot/js/plyr.js"
]
} }
] ]

64
CatherineLynwood/wwwroot/css/site.css
View File

@ -17,70 +17,6 @@ html {
min-height: 93vh; min-height: 93vh;
} }
/* Default background for larger screens (Extra large and up) */
.fixed-background {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background: linear-gradient(rgba(23, 200, 235, 0.5), rgba(23, 200, 235, 0.5)), url('/images/webp/the-alpha-flame-discovery-blank-1920.webp'); /* Path to the largest image */
background-size: cover;
background-repeat: no-repeat;
background-position: top;
z-index: -1;
}
/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
.fixed-background {
background: linear-gradient(rgba(23, 200, 235, 0.5), rgba(23, 200, 235, 0.5)), url('/images/webp/the-alpha-flame-discovery-blank-400.webp'); /* Path to smallest image */
background-size: cover;
background-repeat: no-repeat;
background-position: top;
}
}
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {
.fixed-background {
background: linear-gradient(rgba(23, 200, 235, 0.5), rgba(23, 200, 235, 0.5)), url('/images/webp/the-alpha-flame-discovery-blank-768.webp'); /* Path to small image */
background-size: cover;
background-repeat: no-repeat;
background-position: top;
}
}
/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
.fixed-background {
background: linear-gradient(rgba(23, 200, 235, 0.5), rgba(23, 200, 235, 0.5)), url('/images/webp/the-alpha-flame-discovery-blank-992.webp'); /* Path to medium image */
background-size: cover;
background-repeat: no-repeat;
background-position: top;
}
}
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {
.fixed-background {
background: linear-gradient(rgba(23, 200, 235, 0.5), rgba(23, 200, 235, 0.5)), url('/images/webp/the-alpha-flame-discovery-blank-1200.webp'); /* Path to large image */
background-size: cover;
background-repeat: no-repeat;
background-position: top;
}
}
/* Extra large devices (larger desktops, 1200px and up) */
@media (min-width: 1200px) {
.fixed-background {
background: linear-gradient(rgba(23, 200, 235, 0.5), rgba(23, 200, 235, 0.5)), url('/images/webp/the-alpha-flame-discovery-blank-1920.webp'); /* Path to extra-large image */
background-size: cover;
background-repeat: no-repeat;
background-position: top;
}
}
.content { .content {
position: relative; position: relative;
z-index: 1; /* Brings content above the background */ z-index: 1; /* Brings content above the background */

2
CatherineLynwood/wwwroot/css/site.min.css vendored
View File

@ -1 +1 @@
html{font-size:14px}@media(min-width:768px){html{font-size:16px}}html{position:relative}.content{min-height:93vh}.fixed-background{position:fixed;top:0;left:0;width:100vw;height:100vh;background:linear-gradient(rgba(23,200,235,.5),rgba(23,200,235,.5)),url('/images/webp/the-alpha-flame-discovery-blank-1920.webp');background-size:cover;background-repeat:no-repeat;background-position:top;z-index:-1}@media(max-width:575.98px){.fixed-background{background:linear-gradient(rgba(23,200,235,.5),rgba(23,200,235,.5)),url('/images/webp/the-alpha-flame-discovery-blank-400.webp');background-size:cover;background-repeat:no-repeat;background-position:top}}@media(min-width:576px) and (max-width:767.98px){.fixed-background{background:linear-gradient(rgba(23,200,235,.5),rgba(23,200,235,.5)),url('/images/webp/the-alpha-flame-discovery-blank-768.webp');background-size:cover;background-repeat:no-repeat;background-position:top}}@media(min-width:768px) and (max-width:991.98px){.fixed-background{background:linear-gradient(rgba(23,200,235,.5),rgba(23,200,235,.5)),url('/images/webp/the-alpha-flame-discovery-blank-992.webp');background-size:cover;background-repeat:no-repeat;background-position:top}}@media(min-width:992px) and (max-width:1199.98px){.fixed-background{background:linear-gradient(rgba(23,200,235,.5),rgba(23,200,235,.5)),url('/images/webp/the-alpha-flame-discovery-blank-1200.webp');background-size:cover;background-repeat:no-repeat;background-position:top}}@media(min-width:1200px){.fixed-background{background:linear-gradient(rgba(23,200,235,.5),rgba(23,200,235,.5)),url('/images/webp/the-alpha-flame-discovery-blank-1920.webp');background-size:cover;background-repeat:no-repeat;background-position:top}}.content{position:relative;z-index:1}section{padding-bottom:10px}.w-sm-50{width:100%}@media(min-width:576px){.w-sm-50{width:50%}}.w-md-50{width:100%}@media(min-width:768px){.w-md-50{width:50%}}.excerpt-section{background-color:#f8f9fa}.scene-image{max-width:100%;height:auto;border-radius:10px}.audio-player{margin:1rem 0}.chapter-text{font-family:'Georgia',serif;font-size:1.1rem;line-height:1.6;color:#333}.chapter-title{font-size:1.5rem;font-weight:bold;color:#555;margin-bottom:1rem}.responsive-border{border-right:3px solid #000}@media(max-width:575.98px){.responsive-border{border-right:0;border-bottom:3px solid #000}}.fit-image{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.share-button{padding:8px 12px;margin-left:10px;margin-right:10px;color:#fff;text-decoration:none;border-radius:4px;font-size:14px}.share-button.facebook{background-color:#3b5998}.share-button.twitter{background-color:#1da1f2}.share-button.linkedin{background-color:#0077b5}.share-button.pinterest{background-color:#bd081c}.share-button.instagram{background-color:#e4405f}.share-button.tiktok{background-color:#010101}#synopsis-body{overflow-y:auto}.tagline-shadow{text-shadow:2px 2px 4px rgba(0,0,0,.8)} html{font-size:14px}@media(min-width:768px){html{font-size:16px}}html{position:relative}.content{min-height:93vh}.content{position:relative;z-index:1}section{padding-bottom:10px}.w-sm-50{width:100%}@media(min-width:576px){.w-sm-50{width:50%}}.w-md-50{width:100%}@media(min-width:768px){.w-md-50{width:50%}}.excerpt-section{background-color:#f8f9fa}.scene-image{max-width:100%;height:auto;border-radius:10px}.audio-player{margin:1rem 0}.chapter-text{font-family:'Georgia',serif;font-size:1.1rem;line-height:1.6;color:#333}.chapter-title{font-size:1.5rem;font-weight:bold;color:#555;margin-bottom:1rem}.responsive-border{border-right:3px solid #000}@media(max-width:575.98px){.responsive-border{border-right:0;border-bottom:3px solid #000}}.fit-image{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.share-button{padding:8px 12px;margin-left:10px;margin-right:10px;color:#fff;text-decoration:none;border-radius:4px;font-size:14px}.share-button.facebook{background-color:#3b5998}.share-button.twitter{background-color:#1da1f2}.share-button.linkedin{background-color:#0077b5}.share-button.pinterest{background-color:#bd081c}.share-button.instagram{background-color:#e4405f}.share-button.tiktok{background-color:#010101}#synopsis-body{overflow-y:auto}.tagline-shadow{text-shadow:2px 2px 4px rgba(0,0,0,.8)}

BIN
CatherineLynwood/wwwroot/images/jpg/the-alpha-flame-discovery-blank-400.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 49 KiB

BIN
CatherineLynwood/wwwroot/images/webp/the-alpha-flame-discovery-blank-288.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 167 KiB

BIN
CatherineLynwood/wwwroot/images/webp/the-alpha-flame-discovery-blank-384.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 291 KiB

BIN
CatherineLynwood/wwwroot/images/webp/the-alpha-flame-discovery-blank-400.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 314 KiB

BIN
CatherineLynwood/wwwroot/images/webp/the-alpha-flame-discovery-blank-496.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 471 KiB

BIN
CatherineLynwood/wwwroot/images/webp/the-alpha-flame-discovery-blank-600.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 669 KiB

BIN
CatherineLynwood/wwwroot/images/webp/the-alpha-flame-discovery-blank-700.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 898 KiB

BIN
CatherineLynwood/wwwroot/images/webp/the-alpha-flame-discovery-blank-960.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 MiB

1
CatherineLynwood/wwwroot/js/plyr.js Normal file
View File

File diff suppressed because one or more lines are too long

0
CatherineLynwood/wwwroot/js/site.min.js vendored Normal file
View File

2
CatherineLynwood/wwwroot/lib/bootstrap/dist/css/bootstrap.css vendored
View File

File diff suppressed because one or more lines are too long

2
CatherineLynwood/wwwroot/lib/bootstrap/dist/css/bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long