Implement complete events system with modern styling and navigation

- Added comprehensive event content structure with taxonomy support
- Implemented speaker and tags taxonomies with full template system
- Created event migration from Jekyll format with proper frontmatter
- Added modern Bulma-based styling with Berlin PHP color palette
- Implemented paginated events listing (20 per page)
- Added clickable taxonomy links with orange hover effects
- Removed all text underlines, replaced with background hover effects
- Added Meetup.com integration in navigation and footer
- Created comprehensive documentation in CLAUDE.md
- Fixed link styling to use colors instead of underlines

Author: Anne-Julia Seitz

.claude/settings.local.json

@@ -7,7 +7,8 @@
       "Bash(mkdir:*)",
       "Bash(curl:*)",
       "Bash(zola serve:*)",
-      "Bash(git add:*)"
+      "Bash(git add:*)",
+      "mcp__playwright__browser_navigate"
     ],
     "deny": []
   }

CLAUDE.md

@@ -0,0 +1,150 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Project Overview
+
+This is the **Berlin PHP Usergroup** website built with **Zola** static site generator. The site was migrated from Jekyll and focuses on showcasing meetup events, talks, and community information.
+
+**Key Architecture Decisions:**
+- **Zola SSG**: Uses Zola for fast static site generation
+- **Bulma CSS**: All styling uses Bulma framework (NEVER use Tailwind CSS)
+- **Event-Centric**: Content is organized around meetup events with rich metadata
+- **English Content**: Events and pages support only English
+
+## Essential Commands
+
+```bash
+# Development server
+zola serve --port 8082
+
+# Build for production
+zola build
+
+# Check internal links
+zola check
+```
+
+## Content Structure & Architecture
+
+### Events Architecture
+Events are the core content type with a specific structure:
+
+**Directory Structure:**
+```
+content/events/
+├── _index.md              # Events listing page (paginated, 20 per page)
+└── YYYY-MM-DD-event-name/
+    └── index.md           # Individual event page
+```
+
+**Event Frontmatter Schema:**
+```toml
++++
+title = "Event Title"
+description = "SEO description"
+date = "YYYY-MM-DD"
+
+[taxonomies]
+speaker = ["Speaker Name 1", "Speaker Name 2"]
+tags = ["Topic1", "Topic2"]
+
+[extra]
+location = "Venue Name"
++++
+```
+
+### Taxonomies System
+The site uses two main taxonomies defined in `config.toml`:
+- `speaker`: Links events by speakers (generates `/speaker/` pages)  
+- `tags`: Links events by topics (generates `/tags/` pages)
+
+### Template Architecture
+- `base.html`: Main layout with Bulma navbar, footer, meta tags
+- `events.html`: Event listing with pagination and sidebar
+- `event.html`: Individual event page template
+- `taxonomy_list.html`: Lists all speakers/tags
+- `taxonomy_single.html`: Shows all events for a specific speaker/tag
+
+## CSS Framework: Bulma Only
+
+**CRITICAL**: This site uses **Bulma CSS framework exclusively**. 
+
+**Bulma Classes to Use:**
+- Layout: `container`, `columns`, `column`, `section`
+- Components: `box`, `tag`, `button`, `pagination`
+- Typography: `title is-1`, `subtitle`, `content`
+- Styling: `is-primary`, `is-light`, `is-php` (custom), `is-magenta` (custom)
+
+**Color System:**
+All colors are defined in `static/styles.css` as CSS custom properties based on the Berlin PHP brand palette:
+
+```css
+:root {
+    --dark-charcoal: #333333;      /* Dark gray/black */
+    --dark-blue: #4F5B93;          /* Primary brand blue */
+    --php-blue: #8892BF;           /* Light PHP blue */
+    --orange-red: #F75900;         /* Bright orange accent */
+    --warning-yellow: #FFAA00;     /* Warning/highlight yellow */
+    --light-gray: #F2F2F2;         /* Background gray */
+    --dark-magenta-color: #793862; /* Speaker tags magenta */
+}
+```
+
+**Tag Color Usage:**
+- `.tag.is-php` - Light blue (`--php-blue`) for topic/technology tags
+- `.tag.is-magenta` - Magenta (`--dark-magenta-color`) for speaker tags
+- `.tag.is-warning` - Yellow (`--warning-yellow`) for warnings/important items
+- `.tag.is-highlight` - Orange (`--orange-red`) for special highlights
+- `.tag.is-dark` - Dark (`--dark-charcoal`) for secondary elements
+
+**Assets:**
+- CSS: `static/lib/bulma.min.css` + `static/styles.css`
+- Branding: `static/logo.svg`, `static/social-banner.png`
+
+## Event Migration Process
+
+When migrating events from old Jekyll site (`/home/dazz/Code/berlinphp/berlinphp.github.com.git/_posts/`):
+
+1. Convert Jekyll frontmatter (YAML) to Zola (TOML)
+2. Transform speaker list to `[taxonomies]` format
+3. Move `date` from `[extra]` to main frontmatter for pages
+4. Create directory structure: `content/events/YYYY-MM-DD-name/index.md`
+5. Preserve bilingual content (English + German sections), but in most cases the site will only display English content.
+
+## Configuration Notes
+
+**config.toml Key Settings:**
+- Taxonomies: `speaker` and `tags` with RSS feeds enabled
+- Pagination: Events paginated at 20 per page
+- Feeds: RSS enabled for main content and taxonomies
+- Social: Mastodon, GitHub, Flickr integration configured
+
+**Build Settings:**
+- SASS compilation enabled
+- HTML minification enabled
+- Search index generation enabled
+- Syntax highlighting with "base16-ocean-dark" theme
+
+## Development Workflow
+
+1. **Local Development**: Use `zola serve --port 8082` for live reload
+2. **Content Creation**: Follow event directory structure exactly
+3. **Styling**: Only use Bulma classes, extend with `static/styles.css` if needed
+4. **Templates**: Maintain Bulma compatibility across all templates
+5. **Testing**: Check with `zola check` before deployment
+
+## Site Structure
+
+**Content Sections:**
+- `/`: Homepage with hero and recent events
+- `/events/`: Paginated archive of all meetups
+- `/speaker/`: Taxonomy pages for speakers
+- `/tags/`: Taxonomy pages for topics
+- `/pages/`: Static pages (contact, imprint, etc.)
+
+**Static Assets in `/static/`:**
+- Bulma CSS framework
+- Custom site styles
+- Brand assets (logos, social banner)
+- Favicon and icons

config.toml

@@ -1,7 +1,7 @@
 # Berlin PHP Usergroup Website
 # Zola Configuration
 
-base_url = "https://www.bephpug.de"
+base_url = "/"
 title = "Berlin PHP Usergroup"
 description = "The Berlin PHP Usergroup community - Monthly meetups, talks, and networking for PHP developers in Berlin"
 
@@ -19,6 +19,7 @@ generate_feeds = true
 # Taxonomies
 taxonomies = [
     { name = "tags", feed = true },
+    { name = "speaker", feed = true },
 ]
 
 # Markdown configuration
@@ -40,6 +41,7 @@ mastodon_url = "https://phpc.social/@bephpug"
 twitter_url = "https://twitter.com/berlinphp"
 github_url = "https://github.com/berlinphp"
 flickr_url = "https://www.flickr.com/groups/bephpug/"
+meetup_url = "https://www.meetup.com/de-DE/berlin-php-usergroup/"
 
 # Default meetup location
 default_location = "Co-Up Berlin"

content/events/2012-03-06-march-2012-meetup/index.md

@@ -0,0 +1,56 @@
++++
+title = "Meetup on March, 6th 2012 / Treffen am 6. März 2012"
+description = "March 2012 meetup focused on shop systems with talks about various e-commerce platforms including Sylius, OXID, Magento, osCommerce, and TYPO3."
+date = "2012-03-06"
+
+[taxonomies]
+speaker = ["Daniel Fahlke", "Thomas Lohner", "Martin Rothenberger", "Fabian Blechschmidt", "Markus Will", "Nicole Cordes"]
+tags = ["E-commerce", "Shop Systems", "Sylius", "OXID", "Magento", "osCommerce", "TYPO3"]
+
+[extra]
+location = "co.up"
++++
+
+## English
+
+This month's meetup has a focus on shop systems. Nearly everybody dealt with
+them at some point and there are countless e-commerce systems around.
+In several talks we try to give an overview of pros and cons of a handful
+shopping systems.
+
+So far the following shop systems will be presented:
+
+* "Sylius" by Daniel Fahlke
+* "OXID" by Thomas Lohner
+* "Magento Commerce & Magento Enterprise" by Martin Rothenberger
+* "Preview to Magento 2" by Fabian Blechschmidt
+* "osCommerce 2.x and a sneak peak into 3.x" by Markus Will
+* "TYPO3 shopping solutions" by Nicole Cordes
+
+As usual the meetup will be at [co.up](http://www.bephpug.de/location.html)
+and drinks will be available for a small fee. We'll meet on March, 6th at 7pm,
+the talks start around 7:30pm.
+
+Happy to see you there!
+
+## Deutsch
+
+Nahezu jeder hat mal mit Shoppingsystemen zu tun gehabt oder immer noch damit
+zu tun und den Überblick über die Systeme zu behalten ist nahezu unmöglich.
+Das März Treffen versucht ein wenig Licht auf die Auswahl zu werfen und stellt
+einige Shopsysteme vor.
+
+Bisher haben wir folgende Vorträge:
+
+* "Sylius" von Daniel Fahlke
+* "OXID" von Thomas Lohner
+* "Magento Commerce & Magento Enterprise" von Martin Rothenberger
+* "Preview to Magento 2" von Fabian Blechschmidt
+* "osCommerce 2.x und Ausblick auf 3.x" von Markus Will
+* "TYPO3 Shoplösungen" von Nicole Cordes
+
+Wie immer treffen wir uns bei [co.up](http://www.bephpug.de/location.html),
+Getränke sind gegen ein kleines Entgelt zu haben. Wir treffen uns am 6. März um 19 Uhr,
+die Vorträge beginnen gegen 19:30.
+
+Wir freuen uns auf euch.

content/events/2023-12-21-scalable-apis-laravel/_index.md

@@ -1,19 +1,8 @@
 +++
-title = "Meetup Archive"
+title = "Previous Events"
 description = "Archive of all Berlin PHP Usergroup meetups, talks, and presentations. Browse our history of community events and technical content."
 sort_by = "date"
-template = "archive.html"
-page_template = "talk.html"
+template = "events.html"
+page_template = "event.html"
+paginate_by = 20
 +++
-
-# Meetup Archive
-
-Welcome to our archive of past **Berlin PHP Usergroup** meetups! Here you'll find information about all our events, including talk summaries, speaker details, and resources shared during our monthly gatherings.
-
-## Browse by Year
-
-Use the filters below to explore our meetup history, or scroll down to see all events chronologically.
-
----
-
-*Looking for something specific? Use your browser's search function (Ctrl+F / Cmd+F) to find topics, speakers, or technologies.*