diff options
Diffstat (limited to 'static')
18 files changed, 42 insertions, 209 deletions
diff --git a/static/css/carousel.css b/static/css/carousel.css deleted file mode 100644 index b354591..0000000 --- a/static/css/carousel.css +++ /dev/null @@ -1,48 +0,0 @@ -/* File: carousel.css */ - -.carousel { - width: 100%; - max-width: 46rem; /* As per your specification */ - margin: 0 auto; -} - -.carousel-main-image { - width: 100%; - height: auto; - margin-bottom: 20px; -} - -.carousel-main-image img { - width: 100%; - height: auto; - display: block; -} - -.carousel-vignettes { - display: flex; - justify-content: center; - gap: 10px; - overflow-x: auto; - padding: 10px 0; -} - -.vignette { - cursor: pointer; - transition: opacity 0.3s ease; - flex: 0 0 auto; -} - -.vignette:hover { - opacity: 0.8; -} - -.vignette.active { - border: 2px solid #007bff; -} - -.vignette img { - display: block; - width: 120px; - height: 80px; - object-fit: cover; -} diff --git a/static/css/custom.css b/static/css/custom.css index 57cf620..914db04 100644 --- a/static/css/custom.css +++ b/static/css/custom.css @@ -13,6 +13,7 @@ main { margin: 0 auto; padding: 0 1em; padding-top: 2em; + padding-bottom: 2em; } /* Typography */ @@ -27,9 +28,11 @@ h3 { h1 { font-size: 1.4rem; } + h2 { font-size: 1.3rem; } + h3 { font-size: 1.2rem; } diff --git a/static/css/resume.css b/static/css/resume.css index e3f2d8f..daf322d 100644 --- a/static/css/resume.css +++ b/static/css/resume.css @@ -1,80 +1,80 @@ body { - font-family: sans-serif; - font-size: 1em; - line-height: 1.8em; - color: #0e0e0b; - margin: 1em auto; - padding: 0 0.55em; - max-width: 50rem; + font-family: sans-serif; + font-size: 1em; + line-height: 1.8em; + color: #0e0e0b; + margin: 1em auto; + padding: 0 0.55em; + max-width: 50rem; } h1 { - color: #0e0e0b; - font-size: 1.3rem; + color: #0e0e0b; + font-size: 1.3rem; } h2, h3 { - border-bottom: 1px solid #eee; - font-style: italic; + border-bottom: 1px solid #eee; + font-style: italic; } h2 { - margin-top: 1.25em; - margin-bottom: 0.41em; - font-size: 1.2rem; + margin-top: 1.25em; + margin-bottom: 0.41em; + font-size: 1.2rem; } h3 { - margin-top: 1.5em; - margin-bottom: 0.5em; - font-size: 1rem; + margin-top: 1.5em; + margin-bottom: 0.5em; + font-size: 1rem; } hr { - color: #000111; - background-color: #000111; - border: none; - height: 1px; + color: #000111; + background-color: #000111; + border: none; + height: 1px; } a { - color: #047bc2; - transition: color 0.1s ease-in-out; + color: #047bc2; + transition: color 0.1s ease-in-out; } table { - width: 100%; - border-spacing: 0px; - outline: none; + width: 100%; + border-spacing: 0px; + outline: none; } td { - padding-right: 0.7em; + padding-right: 0.7em; } td:last-child { - text-align: right; + text-align: right; } table, th, td { - font-family: monospace; - color: #000; + font-family: monospace; + color: #000; } #title-block-header { - padding-right: 10px; - font-size: 1.4em; - display: flex; - font-family: monospace; - justify-content: space-between; - align-items: center; - padding-top: 0.5rem; - border-bottom: 1px; + padding-right: 10px; + font-size: 1.4em; + display: flex; + font-family: monospace; + justify-content: space-between; + align-items: center; + padding-top: 0.5rem; + border-bottom: 1px; } #experience { - padding-top: 20px; + padding-top: 20px; } diff --git a/static/images/fogcutter/IMG_0988.jpeg b/static/images/fogcutter/IMG_0988.jpeg Binary files differdeleted file mode 100644 index a63f94c..0000000 --- a/static/images/fogcutter/IMG_0988.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_0989.jpeg b/static/images/fogcutter/IMG_0989.jpeg Binary files differdeleted file mode 100644 index 85dabbd..0000000 --- a/static/images/fogcutter/IMG_0989.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_0990.jpeg b/static/images/fogcutter/IMG_0990.jpeg Binary files differdeleted file mode 100644 index 1f37d65..0000000 --- a/static/images/fogcutter/IMG_0990.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_0991.jpeg b/static/images/fogcutter/IMG_0991.jpeg Binary files differdeleted file mode 100644 index df1ce63..0000000 --- a/static/images/fogcutter/IMG_0991.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_0992.jpeg b/static/images/fogcutter/IMG_0992.jpeg Binary files differdeleted file mode 100644 index 5e25507..0000000 --- a/static/images/fogcutter/IMG_0992.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_0993.jpeg b/static/images/fogcutter/IMG_0993.jpeg Binary files differdeleted file mode 100644 index b361202..0000000 --- a/static/images/fogcutter/IMG_0993.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_0994.jpeg b/static/images/fogcutter/IMG_0994.jpeg Binary files differdeleted file mode 100644 index 8615f82..0000000 --- a/static/images/fogcutter/IMG_0994.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_0995.jpeg b/static/images/fogcutter/IMG_0995.jpeg Binary files differdeleted file mode 100644 index 549f777..0000000 --- a/static/images/fogcutter/IMG_0995.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_0996.jpeg b/static/images/fogcutter/IMG_0996.jpeg Binary files differdeleted file mode 100644 index 5c2da48..0000000 --- a/static/images/fogcutter/IMG_0996.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_0997.jpeg b/static/images/fogcutter/IMG_0997.jpeg Binary files differdeleted file mode 100644 index 1f39c42..0000000 --- a/static/images/fogcutter/IMG_0997.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_0998.jpeg b/static/images/fogcutter/IMG_0998.jpeg Binary files differdeleted file mode 100644 index 77183f1..0000000 --- a/static/images/fogcutter/IMG_0998.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_0999.jpeg b/static/images/fogcutter/IMG_0999.jpeg Binary files differdeleted file mode 100644 index 2cd5b3a..0000000 --- a/static/images/fogcutter/IMG_0999.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_1001.jpeg b/static/images/fogcutter/IMG_1001.jpeg Binary files differdeleted file mode 100644 index ff00a56..0000000 --- a/static/images/fogcutter/IMG_1001.jpeg +++ /dev/null diff --git a/static/images/fogcutter/IMG_1002.jpeg b/static/images/fogcutter/IMG_1002.jpeg Binary files differdeleted file mode 100644 index 3c08ec1..0000000 --- a/static/images/fogcutter/IMG_1002.jpeg +++ /dev/null diff --git a/static/js/carousel.js b/static/js/carousel.js deleted file mode 100644 index f30f934..0000000 --- a/static/js/carousel.js +++ /dev/null @@ -1,122 +0,0 @@ -function createCarousel(images) { - const carousel = document.createElement('div'); - carousel.className = 'carousel'; - let currentIndex = 0; - - // Create main image container - const mainImageContainer = document.createElement('div'); - mainImageContainer.className = 'carousel-main-image'; - carousel.appendChild(mainImageContainer); - - // Create vignette container - const vignetteContainer = document.createElement('div'); - vignetteContainer.className = 'carousel-vignettes'; - carousel.appendChild(vignetteContainer); - - // Function to update the main displayed image - function updateMainImage() { - mainImageContainer.innerHTML = ''; - const img = document.createElement('img'); - img.src = images[currentIndex]; - img.style.width = '100%'; - img.style.height = 'auto'; - mainImageContainer.appendChild(img); - } - - // Function to create vignettes - function createVignettes() { - vignetteContainer.innerHTML = ''; - const containerWidth = carousel.offsetWidth; - const vignetteWidth = 120; - const vignetteHeight = 80; - const vignetteMargin = 10; - const maxVignettes = Math.floor(containerWidth / (vignetteWidth + vignetteMargin)); - - const startIndex = Math.max(0, currentIndex - Math.floor(maxVignettes / 2)); - const endIndex = Math.min(images.length, startIndex + maxVignettes); - - for (let i = startIndex; i < endIndex; i++) { - const vignette = document.createElement('div'); - vignette.className = 'vignette'; - if (i === currentIndex) vignette.classList.add('active'); - - const img = document.createElement('img'); - img.src = images[i]; - img.style.width = vignetteWidth + 'px'; - img.style.height = vignetteHeight + 'px'; - img.style.objectFit = 'cover'; - - vignette.appendChild(img); - vignette.addEventListener('click', () => goToImage(i)); - vignetteContainer.appendChild(vignette); - } - } - - // Function to go to a specific image - function goToImage(index) { - currentIndex = index; - updateMainImage(); - createVignettes(); - } - - // Function to go to the next image - function nextImage() { - currentIndex = (currentIndex + 1) % images.length; - updateMainImage(); - createVignettes(); - } - - // Function to go to the previous image - function prevImage() { - currentIndex = (currentIndex - 1 + images.length) % images.length; - updateMainImage(); - createVignettes(); - } - - // Event listener for keyboard navigation - document.addEventListener('keydown', (e) => { - if (e.key === 'ArrowRight') nextImage(); - if (e.key === 'ArrowLeft') prevImage(); - }); - - // Initialize the carousel - updateMainImage(); - - // Use setTimeout to delay the initial creation of vignettes - setTimeout(() => { - createVignettes(); - }, 0); - - // Recalculate vignettes on window resize - window.addEventListener('resize', createVignettes); - - return carousel; -} - -// Function to initialize the carousel with specific images -function initializeCarousel(containerId, images) { - document.addEventListener('DOMContentLoaded', () => { - const container = document.getElementById(containerId); - if (container) { - const carouselElement = createCarousel(images); - container.appendChild(carouselElement); - - // Use ResizeObserver to detect when the carousel is fully rendered - const resizeObserver = new ResizeObserver(entries => { - for (let entry of entries) { - if (entry.target === carouselElement) { - createVignettes(); - resizeObserver.disconnect(); // Stop observing once vignettes are created - } - } - }); - - resizeObserver.observe(carouselElement); - } else { - console.error(`Container with id "${containerId}" not found.`); - } - }); -} - -// Make the initializeCarousel function globally available -window.initializeCarousel = initializeCarousel; |
