cz scores tab open
This commit is contained in:
1 parent
7214e7c0f3
commit
bd2b0cd864
9 files changed
+58
-43
No files matched your search
BIN
Binary file not shown.
|
Before Width: | Height: | Size: 141 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB |
@@ -46,4 +46,3 @@ def create_thumbnails(base_folder):
|
||||
|
||||
if __name__ == "__main__":
|
||||
create_thumbnails("gallery")
|
||||
create_thumbnails("ahmet")
|
||||
+6
-3
@@ -19,11 +19,14 @@
|
||||
<video muted loop playsinline preload="none" id="calendar-background-video" style="display:none">
|
||||
<source src="textures/calendar_background.mp4" type="video/mp4">
|
||||
</video>
|
||||
<video muted loop playsinline preload="none" id="czscores-background-video" style="display:none">
|
||||
<source src="textures/cz_background.mp4" type="video/mp4">
|
||||
</video>
|
||||
<div id="top-line">
|
||||
<a href="index.html" id="home-btn"></a>
|
||||
<button id="about-btn">About This Website</button>
|
||||
<button id="gallery-btn">Gallery</button>
|
||||
<button id="ahmet-btn">Ahmet Museum</button>
|
||||
<button id="czscores-btn">Cz Scores</button>
|
||||
<button id="yuukabot-btn">Bot Status</button>
|
||||
<button id="calendar-btn">Calendar</button>
|
||||
</div>
|
||||
@@ -113,8 +116,8 @@
|
||||
<div id="gallery-container" class="gallery-grid"></div>
|
||||
</section>
|
||||
|
||||
<section id="ahmet" class="tab-content">
|
||||
<div id="ahmet-container">
|
||||
<section id="czscores" class="tab-content">
|
||||
<div id="czscores-container">
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
@@ -66,7 +66,4 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
|
||||
// Load your original Gallery
|
||||
loadGallery('gallery-container', 'gallery', 50);
|
||||
|
||||
// Load your new Ahmet Museum (adjust the number 20 to however many photos you have)
|
||||
loadGallery('ahmet-container', 'ahmet', 20);
|
||||
});
|
||||
+29
-11
@@ -3,11 +3,14 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
const tabs = document.querySelectorAll('.tab-content');
|
||||
const mainVideo = document.getElementById('background-video');
|
||||
const calVideo = document.getElementById('calendar-background-video');
|
||||
const czVideo = document.getElementById('czscores-background-video');
|
||||
|
||||
// ── Map URL path → tab id ──────────────────────────────
|
||||
function pathToTab(path) {
|
||||
const slug = path.replace(/^\/+|\/+$/g, '') || 'about';
|
||||
const valid = ['about', 'gallery', 'ahmet', 'yuukabot', 'calendar'];
|
||||
const valid = ['about', 'gallery', 'czscores', 'yuukabot', 'calendar'];
|
||||
// backward compat: old /ahmet links
|
||||
if (slug === 'ahmet') return 'czscores';
|
||||
return valid.includes(slug) ? slug : 'about';
|
||||
}
|
||||
|
||||
@@ -18,17 +21,32 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
// ── Swap background videos + top-bar theme ────────────
|
||||
const topLine = document.getElementById('top-line');
|
||||
|
||||
// map tab id → its dedicated video element (null = use main)
|
||||
const tabVideos = {
|
||||
calendar: calVideo,
|
||||
czscores: czVideo
|
||||
};
|
||||
|
||||
function setBgForTab(tabId) {
|
||||
if (tabId === 'calendar') {
|
||||
// Switch to calendar background
|
||||
if (mainVideo) { mainVideo.style.display = 'none'; mainVideo.pause(); }
|
||||
if (calVideo) { calVideo.style.display = 'block'; calVideo.play().catch(() => {}); }
|
||||
if (topLine) topLine.classList.add('cal-theme');
|
||||
} else {
|
||||
// Switch back to main background
|
||||
if (calVideo) { calVideo.style.display = 'none'; calVideo.pause(); }
|
||||
if (mainVideo) { mainVideo.style.display = 'block'; if (mainVideo.paused) mainVideo.play().catch(() => {}); }
|
||||
if (topLine) topLine.classList.remove('cal-theme');
|
||||
// Hide + pause ALL videos first
|
||||
[mainVideo, calVideo, czVideo].forEach(v => {
|
||||
if (v) { v.style.display = 'none'; v.pause(); }
|
||||
});
|
||||
|
||||
// Show the right one
|
||||
const target = tabVideos[tabId];
|
||||
if (target) {
|
||||
target.style.display = 'block';
|
||||
target.play().catch(() => {});
|
||||
} else if (mainVideo) {
|
||||
mainVideo.style.display = 'block';
|
||||
if (mainVideo.paused) mainVideo.play().catch(() => {});
|
||||
}
|
||||
|
||||
// Top-bar theme toggle
|
||||
if (topLine) {
|
||||
topLine.classList.toggle('cal-theme', tabId === 'calendar');
|
||||
topLine.classList.toggle('czscores-theme', tabId === 'czscores');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
+12
-24
@@ -1,24 +1,12 @@
|
||||
#ahmet-btn {
|
||||
background-color: aliceblue;
|
||||
color: #153dee;
|
||||
border: none;
|
||||
padding: 12px 24px;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
transition: box-shadow 0.3s ease;
|
||||
}
|
||||
|
||||
#ahmet-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
|
||||
gap: 10px;
|
||||
padding: 120px 70px 70px 70px;
|
||||
}
|
||||
|
||||
#ahmet-container img {
|
||||
width: 100%;
|
||||
max-width: 250px;
|
||||
height: auto;
|
||||
border-radius: 8px;
|
||||
object-fit: cover;
|
||||
}
|
||||
/* Cz Scores tab */
|
||||
|
||||
#czscores-btn {
|
||||
background-color: aliceblue;
|
||||
color: #153dee;
|
||||
border: none;
|
||||
padding: 12px 24px;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
transition: box-shadow 0.3s ease;
|
||||
}
|
||||
␍
|
||||
+11
-1
@@ -17,7 +17,8 @@ html, body {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
#background-video,
|
||||
#calendar-background-video {
|
||||
#calendar-background-video,
|
||||
#czscores-background-video {
|
||||
position: fixed;
|
||||
right: 0%;
|
||||
left: 0%;
|
||||
@@ -75,6 +76,15 @@ html, body {
|
||||
transition: border-color 0.4s ease, color 0.4s ease;
|
||||
}
|
||||
|
||||
/* ── Cz Scores-themed top bar buttons ─────────────────── */
|
||||
#top-line.czscores-theme button {
|
||||
border-bottom-color: #B5B1C6;
|
||||
border-left-color: #B5B1C6;
|
||||
border-right-color: #B5B1C6;
|
||||
color: #B84457;
|
||||
transition: border-color 0.4s ease, color 0.4s ease;
|
||||
}
|
||||
|
||||
title {
|
||||
font-size: large;
|
||||
font-weight: 100;
|
||||
|
||||
Binary file not shown.
Reference in new issue
Block a user