From 4c697122ab3578577da63e98ba0759c9e7ce428f Mon Sep 17 00:00:00 2001
From: Ruben <post@rubensolvang.no>
Date: Sat, 1 Nov 2025 16:47:15 +0100
Subject: [PATCH] Add demo content and documentation for FolderWeb

Add about page with project philosophy and technical details

Add articles about Markdown, templates, and getting started

Implement demo content system that shows when no user content exists

Update logo to show FolderWeb branding

Improve Apache configuration for development environment
---
 app/default/content/about/metadata.ini        |   3 +
 app/default/content/about/page.md             |  89 ++++++++
 .../2025-10-15-markdown-guide/article.md      | 206 +++++++++++++++++
 .../2025-10-15-markdown-guide/metadata.ini    |   3 +
 .../article.md                                | 165 ++++++++++++++
 .../metadata.ini                              |   3 +
 .../2025-11-01-getting-started/article.md     |  79 +++++++
 .../2025-11-01-getting-started/metadata.ini   |   3 +
 app/default/content/articles/metadata.ini     |   4 +
 app/default/content/articles/page.md          |   3 +
 app/default/content/frontpage.php             |  48 ++++
 app/default/docs/styles/base.css              | 214 ------------------
 app/default/docs/templates/base.php           |  46 ----
 app/default/docs/templates/list.php           |  14 --
 app/default/templates/base.php                |   2 +-
 app/router.php                                |  15 +-
 development/apache/custom.conf                |   7 +-
 development/apache/default.conf               |  20 ++
 development/compose.yaml                      |  29 ++-
 19 files changed, 660 insertions(+), 293 deletions(-)
 create mode 100644 app/default/content/about/metadata.ini
 create mode 100644 app/default/content/about/page.md
 create mode 100644 app/default/content/articles/2025-10-15-markdown-guide/article.md
 create mode 100644 app/default/content/articles/2025-10-15-markdown-guide/metadata.ini
 create mode 100644 app/default/content/articles/2025-10-28-templates-and-customization/article.md
 create mode 100644 app/default/content/articles/2025-10-28-templates-and-customization/metadata.ini
 create mode 100644 app/default/content/articles/2025-11-01-getting-started/article.md
 create mode 100644 app/default/content/articles/2025-11-01-getting-started/metadata.ini
 create mode 100644 app/default/content/articles/metadata.ini
 create mode 100644 app/default/content/articles/page.md
 create mode 100644 app/default/content/frontpage.php
 delete mode 100644 app/default/docs/styles/base.css
 delete mode 100644 app/default/docs/templates/base.php
 delete mode 100644 app/default/docs/templates/list.php
 create mode 100644 development/apache/default.conf

diff --git a/app/default/content/about/metadata.ini b/app/default/content/about/metadata.ini
new file mode 100644
index 0000000..7e73f4a
--- /dev/null
+++ b/app/default/content/about/metadata.ini
@@ -0,0 +1,3 @@
+title = "About FolderWeb"
+menu = true
+menu_order = 2
diff --git a/app/default/content/about/page.md b/app/default/content/about/page.md
new file mode 100644
index 0000000..e400e3e
--- /dev/null
+++ b/app/default/content/about/page.md
@@ -0,0 +1,89 @@
+# About FolderWeb
+
+FolderWeb is a minimalist PHP framework designed for simplicity, longevity, and maintainability. It's built on a simple philosophy: **just enough, nothing more**.
+
+## Philosophy
+
+Modern web development has become unnecessarily complex. Build tools, package managers, JavaScript frameworks that change every few months—it's exhausting and unsustainable.
+
+FolderWeb is different. It's built to:
+
+- **Work for decades** without requiring constant updates
+- **Be understandable** by reading a few hundred lines of code
+- **Stay maintainable** without specialized knowledge
+- **Load fast** with no JavaScript overhead
+- **Just work** without configuration or setup
+
+## Design Principles
+
+### Minimalism
+Use only what is strictly necessary. No frameworks, no build tools, no package managers for frontend code. Every line of code must justify its existence.
+
+### File-Based Everything
+Your folder structure is your URL structure. Drop a file in a folder and it's instantly accessible. No routes to configure, no databases to set up.
+
+### Override, Never Modify
+Custom templates and styles go in `/custom/` and automatically override defaults. The core files in `/app/default/` remain untouched and updateable.
+
+### Modern Standards
+Use modern PHP 8.3+ features and modern CSS capabilities. Avoid JavaScript entirely—it's not needed for content-focused sites.
+
+## Technology Stack
+
+### Backend
+- **PHP 8.3+** - Modern PHP with type hints, arrow functions, match expressions
+- **Apache** - With mod_rewrite for clean URLs
+- **Parsedown** - Simple, reliable Markdown parser
+
+### Frontend
+- **HTML5** - Semantic markup following best practices
+- **CSS3** - Modern features like Grid, clamp(), OKLCH colors, CSS nesting
+- **No JavaScript** - By design, for faster loads and simpler maintenance
+
+## What It's Not
+
+FolderWeb is **not**:
+
+- A CMS with an admin panel
+- A single-page application framework
+- A solution for complex web applications
+- Trying to scale to millions of users
+- Following current trends and fads
+
+## What It Is
+
+FolderWeb **is**:
+
+- A simple way to publish content
+- A foundation that will work for decades
+- A teaching tool for web fundamentals
+- A protest against unnecessary complexity
+- Perfect for documentation, blogs, portfolios, small business sites
+
+## Use Cases
+
+FolderWeb excels at:
+
+- **Documentation sites** - Clear structure, easy to navigate
+- **Personal blogs** - Simple publishing workflow
+- **Portfolio sites** - Showcase your work without bloat
+- **Small business sites** - Professional presence without complexity
+- **Project pages** - Quick site for your open source project
+
+## Who Created This?
+
+FolderWeb emerged from frustration with modern web development complexity. It's built for developers who appreciate simplicity and maintainability over features and frameworks.
+
+## License
+
+FolderWeb is open source. Check the repository for license details.
+
+## Get Started
+
+Ready to build something simple and lasting?
+
+1. Create a `/content` folder
+2. Add your first `.md` file
+3. That's it—you're publishing
+
+No build step. No npm install. No configuration files. Just content.
diff --git a/app/default/content/articles/2025-10-15-markdown-guide/article.md b/app/default/content/articles/2025-10-15-markdown-guide/article.md
new file mode 100644
index 0000000..a3bc6d2
--- /dev/null
+++ b/app/default/content/articles/2025-10-15-markdown-guide/article.md
@@ -0,0 +1,206 @@
+# Markdown Guide
+
+Markdown is a lightweight markup language that's easy to write and read. FolderWeb uses [Parsedown](https://parsedown.org/) to convert your Markdown files into beautiful HTML.
+
+## Headings
+
+Use `#` symbols for headings:
+
+```markdown
+# Heading 1
+## Heading 2
+### Heading 3
+#### Heading 4
+##### Heading 5
+###### Heading 6
+```
+
+## Emphasis
+
+Make text **bold** or *italic*:
+
+```markdown
+*italic text* or _italic text_
+**bold text** or __bold text__
+***bold and italic*** or ___bold and italic___
+```
+
+## Lists
+
+### Unordered Lists
+
+```markdown
+- Item one
+- Item two
+- Item three
+  - Nested item
+  - Another nested item
+```
+
+### Ordered Lists
+
+```markdown
+1. First item
+2. Second item
+3. Third item
+   1. Nested item
+   2. Another nested item
+```
+
+## Links
+
+```markdown
+[Link text](https://example.com)
+[Link with title](https://example.com "Title text")
+```
+
+Example: [Visit FolderWeb](#)
+
+## Images
+
+```markdown
+![Alt text](image.jpg)
+![Alt text with title](image.jpg "Image title")
+```
+
+## Code
+
+### Inline Code
+
+Use backticks for `inline code`:
+
+```markdown
+Use the `$variable` in your code
+```
+
+### Code Blocks
+
+Use triple backticks for code blocks:
+
+````markdown
+```php
+<?php
+echo "Hello, World!";
+?>
+```
+````
+
+Renders as:
+
+```php
+<?php
+echo "Hello, World!";
+?>
+```
+
+## Blockquotes
+
+```markdown
+> This is a blockquote.
+> It can span multiple lines.
+>
+> And multiple paragraphs.
+```
+
+Result:
+
+> This is a blockquote.
+> It can span multiple lines.
+
+## Horizontal Rules
+
+Create a horizontal rule with three or more hyphens, asterisks, or underscores:
+
+```markdown
+---
+***
+___
+```
+
+---
+
+## Tables
+
+```markdown
+| Header 1 | Header 2 | Header 3 |
+|----------|----------|----------|
+| Cell 1   | Cell 2   | Cell 3   |
+| Cell 4   | Cell 5   | Cell 6   |
+```
+
+Result:
+
+| Header 1 | Header 2 | Header 3 |
+|----------|----------|----------|
+| Cell 1   | Cell 2   | Cell 3   |
+| Cell 4   | Cell 5   | Cell 6   |
+
+## Best Practices
+
+### Use Semantic Structure
+
+Start with `# H1` for your page title, then use `## H2`, `### H3`, etc. for sections.
+
+### Write Readable Markdown
+
+```markdown
+# Good Example
+
+This paragraph is easy to read with proper spacing.
+
+## Section Heading
+
+- List items are clear
+- Each on its own line
+
+---
+
+# Bad Example
+No spacing makes it hard to read.
+##SectionWithoutSpace
+-ListItemsSmashed-Together
+```
+
+### Links in FolderWeb
+
+Internal links work best with absolute paths:
+
+```markdown
+[About page](/about/)
+[Articles](/articles/)
+[Specific article](/articles/2025-10-15-markdown-guide/)
+```
+
+## Advanced Features
+
+### HTML in Markdown
+
+You can use HTML directly in Markdown when needed:
+
+```markdown
+<div class="custom-class">
+    Custom HTML content
+</div>
+```
+
+### Escaping Characters
+
+Use backslash to escape Markdown characters:
+
+```markdown
+\*This text is not italic\*
+\[This is not a link\]
+```
+
+## Tips for FolderWeb
+
+1. **Use descriptive filenames** - `article.md` is better than `content.md`
+2. **Add metadata** - Use `metadata.ini` for titles, dates, and summaries
+3. **Include images** - Place images in the same directory as your content
+4. **Add cover images** - Use `cover.jpg` for list view thumbnails
+
+## Further Reading
+
+- [Markdown Guide](https://www.markdownguide.org/) - Comprehensive Markdown reference
+- [Parsedown Documentation](https://parsedown.org/) - The parser FolderWeb uses
+- [CommonMark Spec](https://commonmark.org/) - Markdown specification
diff --git a/app/default/content/articles/2025-10-15-markdown-guide/metadata.ini b/app/default/content/articles/2025-10-15-markdown-guide/metadata.ini
new file mode 100644
index 0000000..053268d
--- /dev/null
+++ b/app/default/content/articles/2025-10-15-markdown-guide/metadata.ini
@@ -0,0 +1,3 @@
+title = "Markdown Guide"
+date = "2025-10-15"
+summary = "Master Markdown syntax for beautiful, semantic content in FolderWeb."
diff --git a/app/default/content/articles/2025-10-28-templates-and-customization/article.md b/app/default/content/articles/2025-10-28-templates-and-customization/article.md
new file mode 100644
index 0000000..16c1d0c
--- /dev/null
+++ b/app/default/content/articles/2025-10-28-templates-and-customization/article.md
@@ -0,0 +1,165 @@
+# Templates and Customization
+
+FolderWeb is built on a simple principle: **never modify defaults, always override**. This guide shows you how to customize your site while keeping it maintainable.
+
+## The Override System
+
+FolderWeb checks for custom files before falling back to defaults:
+
+1. Check `/custom/templates/` → Use custom template
+2. Fall back to `/app/default/templates/` → Use default template
+
+This means you can override any part of the system without touching the core files.
+
+## Available Templates
+
+### Base Template
+The main HTML structure with header, navigation, and footer.
+
+**Override**: `/custom/templates/base.php`
+
+### Page Template
+Wraps single pages and articles.
+
+**Override**: `/custom/templates/page.php`
+
+### List Templates
+
+FolderWeb includes multiple list view variants:
+
+- `list.php` - Simple list
+- `list-grid.php` - Grid layout
+- `list-card-grid.php` - Card grid with images
+- `list-faq.php` - Expandable FAQ format
+
+**Select via metadata**:
+
+```ini
+page_template = "list-card-grid"
+```
+
+## Customizing Styles
+
+### Add Your Own CSS
+
+Create `/custom/styles/base.css` and it automatically overrides default styles.
+
+Example custom stylesheet:
+
+```css
+:root {
+    --color-primary: oklch(0.5 0.2 270);
+    --color-background: oklch(0.98 0 0);
+    --font-body: 'Georgia', serif;
+}
+
+article h1 {
+    color: var(--color-primary);
+    font-size: clamp(2rem, 5vw, 3rem);
+}
+```
+
+### Modern CSS Features
+
+FolderWeb's default styles use modern CSS:
+
+- **CSS Nesting** - Scope styles naturally
+- **OKLCH Colors** - Perceptually uniform colors
+- **CSS Grid** - Flexible layouts
+- **Clamp()** - Responsive sizing
+- **Logical Properties** - Better internationalization
+
+## Custom Fonts
+
+1. Place font files in `/custom/fonts/`
+2. Reference them in your custom CSS:
+
+```css
+@font-face {
+    font-family: 'MyFont';
+    src: url('/fonts/myfont.woff2') format('woff2');
+}
+
+body {
+    font-family: 'MyFont', sans-serif;
+}
+```
+
+## Metadata Options
+
+Control content behavior with `metadata.ini` files:
+
+```ini
+; Basic fields
+title = "Page Title"
+date = "2025-10-28"
+summary = "Short description"
+
+; Navigation
+menu = true
+menu_order = 1
+
+; Templates
+page_template = "list-card-grid"
+
+; Redirects
+redirect = "https://example.com"
+
+; Attachments
+pdf = "document.pdf"
+```
+
+## Template Variables
+
+Templates have access to specific variables:
+
+### Base Template
+- `$content` - Page content
+- `$currentLang` - Current language code
+- `$navigation` - Navigation items array
+- `$pageTitle` - Page title
+
+### Page Template
+- `$content` - Article content
+- `$pageMetadata` - Metadata array
+- `$translations` - Translation strings
+
+### List Templates
+- `$items` - Array of subitems
+- `$metadata` - Directory metadata
+- `$pageContent` - Intro text
+- `$translations` - Translation strings
+
+## Creating a Custom Template
+
+Example custom page template:
+
+```php
+<?php
+// /custom/templates/page.php
+?>
+<article class="custom-layout">
+    <?php if (isset($pageMetadata['date'])): ?>
+        <time><?= htmlspecialchars($pageMetadata['date']) ?></time>
+    <?php endif; ?>
+    
+    <?= $content ?>
+    
+    <footer>
+        <p>Custom footer content</p>
+    </footer>
+</article>
+```
+
+## Best Practices
+
+1. **Never modify `/app/default/`** - Always create overrides in `/custom/`
+2. **Use metadata** - Keep configuration in `metadata.ini` files
+3. **Leverage CSS variables** - Easy theming without rewriting styles
+4. **Keep it simple** - The less custom code, the easier to maintain
+
+## Next Steps
+
+- Explore default templates in `/app/default/templates/`
+- Study the default CSS in `/app/default/styles/base.css`
+- Check out the [Markdown Guide](/articles/2025-10-15-markdown-guide/) for content formatting
diff --git a/app/default/content/articles/2025-10-28-templates-and-customization/metadata.ini b/app/default/content/articles/2025-10-28-templates-and-customization/metadata.ini
new file mode 100644
index 0000000..b69d0a7
--- /dev/null
+++ b/app/default/content/articles/2025-10-28-templates-and-customization/metadata.ini
@@ -0,0 +1,3 @@
+title = "Templates and Customization"
+date = "2025-10-28"
+summary = "Customize your FolderWeb site with templates, styles, and metadata options."
diff --git a/app/default/content/articles/2025-11-01-getting-started/article.md b/app/default/content/articles/2025-11-01-getting-started/article.md
new file mode 100644
index 0000000..0a1e1ce
--- /dev/null
+++ b/app/default/content/articles/2025-11-01-getting-started/article.md
@@ -0,0 +1,79 @@
+# Getting Started with FolderWeb
+
+FolderWeb is designed to be the simplest way to publish content on the web. This guide will walk you through the core concepts and get you publishing in minutes.
+
+## Installation
+
+FolderWeb requires PHP 8.3+ and Apache with `mod_rewrite` enabled.
+
+### Using Docker (Recommended for Development)
+
+```bash
+cd development
+docker compose up
+```
+
+Visit `http://localhost:8080` to see your site.
+
+### Manual Installation
+
+1. Point Apache's document root to the `/content` directory
+2. Ensure the `/app` directory is accessible at the same level
+3. Enable `mod_rewrite` in Apache
+4. That's it!
+
+## Creating Your First Page
+
+The easiest way to understand FolderWeb is to create some content.
+
+### Create a Simple Page
+
+1. Create a new directory: `/content/hello/`
+2. Add a file: `/content/hello/page.md`
+3. Write some Markdown:
+
+```markdown
+# Hello World
+
+This is my first page in FolderWeb!
+```
+
+Your page is now live at `/hello/`
+
+### Create an Article with Metadata
+
+For richer content, add metadata:
+
+1. Create: `/content/articles/2025-11-01-my-article/`
+2. Add metadata: `/content/articles/2025-11-01-my-article/metadata.ini`
+
+```ini
+title = "My First Article"
+date = "2025-11-01"
+summary = "A brief description of my article"
+```
+
+3. Add content: `/content/articles/2025-11-01-my-article/article.md`
+
+The date in the folder name is automatically extracted and displayed.
+
+## File Types
+
+FolderWeb supports three content types:
+
+- **Markdown (`.md`)** - Write in Markdown, rendered as HTML
+- **HTML (`.html`)** - Pure HTML for complete control
+- **PHP (`.php`)** - Dynamic content when needed
+
+## File Naming Conventions
+
+- **Page content**: `page.md`, `page.html`, `page.php`
+- **Articles/posts**: `article.md`, `post.md`, `single.md` (and `.html`/`.php` variants)
+- **Frontpage**: `/content/frontpage.php`
+- **Index override**: `index.php` in any directory takes precedence
+
+## Next Steps
+
+- Read the [Templates Guide](/articles/2025-10-28-templates-and-customization/) to customize your site
+- Learn [Markdown syntax](/articles/2025-10-15-markdown-guide/) for better content
+- Explore the default templates in `/app/default/templates/`
diff --git a/app/default/content/articles/2025-11-01-getting-started/metadata.ini b/app/default/content/articles/2025-11-01-getting-started/metadata.ini
new file mode 100644
index 0000000..977942b
--- /dev/null
+++ b/app/default/content/articles/2025-11-01-getting-started/metadata.ini
@@ -0,0 +1,3 @@
+title = "Getting Started with FolderWeb"
+date = "2025-11-01"
+summary = "Learn the basics of FolderWeb and create your first content in minutes."
diff --git a/app/default/content/articles/metadata.ini b/app/default/content/articles/metadata.ini
new file mode 100644
index 0000000..dbd00c7
--- /dev/null
+++ b/app/default/content/articles/metadata.ini
@@ -0,0 +1,4 @@
+title = "Articles"
+menu = true
+menu_order = 1
+page_template = "list-card-grid"
diff --git a/app/default/content/articles/page.md b/app/default/content/articles/page.md
new file mode 100644
index 0000000..9594a48
--- /dev/null
+++ b/app/default/content/articles/page.md
@@ -0,0 +1,3 @@
+# Articles
+
+A collection of guides and tutorials to help you get the most out of FolderWeb.
diff --git a/app/default/content/frontpage.php b/app/default/content/frontpage.php
new file mode 100644
index 0000000..a275eb3
--- /dev/null
+++ b/app/default/content/frontpage.php
@@ -0,0 +1,48 @@
+<article>
+    <header style="text-align: center; padding: 4rem 0 2rem;">
+        <h1 style="font-size: clamp(2.5rem, 5vw, 4rem); margin-bottom: 1rem;">Welcome to FolderWeb</h1>
+        <p style="font-size: clamp(1.125rem, 2vw, 1.5rem); color: oklch(0.5 0 0); max-width: 60ch; margin: 0 auto;">
+            A minimalist PHP framework that turns folders into websites. No JavaScript, no build tools, just simple files.
+        </p>
+    </header>
+
+    <section style="max-width: 70ch; margin: 3rem auto;">
+        <h2>Getting Started</h2>
+        <p>
+            This is demo content to help you understand how FolderWeb works. To replace it with your own content:
+        </p>
+        <ol>
+            <li>Create a <code>/content</code> folder in your project root</li>
+            <li>Add your content files (<code>.md</code>, <code>.html</code>, or <code>.php</code>)</li>
+            <li>This demo will automatically disappear</li>
+        </ol>
+
+        <h2>Core Concepts</h2>
+        
+        <h3>File-Based Routing</h3>
+        <p>
+            Drop a file in a folder and it's instantly accessible at a URL matching that path. 
+            Your folder structure becomes your URL structure.
+        </p>
+
+        <h3>Multiple Content Types</h3>
+        <ul>
+            <li><strong>Markdown</strong> - Write in <code>.md</code> files, automatically converted to HTML</li>
+            <li><strong>HTML</strong> - Pure HTML files for complete control</li>
+            <li><strong>PHP</strong> - Dynamic content when you need it</li>
+        </ul>
+
+        <h3>Smart Features</h3>
+        <ul>
+            <li><strong>Metadata</strong> - Use <code>metadata.ini</code> files for titles, dates, summaries</li>
+            <li><strong>Date extraction</strong> - Folder names like <code>2025-11-01-title</code> automatically show dates</li>
+            <li><strong>Cover images</strong> - Add <code>cover.jpg</code> for list view thumbnails</li>
+            <li><strong>Templates</strong> - Custom templates in <code>/custom/templates/</code> override defaults</li>
+        </ul>
+
+        <h2>Explore the Demo</h2>
+        <p>
+            Check out the <a href="/articles/">Articles</a> and <a href="/about/">About</a> pages to see different content types in action.
+        </p>
+    </section>
+</article>
diff --git a/app/default/docs/styles/base.css b/app/default/docs/styles/base.css
deleted file mode 100644
index b2b0a64..0000000
--- a/app/default/docs/styles/base.css
+++ /dev/null
@@ -1,214 +0,0 @@
-/* MINIMAL RESET */
-* { margin: 0; padding: 0; box-sizing: border-box; }
-
-/* VARIABLES */
-:root {
-  --font-body: Georgia, "Times New Roman", serif;
-  --font-heading: system-ui, -apple-system, sans-serif;
-  --color-primary: #2563eb;
-  --color-primary-dark: #1e40af;
-  --color-bg: #f8fafc;
-  --color-bg-alt: #ffffff;
-  --color-text: #1e293b;
-  --color-text-light: #64748b;
-  --color-border: #e2e8f0;
-}
-
-/* GLOBAL */
-html { 
-    font-family: var(--font-body); 
-    font-size: 18px; 
-    line-height: 1.7;
-}
-
-body { 
-    margin: 0; 
-    color: var(--color-text);
-    background-color: var(--color-bg);
-}
-
-img { max-width: 100%; height: auto; }
-
-a { 
-    color: var(--color-primary); 
-    text-decoration: none; 
-}
-a:hover { 
-    color: var(--color-primary-dark);
-    text-decoration: underline; 
-}
-
-/* LAYOUT */
-.docs-container {
-    max-width: 1200px;
-    margin: 0 auto;
-    display: grid;
-    grid-template-columns: 250px 1fr;
-    gap: 2rem;
-    padding: 2rem 1rem;
-}
-
-@media (max-width: 768px) {
-    .docs-container {
-        grid-template-columns: 1fr;
-    }
-}
-
-/* HEADER */
-header {
-    grid-column: 1 / -1;
-    border-bottom: 2px solid var(--color-border);
-    padding-bottom: 1rem;
-    margin-bottom: 1rem;
-}
-
-header h1 { 
-    font-family: var(--font-heading);
-    font-size: 1.8rem; 
-    color: var(--color-primary);
-    font-weight: 600;
-}
-
-/* SIDEBAR */
-.sidebar {
-    font-size: 0.9rem;
-}
-
-.sidebar h2 {
-    font-family: var(--font-heading);
-    font-size: 0.85rem;
-    text-transform: uppercase;
-    letter-spacing: 0.05em;
-    color: var(--color-text-light);
-    margin-bottom: 0.5rem;
-    margin-top: 1.5rem;
-}
-
-.sidebar h2:first-child {
-    margin-top: 0;
-}
-
-.sidebar ul {
-    list-style: none;
-    margin-bottom: 1rem;
-}
-
-.sidebar li {
-    margin-bottom: 0.25rem;
-}
-
-.sidebar a {
-    display: block;
-    padding: 0.25rem 0.5rem;
-    border-radius: 0.25rem;
-}
-
-.sidebar a:hover {
-    background-color: var(--color-bg);
-    text-decoration: none;
-}
-
-/* MAIN CONTENT */
-main {
-    background-color: var(--color-bg-alt);
-    padding: 2rem;
-    border-radius: 0.5rem;
-    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
-}
-
-article h1 { 
-    font-family: var(--font-heading);
-    font-size: 2.2rem; 
-    margin-bottom: 1rem;
-    color: var(--color-text);
-    font-weight: 600;
-    line-height: 1.2;
-}
-
-article h2 {
-    font-family: var(--font-heading);
-    font-size: 1.6rem;
-    margin-top: 2rem;
-    margin-bottom: 0.75rem;
-    color: var(--color-text);
-    font-weight: 600;
-}
-
-article h3 {
-    font-family: var(--font-heading);
-    font-size: 1.2rem;
-    margin-top: 1.5rem;
-    margin-bottom: 0.5rem;
-    color: var(--color-text);
-    font-weight: 600;
-}
-
-article p { 
-    margin-bottom: 1rem; 
-}
-
-article ul, article ol {
-    margin-bottom: 1rem;
-    padding-left: 2rem;
-}
-
-article li {
-    margin-bottom: 0.5rem;
-}
-
-article code {
-    background-color: var(--color-bg);
-    padding: 0.2rem 0.4rem;
-    border-radius: 0.25rem;
-    font-size: 0.9em;
-    font-family: 'Courier New', monospace;
-}
-
-article pre {
-    background-color: var(--color-bg);
-    padding: 1rem;
-    border-radius: 0.5rem;
-    overflow-x: auto;
-    margin-bottom: 1rem;
-    border: 1px solid var(--color-border);
-}
-
-article pre code {
-    background: none;
-    padding: 0;
-}
-
-article blockquote {
-    border-left: 4px solid var(--color-primary);
-    padding-left: 1rem;
-    margin: 1rem 0;
-    color: var(--color-text-light);
-    font-style: italic;
-}
-
-/* LIST VIEW */
-.doc-list article h1 {
-    font-size: 1.4rem;
-    margin-top: 1.5rem;
-    margin-bottom: 0.5rem;
-}
-
-.doc-list article h1:first-of-type {
-    margin-top: 0;
-}
-
-.doc-list p {
-    color: var(--color-text-light);
-    font-size: 0.95rem;
-}
-
-/* FOOTER */
-footer {
-    grid-column: 1 / -1;
-    border-top: 2px solid var(--color-border);
-    padding-top: 1rem;
-    margin-top: 2rem;
-    text-align: center;
-    font-size: 0.85rem;
-    color: var(--color-text-light);
-}
diff --git a/app/default/docs/templates/base.php b/app/default/docs/templates/base.php
deleted file mode 100644
index a358672..0000000
--- a/app/default/docs/templates/base.php
+++ /dev/null
@@ -1,46 +0,0 @@
-<!DOCTYPE html>
-<html lang="<?= $currentLang ?? 'en' ?>">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="stylesheet" href="/app/docs-styles/base.css">
-    <title><?= $pageTitle ?? 'Documentation' ?></title>
-</head>
-<body>
-    <div class="docs-container">
-        <header>
-            <h1><a href="/docs">PnP Documentation</a></h1>
-        </header>
-        
-        <aside class="sidebar">
-            <h2>Tutorials</h2>
-            <ul>
-                <li><a href="/docs/tutorials/getting-started">Getting Started</a></li>
-            </ul>
-            
-            <h2>How-To Guides</h2>
-            <ul>
-                <li><a href="/docs/how-to/customize-templates">Customize Templates</a></li>
-            </ul>
-            
-            <h2>Explanation</h2>
-            <ul>
-                <li><a href="/docs/explanation/routing">Routing System</a></li>
-            </ul>
-            
-            <h2>Reference</h2>
-            <ul>
-                <li><a href="/docs/reference/metadata">Metadata</a></li>
-            </ul>
-        </aside>
-        
-        <main>
-            <?= $content ?>
-        </main>
-        
-        <footer>
-            <p>PnP Framework Documentation</p>
-        </footer>
-    </div>
-</body>
-</html>
diff --git a/app/default/docs/templates/list.php b/app/default/docs/templates/list.php
deleted file mode 100644
index 7ec8f6b..0000000
--- a/app/default/docs/templates/list.php
+++ /dev/null
@@ -1,14 +0,0 @@
-<div class="doc-list">
-    <?php foreach ($items as $item): ?>
-        <article>
-            <h1>
-                <a href="<?= htmlspecialchars($item['url']) ?>">
-                    <?= htmlspecialchars($item['title']) ?>
-                </a>
-            </h1>
-            <?php if ($item['summary']): ?>
-                <p><?= htmlspecialchars($item['summary']) ?></p>
-            <?php endif; ?>
-        </article>
-    <?php endforeach; ?>
-</div>
diff --git a/app/default/templates/base.php b/app/default/templates/base.php
index 074445e..d602f64 100644
--- a/app/default/templates/base.php
+++ b/app/default/templates/base.php
@@ -30,7 +30,7 @@ function getActiveClass($href) { return rtrim(parse_url($_SERVER['REQUEST_URI'],
                 <div class="logo">
                     <a href="/">
                         <svg width="200" height="60" viewBox="0 0 200 60" xmlns="http://www.w3.org/2000/svg">
-                            <text x="10" y="40" font-family="Arial, sans-serif" font-size="32" font-weight="bold" fill="currentColor">LOGO</text>
+                            <text x="10" y="40" font-family="Arial, sans-serif" font-size="32" font-weight="bold" fill="currentColor">FolderWeb</text>
                         </svg>
                     </a>
                 </div>
diff --git a/app/router.php b/app/router.php
index 44256d2..a97b978 100644
--- a/app/router.php
+++ b/app/router.php
@@ -9,7 +9,20 @@ $config = parse_ini_file($configFile, true);
 $defaultLang = $config['languages']['default'] ?? 'no';
 $availableLangs = array_map('trim', explode(',', $config['languages']['available'] ?? 'no'));
 
-$contentDir = realpath($_SERVER['DOCUMENT_ROOT']);
+// Use user content if exists and has content, otherwise fall back to demo content
+$userContentDir = $_SERVER['DOCUMENT_ROOT'];
+$demoContentDir = __DIR__ . '/default/content';
+
+// Check if user content directory has actual content (more than just . and ..)
+$hasUserContent = false;
+if (is_dir($userContentDir)) {
+    $userFiles = scandir($userContentDir) ?: [];
+    $userFiles = array_diff($userFiles, ['.', '..']);
+    $hasUserContent = count($userFiles) > 0;
+}
+
+$contentDir = $hasUserContent ? realpath($userContentDir) : realpath($demoContentDir);
+
 $requestUri = parse_url($_SERVER['REQUEST_URI'] ?? '', PHP_URL_PATH) ?: '/';
 $hasTrailingSlash = str_ends_with($requestUri, '/') && $requestUri !== '/';
 $requestPath = trim($requestUri, '/');
diff --git a/development/apache/custom.conf b/development/apache/custom.conf
index d8adda7..a298a46 100644
--- a/development/apache/custom.conf
+++ b/development/apache/custom.conf
@@ -4,10 +4,13 @@
     Require all granted
 </Directory>
 
-# Alias for app assets (styles, fonts, etc.)
+# Alias for app assets (more specific aliases must come first)
+Alias /app/default-styles /var/www/app/default/styles
 Alias /app/styles /var/www/custom/styles
 Alias /app/fonts /var/www/custom/fonts
-Alias /app/default-styles /var/www/app/default/styles
+
+# Alias for app directory (general fallback)
+Alias /app /var/www/app
 
 <Directory /var/www/custom/styles>
     Require all granted
diff --git a/development/apache/default.conf b/development/apache/default.conf
new file mode 100644
index 0000000..b1191d7
--- /dev/null
+++ b/development/apache/default.conf
@@ -0,0 +1,20 @@
+<VirtualHost *:80>
+    ServerAdmin webmaster@localhost
+    DocumentRoot /var/www/html
+    
+    <Directory /var/www/html>
+        Options -Indexes +FollowSymLinks
+        AllowOverride All
+        Require all granted
+        DirectoryIndex disabled
+        
+        # Route all requests through the router
+        RewriteEngine On
+        # Don't rewrite if it's already going to /app/
+        RewriteCond %{REQUEST_URI} !^/app/
+        RewriteRule ^(.*)$ /app/router.php [L,QSA]
+    </Directory>
+    
+    ErrorLog ${APACHE_LOG_DIR}/error.log
+    CustomLog ${APACHE_LOG_DIR}/access.log combined
+</VirtualHost>
diff --git a/development/compose.yaml b/development/compose.yaml
index 7f8253e..0788a43 100644
--- a/development/compose.yaml
+++ b/development/compose.yaml
@@ -1,28 +1,27 @@
 version: '3.8'
 
 services:
-  custom:
-    image: php:8.3.12-apache
-    container_name: folderweb-custom
-    working_dir: /var/www/html/
-    volumes:
-      - ../app:/var/www/app:z
-      - ../content:/var/www/html:z
-      - ../custom:/var/www/custom:z
-      - ../docs:/var/www/html/docs:z
-      - ./apache/custom.conf:/etc/apache2/conf-available/custom.conf:z
-    ports:
-      - "4040:80"
-    command: bash -c "a2enconf custom && a2enmod rewrite && apache2-foreground"
+  # custom:
+  #   image: php:8.3.12-apache
+  #   container_name: folderweb-custom
+  #   working_dir: /var/www/html/
+  #   volumes:
+  #     - ../app:/var/www/app:z
+  #     - ../content:/var/www/html:z
+  #     - ../custom:/var/www/custom:z
+  #     - ../docs:/var/www/html/docs:z
+  #     - ./apache/custom.conf:/etc/apache2/conf-available/custom.conf:z
+  #   ports:
+  #     - "4040:80"
+  #   command: bash -c "a2enconf custom && a2enmod rewrite && apache2-foreground"
   default:
     image: php:8.3.12-apache
     container_name: folderweb-default
     working_dir: /var/www/html/
     volumes:
       - ../app:/var/www/app:z
-      - ../content:/var/www/html:z
-      - ../docs:/var/www/html/docs:z
       - ./apache/custom.conf:/etc/apache2/conf-available/custom.conf:z
+      - ./apache/default.conf:/etc/apache2/sites-available/000-default.conf:z
     ports:
       - "8080:80"
     command: bash -c "a2enconf custom && a2enmod rewrite && apache2-foreground"