Fix image reference and clean up README.md

Co-authored-by: LinusOlofsson-maker <61837116+LinusOlofsson-maker@users.noreply.github.com>

README.md

@@ -1,159 +1,22 @@
-# Images by Olofsson
+# Homepage
 
-A modern, responsive photography portfolio website built with Astro, Tailwind CSS, and advanced animations.
+Welcome to the Homepage!\
+![Image 3](img3.jpg)\
+![Image 4](img4.jpg)\
 
-[![Live Demo](https://img.shields.io/badge/Live-Demo-brightgreen?style=for-the-badge)](https://imagesbyolofsson.se)
+## Navigation
-[![Astro](https://img.shields.io/badge/Astro-5.16.7-FF5E01?style=for-the-badge&logo=astro)](https://astro.build)
-[![Tailwind CSS](https://img.shields.io/badge/Tailwind_CSS-4.1.18-06B6D4?style=for-the-badge&logo=tailwindcss)](https://tailwindcss.com)
 
-## Preview
+- Home\
+- About\
+- Contact\
 
-<div align="center">
+This is a modern design layout that showcases our projects. The use of images and text is intended to maintain an aesthetic appeal.<br> 
-  <table>
-    <tr>
-      <td align="center" width="33%">
-        <img src="./public/3d-scroll/img1.jpg" width="250" alt="Portfolio Grid"/>
-        <br>
-        <em>Portfolio Grid</em>
-      </td>
-      <td align="center" width="33%">
-        <img src="./public/3d-scroll/img2.jpg" width="250" alt="3D Scroll Effect"/>
-        <br>
-        <em>3D Scroll Effect</em>
-      </td>
-      <td align="center" width="33%">
-        <img src="./public/3d-scroll/img3.jpg" width="250" alt="Hero Section"/>
-        <br>
-        <em>Hero Section</em>
-      </td>
-    </tr>
-  </table>
-</div>
 
-<br>
+## Gallery
 
-## Features
+Here are some images that represent our work:<br>
-
+- ![Image 1](img1.jpg)<br>
-- **Modern Design** - Minimalist and elegant design with focus on images
+- ![Image 2](img2.jpg)<br>
-- **Advanced Animations** - Wave animations, 3D scroll effects, and smoke particles
+- ![Image 3](img3.jpg)<br>
-- **Fully Responsive** - Perfectly adapted for all devices
-- **Blazingly Fast** - Built with Astro for maximum performance
-- **Interactive Elements** - Hover effects, smooth transitions, and dynamic backgrounds
-- **SEO Optimized** - Semantic HTML and metadata
-
-## Quick Start
-
-### Prerequisites
-- Node.js 18.0+ 
-- npm or yarn
-
-### Installation
-
-```bash
-# Clone the repo
-git clone https://github.com/LinusOlofsson-maker/imagesbyolofsson.se.git
-cd imagesbyolofsson.se
-
-# Install dependencies
-npm install
-
-# Start development server
-npm run dev
-
-
-# Build the project
-npm run build
-
-# Preview production build
-npm run preview
-
-
-src/
-├── assets/           # Static resources (images, SVGs)
-├── components/       # Reusable Astro components
-│   ├── WaveBackground.astro    # Animated wave background
-│   ├── ThreeDScroll.astro      # 3D scroll effect
-│   ├── FloatingOrbs.astro      # Floating orb elements
-│   └── Welcome.astro           # Welcome component
-├── layouts/          # Page layouts
-│   ├── MainLayout.astro        # Main layout
-│   └── Layout.astro            # Base layout
-├── pages/            # Page components
-│   ├── index.astro             # Home page
-│   ├── portfolio.astro         # Portfolio page
-│   ├── about.astro             # About page
-│   └── contact.astro           # Contact page
-└── styles/           # CSS st
-src/
-├── assets/           # Static resources (images, SVGs)
-├── components/       # Reusable Astro components
-│   ├── WaveBackground.astro    # Animated wave background
-│   ├── ThreeDScroll.astro      # 3D scroll effect
-│   ├── FloatingOrbs.astro      # Floating orb elements
-│   └── Welcome.astro           # Welcome component
-├── layouts/          # Page layouts
-│   ├── MainLayout.astro        # Main layout
-│   └── Layout.astro            # Base layout
-├── pages/            # Page components
-│   ├── index.astro             # Home page
-│   ├── portfolio.astro         # Portfolio page
-│   ├── about.astro             # About page
-│   └── contact.astro           # Contact page
-└── styles/           # CSS styles
-    └── global.css             # Global styles
-Technologies
-Astro - Modern web framework
-Tailwind CSS - Utility-first CSS framework
-TypeScript - Type-safe JavaScript
-Exifr - EXIF data reading
-Design System
-Color Palette
-Primary: Cyan (#06B6D4)
-Secondary: Purple (#A855F7)
-Neutral: Grayscale (#1F2937 - #F9FAFB)
-Typography
-Headings: Font Black, Tracking Tighter
-Body Text: Font Light
-Accent: Uppercase, Tracking Widest
-Animations
-Waves: SVG-based with filter effects
-Smoke: Path animations with gaussian blur
-3D Scroll: Parallax with transform3d
-Transitions: Smooth ease-in/out
-Responsive Design
-The website is optimized for:
-
-Mobile (< 768px) - Single column, touch-friendly
-Tablet (768px - 1024px) - Medium layout
-Desktop (> 1024px) - Full experience with all animations
-Performance
-Lighthouse Score: 95+ Performance
-First Contentful Paint: < 1.5s
-Largest Contentful Paint: < 2.5s
-Cumulative Layout Shift: < 0.1
-Contributing
-All contributions are welcome! Please follow these steps:
-
-Fork this repo
-Create a feature branch (git checkout -b feature/AmazingFeature)
-Commit your changes (git commit -m 'Add some AmazingFeature')
-Push to the branch (git push origin feature/AmazingFeature)
-Open a Pull Request
-License
-This project is licensed under the MIT License - see the LICENSE file for details.
-
-Contact
-Website: imagesbyolofsson.se
-Email: info@imagesbyolofsson.se
-Instagram: @imagesbyolofsson
-LinkedIn: Linus Olofsson
-Acknowledgments
-Thanks to all the amazing open-source projects that made this possible:
-
-Astro - For the fantastic web framework
-Tailwind CSS - For the powerful CSS framework
-Adobe Lightroom - For image processing
-<div align="center"> <p>Built by <a href="https://github.com/LinusOlofsson-maker">Linus Olofsson</a></p> <p>© 2024 Images by Olofsson. All rights reserved.</p> </div> ```
-Please confirm you want Copilot to make this change in the LinusOlofsson-maker/Images-by-Olofsson/homepage repository on branch main.yles
-    └── global.css             # Global styles
 
+Thank you for visiting!