body.html
Changed around line 1
+
+
Karine & François
+
A Tale of Two Gamers
+
+
+
+
+
+
Why We're Perfect Together
+
+
+
+
+
+
+
Gaming Life
+
PS5 gaming sessions are our favorite way to spend evenings together
+
+
+
+
Our Furry Family
+
Adventures with Kiki our energetic dog and lazy days with Minnie our beloved chonky cat
+
+
+
+
Outdoor Adventures
+
From peaceful paddleboarding to scenic hiking trails
+
+
+
+
Indoor Coziness
+
Board game battles and binge-watching our favorite shows
+
+
+
+
Foodie Love
+
Exploring Asian cuisine and our special weakness for peanut butter rolls
+
+
+
+
+
+
Made with 💕 by Karine & François
+
index.scroll
Changed around line 1
+ buildHtml
+ baseUrl https://karine-francois.scroll.pub
+ metaTags
+ title "Karine & François - Our Story Together"
+ description "The story of Karine and François - from gaming to hiking, and all the adventures in between with their pets Kiki and Minnie"
+ author "Karine & François"
+ editButton /edit.html
+ title Karine & François - Our Story Together
+ style.css
+ body.html
+ script.js
readme.scroll
Changed around line 1
+ # karine-francois.scroll.pub
+ Website generated by Claude from prompt: A website saying why Karine and Francois are together. They like gaming on the ps5, walking their dog kiki. Chilling at home with Minnie their old fat cat. They like small hikes, paddleboarding, board games. They like TV shows and movies. They love good food too, particularly Thai, Vietnamese and particularly peanut butter roll
script.js
Changed around line 1
+ document.addEventListener('DOMContentLoaded', () => {
+ // Smooth scroll for internal links
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+ anchor.addEventListener('click', function (e) {
+ e.preventDefault();
+ document.querySelector(this.getAttribute('href')).scrollIntoView({
+ behavior: 'smooth'
+ });
+ });
+ });
+
+ // Animate interest cards on scroll
+ const cards = document.querySelectorAll('.interest-card');
+
+ const observerOptions = {
+ threshold: 0.1,
+ rootMargin: '0px 0px -50px 0px'
+ };
+
+ const observer = new IntersectionObserver((entries) => {
+ entries.forEach(entry => {
+ if (entry.isIntersecting) {
+ entry.target.style.opacity = '1';
+ entry.target.style.transform = 'translateY(0)';
+ }
+ });
+ }, observerOptions);
+
+ cards.forEach(card => {
+ card.style.opacity = '0';
+ card.style.transform = 'translateY(20px)';
+ observer.observe(card);
+ });
+
+ // Create floating hearts animation
+ function createHeart() {
+ const heart = document.createElement('div');
+ heart.innerHTML = '❤️';
+ heart.style.position = 'absolute';
+ heart.style.left = Math.random() * 100 + '%';
+ heart.style.animation = `float ${Math.random() * 2 + 3}s linear`;
+ document.querySelector('.hearts-animation').appendChild(heart);
+
+ setTimeout(() => {
+ heart.remove();
+ }, 5000);
+ }
+
+ setInterval(createHeart, 1000);
+ });
+
+ @keyframes float {
+ 0% {
+ transform: translateY(0) rotate(0deg);
+ opacity: 1;
+ }
+ 100% {
+ transform: translateY(-50px) rotate(360deg);
+ opacity: 0;
+ }
+ }
style.css
Changed around line 1
+ :root {
+ --primary-color: #ff6b6b;
+ --secondary-color: #4ecdc4;
+ --text-color: #2d3436;
+ --background-color: #f9f9f9;
+ }
+
+ * {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ }
+
+ body {
+ font-family: 'Segoe UI', system-ui, sans-serif;
+ line-height: 1.6;
+ color: var(--text-color);
+ background-color: var(--background-color);
+ }
+
+ header {
+ text-align: center;
+ padding: 4rem 2rem;
+ background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
+ color: white;
+ }
+
+ h1 {
+ font-size: 3.5rem;
+ margin-bottom: 1rem;
+ text-shadow: 2px 2px 4px rgba(0,0,0,0.2);
+ }
+
+ .tagline {
+ font-size: 1.5rem;
+ opacity: 0.9;
+ }
+
+ .hero {
+ min-height: 60vh;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ text-align: center;
+ padding: 2rem;
+ background: linear-gradient(rgba(255,255,255,0.9), rgba(255,255,255,0.9)),
+ url('data:image/svg+xml,');
+ }
+
+ .hero h2 {
+ font-size: 2.5rem;
+ margin-bottom: 2rem;
+ color: var(--primary-color);
+ }
+
+ .interests {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+ gap: 2rem;
+ padding: 4rem 2rem;
+ }
+
+ .interest-card {
+ background: white;
+ padding: 2rem;
+ border-radius: 1rem;
+ box-shadow: 0 4px 6px rgba(0,0,0,0.1);
+ transition: transform 0.3s ease;
+ }
+
+ .interest-card:hover {
+ transform: translateY(-5px);
+ }
+
+ .interest-card h3 {
+ color: var(--primary-color);
+ margin-bottom: 1rem;
+ }
+
+ footer {
+ text-align: center;
+ padding: 2rem;
+ background-color: var(--text-color);
+ color: white;
+ }
+
+ @media (max-width: 768px) {
+ h1 {
+ font-size: 2.5rem;
+ }
+
+ .hero h2 {
+ font-size: 2rem;
+ }
+
+ .interests {
+ grid-template-columns: 1fr;
+ }
+ }
+
+ .hearts-animation {
+ height: 50px;
+ position: relative;
+ overflow: hidden;
+ }