Linus OlofssonandClaude Opus 5.5
1e921dfe37
- Homepage images: <Picture> from src/assets (AVIF/WebP/JPG srcset, width/ height, first image eager + fetchpriority high, rest lazy), Swedish alt texts. (The duplicate EXIF-laden copies in public/3d-scroll were deleted in 30e385e; README links now point at src/assets.) - Portfolio: originals are no longer referenced (no .src access), so Astro does not copy them to dist/. Small/Medium/Large downloads and the lightbox srcset are EXIF-free JPGs from getImage. Old -s/-m files are no longer imported. - Alt texts: Swedish fallback from date (EXIF or filename), never camera model or "undefined"; portfolio-meta.ts overrides per image. - Gallery items are <a href> to the large image (lightbox on click); download options are buttons; no empty H3, no H4 for the password box. - Stats beacon unchanged; item keys computed at build time (same format). - Script moved inside the layout so it is no longer rendered after </html>. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01WvE3C43Uwtv2vtnoFBLDw7
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/src/assets/images/3d-scroll/img1.jpg" width="250" alt="Portfolio Grid">
|
|
<br><em> More </em>
|
|
</td>
|
|
<td align="center">
|
|
<img src="https://raw.githubusercontent.com/Images-by-Olofsson/homepage/main/src/assets/images/3d-scroll/img2.jpg" width="250" alt="3D Scroll Effect">
|
|
<br><em> At </em>
|
|
</td>
|
|
<td align="center">
|
|
<img src="https://raw.githubusercontent.com/Images-by-Olofsson/homepage/main/src/assets/images/3d-scroll/img3.jpg" width="250" alt="Hero Section">
|
|
<br><em>Imagesbyolofsson.se</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>
|