copilot-swe-agent[bot]andLinusOlofsson-maker
25732fcfc8
Co-authored-by: LinusOlofsson-maker <61837116+LinusOlofsson-maker@users.noreply.github.com>
103 lines
2.0 KiB
Markdown
103 lines
2.0 KiB
Markdown
# Images by Olofsson
|
|
|
|
A modern, responsive photography portfolio website built with Astro, Tailwind CSS, and advanced animations.
|
|
|
|
<br>
|
|
|
|
<div align="center">
|
|
<table>
|
|
<tr>
|
|
<td align="center">
|
|
<img src="https://raw.githubusercontent.com/Images-by-Olofsson/homepage/main/public/3d-scroll/img1.jpg" width="250" alt="Portfolio Grid">
|
|
<br><em>Portfolio Grid</em>
|
|
</td>
|
|
<td align="center">
|
|
<img src="https://raw.githubusercontent.com/Images-by-Olofsson/homepage/main/public/3d-scroll/img2.jpg" width="250" alt="3D Scroll Effect">
|
|
<br><em>3D Scroll Effect</em>
|
|
</td>
|
|
<td align="center">
|
|
<img src="https://raw.githubusercontent.com/Images-by-Olofsson/homepage/main/public/3d-scroll/img3.jpg" width="250" alt="Hero Section">
|
|
<br><em>Hero Section</em>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
<br>
|
|
<br>
|
|
|
|
## Features
|
|
|
|
Modern design with minimalist aesthetics and focus on imagery. Advanced animations including wave effects, 3D scroll transforms, and smoke particles. Fully responsive across all devices with optimized performance.
|
|
|
|
<br>
|
|
|
|
## Quick Start
|
|
|
|
**Prerequisites**
|
|
|
|
Node.js 18.0 or higher
|
|
|
|
**Installation**
|
|
|
|
```bash
|
|
git clone https://github.com/Images-by-Olofsson/homepage.git
|
|
cd homepage
|
|
npm install
|
|
```
|
|
|
|
**Development**
|
|
|
|
```bash
|
|
npm run dev
|
|
```
|
|
|
|
**Build**
|
|
|
|
```bash
|
|
npm run build
|
|
npm run preview
|
|
```
|
|
|
|
<br>
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
src/
|
|
├── assets/
|
|
├── components/
|
|
│ ├── WaveBackground.astro
|
|
│ ├── ThreeDScroll.astro
|
|
│ ├── FloatingOrbs.astro
|
|
│ └── Welcome.astro
|
|
├── layouts/
|
|
│ ├── MainLayout.astro
|
|
│ └── Layout.astro
|
|
├── pages/
|
|
│ ├── index.astro
|
|
│ ├── portfolio.astro
|
|
│ ├── about.astro
|
|
│ └── contact.astro
|
|
└── styles/
|
|
└── global.css
|
|
```
|
|
|
|
<br>
|
|
|
|
## Technologies
|
|
|
|
Astro, Tailwind CSS, TypeScript, Exifr
|
|
|
|
<br>
|
|
|
|
## License
|
|
|
|
MIT License - see LICENSE file for details
|
|
|
|
<br>
|
|
|
|
<div align="center">
|
|
<p>Built by Linus Olofsson</p>
|
|
</div>
|