{"name":"Personal Website 10-25-2025","description":"Design and build your personal website to showcase your portfolio, hobbies, or personal brand. This project will guide you through creating a visually appealing and functional site using HTML and CSS. A perfect opportunity to dive into web development and create a unique online presence!","photo":"https://res.cloudinary.com/dzv7hjwfn/image/upload/pmsyhkwmcmnhrtf2gkbs","view_count":0,"fork_count":0,"expires_at":null,"created_at":"2025-10-26T03:24:23.678654Z","updated_at":"2025-10-26T03:24:23.678656Z","user_id":70,"status":"PRIVATE","parent_id":10148,"id":10316,"user":{"username":"kris10","id":70,"password_hash":"$2b$12$abwA8Crfrc22ANEFpZErHeQDLvhr9RJOD0lMNLh7PJGrAn7M//qEC","updated_at":"2024-03-23T19:20:56.974485Z","reset_token_expiry":"2025-01-14T23:32:05.455609","subscription_status":"active","photo":null,"email":"kristen@jippity.pro","recess_id":"0c22a63e-e8fa-453f-a493-d113532a13c2","created_at":"2024-03-23T19:20:56.974481Z","reset_token":"GD2dODEjNUbAH88Yx-1HMTa4uc_OUtvTa0c5D-VKUhw","stripe_customer_id":"cus_RPbovGjLueUufv","seats":200},"code":{"script.js":"// Click on the index.html file above this!\n// We are currently in the script.js file - not much to see here.\n// You can add more dynamic and interactive features to your website with javascript.\n// But we aren't using any javascript in this template yet!","style.css":"/* 🎨 STYLE YOUR SITE HERE */\n/* \nThis file controls how your website *looks*!\nIt works together with your HTML file.\nEach \"section\" below changes the look of a part of the HTML.\n*/\n\n/* 🧱 The whole page setup */\nbody {\n background: linear-gradient(180deg, #e0f7e9, #b2e1d5);\n /* This makes a light green-to-teal background fade from top to bottom */\n color: #222;\n /* This sets the text color to dark gray */\n margin: 0;\n padding: 0;\n /* These remove the default white edges around the page */\n text-align: center;\n /* This centers most text on the page */\n font-family: Arial, sans-serif;\n /* This picks the font used for all text */\n}\n\n/* 🌿 The top banner area with your name and picture */\nheader {\n background-color: #4caf50;\n /* Dark green background for the header */\n color: white;\n /* Makes all text in the header white */\n padding: 2rem 1rem;\n /* Adds space inside the header (top/bottom 2rem, sides 1rem) */\n}\n\n/* ✨ The big title in the header */\nheader h1 {\n margin: 0;\n /* Removes extra space around the title */\n font-size: 2.5rem;\n /* Makes the title big! */\n}\n\n/* 💬 The short message under the title */\nheader p {\n margin-top: 0.5rem;\n /* Adds a little space above the message */\n font-size: 1.2rem;\n /* Makes the message a bit smaller than the title */\n opacity: 0.9;\n /* Slightly see-through look */\n}\n\n/* 📦 Each main section of your site (About, Projects, Links, etc.) */\nsection {\n max-width: 800px;\n /* Keeps your content from stretching too wide on big screens */\n margin: 2rem auto;\n /* Adds space above and below each section, and centers them */\n padding: 1rem;\n /* Adds space inside each section */\n text-align: left;\n /* Aligns the section text to the left */\n}\n\n/* 🖼️ The profile picture inside the header */\nimg.profile {\n max-width: 100%;\n /* Makes sure the image fits the page and doesn't overflow */\n max-height: 300px;\n /* Keeps the image from getting too tall */\n object-fit: cover;\n /* Crops the image nicely if it doesn’t fit the shape */\n border-radius: 50%;\n /* Makes the picture round like a circle */\n border: 5px solid #4caf50;\n /* Adds a green border around your picture */\n margin-top: 1rem;\n /* Adds space above the image */\n}\n\n/* 🟩 Headings for each section (About, Projects, etc.) */\nh2 {\n color: #4caf50;\n /* Makes section titles green */\n margin-bottom: 0.5rem;\n /* Adds a little space below the title */\n}\n\n/* 📋 Lists (like your projects or links) */\nul {\n list-style: none;\n /* Removes the little dots or numbers from lists */\n padding: 0;\n /* Removes the default padding on the left */\n}\n\n/* 📄 Each item in a list (a project or link) */\nli {\n background: white;\n /* Gives each list item a white card background */\n border-radius: 10px;\n /* Rounds the corners */\n box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);\n /* Adds a soft shadow below each card */\n margin: 0.5rem 0;\n /* Adds space between each card */\n padding: 0.75rem 1rem;\n /* Adds space inside the card */\n}\n\n/* 🦶 The footer at the bottom of your page */\nfooter {\n background-color: #4caf50;\n /* Green background like the header */\n color: white;\n /* White text */\n padding: 1rem;\n /* Adds space inside the footer */\n font-size: 0.9rem;\n /* Makes the text a bit smaller */\n margin-top: 3rem;\n /* Adds space between the footer and the content above */\n}\n\n/* 🔗 Links (like to your projects or favorite sites) */\na {\n color: #4caf50;\n /* Makes links green */\n text-decoration: none;\n /* Removes the underline by default */\n font-weight: bold;\n /* Makes links bold */\n}\n\n/* 🌈 What happens when you hover over a link */\na:hover {\n text-decoration: underline;\n /* Adds the underline back when your mouse goes over it */\n}","index.html":"\n\n\n\n\n\n\n\n\n\n\n\n \n \n \n \n [Your Name]'s Personal Website\n\n\n\n\n\n\n \n

Hi, I'm [Your Name Here]!

Welcome to my personal website 💻✨

\n\n \n \n

\n $\"Albert$ \n

\n\n \n

About Me

\n \n

Hello! I'm learning how to code and build websites. I love art, games, and exploring new ideas.

I'm also learning to build web games on Jippity!

\n\n \n

My Projects

\n \n

\n\n \n

Links I Love

Jippity
p5.js

\n\n \n \n\n \n \n\n\n\n"},"chat_history":[],"assets":[{"name":"sitecover","created_at":"2025-10-26T03:24:23.684426Z","resource_type":"image","tags":[],"project_id":10316,"creator":null,"cloudinary_id":"pmsyhkwmcmnhrtf2gkbs","deleted":false,"id":87662}],"messages_sent":0,"comments":[],"steps":[]}