From 97e3809ec1ccde0e36e6c52d221c0315ff8af8e1 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Tue, 5 Aug 2025 20:33:02 +1000
Subject: [PATCH 01/27] New - Initial commit.

---
 content/community/_index.md  | 220 ++++++++++++++++++++
 content/docs/_index.md       | 292 +++++++++++++++++++++++++++
 content/learn/_index.md      | 179 +++++++++++++++++
 hugo.toml                    |  35 +++-
 layouts/_default/baseof.html |  44 ++++
 layouts/_default/single.html |  85 ++++++++
 layouts/index.html           |  86 ++++++++
 layouts/partials/footer.html |  32 +++
 layouts/partials/header.html |  34 ++++
 static/css/main.css          | 375 +++++++++++++++++++++++++++++++++++
 10 files changed, 1380 insertions(+), 2 deletions(-)
 create mode 100644 content/community/_index.md
 create mode 100644 content/docs/_index.md
 create mode 100644 content/learn/_index.md
 create mode 100644 layouts/_default/baseof.html
 create mode 100644 layouts/_default/single.html
 create mode 100644 layouts/index.html
 create mode 100644 layouts/partials/footer.html
 create mode 100644 layouts/partials/header.html
 create mode 100644 static/css/main.css

diff --git a/content/community/_index.md b/content/community/_index.md
new file mode 100644
index 0000000..9bb8c15
--- /dev/null
+++ b/content/community/_index.md
@@ -0,0 +1,220 @@
++++
+title = 'Community'
+date = 2024-05-30T18:56:05+03:00
+draft = false
++++
+
+# Pascal Community
+
+Join the vibrant Pascal programming community! Connect with developers, share knowledge, and contribute to the Pascal ecosystem.
+
+## Get Connected
+
+### 🗨️ Discussion Forums
+
+**Free Pascal Community**
+- Official Free Pascal forums
+- Technical discussions and support
+- [Visit Forum](https://forum.lazarus.freepascal.org/)
+
+**Reddit Pascal Community**
+- r/Pascal - General Pascal discussions
+- r/FreePascal - Free Pascal specific
+- [Join on Reddit](https://reddit.com/r/pascal)
+
+### 💬 Real-time Chat
+
+**Discord Server**
+- Instant help and discussions
+- Code sharing and collaboration
+- Community events and challenges
+- [Join Discord](https://discord.gg/pascal) *(Coming Soon)*
+
+**IRC Channels**
+- #freepascal on Libera.Chat
+- #lazarus on Libera.Chat
+
+### 📧 Mailing Lists
+
+**Free Pascal Lists**
+- fpc-announce: Release announcements
+- fpc-pascal: General Pascal discussions
+- fpc-devel: Development discussions
+- [Subscribe](https://lists.freepascal.org/)
+
+## Open Source Projects
+
+### 🚀 Contribute to Pascal
+
+**Free Pascal Compiler**
+- Core compiler development
+- Platform support and optimization
+- [GitHub Repository](https://github.com/graemeg/freepascal)
+
+**Lazarus IDE**
+- IDE features and improvements
+- Component development
+- Documentation
+- [GitLab Repository](https://gitlab.com/freepascal.org/lazarus/lazarus)
+
+**Pascal Libraries**
+- Synapse: Internet protocols
+- mORMot: ORM framework
+- Graphics32: 2D graphics library
+
+### 📚 Documentation Projects
+
+Help improve Pascal documentation:
+- Tutorial writing
+- Code examples
+- Translation projects
+- API documentation
+
+## Learning Resources
+
+### 🎓 Educational Content
+
+**Online Courses**
+- Pascal programming fundamentals
+- Object-oriented programming with Pascal
+- GUI development with Lazarus
+
+**YouTube Channels**
+- Pascal programming tutorials
+- Lazarus IDE walkthroughs
+- Advanced Pascal techniques
+
+**Books and eBooks**
+- "Modern Pascal Introduction" *(Free)*
+- "Lazarus Complete Guide"
+- "Object Pascal Handbook"
+
+### 💡 Code Examples
+
+**GitHub Collections**
+- [Pascal-Examples](https://github.com/ObjectPascal-Community/examples)
+- Algorithm implementations
+- Design pattern examples
+- Real-world applications
+
+## Events and Meetups
+
+### 🏛️ Conferences
+
+**European Pascal Conference**
+- Annual gathering of Pascal developers
+- Technical presentations and workshops
+- Networking opportunities
+
+**Local Meetups**
+- Check for Pascal groups in your area
+- Online meetups and code reviews
+- Lightning talks and presentations
+
+### 🏆 Competitions
+
+**Pascal Programming Contest**
+- Annual coding challenges
+- Educational and fun problems
+- Prizes and recognition
+
+**Open Source Contributions**
+- Hacktoberfest participation
+- Bug fixes and feature additions
+- Documentation improvements
+
+## Getting Help
+
+### ❓ Where to Ask Questions
+
+1. **Stack Overflow**: Tag your questions with `pascal`, `freepascal`, or `lazarus`
+2. **Forums**: Free Pascal and Lazarus official forums
+3. **Discord/IRC**: Real-time help from community members
+4. **GitHub Issues**: For specific library or tool problems
+
+### 📝 How to Ask Good Questions
+
+**Include:**
+- Pascal/compiler version
+- Operating system
+- Complete error messages
+- Minimal code example
+- What you've already tried
+
+**Example:**
+```
+Title: "Array index out of bounds error in Free Pascal 3.2.2"
+
+I'm getting an array index error in Free Pascal 3.2.2 on Windows 10.
+
+Code:
+var arr: array[1..5] of integer;
+begin
+  arr[6] := 10; // This causes the error
+end.
+
+Error: "Range check error while trying to access array element"
+
+I understand the error, but how can I prevent this at runtime?
+```
+
+## Contributing to This Site
+
+This website is open source and welcomes contributions!
+
+### 🛠️ How to Contribute
+
+1. **Fork** the repository
+2. **Create** a new branch for your changes
+3. **Write** or improve content
+4. **Test** your changes locally
+5. **Submit** a pull request
+
+### 📖 Content Guidelines
+
+- Write clear, beginner-friendly explanations
+- Include working code examples
+- Test all code snippets
+- Follow the existing style and format
+- Add proper metadata to markdown files
+
+### 🐛 Report Issues
+
+Found a problem? Help us improve:
+- [Report bugs](https://github.com/ObjectPascal-Community/ObjectPascal-Community.github.io/issues)
+- Suggest new content
+- Fix typos and errors
+- Improve existing examples
+
+## Code of Conduct
+
+Our community is welcoming and inclusive. We expect all members to:
+
+- **Be respectful** of different skill levels and backgrounds
+- **Help others** learn and grow
+- **Share knowledge** freely and constructively
+- **Give credit** where credit is due
+- **Follow** platform-specific rules and guidelines
+
+## Stay Updated
+
+### 📢 News and Announcements
+
+- Follow [@PascalLang](https://twitter.com/pascallang) on Twitter
+- Subscribe to our newsletter *(Coming Soon)*
+- Watch this repository for updates
+- Join our Discord for real-time updates
+
+### 🔔 Release Notifications
+
+Stay informed about:
+- Free Pascal compiler releases
+- Lazarus IDE updates
+- New library versions
+- Community project launches
+
+---
+
+**Ready to join?** Pick a platform above and start connecting with fellow Pascal developers today!
+
+*Questions about the community? [Contact us](mailto:community@pascal-lang.org)*
diff --git a/content/docs/_index.md b/content/docs/_index.md
new file mode 100644
index 0000000..393ef4b
--- /dev/null
+++ b/content/docs/_index.md
@@ -0,0 +1,292 @@
++++
+title = 'Documentation'
+date = 2024-05-30T18:56:05+03:00
+draft = false
++++
+
+# Pascal Documentation
+
+Comprehensive guides and references for Pascal programming.
+
+## Language Reference
+
+### Syntax Guide
+
+Pascal uses a clear, structured syntax that emphasizes readability:
+
+```pascal
+program ExampleProgram;
+
+const
+    MAX_SIZE = 100;
+    PI = 3.14159;
+
+type
+    TIntArray = array[1..MAX_SIZE] of integer;
+    TPoint = record
+        x, y: real;
+    end;
+
+var
+    numbers: TIntArray;
+    point: TPoint;
+    i: integer;
+
+begin
+    { Initialize array }
+    for i := 1 to 10 do
+        numbers[i] := i * i;
+    
+    { Initialize record }
+    point.x := 10.5;
+    point.y := 20.3;
+    
+    { Output results }
+    writeln('First 10 squares:');
+    for i := 1 to 10 do
+        writeln(i, '^2 = ', numbers[i]);
+    
+    writeln('Point: (', point.x:0:1, ', ', point.y:0:1, ')');
+end.
+```
+
+### Data Types
+
+**Basic Types:**
+- `integer`: Whole numbers (-32768 to 32767)
+- `longint`: Extended integers (-2147483648 to 2147483647)
+- `real`: Floating-point numbers
+- `double`: Double-precision floating-point
+- `char`: Single character
+- `string`: Text strings
+- `boolean`: True or false values
+
+**Structured Types:**
+
+```pascal
+{ Arrays }
+type
+    TScores = array[1..10] of integer;
+    TMatrix = array[1..3, 1..3] of real;
+
+{ Records }
+type
+    TPerson = record
+        name: string;
+        age: integer;
+        salary: real;
+    end;
+
+{ Sets }
+type
+    TDigits = set of 0..9;
+    TLetters = set of 'A'..'Z';
+```
+
+## Code Examples
+
+### File Operations
+
+```pascal
+program FileExample;
+var
+    inputFile, outputFile: text;
+    line: string;
+begin
+    assign(inputFile, 'input.txt');
+    assign(outputFile, 'output.txt');
+    
+    reset(inputFile);
+    rewrite(outputFile);
+    
+    while not eof(inputFile) do
+    begin
+        readln(inputFile, line);
+        writeln(outputFile, 'Processed: ', line);
+    end;
+    
+    close(inputFile);
+    close(outputFile);
+    
+    writeln('File processing complete.');
+end.
+```
+
+### Dynamic Arrays
+
+```pascal
+program DynamicArrayExample;
+type
+    TIntArray = array of integer;
+
+var
+    numbers: TIntArray;
+    i, size: integer;
+
+begin
+    write('Enter array size: ');
+    readln(size);
+    
+    { Allocate memory }
+    SetLength(numbers, size);
+    
+    { Fill array }
+    for i := 0 to size - 1 do
+        numbers[i] := Random(100);
+    
+    { Display array }
+    writeln('Random numbers:');
+    for i := 0 to size - 1 do
+        write(numbers[i], ' ');
+    writeln;
+    
+    { Free memory automatically when program ends }
+end.
+```
+
+### Object-Oriented Programming
+
+```pascal
+program OOPExample;
+
+type
+    { Base class }
+    TShape = class
+    private
+        FColor: string;
+    public
+        constructor Create(AColor: string);
+        procedure SetColor(AColor: string);
+        function GetColor: string;
+        function GetArea: real; virtual; abstract;
+    end;
+    
+    { Derived class }
+    TCircle = class(TShape)
+    private
+        FRadius: real;
+    public
+        constructor Create(AColor: string; ARadius: real);
+        function GetArea: real; override;
+    end;
+
+{ TShape implementation }
+constructor TShape.Create(AColor: string);
+begin
+    FColor := AColor;
+end;
+
+procedure TShape.SetColor(AColor: string);
+begin
+    FColor := AColor;
+end;
+
+function TShape.GetColor: string;
+begin
+    Result := FColor;
+end;
+
+{ TCircle implementation }
+constructor TCircle.Create(AColor: string; ARadius: real);
+begin
+    inherited Create(AColor);
+    FRadius := ARadius;
+end;
+
+function TCircle.GetArea: real;
+begin
+    Result := 3.14159 * FRadius * FRadius;
+end;
+
+{ Main program }
+var
+    circle: TCircle;
+begin
+    circle := TCircle.Create('Red', 5.0);
+    writeln('Circle color: ', circle.GetColor);
+    writeln('Circle area: ', circle.GetArea:0:2);
+    circle.Free;
+end.
+```
+
+## Best Practices
+
+### Code Style
+
+1. **Use meaningful names:**
+   ```pascal
+   var
+       studentCount: integer;    // Good
+       sc: integer;              // Avoid
+   ```
+
+2. **Consistent indentation:**
+   ```pascal
+   if condition then
+   begin
+       statement1;
+       statement2;
+   end;
+   ```
+
+3. **Comment your code:**
+   ```pascal
+   { Calculate compound interest }
+   function CompoundInterest(principal, rate: real; years: integer): real;
+   begin
+       Result := principal * Power(1 + rate, years);
+   end;
+   ```
+
+### Error Handling
+
+```pascal
+program ErrorHandlingExample;
+var
+    number, divisor: integer;
+    result: real;
+begin
+    try
+        write('Enter a number: ');
+        readln(number);
+        write('Enter divisor: ');
+        readln(divisor);
+        
+        if divisor = 0 then
+            raise Exception.Create('Division by zero not allowed');
+        
+        result := number / divisor;
+        writeln('Result: ', result:0:2);
+        
+    except
+        on E: Exception do
+            writeln('Error: ', E.Message);
+    end;
+end.
+```
+
+## Tools and Libraries
+
+### Free Pascal Compiler
+- Cross-platform compilation
+- Extensive standard library
+- Compatible with Turbo Pascal and Delphi
+
+### Lazarus IDE
+- Visual form designer
+- Integrated debugger
+- Component library (LCL)
+- Cross-platform GUI development
+
+### Popular Libraries
+- **LCL**: Lazarus Component Library for GUI
+- **FCL**: Free Component Library for utilities
+- **Synapse**: Network and internet protocols
+- **ZeosDBO**: Database connectivity
+
+## Further Reading
+
+- [Free Pascal Reference Guide](https://www.freepascal.org/docs-html/ref/ref.html)
+- [Lazarus Documentation](https://wiki.lazarus.freepascal.org/)
+- [Pascal Programming Tutorials](/learn/)
+- [Community Examples and Projects](/community/)
diff --git a/content/learn/_index.md b/content/learn/_index.md
new file mode 100644
index 0000000..28a4664
--- /dev/null
+++ b/content/learn/_index.md
@@ -0,0 +1,179 @@
++++
+title = 'Learn Pascal'
+date = 2024-05-30T18:56:05+03:00
+draft = false
++++
+
+# Learn Pascal Programming
+
+Pascal is an excellent language for learning programming fundamentals. Its clear syntax and structured approach make it perfect for beginners while remaining powerful enough for advanced applications.
+
+## Getting Started
+
+### Installation {#install}
+
+Choose your Pascal development environment:
+
+**Free Pascal Compiler (FPC)**
+- Cross-platform Pascal compiler
+- Command-line based development
+- [Download FPC](https://www.freepascal.org/)
+
+**Lazarus IDE**
+- Complete visual development environment
+- Built on Free Pascal
+- Perfect for beginners
+- [Download Lazarus](https://www.lazarus-ide.org/)
+
+### Your First Program
+
+Create a new file called `hello.pas`:
+
+```pascal
+program HelloWorld;
+begin
+    writeln('Hello, Pascal World!');
+    writeln('Ready to learn programming?');
+end.
+```
+
+Compile and run:
+```bash
+fpc hello.pas
+./hello
+```
+
+## Core Concepts
+
+### Program Structure
+
+Every Pascal program follows this basic structure:
+
+```pascal
+program ProgramName;
+
+{ Variable declarations }
+var
+    message: string;
+    count: integer;
+
+{ Main program block }
+begin
+    message := 'Welcome to Pascal';
+    count := 42;
+    writeln(message);
+    writeln('Count: ', count);
+end.
+```
+
+### Data Types
+
+Pascal has strong typing with these fundamental types:
+
+```pascal
+var
+    // Integer types
+    age: integer;
+    population: longint;
+    
+    // Real types
+    temperature: real;
+    price: double;
+    
+    // Character and string
+    grade: char;
+    name: string;
+    
+    // Boolean
+    isActive: boolean;
+```
+
+### Control Structures
+
+**Conditional Statements:**
+
+```pascal
+if age >= 18 then
+    writeln('You are an adult')
+else
+    writeln('You are a minor');
+
+case grade of
+    'A': writeln('Excellent!');
+    'B': writeln('Good job!');
+    'C': writeln('Average');
+    else writeln('Keep trying!');
+end;
+```
+
+**Loops:**
+
+```pascal
+{ For loop }
+for i := 1 to 10 do
+    writeln('Number: ', i);
+
+{ While loop }
+while count > 0 do
+begin
+    writeln(count);
+    count := count - 1;
+end;
+
+{ Repeat-until loop }
+repeat
+    write('Enter a positive number: ');
+    readln(number);
+until number > 0;
+```
+
+## Procedures and Functions
+
+### Procedures
+
+```pascal
+procedure greetUser(name: string);
+begin
+    writeln('Hello, ', name, '!');
+    writeln('Welcome to Pascal programming.');
+end;
+
+{ Call the procedure }
+begin
+    greetUser('Alice');
+end.
+```
+
+### Functions
+
+```pascal
+function calculateArea(radius: real): real;
+begin
+    calculateArea := 3.14159 * radius * radius;
+end;
+
+{ Using the function }
+var
+    area: real;
+begin
+    area := calculateArea(5.0);
+    writeln('Area: ', area:0:2);
+end.
+```
+
+## Next Steps
+
+1. **Practice Basic Programs**: Start with simple console applications
+2. **Learn Data Structures**: Arrays, records, and sets
+3. **Object-Oriented Programming**: Classes and inheritance in Object Pascal
+4. **GUI Development**: Create desktop applications with Lazarus
+5. **Advanced Topics**: File handling, dynamic memory, and libraries
+
+## Resources
+
+- [Free Pascal Documentation](https://www.freepascal.org/docs.html)
+- [Lazarus Wiki](https://wiki.lazarus.freepascal.org/)
+- [Pascal Programming Examples](/docs/)
+- [Community Forum](/community/)
+
+Ready to start coding? [Join our community](/community/) for help and support!
diff --git a/hugo.toml b/hugo.toml
index 75d4542..9a37735 100644
--- a/hugo.toml
+++ b/hugo.toml
@@ -1,4 +1,35 @@
 baseURL = 'https://pascal-lang.org/'
 languageCode = 'en-us'
-title = 'Object Pascal Language'
-theme = 'ananke'
\ No newline at end of file
+title = 'Pascal - Readable, Reliable Programming'
+
+# Disable theme to use custom templates
+# theme = 'ananke'
+
+[markup]
+  [markup.highlight]
+    style = 'github'
+    lineNos = true
+    tabWidth = 2
+    codeFences = true
+
+[params]
+  description = 'Pascal programming language - readable, reliable, and educational'
+  author = 'Object Pascal Community'
+
+[menu]
+  [[menu.main]]
+    name = 'Home'
+    url = '/'
+    weight = 10
+  [[menu.main]]
+    name = 'Learn'
+    url = '/learn/'
+    weight = 20
+  [[menu.main]]
+    name = 'Docs'
+    url = '/docs/'
+    weight = 30
+  [[menu.main]]
+    name = 'Community'
+    url = '/community/'
+    weight = 40
\ No newline at end of file
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
new file mode 100644
index 0000000..e1ef82f
--- /dev/null
+++ b/layouts/_default/baseof.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="{{ .Site.LanguageCode | default "en" }}">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} - {{ .Site.Title }}{{ end }}</title>
+    <meta name="description" content="{{ .Site.Params.description }}">
+    <meta name="author" content="{{ .Site.Params.author }}">
+    
+    <!-- CSS -->
+    <link rel="stylesheet" href="{{ "css/main.css" | relURL }}">
+    
+    <!-- Favicon -->
+    <link rel="icon" type="image/x-icon" href="{{ "favicon.ico" | relURL }}">
+</head>
+<body>
+    {{ partial "header.html" . }}
+    
+    <main>
+        {{ block "main" . }}{{ end }}
+    </main>
+    
+    {{ partial "footer.html" . }}
+    
+    <!-- Theme toggle script -->
+    <script>
+        // Theme toggle functionality
+        const themeToggle = document.getElementById('theme-toggle');
+        const body = document.body;
+        
+        // Check for saved theme preference or default to light
+        const currentTheme = localStorage.getItem('theme') || 'light';
+        body.setAttribute('data-theme', currentTheme);
+        
+        if (themeToggle) {
+            themeToggle.addEventListener('click', () => {
+                const newTheme = body.getAttribute('data-theme') === 'light' ? 'dark' : 'light';
+                body.setAttribute('data-theme', newTheme);
+                localStorage.setItem('theme', newTheme);
+            });
+        }
+    </script>
+</body>
+</html>
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
new file mode 100644
index 0000000..9782a8d
--- /dev/null
+++ b/layouts/_default/single.html
@@ -0,0 +1,85 @@
+{{ define "main" }}
+<article class="content-section">
+    <div class="container">
+        <header class="article-header">
+            <h1>{{ .Title }}</h1>
+            {{ if .Date }}
+            <time datetime="{{ .Date.Format "2006-01-02" }}" class="article-date">
+                {{ .Date.Format "January 2, 2006" }}
+            </time>
+            {{ end }}
+        </header>
+        
+        <div class="article-content">
+            {{ .Content }}
+        </div>
+        
+        {{ if .Params.tags }}
+        <div class="article-tags">
+            <strong>Tags:</strong>
+            {{ range .Params.tags }}
+            <span class="tag">{{ . }}</span>
+            {{ end }}
+        </div>
+        {{ end }}
+    </div>
+</article>
+
+<style>
+.article-header {
+    text-align: center;
+    margin-bottom: var(--spacing-2xl);
+    padding-bottom: var(--spacing-lg);
+    border-bottom: 1px solid var(--border-color);
+}
+
+.article-date {
+    color: var(--text-muted);
+    font-size: 0.9rem;
+}
+
+.article-content {
+    max-width: 800px;
+    margin: 0 auto;
+    line-height: 1.7;
+}
+
+.article-content h2,
+.article-content h3,
+.article-content h4 {
+    margin-top: var(--spacing-xl);
+    margin-bottom: var(--spacing-md);
+}
+
+.article-content p {
+    margin-bottom: var(--spacing-lg);
+}
+
+.article-content ul,
+.article-content ol {
+    margin-bottom: var(--spacing-lg);
+    padding-left: var(--spacing-xl);
+}
+
+.article-content li {
+    margin-bottom: var(--spacing-sm);
+}
+
+.article-tags {
+    margin-top: var(--spacing-2xl);
+    padding-top: var(--spacing-lg);
+    border-top: 1px solid var(--border-color);
+    text-align: center;
+}
+
+.tag {
+    display: inline-block;
+    background-color: var(--bg-secondary);
+    color: var(--text-secondary);
+    padding: var(--spacing-xs) var(--spacing-sm);
+    border-radius: var(--border-radius);
+    font-size: 0.85rem;
+    margin: 0 var(--spacing-xs);
+}
+</style>
+{{ end }}
diff --git a/layouts/index.html b/layouts/index.html
new file mode 100644
index 0000000..e512343
--- /dev/null
+++ b/layouts/index.html
@@ -0,0 +1,86 @@
+{{ define "main" }}
+<!-- Hero Section -->
+<section class="hero">
+    <div class="container">
+        <h1>Pascal - Readable, Reliable Programming</h1>
+        <p>A structured programming language that emphasizes clarity, reliability, and educational value. Perfect for learning programming fundamentals and building robust applications.</p>
+        <a href="{{ "/learn/" | relURL }}" class="hero-cta">Get Started</a>
+    </div>
+</section>
+
+<!-- Code Example Section -->
+<section class="content-section">
+    <div class="container">
+        <h2 class="section-title">Clean, Readable Code</h2>
+        <div class="highlight">
+            <pre><code class="language-pascal">program HelloWorld;
+begin
+    writeln('Hello, World!');
+    writeln('Welcome to Pascal programming');
+end.</code></pre>
+        </div>
+    </div>
+</section>
+
+<!-- Features Section -->
+<section class="content-section" style="background-color: var(--bg-secondary);">
+    <div class="container">
+        <h2 class="section-title">Why Choose Pascal?</h2>
+        <div class="cards">
+            <div class="card">
+                <h3>📖 Readable</h3>
+                <p>Pascal's clear syntax and structured approach make code easy to read, understand, and maintain. Perfect for both beginners and experienced developers.</p>
+            </div>
+            <div class="card">
+                <h3>🔒 Reliable</h3>
+                <p>Strong typing and compile-time checking help catch errors early, resulting in more robust and dependable software applications.</p>
+            </div>
+            <div class="card">
+                <h3>🎓 Educational</h3>
+                <p>Designed with education in mind, Pascal teaches fundamental programming concepts and good coding practices from the ground up.</p>
+            </div>
+            <div class="card">
+                <h3>⚡ Cross-Platform</h3>
+                <p>Modern Pascal implementations support multiple platforms, allowing you to write once and deploy everywhere with excellent performance.</p>
+            </div>
+        </div>
+    </div>
+</section>
+
+<!-- Getting Started Section -->
+<section class="content-section">
+    <div class="container">
+        <h2 class="section-title">Quick Start</h2>
+        <div class="cards">
+            <div class="card">
+                <h3>1. Install</h3>
+                <p>Download and install Free Pascal or Lazarus IDE to start coding immediately with a complete development environment.</p>
+                <a href="{{ "/learn/#install" | relURL }}">Installation Guide →</a>
+            </div>
+            <div class="card">
+                <h3>2. Learn</h3>
+                <p>Follow our comprehensive tutorials covering Pascal fundamentals, from basic syntax to advanced programming concepts.</p>
+                <a href="{{ "/learn/" | relURL }}">Start Learning →</a>
+            </div>
+            <div class="card">
+                <h3>3. Build</h3>
+                <p>Create your first Pascal program and explore our examples, from simple console apps to complex desktop applications.</p>
+                <a href="{{ "/docs/" | relURL }}">View Examples →</a>
+            </div>
+        </div>
+    </div>
+</section>
+
+<!-- Community Section -->
+<section class="content-section" style="background-color: var(--bg-secondary);">
+    <div class="container">
+        <h2 class="section-title">Join the Community</h2>
+        <p style="text-align: center; font-size: 1.1rem; max-width: 600px; margin: 0 auto var(--spacing-xl);">
+            Connect with Pascal developers worldwide, share knowledge, and contribute to the growing Pascal ecosystem.
+        </p>
+        <div style="text-align: center;">
+            <a href="{{ "/community/" | relURL }}" class="hero-cta">Join Community</a>
+        </div>
+    </div>
+</section>
+{{ end }}
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
new file mode 100644
index 0000000..6615d9a
--- /dev/null
+++ b/layouts/partials/footer.html
@@ -0,0 +1,32 @@
+<footer class="site-footer">
+    <div class="container">
+        <div class="footer-content">
+            <div class="footer-section">
+                <h4>Pascal</h4>
+                <p>Readable, reliable programming language for education and development.</p>
+            </div>
+            
+            <div class="footer-section">
+                <h4>Learn</h4>
+                <ul>
+                    <li><a href="{{ "/learn/" | relURL }}">Getting Started</a></li>
+                    <li><a href="{{ "/docs/" | relURL }}">Documentation</a></li>
+                </ul>
+            </div>
+            
+            <div class="footer-section">
+                <h4>Community</h4>
+                <ul>
+                    <li><a href="{{ "/community/" | relURL }}">Join Us</a></li>
+                    <li><a href="https://github.com/ObjectPascal-Community" target="_blank">GitHub</a></li>
+                </ul>
+            </div>
+        </div>
+        
+        <div class="footer-bottom">
+            <p>&copy; {{ now.Year }} Object Pascal Community. 
+               <a href="{{ "/license/" | relURL }}">Licensed under CC BY-SA 4.0</a>
+            </p>
+        </div>
+    </div>
+</footer>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
new file mode 100644
index 0000000..20f4bbb
--- /dev/null
+++ b/layouts/partials/header.html
@@ -0,0 +1,34 @@
+<header class="site-header">
+    <div class="container">
+        <nav class="navbar">
+            <div class="navbar-brand">
+                <a href="{{ "/" | relURL }}" class="logo">
+                    <span class="logo-text">Pascal</span>
+                </a>
+            </div>
+            
+            <div class="navbar-menu">
+                <ul class="navbar-nav">
+                    {{ range .Site.Menus.main }}
+                    <li class="nav-item">
+                        <a href="{{ .URL | relURL }}" class="nav-link{{ if $.IsMenuCurrent "main" . }} active{{ end }}">
+                            {{ .Name }}
+                        </a>
+                    </li>
+                    {{ end }}
+                </ul>
+                
+                <button id="theme-toggle" class="theme-toggle" aria-label="Toggle theme">
+                    <span class="theme-icon">🌙</span>
+                </button>
+            </div>
+            
+            <!-- Mobile menu button -->
+            <button class="mobile-menu-toggle" aria-label="Toggle menu">
+                <span></span>
+                <span></span>
+                <span></span>
+            </button>
+        </nav>
+    </div>
+</header>
diff --git a/static/css/main.css b/static/css/main.css
new file mode 100644
index 0000000..50a56c9
--- /dev/null
+++ b/static/css/main.css
@@ -0,0 +1,375 @@
+/* CSS Variables for theming */
+:root {
+  /* Light theme colors */
+  --bg-primary: #ffffff;
+  --bg-secondary: #f8f9fa;
+  --bg-tertiary: #e9ecef;
+  --text-primary: #212529;
+  --text-secondary: #6c757d;
+  --text-muted: #868e96;
+  --accent-primary: #007bff;
+  --accent-hover: #0056b3;
+  --border-color: #dee2e6;
+  --code-bg: #f8f9fa;
+  --shadow: rgba(0, 0, 0, 0.1);
+  
+  /* Typography */
+  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  --font-mono: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
+  
+  /* Spacing */
+  --spacing-xs: 0.25rem;
+  --spacing-sm: 0.5rem;
+  --spacing-md: 1rem;
+  --spacing-lg: 1.5rem;
+  --spacing-xl: 2rem;
+  --spacing-2xl: 3rem;
+  --spacing-3xl: 4rem;
+  
+  /* Layout */
+  --container-max-width: 1200px;
+  --border-radius: 8px;
+  --transition: all 0.2s ease;
+}
+
+/* Dark theme colors */
+[data-theme="dark"] {
+  --bg-primary: #1a1a1a;
+  --bg-secondary: #2d2d2d;
+  --bg-tertiary: #404040;
+  --text-primary: #ffffff;
+  --text-secondary: #b3b3b3;
+  --text-muted: #808080;
+  --accent-primary: #4dabf7;
+  --accent-hover: #339af0;
+  --border-color: #404040;
+  --code-bg: #2d2d2d;
+  --shadow: rgba(0, 0, 0, 0.3);
+}
+
+/* Reset and base styles */
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+html {
+  font-size: 16px;
+  line-height: 1.6;
+}
+
+body {
+  font-family: var(--font-family);
+  background-color: var(--bg-primary);
+  color: var(--text-primary);
+  transition: var(--transition);
+}
+
+/* Container */
+.container {
+  max-width: var(--container-max-width);
+  margin: 0 auto;
+  padding: 0 var(--spacing-lg);
+}
+
+/* Typography */
+h1, h2, h3, h4, h5, h6 {
+  font-weight: 600;
+  line-height: 1.2;
+  margin-bottom: var(--spacing-md);
+  color: var(--text-primary);
+}
+
+h1 { font-size: 2.5rem; }
+h2 { font-size: 2rem; }
+h3 { font-size: 1.5rem; }
+h4 { font-size: 1.25rem; }
+
+p {
+  margin-bottom: var(--spacing-md);
+  color: var(--text-secondary);
+}
+
+a {
+  color: var(--accent-primary);
+  text-decoration: none;
+  transition: var(--transition);
+}
+
+a:hover {
+  color: var(--accent-hover);
+}
+
+/* Header */
+.site-header {
+  background-color: var(--bg-primary);
+  border-bottom: 1px solid var(--border-color);
+  position: sticky;
+  top: 0;
+  z-index: 100;
+}
+
+.navbar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: var(--spacing-md) 0;
+}
+
+.navbar-brand .logo {
+  font-size: 1.5rem;
+  font-weight: 700;
+  color: var(--text-primary);
+  text-decoration: none;
+}
+
+.navbar-menu {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-lg);
+}
+
+.navbar-nav {
+  display: flex;
+  list-style: none;
+  gap: var(--spacing-lg);
+  margin: 0;
+}
+
+.nav-link {
+  color: var(--text-secondary);
+  font-weight: 500;
+  padding: var(--spacing-sm) var(--spacing-md);
+  border-radius: var(--border-radius);
+  transition: var(--transition);
+}
+
+.nav-link:hover,
+.nav-link.active {
+  color: var(--accent-primary);
+  background-color: var(--bg-secondary);
+}
+
+/* Theme toggle */
+.theme-toggle {
+  background: none;
+  border: 1px solid var(--border-color);
+  border-radius: var(--border-radius);
+  padding: var(--spacing-sm);
+  cursor: pointer;
+  font-size: 1.2rem;
+  transition: var(--transition);
+}
+
+.theme-toggle:hover {
+  background-color: var(--bg-secondary);
+}
+
+/* Mobile menu toggle */
+.mobile-menu-toggle {
+  display: none;
+  flex-direction: column;
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: var(--spacing-sm);
+}
+
+.mobile-menu-toggle span {
+  width: 25px;
+  height: 3px;
+  background-color: var(--text-primary);
+  margin: 3px 0;
+  transition: var(--transition);
+}
+
+/* Hero section */
+.hero {
+  padding: var(--spacing-3xl) 0;
+  text-align: center;
+  background-color: var(--bg-secondary);
+}
+
+.hero h1 {
+  font-size: 3rem;
+  margin-bottom: var(--spacing-lg);
+  color: var(--text-primary);
+}
+
+.hero p {
+  font-size: 1.25rem;
+  margin-bottom: var(--spacing-xl);
+  color: var(--text-secondary);
+  max-width: 600px;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.hero-cta {
+  display: inline-block;
+  background-color: var(--accent-primary);
+  color: white;
+  padding: var(--spacing-md) var(--spacing-xl);
+  border-radius: var(--border-radius);
+  font-weight: 600;
+  font-size: 1.1rem;
+  transition: var(--transition);
+}
+
+.hero-cta:hover {
+  background-color: var(--accent-hover);
+  color: white;
+  transform: translateY(-2px);
+  box-shadow: 0 4px 12px var(--shadow);
+}
+
+/* Content sections */
+.content-section {
+  padding: var(--spacing-3xl) 0;
+}
+
+.section-title {
+  text-align: center;
+  margin-bottom: var(--spacing-2xl);
+}
+
+/* Cards */
+.cards {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+  gap: var(--spacing-xl);
+  margin-top: var(--spacing-2xl);
+}
+
+.card {
+  background-color: var(--bg-primary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--border-radius);
+  padding: var(--spacing-xl);
+  transition: var(--transition);
+}
+
+.card:hover {
+  transform: translateY(-4px);
+  box-shadow: 0 8px 25px var(--shadow);
+}
+
+.card h3 {
+  color: var(--accent-primary);
+  margin-bottom: var(--spacing-md);
+}
+
+/* Code blocks */
+.highlight {
+  margin: var(--spacing-lg) 0;
+  border-radius: var(--border-radius);
+  overflow: hidden;
+}
+
+pre {
+  background-color: var(--code-bg);
+  padding: var(--spacing-lg);
+  overflow-x: auto;
+  font-family: var(--font-mono);
+  font-size: 0.9rem;
+  line-height: 1.4;
+}
+
+code {
+  font-family: var(--font-mono);
+  background-color: var(--code-bg);
+  padding: 0.2em 0.4em;
+  border-radius: 4px;
+  font-size: 0.9em;
+}
+
+pre code {
+  background: none;
+  padding: 0;
+}
+
+/* Footer */
+.site-footer {
+  background-color: var(--bg-secondary);
+  border-top: 1px solid var(--border-color);
+  padding: var(--spacing-2xl) 0 var(--spacing-lg);
+  margin-top: var(--spacing-3xl);
+}
+
+.footer-content {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+  gap: var(--spacing-xl);
+  margin-bottom: var(--spacing-xl);
+}
+
+.footer-section h4 {
+  color: var(--text-primary);
+  margin-bottom: var(--spacing-md);
+}
+
+.footer-section ul {
+  list-style: none;
+}
+
+.footer-section ul li {
+  margin-bottom: var(--spacing-sm);
+}
+
+.footer-section a {
+  color: var(--text-secondary);
+}
+
+.footer-bottom {
+  text-align: center;
+  padding-top: var(--spacing-lg);
+  border-top: 1px solid var(--border-color);
+  color: var(--text-muted);
+}
+
+/* Responsive design */
+@media (max-width: 768px) {
+  .container {
+    padding: 0 var(--spacing-md);
+  }
+  
+  .navbar-menu {
+    display: none;
+  }
+  
+  .mobile-menu-toggle {
+    display: flex;
+  }
+  
+  .hero h1 {
+    font-size: 2rem;
+  }
+  
+  .hero p {
+    font-size: 1.1rem;
+  }
+  
+  .cards {
+    grid-template-columns: 1fr;
+    gap: var(--spacing-lg);
+  }
+  
+  .content-section {
+    padding: var(--spacing-2xl) 0;
+  }
+}
+
+@media (max-width: 480px) {
+  .hero {
+    padding: var(--spacing-2xl) 0;
+  }
+  
+  .hero h1 {
+    font-size: 1.75rem;
+  }
+  
+  .card {
+    padding: var(--spacing-lg);
+  }
+}

From 44591f3e556b93ac2c3bf5cc48b9fe7768ceaf3a Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Tue, 5 Aug 2025 20:50:09 +1000
Subject: [PATCH 02/27] feat: more styling

---
 layouts/index.html  |  10 ++---
 static/css/main.css | 101 ++++++++++++++++++++++++++++++++++++++++++++
 static/favicon.ico  |   0
 3 files changed, 106 insertions(+), 5 deletions(-)
 create mode 100644 static/favicon.ico

diff --git a/layouts/index.html b/layouts/index.html
index e512343..fa565e8 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -13,11 +13,11 @@ <h1>Pascal - Readable, Reliable Programming</h1>
     <div class="container">
         <h2 class="section-title">Clean, Readable Code</h2>
         <div class="highlight">
-            <pre><code class="language-pascal">program HelloWorld;
-begin
-    writeln('Hello, World!');
-    writeln('Welcome to Pascal programming');
-end.</code></pre>
+            <pre class="chroma"><code><span class="k">program</span> <span class="n">HelloWorld</span>;
+<span class="k">begin</span>
+    <span class="nf">writeln</span>(<span class="s1">'Hello, World!'</span>);
+    <span class="nf">writeln</span>(<span class="s1">'Welcome to Pascal programming'</span>);
+<span class="k">end</span>.</code></pre>
         </div>
     </div>
 </section>
diff --git a/static/css/main.css b/static/css/main.css
index 50a56c9..370593a 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -328,6 +328,107 @@ pre code {
   color: var(--text-muted);
 }
 
+/* Chroma Syntax Highlighting Styles */
+/* Background */ .bg { background-color: var(--code-bg); }
+/* PreWrapper */ .chroma { background-color: var(--code-bg); }
+/* Other */ .chroma .x {  }
+/* Error */ .chroma .err { color:#f6f8fa;background-color:#82071e }
+/* CodeLine */ .chroma .cl {  }
+/* LineLink */ .chroma .lnlinks { outline:none;text-decoration:none;color:inherit }
+/* LineTableTD */ .chroma .lntd { vertical-align:top;padding:0;margin:0;border:0; }
+/* LineTable */ .chroma .lntable { border-spacing:0;padding:0;margin:0;border:0; }
+/* LineHighlight */ .chroma .hl { background-color:#e5e5e5 }
+/* LineNumbersTable */ .chroma .lnt { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f }
+/* LineNumbers */ .chroma .ln { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f }
+/* Line */ .chroma .line { display:flex; }
+/* Keyword */ .chroma .k { color:#cf222e }
+/* KeywordConstant */ .chroma .kc { color:#cf222e }
+/* KeywordDeclaration */ .chroma .kd { color:#cf222e }
+/* KeywordNamespace */ .chroma .kn { color:#cf222e }
+/* KeywordPseudo */ .chroma .kp { color:#cf222e }
+/* KeywordReserved */ .chroma .kr { color:#cf222e }
+/* KeywordType */ .chroma .kt { color:#cf222e }
+/* Name */ .chroma .n {  }
+/* NameAttribute */ .chroma .na { color:#1f2328 }
+/* NameClass */ .chroma .nc { color:#1f2328 }
+/* NameConstant */ .chroma .no { color:#0550ae }
+/* NameDecorator */ .chroma .nd { color:#0550ae }
+/* NameEntity */ .chroma .ni { color:#6639ba }
+/* NameException */ .chroma .ne {  }
+/* NameLabel */ .chroma .nl { color:#900;font-weight:bold }
+/* NameNamespace */ .chroma .nn { color:#24292e }
+/* NameOther */ .chroma .nx { color:#1f2328 }
+/* NameProperty */ .chroma .py {  }
+/* NameTag */ .chroma .nt { color:#0550ae }
+/* NameBuiltin */ .chroma .nb { color:#6639ba }
+/* NameBuiltinPseudo */ .chroma .bp { color:#6a737d }
+/* NameVariable */ .chroma .nv { color:#953800 }
+/* NameVariableClass */ .chroma .vc { color:#953800 }
+/* NameVariableGlobal */ .chroma .vg { color:#953800 }
+/* NameVariableInstance */ .chroma .vi { color:#953800 }
+/* NameVariableMagic */ .chroma .vm { color:#953800 }
+/* NameFunction */ .chroma .nf { color:#6639ba }
+/* NameFunctionMagic */ .chroma .fm { color:#6639ba }
+/* Literal */ .chroma .l {  }
+/* LiteralDate */ .chroma .ld {  }
+/* LiteralString */ .chroma .s { color:#0a3069 }
+/* LiteralStringAffix */ .chroma .sa { color:#0a3069 }
+/* LiteralStringBacktick */ .chroma .sb { color:#0a3069 }
+/* LiteralStringChar */ .chroma .sc { color:#0a3069 }
+/* LiteralStringDelimiter */ .chroma .dl { color:#0a3069 }
+/* LiteralStringDoc */ .chroma .sd { color:#0a3069 }
+/* LiteralStringDouble */ .chroma .s2 { color:#0a3069 }
+/* LiteralStringEscape */ .chroma .se { color:#0a3069 }
+/* LiteralStringHeredoc */ .chroma .sh { color:#0a3069 }
+/* LiteralStringInterpol */ .chroma .si { color:#0a3069 }
+/* LiteralStringOther */ .chroma .sx { color:#0a3069 }
+/* LiteralStringRegex */ .chroma .sr { color:#0a3069 }
+/* LiteralStringSingle */ .chroma .s1 { color:#0a3069 }
+/* LiteralStringSymbol */ .chroma .ss { color:#032f62 }
+/* LiteralNumber */ .chroma .m { color:#0550ae }
+/* LiteralNumberBin */ .chroma .mb { color:#0550ae }
+/* LiteralNumberFloat */ .chroma .mf { color:#0550ae }
+/* LiteralNumberHex */ .chroma .mh { color:#0550ae }
+/* LiteralNumberInteger */ .chroma .mi { color:#0550ae }
+/* LiteralNumberIntegerLong */ .chroma .il { color:#0550ae }
+/* LiteralNumberOct */ .chroma .mo { color:#0550ae }
+/* Operator */ .chroma .o { color:#0550ae }
+/* OperatorWord */ .chroma .ow { color:#0550ae }
+/* Punctuation */ .chroma .p { color:#1f2328 }
+/* Comment */ .chroma .c { color:#57606a }
+/* CommentHashbang */ .chroma .ch { color:#57606a }
+/* CommentMultiline */ .chroma .cm { color:#57606a }
+/* CommentSingle */ .chroma .c1 { color:#57606a }
+/* CommentSpecial */ .chroma .cs { color:#57606a }
+/* CommentPreproc */ .chroma .cp { color:#57606a }
+/* CommentPreprocFile */ .chroma .cpf { color:#57606a }
+/* Generic */ .chroma .g {  }
+/* GenericDeleted */ .chroma .gd { color:#82071e;background-color:#ffebe9 }
+/* GenericEmph */ .chroma .ge { color:#1f2328 }
+/* GenericError */ .chroma .gr {  }
+/* GenericHeading */ .chroma .gh {  }
+/* GenericInserted */ .chroma .gi { color:#116329;background-color:#dafbe1 }
+/* GenericOutput */ .chroma .go { color:#1f2328 }
+/* GenericPrompt */ .chroma .gp {  }
+/* GenericStrong */ .chroma .gs {  }
+/* GenericSubheading */ .chroma .gu {  }
+/* GenericTraceback */ .chroma .gt {  }
+/* GenericUnderline */ .chroma .gl { text-decoration:underline }
+/* TextWhitespace */ .chroma .w { color:#fff }
+
+/* Dark theme adjustments for syntax highlighting */
+[data-theme="dark"] .chroma { background-color: var(--code-bg); color: var(--text-primary); }
+[data-theme="dark"] .chroma .k { color:#ff7b72; } /* Keywords - red */
+[data-theme="dark"] .chroma .s { color:#a5d6ff; } /* Strings - blue */
+[data-theme="dark"] .chroma .s1 { color:#a5d6ff; } /* Single quoted strings - blue */
+[data-theme="dark"] .chroma .m { color:#79c0ff; } /* Numbers - cyan */
+[data-theme="dark"] .chroma .c { color:#8b949e; } /* Comments - gray */
+[data-theme="dark"] .chroma .nf { color:#d2a8ff; } /* Function names - purple */
+[data-theme="dark"] .chroma .nb { color:#ffa657; } /* Built-ins - orange */
+[data-theme="dark"] .chroma .n { color: var(--text-primary); } /* Names - white */
+[data-theme="dark"] .chroma .p { color: var(--text-secondary); } /* Punctuation - light gray */
+[data-theme="dark"] .chroma code { color: var(--text-primary); } /* Default code text - white */
+
 /* Responsive design */
 @media (max-width: 768px) {
   .container {
diff --git a/static/favicon.ico b/static/favicon.ico
new file mode 100644
index 0000000..e69de29

From ed53149774552f408c597ee26387985aa9d835e9 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Tue, 5 Aug 2025 20:56:11 +1000
Subject: [PATCH 03/27] feat: beter dark colours

---
 static/css/main.css | 24 ++++++++++++------------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/static/css/main.css b/static/css/main.css
index 370593a..c9db2b5 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -32,19 +32,19 @@
   --transition: all 0.2s ease;
 }
 
-/* Dark theme colors */
+/* Dark theme colors - Professional and modern */
 [data-theme="dark"] {
-  --bg-primary: #1a1a1a;
-  --bg-secondary: #2d2d2d;
-  --bg-tertiary: #404040;
-  --text-primary: #ffffff;
-  --text-secondary: #b3b3b3;
-  --text-muted: #808080;
-  --accent-primary: #4dabf7;
-  --accent-hover: #339af0;
-  --border-color: #404040;
-  --code-bg: #2d2d2d;
-  --shadow: rgba(0, 0, 0, 0.3);
+  --bg-primary: #0d1117;
+  --bg-secondary: #161b22;
+  --bg-tertiary: #21262d;
+  --text-primary: #f0f6fc;
+  --text-secondary: #8b949e;
+  --text-muted: #6e7681;
+  --accent-primary: #58a6ff;
+  --accent-hover: #1f6feb;
+  --border-color: #30363d;
+  --code-bg: #161b22;
+  --shadow: rgba(0, 0, 0, 0.4);
 }
 
 /* Reset and base styles */

From 6ea145c86c112e8c53f36f8a9ac694cd0903420d Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Tue, 5 Aug 2025 21:04:27 +1000
Subject: [PATCH 04/27] feat: better light colours

---
 static/css/main.css | 25 ++++++++++++++-----------
 1 file changed, 14 insertions(+), 11 deletions(-)

diff --git a/static/css/main.css b/static/css/main.css
index c9db2b5..e732035 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -1,17 +1,17 @@
 /* CSS Variables for theming */
 :root {
   /* Light theme colors */
-  --bg-primary: #ffffff;
-  --bg-secondary: #f8f9fa;
-  --bg-tertiary: #e9ecef;
-  --text-primary: #212529;
-  --text-secondary: #6c757d;
-  --text-muted: #868e96;
-  --accent-primary: #007bff;
-  --accent-hover: #0056b3;
-  --border-color: #dee2e6;
-  --code-bg: #f8f9fa;
-  --shadow: rgba(0, 0, 0, 0.1);
+  --bg-primary: #fafbfc;
+  --bg-secondary: #f6f8fa;
+  --bg-tertiary: #e1e4e8;
+  --text-primary: #24292e;
+  --text-secondary: #586069;
+  --text-muted: #6a737d;
+  --accent-primary: #0366d6;
+  --accent-hover: #0256cc;
+  --border-color: #e1e4e8;
+  --code-bg: #f6f8fa;
+  --shadow: rgba(27, 31, 35, 0.04);
   
   /* Typography */
   --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
@@ -265,6 +265,8 @@ a:hover {
   margin: var(--spacing-lg) 0;
   border-radius: var(--border-radius);
   overflow: hidden;
+  border: 1px solid var(--border-color);
+  box-shadow: 0 2px 4px var(--shadow);
 }
 
 pre {
@@ -274,6 +276,7 @@ pre {
   font-family: var(--font-mono);
   font-size: 0.9rem;
   line-height: 1.4;
+  margin: 0;
 }
 
 code {

From 6ca9be27f3e11ba48c37cef781b4208993769bb6 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Tue, 5 Aug 2025 21:22:28 +1000
Subject: [PATCH 05/27] feat: add initial website structure with content
 sections and layouts

---
 content/community/_index.md   | 303 ++++++++++++++++
 content/docs/_index.md        | 665 ++++++++++++++++++++++++++++++++++
 content/learn/_index.md       | 227 ++++++++++++
 hugo.toml                     |   7 +-
 layouts/_default/section.html |  92 +++++
 static/css/main.css           | 100 -----
 6 files changed, 1293 insertions(+), 101 deletions(-)
 create mode 100644 layouts/_default/section.html

diff --git a/content/community/_index.md b/content/community/_index.md
index 9bb8c15..bbc949e 100644
--- a/content/community/_index.md
+++ b/content/community/_index.md
@@ -217,4 +217,307 @@ Stay informed about:
 
 **Ready to join?** Pick a platform above and start connecting with fellow Pascal developers today!
 
+## Featured Community Projects
+
+### 🚀 Active Open Source Projects
+
+**Free Pascal Compiler (FPC)**
+- **Description**: The core Free Pascal compiler and runtime library
+- **Language**: Pascal, Assembly, C
+- **Contributors**: 100+ active developers worldwide
+- **How to contribute**: Bug reports, patches, documentation, testing
+- **Repository**: [GitHub - Free Pascal](https://github.com/graemeg/freepascal)
+- **Difficulty**: Beginner to Expert
+
+**Lazarus IDE**
+- **Description**: Cross-platform visual IDE for Free Pascal
+- **Language**: Object Pascal
+- **Contributors**: 50+ active developers
+- **How to contribute**: UI improvements, components, bug fixes
+- **Repository**: [GitLab - Lazarus](https://gitlab.com/freepascal.org/lazarus/lazarus)
+- **Difficulty**: Intermediate to Expert
+
+**mORMot Framework**
+- **Description**: High-performance ORM and SOA framework
+- **Language**: Object Pascal
+- **Contributors**: 20+ developers
+- **How to contribute**: Examples, documentation, performance testing
+- **Repository**: [GitHub - mORMot](https://github.com/synopse/mORMot2)
+- **Difficulty**: Advanced
+
+**Castle Game Engine**
+- **Description**: 3D and 2D game engine for Pascal
+- **Language**: Object Pascal
+- **Contributors**: 15+ developers
+- **How to contribute**: Game examples, engine features, documentation
+- **Repository**: [GitHub - Castle Game Engine](https://github.com/castle-engine/castle-engine)
+- **Difficulty**: Intermediate to Advanced
+
+**Synapse TCP/IP Library**
+- **Description**: Network communication library
+- **Language**: Object Pascal
+- **Contributors**: 10+ developers
+- **How to contribute**: Protocol implementations, examples, testing
+- **Repository**: [SourceForge - Synapse](https://sourceforge.net/projects/synalist/)
+- **Difficulty**: Intermediate
+
+### 📚 Community-Driven Documentation
+
+**Pascal Wiki**
+- **Description**: Collaborative Pascal knowledge base
+- **How to contribute**: Write tutorials, improve existing articles
+- **Topics needed**: Modern Pascal features, best practices, examples
+- **Repository**: [Free Pascal Wiki](https://wiki.freepascal.org/)
+
+**Pascal Cookbook**
+- **Description**: Collection of practical Pascal recipes
+- **How to contribute**: Submit code examples, review submissions
+- **Focus areas**: Algorithms, GUI programming, web development
+- **Repository**: [GitHub - Pascal Cookbook](https://github.com/ObjectPascal-Community/pascal-cookbook)
+
+**Translation Projects**
+- **Languages needed**: Spanish, French, German, Portuguese, Russian, Chinese
+- **Content**: Documentation, tutorials, error messages
+- **Tools**: Standard translation tools and Git workflow
+- **Coordination**: Translation team leads for each language
+
+## Community Showcase
+
+### 🏆 Project Spotlight
+
+**This Month: PascalScript**
+- **Developer**: RemObjects Software
+- **Description**: Scripting engine that allows Pascal code to be executed at runtime
+- **Use cases**: Plugin systems, configuration scripts, embedded scripting
+- **Why it's cool**: Brings dynamic capabilities to Pascal applications
+- **Learn more**: [PascalScript Documentation](https://www.remobjects.com/ps.aspx)
+
+**Previous Spotlights:**
+- **Graphics32**: High-performance 2D graphics library
+- **Indy Project**: Internet protocol components
+- **LazReport**: Reporting system for Lazarus
+- **BGRABitmap**: Advanced bitmap manipulation library
+
+### 👥 Developer Profiles
+
+**Featured Developer: Mattias Gaertner**
+- **Role**: Lazarus IDE core developer
+- **Contributions**: IDE architecture, debugger integration, code tools
+- **Quote**: "Pascal's clarity makes complex IDE features manageable"
+- **Projects**: Lazarus IDE, CodeTools, FPC integration
+
+**Featured Developer: Arnaud Bouchez**
+- **Role**: mORMot framework creator
+- **Contributions**: High-performance ORM, SOA architecture
+- **Quote**: "Pascal's performance rivals C++ while maintaining readability"
+- **Projects**: mORMot, SynPDF, SynCrypto
+
+### 🎯 Success Stories
+
+**Commercial Applications**
+- **Skype**: Original client written in Object Pascal (Delphi)
+- **Total Commander**: Popular file manager
+- **Dev-C++**: IDE development environment
+- **Cheat Engine**: Memory scanner and debugger
+
+**Educational Institutions**
+- **Universities**: 50+ universities teaching Pascal worldwide
+- **Online Courses**: 10,000+ students learning Pascal annually
+- **Coding Competitions**: Pascal remains popular in programming contests
+
+## Learning Together
+
+### 📖 Study Groups
+
+**Beginner Study Group**
+- **Schedule**: Every Tuesday, 7 PM UTC
+- **Platform**: Discord voice channel
+- **Topics**: Basic syntax, control structures, simple programs
+- **Materials**: Shared exercises and solutions
+- **Mentor**: Rotating experienced community members
+
+**Advanced Topics Group**
+- **Schedule**: Every Friday, 8 PM UTC
+- **Platform**: Discord + screen sharing
+- **Topics**: OOP, generics, advanced memory management
+- **Format**: Code reviews and architectural discussions
+- **Prerequisites**: Comfortable with basic Pascal
+
+**GUI Development Workshop**
+- **Schedule**: Monthly, first Saturday
+- **Platform**: Lazarus IDE + Discord
+- **Topics**: Form design, event handling, custom components
+- **Projects**: Build real applications together
+- **Duration**: 3-hour sessions
+
+### 🏃‍♂️ Code Challenges
+
+**Weekly Coding Challenge**
+- **Day**: Every Monday
+- **Difficulty**: Rotating (Easy → Medium → Hard)
+- **Platform**: GitHub repository with submissions
+- **Prizes**: Community recognition, Pascal swag
+- **Examples**: Algorithm puzzles, data structure problems
+
+**Monthly Project Challenge**
+- **Theme**: Changes monthly (Games, Utilities, Libraries)
+- **Duration**: 4 weeks to complete
+- **Judging**: Community voting + expert review
+- **Categories**: Innovation, Code Quality, Documentation
+- **Prizes**: Featured on website, mentorship opportunities
+
+**Annual Hackathon**
+- **Event**: Pascal Global Hackathon
+- **Duration**: 48 hours
+- **Teams**: 2-4 people, global participation
+- **Themes**: Education, Open Source, Innovation
+- **Prizes**: Cash prizes, conference tickets, mentorship
+
+## Mentorship Program
+
+### 🎓 Become a Mentee
+
+**Application Process**
+1. **Submit Application**: Background, goals, time commitment
+2. **Skill Assessment**: Basic Pascal knowledge test
+3. **Matching**: Paired with compatible mentor
+4. **Kickoff Meeting**: Set goals and schedule
+5. **Regular Check-ins**: Weekly progress meetings
+
+**What You Get**
+- **One-on-one guidance** from experienced Pascal developer
+- **Code reviews** and architectural feedback
+- **Career advice** and industry insights
+- **Project collaboration** opportunities
+- **Community connections** and networking
+
+**Commitment**
+- **Duration**: 3-6 months
+- **Time**: 2-3 hours per week
+- **Activities**: Coding sessions, project work, discussions
+- **Goals**: Skill improvement, project completion, confidence building
+
+### 👨‍🏫 Become a Mentor
+
+**Requirements**
+- **Experience**: 2+ years professional Pascal development
+- **Skills**: Strong technical knowledge, teaching ability
+- **Time**: 3-4 hours per week availability
+- **Communication**: Good English, patient personality
+
+**Benefits**
+- **Give back** to the Pascal community
+- **Develop leadership** and teaching skills
+- **Stay current** with new Pascal developments
+- **Build network** of junior developers
+- **Recognition** in community and resume
+
+**Application Process**
+1. **Submit Profile**: Experience, specialties, availability
+2. **Interview**: Video call with program coordinators
+3. **Training**: Mentorship best practices workshop
+4. **Matching**: Paired with suitable mentee
+5. **Ongoing Support**: Regular mentor meetings and resources
+
+## Regional Communities
+
+### 🌍 Local User Groups
+
+**North America**
+- **Pascal Users Group - Silicon Valley**: Monthly meetups, tech talks
+- **Toronto Pascal Developers**: Quarterly workshops, networking
+- **Pascal Mexico**: Spanish-language community, tutorials
+
+**Europe**
+- **German Pascal Community**: Large active forum, annual conference
+- **French Pascal Users**: Monthly Paris meetups, online resources
+- **UK Pascal Society**: London meetups, university partnerships
+- **Scandinavian Pascal Group**: Nordic countries collaboration
+
+**Asia-Pacific**
+- **Japan Pascal Community**: Tokyo meetups, Japanese documentation
+- **Australian Pascal Users**: Sydney/Melbourne chapters
+- **Pascal India**: Growing community, educational focus
+
+**South America**
+- **Brazilian Pascal Community**: Large Portuguese-speaking group
+- **Argentina Pascal Developers**: Buenos Aires meetups
+
+### 📅 Upcoming Events
+
+**March 2024**
+- **15th**: Pascal Global Meetup (Online)
+- **22nd**: Lazarus GUI Workshop (Berlin)
+- **29th**: Free Pascal Compiler Deep Dive (Online)
+
+**April 2024**
+- **5th**: Pascal in Education Conference (Online)
+- **12th**: Game Development with Pascal (London)
+- **19th**: Database Programming Workshop (Online)
+- **26th**: Pascal Performance Optimization (San Francisco)
+
+**May 2024**
+- **3rd**: Annual Pascal Hackathon (Global, 48 hours)
+- **10th**: Mobile Development with Pascal (Online)
+- **17th**: Pascal Web Development (Amsterdam)
+- **24th**: Community Contributors Summit (Online)
+
+## Community Guidelines
+
+### 🤝 Code of Conduct
+
+**Our Values**
+- **Respect**: Treat all community members with dignity
+- **Inclusivity**: Welcome developers of all backgrounds and skill levels
+- **Collaboration**: Share knowledge and help others succeed
+- **Quality**: Strive for excellence in code and communication
+- **Growth**: Support continuous learning and improvement
+
+**Expected Behavior**
+- **Be helpful and patient** with newcomers
+- **Provide constructive feedback** on code and ideas
+- **Share knowledge freely** and credit others appropriately
+- **Communicate clearly** and professionally
+- **Respect different opinions** and approaches
+
+**Unacceptable Behavior**
+- **Harassment or discrimination** of any kind
+- **Spam or off-topic content** in community channels
+- **Sharing proprietary code** without permission
+- **Personal attacks** or inflammatory language
+- **Disrupting community events** or discussions
+
+**Enforcement**
+- **First violation**: Warning and guidance
+- **Second violation**: Temporary suspension
+- **Serious violations**: Immediate permanent ban
+- **Appeals process**: Contact community moderators
+
+### 📋 Contribution Guidelines
+
+**Code Contributions**
+1. **Follow coding standards**: Consistent formatting and naming
+2. **Write clear comments**: Explain complex logic and algorithms
+3. **Include tests**: Unit tests for new functionality
+4. **Update documentation**: Keep docs in sync with code changes
+5. **Submit pull requests**: Use standard Git workflow
+
+**Documentation Contributions**
+1. **Write for your audience**: Consider skill level and context
+2. **Use clear examples**: Working code snippets with explanations
+3. **Keep it current**: Update outdated information
+4. **Follow style guide**: Consistent formatting and structure
+5. **Proofread carefully**: Check grammar and technical accuracy
+
+**Community Participation**
+1. **Be active and engaged**: Regular participation in discussions
+2. **Help newcomers**: Answer questions and provide guidance
+3. **Share your projects**: Show what you're building with Pascal
+4. **Attend events**: Join meetups, workshops, and conferences
+5. **Provide feedback**: Help improve community resources and events
+
+---
+
+**Ready to join?** Pick a platform above and start connecting with fellow Pascal developers today!
+
 *Questions about the community? [Contact us](mailto:community@pascal-lang.org)*
diff --git a/content/docs/_index.md b/content/docs/_index.md
index 393ef4b..8a5821d 100644
--- a/content/docs/_index.md
+++ b/content/docs/_index.md
@@ -290,3 +290,668 @@ end.
 - [Lazarus Documentation](https://wiki.lazarus.freepascal.org/)
 - [Pascal Programming Tutorials](/learn/)
 - [Community Examples and Projects](/community/)
+
+## Standard Library Reference
+
+### System Unit
+
+The System unit is automatically included and provides core functionality:
+
+**Memory Management:**
+```pascal
+{ Dynamic memory allocation }
+var
+    ptr: ^integer;
+begin
+    New(ptr);           // Allocate memory
+    ptr^ := 42;         // Assign value
+    writeln(ptr^);      // Use value
+    Dispose(ptr);       // Free memory
+end;
+```
+
+**String Functions:**
+```pascal
+program StringFunctions;
+var
+    text: string;
+    position: integer;
+begin
+    text := 'Hello, Pascal World!';
+    
+    writeln('Length: ', Length(text));
+    writeln('Uppercase: ', UpperCase(text));
+    writeln('Lowercase: ', LowerCase(text));
+    
+    position := Pos('Pascal', text);
+    writeln('Position of "Pascal": ', position);
+    
+    writeln('Substring: ', Copy(text, 8, 6)); // "Pascal"
+end.
+```
+
+### SysUtils Unit
+
+Provides extended system utilities:
+
+```pascal
+uses SysUtils;
+
+program SysUtilsExample;
+var
+    fileName: string;
+    fileAge: integer;
+begin
+    fileName := 'example.txt';
+    
+    { File operations }
+    if FileExists(fileName) then
+    begin
+        fileAge := FileAge(fileName);
+        writeln('File exists, age: ', fileAge);
+        writeln('File size: ', FileSize(fileName), ' bytes');
+    end
+    else
+        writeln('File does not exist');
+    
+    { String formatting }
+    writeln(Format('Today is %s', [DateToStr(Date)]));
+    writeln(Format('Current time: %s', [TimeToStr(Time)]));
+end.
+```
+
+### Math Unit
+
+Mathematical functions and constants:
+
+```pascal
+uses Math;
+
+program MathExample;
+var
+    angle, result: double;
+begin
+    angle := Pi / 4;  // 45 degrees in radians
+    
+    writeln('Sin(45°): ', Sin(angle):0:4);
+    writeln('Cos(45°): ', Cos(angle):0:4);
+    writeln('Tan(45°): ', Tan(angle):0:4);
+    
+    writeln('Square root of 16: ', Sqrt(16):0:2);
+    writeln('2 to the power of 8: ', Power(2, 8):0:0);
+    writeln('Natural log of e: ', Ln(Exp(1)):0:4);
+    
+    { Random numbers }
+    Randomize;
+    writeln('Random number (0-99): ', Random(100));
+end.
+```
+
+## Advanced Programming Patterns
+
+### Generic Programming
+
+```pascal
+program GenericExample;
+
+{$mode objfpc}
+{$H+}
+
+type
+    generic TList<T> = class
+    private
+        FItems: array of T;
+        FCount: integer;
+    public
+        procedure Add(const Item: T);
+        function Get(Index: integer): T;
+        property Count: integer read FCount;
+    end;
+
+procedure TList.Add(const Item: T);
+begin
+    SetLength(FItems, FCount + 1);
+    FItems[FCount] := Item;
+    Inc(FCount);
+end;
+
+function TList.Get(Index: integer): T;
+begin
+    if (Index >= 0) and (Index < FCount) then
+        Result := FItems[Index]
+    else
+        raise Exception.Create('Index out of bounds');
+end;
+
+type
+    TIntegerList = specialize TList<integer>;
+    TStringList = specialize TList<string>;
+
+var
+    intList: TIntegerList;
+    strList: TStringList;
+    i: integer;
+begin
+    intList := TIntegerList.Create;
+    strList := TStringList.Create;
+    
+    try
+        { Add integers }
+        for i := 1 to 5 do
+            intList.Add(i * 10);
+        
+        { Add strings }
+        strList.Add('Apple');
+        strList.Add('Banana');
+        strList.Add('Cherry');
+        
+        { Display results }
+        writeln('Integers:');
+        for i := 0 to intList.Count - 1 do
+            writeln('  ', intList.Get(i));
+        
+        writeln('Strings:');
+        for i := 0 to strList.Count - 1 do
+            writeln('  ', strList.Get(i));
+    finally
+        intList.Free;
+        strList.Free;
+    end;
+end.
+```
+
+### Interface Programming
+
+```pascal
+program InterfaceExample;
+
+{$mode objfpc}
+{$interfaces corba}
+
+type
+    { Interface definition }
+    IDrawable = interface
+        procedure Draw;
+        function GetArea: double;
+    end;
+    
+    { Circle implementation }
+    TCircle = class(TInterfacedObject, IDrawable)
+    private
+        FRadius: double;
+    public
+        constructor Create(ARadius: double);
+        procedure Draw;
+        function GetArea: double;
+    end;
+    
+    { Rectangle implementation }
+    TRectangle = class(TInterfacedObject, IDrawable)
+    private
+        FWidth, FHeight: double;
+    public
+        constructor Create(AWidth, AHeight: double);
+        procedure Draw;
+        function GetArea: double;
+    end;
+
+{ TCircle implementation }
+constructor TCircle.Create(ARadius: double);
+begin
+    inherited Create;
+    FRadius := ARadius;
+end;
+
+procedure TCircle.Draw;
+begin
+    writeln('Drawing a circle with radius: ', FRadius:0:2);
+end;
+
+function TCircle.GetArea: double;
+begin
+    Result := Pi * FRadius * FRadius;
+end;
+
+{ TRectangle implementation }
+constructor TRectangle.Create(AWidth, AHeight: double);
+begin
+    inherited Create;
+    FWidth := AWidth;
+    FHeight := AHeight;
+end;
+
+procedure TRectangle.Draw;
+begin
+    writeln('Drawing a rectangle: ', FWidth:0:2, ' x ', FHeight:0:2);
+end;
+
+function TRectangle.GetArea: double;
+begin
+    Result := FWidth * FHeight;
+end;
+
+{ Main program }
+var
+    shapes: array[0..1] of IDrawable;
+    shape: IDrawable;
+begin
+    { Create shapes }
+    shapes[0] := TCircle.Create(5.0);
+    shapes[1] := TRectangle.Create(4.0, 6.0);
+    
+    { Use polymorphism }
+    for shape in shapes do
+    begin
+        shape.Draw;
+        writeln('Area: ', shape.GetArea:0:2);
+        writeln;
+    end;
+end.
+```
+
+### Multi-threading
+
+```pascal
+program ThreadExample;
+
+{$mode objfpc}
+{$H+}
+
+uses
+    Classes, SysUtils;
+
+type
+    TWorkerThread = class(TThread)
+    private
+        FThreadID: integer;
+    protected
+        procedure Execute; override;
+    public
+        constructor Create(AThreadID: integer);
+    end;
+
+constructor TWorkerThread.Create(AThreadID: integer);
+begin
+    FThreadID := AThreadID;
+    inherited Create(False); // Start immediately
+end;
+
+procedure TWorkerThread.Execute;
+var
+    i: integer;
+begin
+    for i := 1 to 5 do
+    begin
+        writeln('Thread ', FThreadID, ' - Step ', i);
+        Sleep(1000); // Wait 1 second
+    end;
+    writeln('Thread ', FThreadID, ' completed');
+end;
+
+var
+    threads: array[1..3] of TWorkerThread;
+    i: integer;
+begin
+    writeln('Starting multiple threads...');
+    
+    { Create and start threads }
+    for i := 1 to 3 do
+        threads[i] := TWorkerThread.Create(i);
+    
+    { Wait for all threads to complete }
+    for i := 1 to 3 do
+    begin
+        threads[i].WaitFor;
+        threads[i].Free;
+    end;
+    
+    writeln('All threads completed');
+end.
+```
+
+## Database Programming
+
+### SQLite Integration
+
+```pascal
+program DatabaseExample;
+
+{$mode objfpc}
+{$H+}
+
+uses
+    Classes, SysUtils, sqldb, sqlite3conn;
+
+var
+    connection: TSQLite3Connection;
+    transaction: TSQLTransaction;
+    query: TSQLQuery;
+begin
+    { Create database components }
+    connection := TSQLite3Connection.Create(nil);
+    transaction := TSQLTransaction.Create(nil);
+    query := TSQLQuery.Create(nil);
+    
+    try
+        { Setup connection }
+        connection.DatabaseName := 'example.db';
+        connection.Transaction := transaction;
+        transaction.DataBase := connection;
+        query.DataBase := connection;
+        
+        { Open connection }
+        connection.Open;
+        
+        { Create table }
+        query.SQL.Text := 'CREATE TABLE IF NOT EXISTS users (' +
+                         'id INTEGER PRIMARY KEY, ' +
+                         'name TEXT NOT NULL, ' +
+                         'email TEXT UNIQUE)';
+        query.ExecSQL;
+        transaction.Commit;
+        
+        { Insert data }
+        query.SQL.Text := 'INSERT INTO users (name, email) VALUES (?, ?)';
+        query.Params[0].AsString := 'John Doe';
+        query.Params[1].AsString := 'john@example.com';
+        query.ExecSQL;
+        transaction.Commit;
+        
+        { Query data }
+        query.SQL.Text := 'SELECT * FROM users';
+        query.Open;
+        
+        while not query.EOF do
+        begin
+            writeln('ID: ', query.FieldByName('id').AsInteger);
+            writeln('Name: ', query.FieldByName('name').AsString);
+            writeln('Email: ', query.FieldByName('email').AsString);
+            writeln('---');
+            query.Next;
+        end;
+        
+    finally
+        query.Free;
+        transaction.Free;
+        connection.Free;
+    end;
+    
+    writeln('Database operations completed');
+end.
+```
+
+## GUI Development with Lazarus
+
+### Basic Form Application
+
+```pascal
+unit MainForm;
+
+{$mode objfpc}{$H+}
+
+interface
+
+uses
+    Classes, SysUtils, Forms, Controls, Graphics, Dialogs, StdCtrls;
+
+type
+    TForm1 = class(TForm)
+        Button1: TButton;
+        Edit1: TEdit;
+        Label1: TLabel;
+        procedure Button1Click(Sender: TObject);
+        procedure FormCreate(Sender: TObject);
+    private
+    public
+    end;
+
+var
+    Form1: TForm1;
+
+implementation
+
+{$R *.lfm}
+
+procedure TForm1.FormCreate(Sender: TObject);
+begin
+    Caption := 'Pascal GUI Example';
+    Label1.Caption := 'Enter your name:';
+    Button1.Caption := 'Greet';
+    Edit1.Text := '';
+end;
+
+procedure TForm1.Button1Click(Sender: TObject);
+var
+    userName: string;
+begin
+    userName := Trim(Edit1.Text);
+    if userName <> '' then
+        ShowMessage('Hello, ' + userName + '!')
+    else
+        ShowMessage('Please enter your name first.');
+end;
+
+end.
+```
+
+## Performance Optimization
+
+### Memory Management Tips
+
+```pascal
+program PerformanceExample;
+
+type
+    PIntegerArray = ^TIntegerArray;
+    TIntegerArray = array[0..0] of integer;
+
+var
+    data: PIntegerArray;
+    size, i: integer;
+begin
+    size := 1000000; // One million integers
+    
+    { Allocate memory efficiently }
+    GetMem(data, size * SizeOf(integer));
+    
+    try
+        { Initialize data }
+        for i := 0 to size - 1 do
+            data^[i] := i;
+        
+        { Process data efficiently }
+        writeln('Processing ', size, ' integers...');
+        
+        { Example: Find sum }
+        var sum: int64 := 0;
+        for i := 0 to size - 1 do
+            sum := sum + data^[i];
+        
+        writeln('Sum: ', sum);
+        
+    finally
+        { Always free allocated memory }
+        FreeMem(data);
+    end;
+end.
+```
+
+### Compiler Directives
+
+```pascal
+program CompilerDirectives;
+
+{$mode objfpc}          // Object Pascal mode
+{$H+}                   // Long strings
+{$R+}                   // Range checking (debug)
+{$I+}                   // I/O checking
+{$Q+}                   // Overflow checking
+{$optimization level3}   // High optimization
+
+{ Conditional compilation }
+{$IFDEF DEBUG}
+    {$DEFINE VERBOSE}
+{$ENDIF}
+
+{$IFDEF WINDOWS}
+    {$DEFINE PLATFORM_SPECIFIC}
+{$ENDIF}
+
+begin
+    writeln('Pascal program with compiler directives');
+    
+    {$IFDEF VERBOSE}
+    writeln('Debug mode: Verbose output enabled');
+    {$ENDIF}
+    
+    {$IFDEF PLATFORM_SPECIFIC}
+    writeln('Windows-specific code would go here');
+    {$ENDIF}
+end.
+```
+
+## Testing and Quality Assurance
+
+### Unit Testing Framework
+
+```pascal
+program TestExample;
+
+{$mode objfpc}
+{$H+}
+
+uses
+    Classes, SysUtils;
+
+type
+    TTestCase = class
+    private
+        FTestName: string;
+        FPassed: boolean;
+    public
+        constructor Create(const ATestName: string);
+        procedure AssertEquals(Expected, Actual: integer; const Message: string = '');
+        procedure AssertTrue(Condition: boolean; const Message: string = '');
+        property TestName: string read FTestName;
+        property Passed: boolean read FPassed;
+    end;
+
+constructor TTestCase.Create(const ATestName: string);
+begin
+    FTestName := ATestName;
+    FPassed := True;
+end;
+
+procedure TTestCase.AssertEquals(Expected, Actual: integer; const Message: string);
+begin
+    if Expected <> Actual then
+    begin
+        FPassed := False;
+        writeln('FAIL: ', FTestName);
+        writeln('  Expected: ', Expected, ', Actual: ', Actual);
+        if Message <> '' then
+            writeln('  Message: ', Message);
+    end
+    else
+        writeln('PASS: ', FTestName);
+end;
+
+procedure TTestCase.AssertTrue(Condition: boolean; const Message: string);
+begin
+    if not Condition then
+    begin
+        FPassed := False;
+        writeln('FAIL: ', FTestName);
+        if Message <> '' then
+            writeln('  Message: ', Message);
+    end
+    else
+        writeln('PASS: ', FTestName);
+end;
+
+{ Example function to test }
+function Add(a, b: integer): integer;
+begin
+    Result := a + b;
+end;
+
+function IsEven(n: integer): boolean;
+begin
+    Result := (n mod 2) = 0;
+end;
+
+{ Test cases }
+var
+    test: TTestCase;
+begin
+    writeln('Running Pascal Unit Tests');
+    writeln('========================');
+    
+    { Test addition }
+    test := TTestCase.Create('Add function test');
+    test.AssertEquals(5, Add(2, 3), 'Basic addition');
+    test.Free;
+    
+    test := TTestCase.Create('Add negative numbers');
+    test.AssertEquals(-1, Add(-3, 2), 'Adding negative numbers');
+    test.Free;
+    
+    { Test even number detection }
+    test := TTestCase.Create('Even number test');
+    test.AssertTrue(IsEven(4), '4 should be even');
+    test.Free;
+    
+    test := TTestCase.Create('Odd number test');
+    test.AssertTrue(not IsEven(3), '3 should be odd');
+    test.Free;
+    
+    writeln('Tests completed');
+end.
+```
+
+## Deployment and Distribution
+
+### Cross-Platform Compilation
+
+```bash
+# Compile for Windows (64-bit)
+fpc -Twin64 -O3 program.pas
+
+# Compile for Linux (64-bit)
+fpc -Tlinux -O3 program.pas
+
+# Compile for macOS
+fpc -Tdarwin -O3 program.pas
+
+# Create optimized release build
+fpc -O3 -Xs -XX -CX program.pas
+```
+
+### Build Scripts
+
+**Windows Batch File (build.bat):**
+```batch
+@echo off
+echo Building Pascal project...
+fpc -O3 -Xs -XX -CX src\main.pas
+if %errorlevel% == 0 (
+    echo Build successful!
+    copy main.exe bin\
+) else (
+    echo Build failed!
+)
+pause
+```
+
+**Linux Shell Script (build.sh):**
+```bash
+#!/bin/bash
+echo "Building Pascal project..."
+fpc -O3 -Xs -XX -CX src/main.pas
+if [ $? -eq 0 ]; then
+    echo "Build successful!"
+    cp main bin/
+else
+    echo "Build failed!"
+fi
+```
diff --git a/content/learn/_index.md b/content/learn/_index.md
index 28a4664..e5e6d1f 100644
--- a/content/learn/_index.md
+++ b/content/learn/_index.md
@@ -38,6 +38,7 @@ end.
 ```
 
 Compile and run:
+
 ```bash
 fpc hello.pas
 ./hello
@@ -176,4 +177,230 @@ end.
 - [Pascal Programming Examples](/docs/)
 - [Community Forum](/community/)
 
+## Advanced Topics
+
+### Arrays and Data Structures
+
+**Static Arrays:**
+```pascal
+program ArrayExample;
+var
+    scores: array[1..5] of integer;
+    names: array[1..3] of string;
+    i: integer;
+begin
+    { Initialize array }
+    scores[1] := 95;
+    scores[2] := 87;
+    scores[3] := 92;
+    
+    names[1] := 'Alice';
+    names[2] := 'Bob';
+    names[3] := 'Charlie';
+    
+    { Display results }
+    for i := 1 to 3 do
+        writeln(names[i], ': ', scores[i]);
+end.
+```
+
+**Records (Structures):**
+```pascal
+program RecordExample;
+type
+    TStudent = record
+        name: string;
+        age: integer;
+        grade: char;
+        gpa: real;
+    end;
+
+var
+    student: TStudent;
+begin
+    { Initialize record }
+    student.name := 'Emma Watson';
+    student.age := 20;
+    student.grade := 'A';
+    student.gpa := 3.8;
+    
+    { Display student info }
+    writeln('Student: ', student.name);
+    writeln('Age: ', student.age);
+    writeln('Grade: ', student.grade);
+    writeln('GPA: ', student.gpa:0:1);
+end.
+```
+
+### File Input/Output
+
+**Reading from Files:**
+```pascal
+program ReadFile;
+var
+    inputFile: text;
+    line: string;
+begin
+    assign(inputFile, 'data.txt');
+    {$I-} reset(inputFile); {$I+}
+    
+    if IOResult = 0 then
+    begin
+        while not eof(inputFile) do
+        begin
+            readln(inputFile, line);
+            writeln('Read: ', line);
+        end;
+        close(inputFile);
+    end
+    else
+        writeln('Error: Could not open file');
+end.
+```
+
+**Writing to Files:**
+```pascal
+program WriteFile;
+var
+    outputFile: text;
+    i: integer;
+begin
+    assign(outputFile, 'output.txt');
+    rewrite(outputFile);
+    
+    writeln(outputFile, 'Pascal File Output Example');
+    writeln(outputFile, '========================');
+    
+    for i := 1 to 5 do
+        writeln(outputFile, 'Line number: ', i);
+    
+    close(outputFile);
+    writeln('File written successfully!');
+end.
+```
+
+### Error Handling
+
+```pascal
+program ErrorHandling;
+var
+    number, divisor: integer;
+    result: real;
+begin
+    try
+        write('Enter a number: ');
+        readln(number);
+        
+        write('Enter divisor: ');
+        readln(divisor);
+        
+        if divisor = 0 then
+            raise Exception.Create('Division by zero is not allowed');
+        
+        result := number / divisor;
+        writeln('Result: ', result:0:2);
+        
+    except
+        on E: Exception do
+        begin
+            writeln('Error occurred: ', E.Message);
+            writeln('Please try again with valid input.');
+        end;
+    end;
+end.
+```
+
+## Learning Path
+
+### Beginner (Week 1-2)
+1. **Setup Environment**: Install Free Pascal or Lazarus
+2. **Basic Syntax**: Variables, data types, input/output
+3. **Control Flow**: If statements, loops, case statements
+4. **Simple Programs**: Calculator, number guessing game
+
+### Intermediate (Week 3-4)
+1. **Procedures & Functions**: Modular programming
+2. **Arrays & Records**: Data organization
+3. **File Operations**: Reading and writing files
+4. **String Manipulation**: Text processing
+
+### Advanced (Week 5-8)
+1. **Object-Oriented Programming**: Classes and inheritance
+2. **Dynamic Memory**: Pointers and dynamic arrays
+3. **GUI Development**: Lazarus forms and controls
+4. **Database Connectivity**: Working with data
+
+## Practice Projects
+
+### Beginner Projects
+- **Simple Calculator**: Basic arithmetic operations
+- **Grade Calculator**: Average grades with letter grades
+- **Number Guessing Game**: Random number generation
+- **Temperature Converter**: Celsius to Fahrenheit
+
+### Intermediate Projects
+- **Student Management System**: Records and file I/O
+- **Text File Analyzer**: Count words, lines, characters
+- **Simple Banking System**: Account management
+- **Inventory Tracker**: Product database
+
+### Advanced Projects
+- **GUI Calculator**: Lazarus-based calculator
+- **Database Application**: Student records with SQLite
+- **Game Development**: Simple 2D games
+- **Web Server**: Basic HTTP server implementation
+
+## Common Mistakes to Avoid
+
+1. **Forgetting semicolons**: Every statement needs a semicolon
+2. **Array bounds**: Pascal arrays are 1-indexed by default
+3. **Variable initialization**: Always initialize variables before use
+4. **Case sensitivity**: Pascal is not case-sensitive, but be consistent
+5. **Memory management**: Free dynamically allocated memory
+
+## Development Tools
+
+### Free Pascal Compiler
+- **Cross-platform**: Windows, Linux, macOS, FreeBSD
+- **Command-line**: Compile with `fpc program.pas`
+- **Optimization**: Multiple optimization levels
+- **Debugging**: Built-in debugger support
+
+### Lazarus IDE
+- **Visual Designer**: Drag-and-drop form creation
+- **Code Completion**: IntelliSense-like features
+- **Integrated Debugger**: Step-through debugging
+- **Package System**: Easy library management
+
+### Text Editors
+- **VS Code**: Pascal extensions available
+- **Sublime Text**: Syntax highlighting
+- **Notepad++**: Simple Pascal support
+- **Vim/Emacs**: Advanced editor configurations
+
+## Getting Help
+
+### When You're Stuck
+1. **Read error messages carefully** - they usually point to the problem
+2. **Check syntax** - missing semicolons, brackets, or keywords
+3. **Use writeln for debugging** - print variable values
+4. **Break down complex problems** - solve step by step
+5. **Ask for help** - community forums and Discord
+
+### Debugging Tips
+```pascal
+{ Add debug output }
+writeln('Debug: Variable x = ', x);
+writeln('Debug: Entering function Calculate');
+
+{ Use meaningful variable names }
+var
+    studentCount: integer;     // Good
+    sc: integer;               // Avoid
+
+{ Add comments for complex logic }
+{ Calculate compound interest using formula: A = P(1 + r)^t }
+result := principal * Power(1 + rate, years);
+```
+
 Ready to start coding? [Join our community](/community/) for help and support!
diff --git a/hugo.toml b/hugo.toml
index 9a37735..5a9f067 100644
--- a/hugo.toml
+++ b/hugo.toml
@@ -32,4 +32,9 @@ title = 'Pascal - Readable, Reliable Programming'
   [[menu.main]]
     name = 'Community'
     url = '/community/'
-    weight = 40
\ No newline at end of file
+    weight = 40
+
+# Enable section pages
+[taxonomies]
+  tag = "tags"
+  category = "categories"
\ No newline at end of file
diff --git a/layouts/_default/section.html b/layouts/_default/section.html
new file mode 100644
index 0000000..d89f638
--- /dev/null
+++ b/layouts/_default/section.html
@@ -0,0 +1,92 @@
+{{ define "main" }}
+<article class="content-section">
+    <div class="container">
+        <header class="section-header">
+            <h1>{{ .Title }}</h1>
+            {{ if .Params.description }}
+            <p class="section-description">{{ .Params.description }}</p>
+            {{ end }}
+        </header>
+        
+        <div class="section-content">
+            {{ .Content }}
+        </div>
+        
+        {{ if .Pages }}
+        <div class="section-pages">
+            <h2>Pages in this section</h2>
+            <div class="cards">
+                {{ range .Pages }}
+                <div class="card">
+                    <h3><a href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
+                    {{ if .Summary }}
+                    <p>{{ .Summary }}</p>
+                    {{ end }}
+                    <a href="{{ .RelPermalink }}" class="read-more">Read more →</a>
+                </div>
+                {{ end }}
+            </div>
+        </div>
+        {{ end }}
+    </div>
+</article>
+
+<style>
+.section-header {
+    text-align: center;
+    margin-bottom: var(--spacing-2xl);
+    padding-bottom: var(--spacing-lg);
+    border-bottom: 1px solid var(--border-color);
+}
+
+.section-description {
+    font-size: 1.1rem;
+    color: var(--text-secondary);
+    max-width: 600px;
+    margin: 0 auto;
+}
+
+.section-content {
+    max-width: 900px;
+    margin: 0 auto;
+    line-height: 1.7;
+}
+
+.section-content h2,
+.section-content h3,
+.section-content h4 {
+    margin-top: var(--spacing-xl);
+    margin-bottom: var(--spacing-md);
+}
+
+.section-content p {
+    margin-bottom: var(--spacing-lg);
+}
+
+.section-content ul,
+.section-content ol {
+    margin-bottom: var(--spacing-lg);
+    padding-left: var(--spacing-xl);
+}
+
+.section-content li {
+    margin-bottom: var(--spacing-sm);
+}
+
+.section-pages {
+    margin-top: var(--spacing-3xl);
+    padding-top: var(--spacing-2xl);
+    border-top: 1px solid var(--border-color);
+}
+
+.read-more {
+    color: var(--accent-primary);
+    font-weight: 500;
+    text-decoration: none;
+}
+
+.read-more:hover {
+    color: var(--accent-hover);
+}
+</style>
+{{ end }}
diff --git a/static/css/main.css b/static/css/main.css
index e732035..6413bfe 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -331,106 +331,6 @@ pre code {
   color: var(--text-muted);
 }
 
-/* Chroma Syntax Highlighting Styles */
-/* Background */ .bg { background-color: var(--code-bg); }
-/* PreWrapper */ .chroma { background-color: var(--code-bg); }
-/* Other */ .chroma .x {  }
-/* Error */ .chroma .err { color:#f6f8fa;background-color:#82071e }
-/* CodeLine */ .chroma .cl {  }
-/* LineLink */ .chroma .lnlinks { outline:none;text-decoration:none;color:inherit }
-/* LineTableTD */ .chroma .lntd { vertical-align:top;padding:0;margin:0;border:0; }
-/* LineTable */ .chroma .lntable { border-spacing:0;padding:0;margin:0;border:0; }
-/* LineHighlight */ .chroma .hl { background-color:#e5e5e5 }
-/* LineNumbersTable */ .chroma .lnt { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f }
-/* LineNumbers */ .chroma .ln { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f }
-/* Line */ .chroma .line { display:flex; }
-/* Keyword */ .chroma .k { color:#cf222e }
-/* KeywordConstant */ .chroma .kc { color:#cf222e }
-/* KeywordDeclaration */ .chroma .kd { color:#cf222e }
-/* KeywordNamespace */ .chroma .kn { color:#cf222e }
-/* KeywordPseudo */ .chroma .kp { color:#cf222e }
-/* KeywordReserved */ .chroma .kr { color:#cf222e }
-/* KeywordType */ .chroma .kt { color:#cf222e }
-/* Name */ .chroma .n {  }
-/* NameAttribute */ .chroma .na { color:#1f2328 }
-/* NameClass */ .chroma .nc { color:#1f2328 }
-/* NameConstant */ .chroma .no { color:#0550ae }
-/* NameDecorator */ .chroma .nd { color:#0550ae }
-/* NameEntity */ .chroma .ni { color:#6639ba }
-/* NameException */ .chroma .ne {  }
-/* NameLabel */ .chroma .nl { color:#900;font-weight:bold }
-/* NameNamespace */ .chroma .nn { color:#24292e }
-/* NameOther */ .chroma .nx { color:#1f2328 }
-/* NameProperty */ .chroma .py {  }
-/* NameTag */ .chroma .nt { color:#0550ae }
-/* NameBuiltin */ .chroma .nb { color:#6639ba }
-/* NameBuiltinPseudo */ .chroma .bp { color:#6a737d }
-/* NameVariable */ .chroma .nv { color:#953800 }
-/* NameVariableClass */ .chroma .vc { color:#953800 }
-/* NameVariableGlobal */ .chroma .vg { color:#953800 }
-/* NameVariableInstance */ .chroma .vi { color:#953800 }
-/* NameVariableMagic */ .chroma .vm { color:#953800 }
-/* NameFunction */ .chroma .nf { color:#6639ba }
-/* NameFunctionMagic */ .chroma .fm { color:#6639ba }
-/* Literal */ .chroma .l {  }
-/* LiteralDate */ .chroma .ld {  }
-/* LiteralString */ .chroma .s { color:#0a3069 }
-/* LiteralStringAffix */ .chroma .sa { color:#0a3069 }
-/* LiteralStringBacktick */ .chroma .sb { color:#0a3069 }
-/* LiteralStringChar */ .chroma .sc { color:#0a3069 }
-/* LiteralStringDelimiter */ .chroma .dl { color:#0a3069 }
-/* LiteralStringDoc */ .chroma .sd { color:#0a3069 }
-/* LiteralStringDouble */ .chroma .s2 { color:#0a3069 }
-/* LiteralStringEscape */ .chroma .se { color:#0a3069 }
-/* LiteralStringHeredoc */ .chroma .sh { color:#0a3069 }
-/* LiteralStringInterpol */ .chroma .si { color:#0a3069 }
-/* LiteralStringOther */ .chroma .sx { color:#0a3069 }
-/* LiteralStringRegex */ .chroma .sr { color:#0a3069 }
-/* LiteralStringSingle */ .chroma .s1 { color:#0a3069 }
-/* LiteralStringSymbol */ .chroma .ss { color:#032f62 }
-/* LiteralNumber */ .chroma .m { color:#0550ae }
-/* LiteralNumberBin */ .chroma .mb { color:#0550ae }
-/* LiteralNumberFloat */ .chroma .mf { color:#0550ae }
-/* LiteralNumberHex */ .chroma .mh { color:#0550ae }
-/* LiteralNumberInteger */ .chroma .mi { color:#0550ae }
-/* LiteralNumberIntegerLong */ .chroma .il { color:#0550ae }
-/* LiteralNumberOct */ .chroma .mo { color:#0550ae }
-/* Operator */ .chroma .o { color:#0550ae }
-/* OperatorWord */ .chroma .ow { color:#0550ae }
-/* Punctuation */ .chroma .p { color:#1f2328 }
-/* Comment */ .chroma .c { color:#57606a }
-/* CommentHashbang */ .chroma .ch { color:#57606a }
-/* CommentMultiline */ .chroma .cm { color:#57606a }
-/* CommentSingle */ .chroma .c1 { color:#57606a }
-/* CommentSpecial */ .chroma .cs { color:#57606a }
-/* CommentPreproc */ .chroma .cp { color:#57606a }
-/* CommentPreprocFile */ .chroma .cpf { color:#57606a }
-/* Generic */ .chroma .g {  }
-/* GenericDeleted */ .chroma .gd { color:#82071e;background-color:#ffebe9 }
-/* GenericEmph */ .chroma .ge { color:#1f2328 }
-/* GenericError */ .chroma .gr {  }
-/* GenericHeading */ .chroma .gh {  }
-/* GenericInserted */ .chroma .gi { color:#116329;background-color:#dafbe1 }
-/* GenericOutput */ .chroma .go { color:#1f2328 }
-/* GenericPrompt */ .chroma .gp {  }
-/* GenericStrong */ .chroma .gs {  }
-/* GenericSubheading */ .chroma .gu {  }
-/* GenericTraceback */ .chroma .gt {  }
-/* GenericUnderline */ .chroma .gl { text-decoration:underline }
-/* TextWhitespace */ .chroma .w { color:#fff }
-
-/* Dark theme adjustments for syntax highlighting */
-[data-theme="dark"] .chroma { background-color: var(--code-bg); color: var(--text-primary); }
-[data-theme="dark"] .chroma .k { color:#ff7b72; } /* Keywords - red */
-[data-theme="dark"] .chroma .s { color:#a5d6ff; } /* Strings - blue */
-[data-theme="dark"] .chroma .s1 { color:#a5d6ff; } /* Single quoted strings - blue */
-[data-theme="dark"] .chroma .m { color:#79c0ff; } /* Numbers - cyan */
-[data-theme="dark"] .chroma .c { color:#8b949e; } /* Comments - gray */
-[data-theme="dark"] .chroma .nf { color:#d2a8ff; } /* Function names - purple */
-[data-theme="dark"] .chroma .nb { color:#ffa657; } /* Built-ins - orange */
-[data-theme="dark"] .chroma .n { color: var(--text-primary); } /* Names - white */
-[data-theme="dark"] .chroma .p { color: var(--text-secondary); } /* Punctuation - light gray */
-[data-theme="dark"] .chroma code { color: var(--text-primary); } /* Default code text - white */
 
 /* Responsive design */
 @media (max-width: 768px) {

From fcc50b33e5709e75c06f7d7c99909980f6276956 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Tue, 5 Aug 2025 21:38:22 +1000
Subject: [PATCH 06/27] feat: used correct prog lang identifier in the code
 blocks

---
 content/docs/_index.md  | 42 ++++++++++++++++++++---------------------
 content/learn/_index.md | 26 ++++++++++++-------------
 2 files changed, 34 insertions(+), 34 deletions(-)

diff --git a/content/docs/_index.md b/content/docs/_index.md
index 8a5821d..17ca7d0 100644
--- a/content/docs/_index.md
+++ b/content/docs/_index.md
@@ -14,7 +14,7 @@ Comprehensive guides and references for Pascal programming.
 
 Pascal uses a clear, structured syntax that emphasizes readability:
 
-```pascal
+```objectpascal
 program ExampleProgram;
 
 const
@@ -63,7 +63,7 @@ end.
 
 **Structured Types:**
 
-```pascal
+```objectpascal
 { Arrays }
 type
     TScores = array[1..10] of integer;
@@ -87,7 +87,7 @@ type
 
 ### File Operations
 
-```pascal
+```objectpascal
 program FileExample;
 var
     inputFile, outputFile: text;
@@ -114,7 +114,7 @@ end.
 
 ### Dynamic Arrays
 
-```pascal
+```objectpascal
 program DynamicArrayExample;
 type
     TIntArray = array of integer;
@@ -146,7 +146,7 @@ end.
 
 ### Object-Oriented Programming
 
-```pascal
+```objectpascal
 program OOPExample;
 
 type
@@ -214,14 +214,14 @@ end.
 ### Code Style
 
 1. **Use meaningful names:**
-   ```pascal
+   ```objectpascal
    var
        studentCount: integer;    // Good
        sc: integer;              // Avoid
    ```
 
 2. **Consistent indentation:**
-   ```pascal
+   ```objectpascal
    if condition then
    begin
        statement1;
@@ -230,7 +230,7 @@ end.
    ```
 
 3. **Comment your code:**
-   ```pascal
+   ```objectpascal
    { Calculate compound interest }
    function CompoundInterest(principal, rate: real; years: integer): real;
    begin
@@ -240,7 +240,7 @@ end.
 
 ### Error Handling
 
-```pascal
+```objectpascal
 program ErrorHandlingExample;
 var
     number, divisor: integer;
@@ -298,7 +298,7 @@ end.
 The System unit is automatically included and provides core functionality:
 
 **Memory Management:**
-```pascal
+```objectpascal
 { Dynamic memory allocation }
 var
     ptr: ^integer;
@@ -311,7 +311,7 @@ end;
 ```
 
 **String Functions:**
-```pascal
+```objectpascal
 program StringFunctions;
 var
     text: string;
@@ -334,7 +334,7 @@ end.
 
 Provides extended system utilities:
 
-```pascal
+```objectpascal
 uses SysUtils;
 
 program SysUtilsExample;
@@ -364,7 +364,7 @@ end.
 
 Mathematical functions and constants:
 
-```pascal
+```objectpascal
 uses Math;
 
 program MathExample;
@@ -391,7 +391,7 @@ end.
 
 ### Generic Programming
 
-```pascal
+```objectpascal
 program GenericExample;
 
 {$mode objfpc}
@@ -462,7 +462,7 @@ end.
 
 ### Interface Programming
 
-```pascal
+```objectpascal
 program InterfaceExample;
 
 {$mode objfpc}
@@ -551,7 +551,7 @@ end.
 
 ### Multi-threading
 
-```pascal
+```objectpascal
 program ThreadExample;
 
 {$mode objfpc}
@@ -613,7 +613,7 @@ end.
 
 ### SQLite Integration
 
-```pascal
+```objectpascal
 program DatabaseExample;
 
 {$mode objfpc}
@@ -684,7 +684,7 @@ end.
 
 ### Basic Form Application
 
-```pascal
+```objectpascal
 unit MainForm;
 
 {$mode objfpc}{$H+}
@@ -738,7 +738,7 @@ end.
 
 ### Memory Management Tips
 
-```pascal
+```objectpascal
 program PerformanceExample;
 
 type
@@ -778,7 +778,7 @@ end.
 
 ### Compiler Directives
 
-```pascal
+```objectpascal
 program CompilerDirectives;
 
 {$mode objfpc}          // Object Pascal mode
@@ -814,7 +814,7 @@ end.
 
 ### Unit Testing Framework
 
-```pascal
+```objectpascal
 program TestExample;
 
 {$mode objfpc}
diff --git a/content/learn/_index.md b/content/learn/_index.md
index e5e6d1f..1e230e2 100644
--- a/content/learn/_index.md
+++ b/content/learn/_index.md
@@ -29,7 +29,7 @@ Choose your Pascal development environment:
 
 Create a new file called `hello.pas`:
 
-```pascal
+```objectpascal
 program HelloWorld;
 begin
     writeln('Hello, Pascal World!');
@@ -50,7 +50,7 @@ fpc hello.pas
 
 Every Pascal program follows this basic structure:
 
-```pascal
+```objectpascal
 program ProgramName;
 
 { Variable declarations }
@@ -71,7 +71,7 @@ end.
 
 Pascal has strong typing with these fundamental types:
 
-```pascal
+```objectpascal
 var
     // Integer types
     age: integer;
@@ -93,7 +93,7 @@ var
 
 **Conditional Statements:**
 
-```pascal
+```objectpascal
 if age >= 18 then
     writeln('You are an adult')
 else
@@ -109,7 +109,7 @@ end;
 
 **Loops:**
 
-```pascal
+```objectpascal
 { For loop }
 for i := 1 to 10 do
     writeln('Number: ', i);
@@ -132,7 +132,7 @@ until number > 0;
 
 ### Procedures
 
-```pascal
+```objectpascal
 procedure greetUser(name: string);
 begin
     writeln('Hello, ', name, '!');
@@ -147,7 +147,7 @@ end.
 
 ### Functions
 
-```pascal
+```objectpascal
 function calculateArea(radius: real): real;
 begin
     calculateArea := 3.14159 * radius * radius;
@@ -182,7 +182,7 @@ end.
 ### Arrays and Data Structures
 
 **Static Arrays:**
-```pascal
+```objectpascal
 program ArrayExample;
 var
     scores: array[1..5] of integer;
@@ -205,7 +205,7 @@ end.
 ```
 
 **Records (Structures):**
-```pascal
+```objectpascal
 program RecordExample;
 type
     TStudent = record
@@ -235,7 +235,7 @@ end.
 ### File Input/Output
 
 **Reading from Files:**
-```pascal
+```objectpascal
 program ReadFile;
 var
     inputFile: text;
@@ -259,7 +259,7 @@ end.
 ```
 
 **Writing to Files:**
-```pascal
+```objectpascal
 program WriteFile;
 var
     outputFile: text;
@@ -281,7 +281,7 @@ end.
 
 ### Error Handling
 
-```pascal
+```objectpascal
 program ErrorHandling;
 var
     number, divisor: integer;
@@ -388,7 +388,7 @@ end.
 5. **Ask for help** - community forums and Discord
 
 ### Debugging Tips
-```pascal
+```objectpascal
 { Add debug output }
 writeln('Debug: Variable x = ', x);
 writeln('Debug: Entering function Calculate');

From 84d73475f5169c4dc25993d5d48ef494dc0600e5 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Tue, 5 Aug 2025 21:51:51 +1000
Subject: [PATCH 07/27] feat: fixed colours

---
 layouts/index.html  | 13 ++++++-------
 static/css/main.css |  8 ++++++++
 2 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/layouts/index.html b/layouts/index.html
index fa565e8..31f881c 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -12,13 +12,12 @@ <h1>Pascal - Readable, Reliable Programming</h1>
 <section class="content-section">
     <div class="container">
         <h2 class="section-title">Clean, Readable Code</h2>
-        <div class="highlight">
-            <pre class="chroma"><code><span class="k">program</span> <span class="n">HelloWorld</span>;
-<span class="k">begin</span>
-    <span class="nf">writeln</span>(<span class="s1">'Hello, World!'</span>);
-    <span class="nf">writeln</span>(<span class="s1">'Welcome to Pascal programming'</span>);
-<span class="k">end</span>.</code></pre>
-        </div>
+        {{ $codeExample := `program HelloWorld;
+begin
+    writeln('Hello, World!');
+    writeln('Welcome to Pascal programming');
+end.` }}
+        {{ highlight $codeExample "objectpascal" "linenos=false" }}
     </div>
 </section>
 
diff --git a/static/css/main.css b/static/css/main.css
index 6413bfe..ca1496a 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -66,6 +66,14 @@ body {
   transition: var(--transition);
 }
 
+/* Dark theme adjustments for syntax highlighting */
+[data-theme="dark"] .chroma { background-color: var(--code-bg) !important; color: var(--text-primary) !important; }
+[data-theme="dark"] .highlight { background-color: var(--code-bg) !important; }
+[data-theme="dark"] .highlight > div { background-color: var(--code-bg) !important; }
+[data-theme="dark"] .highlight pre { background-color: var(--code-bg) !important; color: var(--text-primary) !important; }
+[data-theme="dark"] .chroma .lntable { background-color: var(--code-bg) !important; }
+[data-theme="dark"] .chroma .lntd { background-color: var(--code-bg) !important; }
+
 /* Container */
 .container {
   max-width: var(--container-max-width);

From 0e8481cb83695d7f45c62722e83455c13f9a7f2a Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Tue, 5 Aug 2025 22:04:12 +1000
Subject: [PATCH 08/27] feat: switched code highlighting to monokai style

---
 hugo.toml           | 2 +-
 static/css/main.css | 8 --------
 2 files changed, 1 insertion(+), 9 deletions(-)

diff --git a/hugo.toml b/hugo.toml
index 5a9f067..e847ca1 100644
--- a/hugo.toml
+++ b/hugo.toml
@@ -7,7 +7,7 @@ title = 'Pascal - Readable, Reliable Programming'
 
 [markup]
   [markup.highlight]
-    style = 'github'
+    style = 'monokai'
     lineNos = true
     tabWidth = 2
     codeFences = true
diff --git a/static/css/main.css b/static/css/main.css
index ca1496a..6413bfe 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -66,14 +66,6 @@ body {
   transition: var(--transition);
 }
 
-/* Dark theme adjustments for syntax highlighting */
-[data-theme="dark"] .chroma { background-color: var(--code-bg) !important; color: var(--text-primary) !important; }
-[data-theme="dark"] .highlight { background-color: var(--code-bg) !important; }
-[data-theme="dark"] .highlight > div { background-color: var(--code-bg) !important; }
-[data-theme="dark"] .highlight pre { background-color: var(--code-bg) !important; color: var(--text-primary) !important; }
-[data-theme="dark"] .chroma .lntable { background-color: var(--code-bg) !important; }
-[data-theme="dark"] .chroma .lntd { background-color: var(--code-bg) !important; }
-
 /* Container */
 .container {
   max-width: var(--container-max-width);

From fa1ba94df92b7d9d29d9ce2d3f3ff91742af35f2 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Tue, 5 Aug 2025 22:21:05 +1000
Subject: [PATCH 09/27] feat: line no on homepage

---
 layouts/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/layouts/index.html b/layouts/index.html
index 31f881c..d9ee196 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -17,7 +17,7 @@ <h2 class="section-title">Clean, Readable Code</h2>
     writeln('Hello, World!');
     writeln('Welcome to Pascal programming');
 end.` }}
-        {{ highlight $codeExample "objectpascal" "linenos=false" }}
+        {{ highlight $codeExample "objectpascal" "linenos=true" }}
     </div>
 </section>
 

From c22235215cfd5437b2cb6ef63212b95f77de30d5 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Wed, 6 Aug 2025 07:53:22 +1000
Subject: [PATCH 10/27] feat: Edits to styles

---
 layouts/_default/baseof.html |  1 +
 layouts/index.html           | 40 +++++++--------
 static/css/main.css          | 96 +++++++++++++++++++++++++++++++-----
 3 files changed, 106 insertions(+), 31 deletions(-)

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index e1ef82f..122def2 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -37,6 +37,7 @@
                 const newTheme = body.getAttribute('data-theme') === 'light' ? 'dark' : 'light';
                 body.setAttribute('data-theme', newTheme);
                 localStorage.setItem('theme', newTheme);
+                // CSS variables automatically handle syntax highlighting theme switching!
             });
         }
     </script>
diff --git a/layouts/index.html b/layouts/index.html
index d9ee196..f7714b1 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -2,9 +2,13 @@
 <!-- Hero Section -->
 <section class="hero">
     <div class="container">
-        <h1>Pascal - Readable, Reliable Programming</h1>
-        <p>A structured programming language that emphasizes clarity, reliability, and educational value. Perfect for learning programming fundamentals and building robust applications.</p>
-        <a href="{{ "/learn/" | relURL }}" class="hero-cta">Get Started</a>
+        <h1>Pascal</h1>
+        <p class="hero-subtitle">A language empowering everyone<br>to build readable and reliable software.</p>
+        <div class="hero-actions">
+            <a href="{{ "/learn/" | relURL }}" class="hero-cta primary">Get Started</a>
+            <a href="{{ "/docs/" | relURL }}" class="hero-cta secondary">Documentation</a>
+        </div>
+        <p class="version-info">Latest: Free Pascal 3.2.2 • Lazarus 3.6</p>
     </div>
 </section>
 
@@ -21,26 +25,22 @@ <h2 class="section-title">Clean, Readable Code</h2>
     </div>
 </section>
 
-<!-- Features Section -->
-<section class="content-section" style="background-color: var(--bg-secondary);">
+<!-- Why Pascal Section -->
+<section class="why-pascal">
     <div class="container">
-        <h2 class="section-title">Why Choose Pascal?</h2>
-        <div class="cards">
-            <div class="card">
-                <h3>📖 Readable</h3>
-                <p>Pascal's clear syntax and structured approach make code easy to read, understand, and maintain. Perfect for both beginners and experienced developers.</p>
+        <h2 class="section-title">Why Pascal?</h2>
+        <div class="pillars">
+            <div class="pillar">
+                <h3>Readability</h3>
+                <p>Pascal's clean, English-like syntax makes code self-documenting. Strong structure and clear semantics eliminate guesswork, making maintenance a breeze for teams of any size.</p>
             </div>
-            <div class="card">
-                <h3>🔒 Reliable</h3>
-                <p>Strong typing and compile-time checking help catch errors early, resulting in more robust and dependable software applications.</p>
-            </div>
-            <div class="card">
-                <h3>🎓 Educational</h3>
-                <p>Designed with education in mind, Pascal teaches fundamental programming concepts and good coding practices from the ground up.</p>
+            <div class="pillar">
+                <h3>Reliability</h3>
+                <p>Pascal's strong type system and compile-time checks catch errors before they reach production. Memory safety and structured programming prevent entire classes of bugs.</p>
             </div>
-            <div class="card">
-                <h3>⚡ Cross-Platform</h3>
-                <p>Modern Pascal implementations support multiple platforms, allowing you to write once and deploy everywhere with excellent performance.</p>
+            <div class="pillar">
+                <h3>Productivity</h3>
+                <p>Pascal has excellent tooling, comprehensive libraries, and cross-platform support. Rapid development cycles with integrated debugging and visual designers boost developer efficiency.</p>
             </div>
         </div>
     </div>
diff --git a/static/css/main.css b/static/css/main.css
index 6413bfe..b8ed995 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -192,38 +192,74 @@ a:hover {
 }
 
 .hero h1 {
-  font-size: 3rem;
-  margin-bottom: var(--spacing-lg);
+  font-size: 4rem;
+  font-weight: 800;
+  margin-bottom: var(--spacing-md);
   color: var(--text-primary);
+  letter-spacing: -0.02em;
 }
 
-.hero p {
-  font-size: 1.25rem;
+.hero-subtitle {
+  font-size: 1.5rem;
   margin-bottom: var(--spacing-xl);
   color: var(--text-secondary);
   max-width: 600px;
   margin-left: auto;
   margin-right: auto;
+  line-height: 1.4;
+}
+
+.hero-actions {
+  display: flex;
+  gap: var(--spacing-md);
+  justify-content: center;
+  margin-bottom: var(--spacing-lg);
+  flex-wrap: wrap;
+}
+
+.version-info {
+  font-size: 1rem;
+  color: var(--text-muted);
+  margin: 0;
 }
 
 .hero-cta {
   display: inline-block;
-  background-color: var(--accent-primary);
-  color: white;
   padding: var(--spacing-md) var(--spacing-xl);
   border-radius: var(--border-radius);
   font-weight: 600;
   font-size: 1.1rem;
   transition: var(--transition);
+  text-decoration: none;
+  border: 2px solid transparent;
 }
 
-.hero-cta:hover {
-  background-color: var(--accent-hover);
+.hero-cta.primary {
+  background-color: var(--accent-primary);
   color: white;
+}
+
+.hero-cta.secondary {
+  background-color: transparent;
+  color: var(--accent-primary);
+  border-color: var(--accent-primary);
+}
+
+.hero-cta:hover {
   transform: translateY(-2px);
   box-shadow: 0 4px 12px var(--shadow);
 }
 
+.hero-cta.primary:hover {
+  background-color: var(--accent-hover);
+  color: white;
+}
+
+.hero-cta.secondary:hover {
+  background-color: var(--accent-primary);
+  color: white;
+}
+
 /* Content sections */
 .content-section {
   padding: var(--spacing-3xl) 0;
@@ -234,6 +270,45 @@ a:hover {
   margin-bottom: var(--spacing-2xl);
 }
 
+/* Why Pascal Section */
+.why-pascal {
+  background-color: #2a9d8f;
+  color: white;
+  padding: var(--spacing-3xl) 0;
+}
+
+.why-pascal .section-title {
+  color: white;
+  margin-bottom: var(--spacing-2xl);
+}
+
+.pillars {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+  gap: var(--spacing-2xl);
+  margin-top: var(--spacing-2xl);
+}
+
+.pillar {
+  text-align: left;
+}
+
+.pillar h3 {
+  font-size: 1.5rem;
+  font-weight: 700;
+  margin-bottom: var(--spacing-md);
+  color: white;
+  border-bottom: 3px solid rgba(255, 255, 255, 0.3);
+  padding-bottom: var(--spacing-sm);
+  display: inline-block;
+}
+
+.pillar p {
+  color: rgba(255, 255, 255, 0.9);
+  line-height: 1.6;
+  font-size: 1rem;
+}
+
 /* Cards */
 .cards {
   display: grid;
@@ -274,7 +349,7 @@ pre {
   padding: var(--spacing-lg);
   overflow-x: auto;
   font-family: var(--font-mono);
-  font-size: 0.9rem;
+  font-size: 1rem;
   line-height: 1.4;
   margin: 0;
 }
@@ -284,7 +359,7 @@ code {
   background-color: var(--code-bg);
   padding: 0.2em 0.4em;
   border-radius: 4px;
-  font-size: 0.9em;
+  font-size: 1em;
 }
 
 pre code {
@@ -331,7 +406,6 @@ pre code {
   color: var(--text-muted);
 }
 
-
 /* Responsive design */
 @media (max-width: 768px) {
   .container {

From f934aadbb7f0796e1a61d3411a49f75b912b69f0 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Wed, 6 Aug 2025 08:38:45 +1000
Subject: [PATCH 11/27] feat: add about page with modern homepage design and
 styling

---
 content/about/_index.md | 157 ++++++++++++++++++++++++++++++++++++++++
 hugo.toml               |   6 +-
 layouts/index.html      |  51 ++++++++-----
 static/css/main.css     |  56 ++++++++++++--
 4 files changed, 243 insertions(+), 27 deletions(-)
 create mode 100644 content/about/_index.md

diff --git a/content/about/_index.md b/content/about/_index.md
new file mode 100644
index 0000000..4f763fc
--- /dev/null
+++ b/content/about/_index.md
@@ -0,0 +1,157 @@
+---
+title: "About Pascal"
+description: "Learn about Pascal's philosophy, history, and the various implementations available today"
+---
+
+# About Pascal
+
+Pascal is a programming language that embodies the principles of clarity, reliability, and educational excellence. Created by Niklaus Wirth in 1970, Pascal was designed to encourage good programming practices and make programming concepts accessible to learners while remaining powerful enough for professional software development.
+
+## The Philosophy of Pascal
+
+Pascal was born from a simple yet profound philosophy: **programming should be clear, structured, and understandable**. Niklaus Wirth designed Pascal not just as a programming language, but as a tool for teaching and learning the fundamental concepts of computer science.
+
+Wirth famously said, "A good programming language is a conceptual universe for thinking about programming." Pascal provides exactly that—a clean, logical framework that mirrors how we naturally think about solving problems.
+
+## Pascal's Enduring Principles
+
+### Readability Above All
+Pascal's English-like syntax makes code self-documenting. When you read Pascal code, you understand not just *what* the program does, but *why* it does it. This clarity reduces bugs, simplifies maintenance, and makes collaboration natural.
+
+```objectpascal
+program CalculateAverage;
+var
+  numbers: array[1..10] of real;
+  sum, average: real;
+  i: integer;
+begin
+  sum := 0;
+  for i := 1 to 10 do
+  begin
+    write('Enter number ', i, ': ');
+    readln(numbers[i]);
+    sum := sum + numbers[i];
+  end;
+  
+  average := sum / 10;
+  writeln('The average is: ', average:0:2);
+end.
+```
+
+### Strong Foundation for Learning
+Pascal teaches fundamental programming concepts without the complexity that can obscure learning in other languages. Students learn about data types, control structures, procedures, and functions in their purest form.
+
+### Reliability Through Structure
+Pascal's strong typing system and structured programming approach prevent entire classes of errors before they occur. The compiler catches mistakes early, leading to more robust software.
+
+## Pascal's Evolution and Growth
+
+Since its creation in 1970, Pascal has evolved far beyond its educational origins. Modern Pascal implementations power everything from desktop applications to web services, mobile apps to embedded systems.
+
+The language gained massive popularity in the 1980s and 1990s with Turbo Pascal and later Delphi, proving that educational clarity and professional power could coexist beautifully.
+
+Today, Pascal continues to thrive with active development communities, modern language features, and cross-platform capabilities that rival any contemporary programming language.
+
+## Object Pascal: The Modern Evolution
+
+Object Pascal extends Pascal's clarity into the world of object-oriented programming. It maintains Pascal's readable syntax while adding powerful features like classes, inheritance, interfaces, and generics.
+
+Modern Object Pascal supports:
+- **Cross-platform development** - Write once, deploy everywhere
+- **Modern language features** - Generics, anonymous methods, RTTI
+- **Rich ecosystems** - Comprehensive libraries and frameworks
+- **Visual development** - Integrated designers and RAD tools
+
+## Other Implementations of Pascal
+
+Pascal, as a language family, has numerous implementations beyond the mainstream options. Each brings unique strengths and targets specific development scenarios:
+
+### Oxygene (Elements Compiler)
+[Oxygene](https://www.elementscompiler.com/elements/oxygene/) is a modern Object Pascal implementation that compiles to .NET, Java, and native code. Developed by RemObjects Software, Oxygene brings Pascal's clarity to contemporary platforms while adding cutting-edge language features.
+
+**Key Features:**
+- Compiles to .NET Framework, .NET Core, Java, and native platforms
+- Modern language features like LINQ, async/await, and nullable types
+- Full access to platform APIs and frameworks
+- Advanced IDE integration with Visual Studio and Fire
+
+### PascalABC.NET
+[PascalABC.NET](http://pascalabc.net/) is a modern Pascal implementation for the .NET platform, developed in Russia. It's particularly popular in educational settings and combines traditional Pascal syntax with .NET power.
+
+**Key Features:**
+- Full .NET integration with access to all .NET libraries
+- Modern Pascal syntax with object-oriented extensions
+- Built-in educational tools and simplified development environment
+- Strong focus on teaching programming concepts
+
+### Smart Pascal
+[Smart Pascal](https://smartpascal.com/) brings Pascal to web development, compiling Pascal code to optimized JavaScript. It enables developers to use Pascal's clarity for both client-side and server-side web applications.
+
+**Key Features:**
+- Compiles Pascal to JavaScript
+- Full DOM access and web API integration
+- Node.js support for server-side development
+- Visual web development tools
+
+### Turbo51
+Turbo51 is a Pascal compiler specifically designed for 8051 microcontrollers, bringing Pascal's structured approach to embedded systems development.
+
+**Key Features:**
+- Targets 8051 microcontroller family
+- Optimized code generation for resource-constrained environments
+- Pascal syntax for embedded systems programming
+
+### Virtual Pascal
+Virtual Pascal was a popular Pascal implementation for OS/2 and Windows, known for its speed and compatibility. While no longer actively developed, it influenced many modern Pascal implementations.
+
+### GNU Pascal (GPC)
+GNU Pascal is part of the GNU Compiler Collection, providing a free Pascal compiler that aims for ISO Pascal compatibility while adding useful extensions.
+
+**Key Features:**
+- ISO Pascal standard compliance
+- GNU/Linux and Unix platform support
+- Integration with GNU development tools
+- Free and open source
+
+### IP Pascal
+IP Pascal is an implementation focused on ISO Pascal standard compliance, providing a reference implementation for educational and research purposes.
+
+For a comprehensive list of Pascal implementations, see the [Pascal implementations wiki](https://wiki.freepascal.org/Pascal_implementations).
+
+## Why Pascal Matters Today
+
+In an era of complex frameworks and rapidly changing technologies, Pascal's core values remain more relevant than ever:
+
+**Clarity in Complexity**: As software systems grow more complex, Pascal's emphasis on readable, maintainable code becomes increasingly valuable.
+
+**Learning Foundation**: Pascal continues to be an excellent first language, teaching programming fundamentals without unnecessary complexity.
+
+**Professional Power**: Modern Pascal implementations prove that educational clarity and professional capability are not mutually exclusive.
+
+**Cross-Platform Reality**: Today's Pascal tools enable true cross-platform development with native performance.
+
+## Get Started with Pascal
+
+Ready to experience Pascal's unique combination of clarity and power?
+
+- **[Learn Pascal](/learn/)** - Start with our comprehensive tutorials
+- **[Documentation](/docs/)** - Explore Pascal's features and capabilities  
+- **[Community](/community/)** - Connect with Pascal developers worldwide
+
+## Explore the Pascal Ecosystem
+
+- **[Free Pascal Compiler](https://www.freepascal.org/)** - The leading open-source Pascal compiler
+- **[Lazarus IDE](https://www.lazarus-ide.org/)** - Cross-platform visual development environment
+- **[Pascal Standards](https://www.pascal-central.com/standards.html)** - Language specifications and standards
+- **[Academic Research](https://scholar.google.com/scholar?q=pascal+programming+language)** - Pascal in computer science education
+
+## Join the Pascal Community
+
+Pascal has a vibrant, welcoming community of developers, educators, and enthusiasts:
+
+- **[Pascal Forums](https://forum.lazarus.freepascal.org/)** - Discuss Pascal development with experts
+- **[User Groups](/community/#user-groups)** - Find Pascal developers in your area
+- **[Educational Resources](/learn/)** - Materials for teaching and learning Pascal
+- **[Open Source Projects](https://github.com/topics/pascal)** - Contribute to Pascal projects on GitHub
+
+Pascal isn't just a programming language—it's a philosophy of clear thinking, structured problem-solving, and elegant code. Whether you're learning your first programming concepts or building professional applications, Pascal provides the clarity and power you need to succeed.
diff --git a/hugo.toml b/hugo.toml
index e847ca1..7ecdb6c 100644
--- a/hugo.toml
+++ b/hugo.toml
@@ -7,7 +7,7 @@ title = 'Pascal - Readable, Reliable Programming'
 
 [markup]
   [markup.highlight]
-    style = 'monokai'
+    style = 'catppuccin-frappe'
     lineNos = true
     tabWidth = 2
     codeFences = true
@@ -33,6 +33,10 @@ title = 'Pascal - Readable, Reliable Programming'
     name = 'Community'
     url = '/community/'
     weight = 40
+  [[menu.main]]
+    name = 'About'
+    url = '/about/'
+    weight = 15
 
 # Enable section pages
 [taxonomies]
diff --git a/layouts/index.html b/layouts/index.html
index f7714b1..646b16d 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -2,26 +2,41 @@
 <!-- Hero Section -->
 <section class="hero">
     <div class="container">
-        <h1>Pascal</h1>
-        <p class="hero-subtitle">A language empowering everyone<br>to build readable and reliable software.</p>
-        <div class="hero-actions">
-            <a href="{{ "/learn/" | relURL }}" class="hero-cta primary">Get Started</a>
-            <a href="{{ "/docs/" | relURL }}" class="hero-cta secondary">Documentation</a>
-        </div>
-        <p class="version-info">Latest: Free Pascal 3.2.2 • Lazarus 3.6</p>
-    </div>
-</section>
-
-<!-- Code Example Section -->
-<section class="content-section">
-    <div class="container">
-        <h2 class="section-title">Clean, Readable Code</h2>
-        {{ $codeExample := `program HelloWorld;
+        <div class="hero-content">
+            <div class="hero-text">
+                <h1>Pascal</h1>
+                <p class="hero-subtitle">Build readable, fast and reliable software.</p>
+                <div class="hero-actions">
+                    <a href="{{ "/learn/" | relURL }}" class="hero-cta primary">Get Started</a>
+                    <a href="{{ "/docs/" | relURL }}" class="hero-cta secondary">Documentation</a>
+                </div>
+                <p class="version-info">Latest: Free Pascal 3.2.2 • Lazarus 4.2</p>
+            </div>
+            <div class="hero-code">
+                {{ $heroCode := `program webserver;
+{$mode objfpc}{$H+}
+ 
+uses
+  {$ifdef UNIX}
+  cthreads, cmem,
+  {$endif} 
+  fphttpapp, httpdefs, httproute;
+ 
+procedure route1(aReq: TRequest; aResp: TResponse);
+begin
+  aResp.Content:='<html><body><h1>Hello Pascal!</h1></body></html>';
+end;
+ 
 begin
-    writeln('Hello, World!');
-    writeln('Welcome to Pascal programming');
+  HTTPRouter.RegisterRoute('/', @route1);
+  Application.Port := 1999;
+  Application.Threaded := true;
+  Application.Initialize;
+  Application.Run;
 end.` }}
-        {{ highlight $codeExample "objectpascal" "linenos=true" }}
+                {{ highlight $heroCode "objectpascal" "linenos=false" }}
+            </div>
+        </div>
     </div>
 </section>
 
diff --git a/static/css/main.css b/static/css/main.css
index b8ed995..dac2858 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -187,10 +187,21 @@ a:hover {
 /* Hero section */
 .hero {
   padding: var(--spacing-3xl) 0;
-  text-align: center;
   background-color: var(--bg-secondary);
 }
 
+.hero-content {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: var(--spacing-3xl);
+  align-items: center;
+  min-height: 500px;
+}
+
+.hero-text {
+  text-align: left;
+}
+
 .hero h1 {
   font-size: 4rem;
   font-weight: 800;
@@ -203,16 +214,29 @@ a:hover {
   font-size: 1.5rem;
   margin-bottom: var(--spacing-xl);
   color: var(--text-secondary);
-  max-width: 600px;
-  margin-left: auto;
-  margin-right: auto;
   line-height: 1.4;
 }
 
+.hero-code {
+  position: relative;
+}
+
+.hero-code .highlight {
+  margin: 0;
+  border-radius: 12px;
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+  overflow: hidden;
+}
+
+.hero-code pre {
+  padding: var(--spacing-xl);
+  font-size: 0.95rem;
+  line-height: 1.5;
+}
+
 .hero-actions {
   display: flex;
   gap: var(--spacing-md);
-  justify-content: center;
   margin-bottom: var(--spacing-lg);
   flex-wrap: wrap;
 }
@@ -420,12 +444,28 @@ pre code {
     display: flex;
   }
   
+  .hero-content {
+    grid-template-columns: 1fr;
+    gap: var(--spacing-xl);
+    min-height: auto;
+    text-align: center;
+  }
+  
+  .hero-text {
+    text-align: center;
+    order: 1;
+  }
+  
+  .hero-code {
+    order: 2;
+  }
+  
   .hero h1 {
-    font-size: 2rem;
+    font-size: 2.5rem;
   }
   
-  .hero p {
-    font-size: 1.1rem;
+  .hero-subtitle {
+    font-size: 1.2rem;
   }
   
   .cards {

From 4020a6c8d74cbe5d9d64a6cde829973c890acd74 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Wed, 6 Aug 2025 14:49:53 +1000
Subject: [PATCH 12/27] feat: update site title to Object Pascal and updated
 examples

---
 hugo.toml                    |   4 +-
 layouts/_default/baseof.html |  25 +++-
 layouts/index.html           | 268 +++++++++++++++++++++++++++++++++--
 static/css/main.css          |  75 ++++++++--
 4 files changed, 349 insertions(+), 23 deletions(-)

diff --git a/hugo.toml b/hugo.toml
index 7ecdb6c..da0fd1e 100644
--- a/hugo.toml
+++ b/hugo.toml
@@ -1,6 +1,6 @@
 baseURL = 'https://pascal-lang.org/'
 languageCode = 'en-us'
-title = 'Pascal - Readable, Reliable Programming'
+title = 'Object Pascal - Readable, Reliable Programming'
 
 # Disable theme to use custom templates
 # theme = 'ananke'
@@ -13,7 +13,7 @@ title = 'Pascal - Readable, Reliable Programming'
     codeFences = true
 
 [params]
-  description = 'Pascal programming language - readable, reliable, and educational'
+  description = 'Object Pascal programming language - readable, reliable, and educational'
   author = 'Object Pascal Community'
 
 [menu]
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 122def2..49c8b1f 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -22,7 +22,7 @@
     
     {{ partial "footer.html" . }}
     
-    <!-- Theme toggle script -->
+    <!-- Theme toggle and code selector scripts -->
     <script>
         // Theme toggle functionality
         const themeToggle = document.getElementById('theme-toggle');
@@ -40,6 +40,29 @@
                 // CSS variables automatically handle syntax highlighting theme switching!
             });
         }
+        
+        // Code example selector functionality
+        document.addEventListener('DOMContentLoaded', function() {
+            const codeTabs = document.querySelectorAll('.code-tab');
+            const codeExamples = document.querySelectorAll('.code-example');
+            
+            codeTabs.forEach(tab => {
+                tab.addEventListener('click', () => {
+                    const exampleId = tab.getAttribute('data-example');
+                    
+                    // Remove active class from all tabs and examples
+                    codeTabs.forEach(t => t.classList.remove('active'));
+                    codeExamples.forEach(e => e.classList.remove('active'));
+                    
+                    // Add active class to clicked tab and corresponding example
+                    tab.classList.add('active');
+                    const targetExample = document.getElementById('example-' + exampleId);
+                    if (targetExample) {
+                        targetExample.classList.add('active');
+                    }
+                });
+            });
+        });
     </script>
 </body>
 </html>
diff --git a/layouts/index.html b/layouts/index.html
index 646b16d..b3cba1d 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -4,7 +4,7 @@
     <div class="container">
         <div class="hero-content">
             <div class="hero-text">
-                <h1>Pascal</h1>
+                <h1>Object Pascal</h1>
                 <p class="hero-subtitle">Build readable, fast and reliable software.</p>
                 <div class="hero-actions">
                     <a href="{{ "/learn/" | relURL }}" class="hero-cta primary">Get Started</a>
@@ -13,28 +13,272 @@ <h1>Pascal</h1>
                 <p class="version-info">Latest: Free Pascal 3.2.2 • Lazarus 4.2</p>
             </div>
             <div class="hero-code">
-                {{ $heroCode := `program webserver;
-{$mode objfpc}{$H+}
- 
+                <div class="code-selector">
+                    <button class="code-tab active" data-example="webserver">Web Server</button>
+                    <button class="code-tab" data-example="sorting">Data Processing</button>
+                    <button class="code-tab" data-example="json">JSON API</button>
+                    <button class="code-tab" data-example="filestream">File Processing</button>
+                    <button class="code-tab" data-example="sqlite">SQLite DB</button>
+                    <button class="code-tab" data-example="csv">CSV Parser</button>
+                    <button class="code-tab" data-example="concurrent">Concurrency</button>
+                </div>
+                
+                <div class="code-examples">
+                    <div class="code-example active" id="example-webserver">
+                        {{ $webserverCode := `program webserver;
+
+{$mode objfpc}{$H+}{$J-}
+
 uses
-  {$ifdef UNIX}
-  cthreads, cmem,
-  {$endif} 
-  fphttpapp, httpdefs, httproute;
- 
+  Classes, fphttpapp, httpdefs, httproute;
+
 procedure route1(aReq: TRequest; aResp: TResponse);
 begin
-  aResp.Content:='<html><body><h1>Hello Pascal!</h1></body></html>';
+  aResp.Content := '<h1>Hello Pascal!</h1>';
 end;
- 
+
 begin
   HTTPRouter.RegisterRoute('/', @route1);
   Application.Port := 1999;
   Application.Threaded := true;
   Application.Initialize;
+
+  WriteLn('Your site is ready at: http://localhost:1999');
+  WriteLn('Hit Ctrl + C to quit');
+
   Application.Run;
 end.` }}
-                {{ highlight $heroCode "objectpascal" "linenos=false" }}
+                        {{ highlight $webserverCode "objectpascal" "linenos=false" }}
+                    </div>
+                    
+                    <div class="code-example" id="example-sorting">
+                        {{ $sortingCode := `program datasort;
+
+{$mode objfpc}{$H+}{$J-}
+
+uses
+  SysUtils, Classes, Generics.Collections;
+ 
+type
+  TListInt = specialize TList<integer>;
+ 
+var
+  Numbers: TListInt;
+  Num: integer;
+ 
+begin
+  Numbers := TListInt.Create();
+  try
+    Numbers.AddRange([1, 45, 78, 99, 32, 47]);
+    Numbers.Sort;
+ 
+    for Num in Numbers do
+      WriteLn(Num);
+  finally
+    Numbers.Free;
+  end;
+end.` }}
+                        {{ highlight $sortingCode "objectpascal" "linenos=false" }}
+                    </div>
+                    
+                    <div class="code-example" id="example-json">
+                        {{ $jsonCode := `program jsonapi;
+
+{$mode objfpc}{$H+}{$J-}
+
+uses
+  fpjson, jsonparser;
+
+var
+  JSON: TJSONObject;
+begin
+  JSON := GetJSON('{"name":"Alice","age":30}') as TJSONObject;
+  try
+    WriteLn(JSON.Get('name', ''), ' is ', JSON.Get('age', 0), ' years old');
+  finally
+    JSON.Free;
+  end;
+end.` }}
+                        {{ highlight $jsonCode "objectpascal" "linenos=false" }}
+                    </div>
+                    
+                    <div class="code-example" id="example-filestream">
+                        {{ $filestreamCode := `program fileprocess;
+
+{$mode objfpc}{$H+}{$J-}
+ 
+ uses
+   Classes, SysUtils, streamex;
+ 
+ var
+   FileStream: TFileStream;
+   Reader: TStreamReader;
+   Line: string;
+   LineNum: integer;
+ 
+ begin
+   FileStream := TFileStream.Create('data.txt', fmOpenRead);
+   try
+     Reader := TStreamReader.Create(FileStream);
+     try
+       LineNum := 1;
+       while not Reader.EOF do
+       begin
+         Line := Reader.ReadLine;
+         WriteLn('Line ', LineNum, ': ', Line);
+         Inc(LineNum);
+       end;
+     finally
+       Reader.Free;
+     end;
+   finally
+     FileStream.Free;
+   end;
+ end.` }}
+                        {{ highlight $filestreamCode "objectpascal" "linenos=false" }}
+                    </div>
+                    
+                    <div class="code-example" id="example-sqlite">
+                        {{ $sqliteCode := `program sqlite;
+
+{$mode objfpc}{$H+}
+
+uses
+  SysUtils, sqldb, sqlite3conn;
+
+var
+  Conn: TSQLite3Connection;
+  Query: TSQLQuery;
+  Trans: TSQLTransaction;
+
+begin
+  Conn := TSQLite3Connection.Create(nil);
+  Trans := TSQLTransaction.Create(nil);
+  Query := TSQLQuery.Create(nil);
+  try
+    Conn.DatabaseName := 'users.db';
+    Conn.Transaction := Trans;
+    Trans.Database := Conn;
+    Query.Database := Conn;
+    Query.Transaction := Trans;
+    
+    Conn.Open;
+
+    // Simple query
+    Query.SQL.Text := 'SELECT name, age FROM users WHERE age > 25';
+    Query.Open;
+
+    while not Query.EOF do
+    begin
+      WriteLn(Query.FieldByName('name').AsString, ' is ',
+              Query.FieldByName('age').AsInteger, ' years old');
+      Query.Next;
+    end;
+  finally
+    Query.Free;
+    Trans.Free;
+    Conn.Free;
+  end;
+end.` }}
+                        {{ highlight $sqliteCode "objectpascal" "linenos=false" }}
+                    </div>
+                    
+                    <div class="code-example" id="example-csv">
+                        {{ $csvCode := `program csvparser;
+
+{$mode objfpc}{$H+}{$J-}
+
+uses
+  SysUtils, csvdocument;
+
+var
+  CSV: TCSVDocument;
+  Row, Col: Integer;
+
+begin
+  CSV := TCSVDocument.Create;
+  try
+    CSV.LoadFromFile('data.csv');
+
+    WriteLn('CSV has ', CSV.RowCount, ' rows and ', CSV.ColCount[0], ' columns');
+    WriteLn;
+
+    for Row := 0 to CSV.RowCount - 1 do
+    begin
+      Write('Row ', Row + 1, ': ');
+      for Col := 0 to CSV.ColCount[0] - 1 do
+      begin
+        Write(CSV.Cells[Col, Row]);
+        if Col < CSV.ColCount[0] - 1 then Write(' | ');
+      end;
+      WriteLn;
+    end;
+  finally
+    CSV.Free;
+  end;
+end.` }}
+                        {{ highlight $csvCode "objectpascal" "linenos=false" }}
+                    </div>
+                    
+                    <div class="code-example" id="example-concurrent">
+                        {{ $concurrentCode := `program concurrent;
+
+{$mode objfpc}{$H+}{$J-}
+
+uses
+  {$IFDEF UNIX}
+  cthreads, cmem
+  {$ENDIF}
+  SysUtils, Classes, SyncObjs;
+
+type
+  TWorkerThread = class(TThread)
+  private
+    FTaskID: Integer;
+  protected
+    procedure Execute; override;
+  public
+    constructor Create(TaskID: Integer);
+  end;
+
+constructor TWorkerThread.Create(TaskID: Integer);
+begin
+  FTaskID := TaskID;
+  inherited Create(False);
+end;
+
+procedure TWorkerThread.Execute;
+begin
+  WriteLn('Task ', FTaskID, ' starting...');
+  Sleep(1000 + Random(2000)); // Simulate work
+  WriteLn('Task ', FTaskID, ' completed!');
+end;
+
+var
+  Threads: array[1..4] of TWorkerThread;
+  i: Integer;
+
+begin
+  Randomize;
+
+  // Start concurrent tasks
+  for i := 1 to 4 do
+    Threads[i] := TWorkerThread.Create(i);
+
+  // Wait for completion
+  for i := 1 to 4 do
+  begin
+    Threads[i].WaitFor;
+    Threads[i].Free;
+  end;
+
+  WriteLn('All tasks completed!');
+end.
+
+` }}
+                        {{ highlight $concurrentCode "objectpascal" "linenos=false" }}
+                    </div>
+                </div>
             </div>
         </div>
     </div>
diff --git a/static/css/main.css b/static/css/main.css
index dac2858..07d6d9a 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -198,9 +198,6 @@ a:hover {
   min-height: 500px;
 }
 
-.hero-text {
-  text-align: left;
-}
 
 .hero h1 {
   font-size: 4rem;
@@ -221,17 +218,74 @@ a:hover {
   position: relative;
 }
 
+.code-selector {
+  display: flex;
+  gap: 2px;
+  margin-bottom: var(--spacing-md);
+  background-color: var(--bg-tertiary);
+  border-radius: 8px;
+  padding: 4px;
+}
+
+.code-tab {
+  flex: 1;
+  padding: var(--spacing-sm) var(--spacing-md);
+  background: none;
+  border: none;
+  border-radius: 6px;
+  font-size: 0.9rem;
+  font-weight: 500;
+  color: var(--text-secondary);
+  cursor: pointer;
+  transition: var(--transition);
+  text-align: center;
+}
+
+.code-tab:hover {
+  color: var(--text-primary);
+  background-color: rgba(255, 255, 255, 0.1);
+}
+
+.code-tab.active {
+  background-color: var(--bg-primary);
+  color: var(--accent-primary);
+  font-weight: 600;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.code-examples {
+  position: relative;
+  height: 420px; /* Fixed height to prevent layout shifts */
+}
+
+.code-example {
+  display: none;
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 100%;
+}
+
+.code-example.active {
+  display: block;
+}
+
 .hero-code .highlight {
   margin: 0;
   border-radius: 12px;
   box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
   overflow: hidden;
+  height: 100%;
 }
 
 .hero-code pre {
-  padding: var(--spacing-xl);
-  font-size: 0.95rem;
-  line-height: 1.5;
+  padding: var(--spacing-lg);
+  font-size: 0.75rem;
+  line-height: 1.4;
+  height: 100%;
+  overflow-y: auto;
+  margin: 0;
 }
 
 .hero-actions {
@@ -249,7 +303,7 @@ a:hover {
 
 .hero-cta {
   display: inline-block;
-  padding: var(--spacing-md) var(--spacing-xl);
+  padding: var(--spacing-sm) var(--spacing-lg);
   border-radius: var(--border-radius);
   font-weight: 600;
   font-size: 1.1rem;
@@ -292,6 +346,7 @@ a:hover {
 .section-title {
   text-align: center;
   margin-bottom: var(--spacing-2xl);
+  font-weight: 800;
 }
 
 /* Why Pascal Section */
@@ -322,7 +377,7 @@ a:hover {
   font-weight: 700;
   margin-bottom: var(--spacing-md);
   color: white;
-  border-bottom: 3px solid rgba(255, 255, 255, 0.3);
+  border-bottom: 8px solid rgb(255 193 7 / 75%);
   padding-bottom: var(--spacing-sm);
   display: inline-block;
 }
@@ -456,6 +511,10 @@ pre code {
     order: 1;
   }
   
+  .hero-actions {
+    justify-content: center;
+  }
+
   .hero-code {
     order: 2;
   }

From b2f9358d235072145e96115fea02481c71b73cd4 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Wed, 6 Aug 2025 20:25:39 +1000
Subject: [PATCH 13/27] feat: Edits to pages. Added a sidebar to the Learn
 page.

---
 content/about/_index.md                   |  55 +--
 content/learn/_index.md                   | 449 ++++++++++++----------
 hugo.toml                                 |   3 +
 layouts/_default/single-with-sidebar.html | 401 +++++++++++++++++++
 layouts/index.html                        |   4 +-
 static/css/main.css                       |  99 ++++-
 6 files changed, 775 insertions(+), 236 deletions(-)
 create mode 100644 layouts/_default/single-with-sidebar.html

diff --git a/content/about/_index.md b/content/about/_index.md
index 4f763fc..2b1cd13 100644
--- a/content/about/_index.md
+++ b/content/about/_index.md
@@ -11,7 +11,7 @@ Pascal is a programming language that embodies the principles of clarity, reliab
 
 Pascal was born from a simple yet profound philosophy: **programming should be clear, structured, and understandable**. Niklaus Wirth designed Pascal not just as a programming language, but as a tool for teaching and learning the fundamental concepts of computer science.
 
-Wirth famously said, "A good programming language is a conceptual universe for thinking about programming." Pascal provides exactly that—a clean, logical framework that mirrors how we naturally think about solving problems.
+Wirth believed that a programming language should provide a clear conceptual framework for thinking about programming. Pascal provides exactly that—a clean, logical framework that mirrors how we naturally think about solving problems.
 
 ## Pascal's Enduring Principles
 
@@ -57,8 +57,9 @@ Today, Pascal continues to thrive with active development communities, modern la
 Object Pascal extends Pascal's clarity into the world of object-oriented programming. It maintains Pascal's readable syntax while adding powerful features like classes, inheritance, interfaces, and generics.
 
 Modern Object Pascal supports:
+
 - **Cross-platform development** - Write once, deploy everywhere
-- **Modern language features** - Generics, anonymous methods, RTTI
+- **Modern language features** - Generics, RTTI, anonymous methods (in the  _trunk_ branch)
 - **Rich ecosystems** - Comprehensive libraries and frameworks
 - **Visual development** - Integrated designers and RAD tools
 
@@ -84,28 +85,18 @@ Pascal, as a language family, has numerous implementations beyond the mainstream
 - Built-in educational tools and simplified development environment
 - Strong focus on teaching programming concepts
 
-### Smart Pascal
-[Smart Pascal](https://smartpascal.com/) brings Pascal to web development, compiling Pascal code to optimized JavaScript. It enables developers to use Pascal's clarity for both client-side and server-side web applications.
+### pas2js (Pascal to JavaScript)
+[pas2js](https://wiki.freepascal.org/pas2js) is the official Free Pascal transpiler that compiles Pascal code to JavaScript. Maintained by the Free Pascal team, it brings Pascal's clarity to modern web development.
 
 **Key Features:**
-- Compiles Pascal to JavaScript
-- Full DOM access and web API integration
+- Official Free Pascal project for web development
+- Compiles Object Pascal to clean, readable JavaScript
+- Full DOM access and modern web API integration
 - Node.js support for server-side development
-- Visual web development tools
-
-### Turbo51
-Turbo51 is a Pascal compiler specifically designed for 8051 microcontrollers, bringing Pascal's structured approach to embedded systems development.
-
-**Key Features:**
-- Targets 8051 microcontroller family
-- Optimized code generation for resource-constrained environments
-- Pascal syntax for embedded systems programming
-
-### Virtual Pascal
-Virtual Pascal was a popular Pascal implementation for OS/2 and Windows, known for its speed and compatibility. While no longer actively developed, it influenced many modern Pascal implementations.
+- Active development and community support
 
 ### GNU Pascal (GPC)
-GNU Pascal is part of the GNU Compiler Collection, providing a free Pascal compiler that aims for ISO Pascal compatibility while adding useful extensions.
+[GNU Pascal](https://www.gnu-pascal.de/gpc/h-index.html) is part of the GNU Compiler Collection, providing a free Pascal compiler that aims for ISO Pascal compatibility while adding useful extensions.
 
 **Key Features:**
 - ISO Pascal standard compliance
@@ -113,10 +104,14 @@ GNU Pascal is part of the GNU Compiler Collection, providing a free Pascal compi
 - Integration with GNU development tools
 - Free and open source
 
-### IP Pascal
-IP Pascal is an implementation focused on ISO Pascal standard compliance, providing a reference implementation for educational and research purposes.
+### Turbo51
+[Turbo51](https://turbo51.com/) is a Pascal compiler specifically designed for 8051 microcontrollers, bringing Pascal's structured approach to embedded systems development.
+
+**Key Features:**
+- Targets 8051 microcontroller family
+- Optimized code generation for resource-constrained environments
+- Pascal syntax for embedded systems programming
 
-For a comprehensive list of Pascal implementations, see the [Pascal implementations wiki](https://wiki.freepascal.org/Pascal_implementations).
 
 ## Why Pascal Matters Today
 
@@ -138,20 +133,4 @@ Ready to experience Pascal's unique combination of clarity and power?
 - **[Documentation](/docs/)** - Explore Pascal's features and capabilities  
 - **[Community](/community/)** - Connect with Pascal developers worldwide
 
-## Explore the Pascal Ecosystem
-
-- **[Free Pascal Compiler](https://www.freepascal.org/)** - The leading open-source Pascal compiler
-- **[Lazarus IDE](https://www.lazarus-ide.org/)** - Cross-platform visual development environment
-- **[Pascal Standards](https://www.pascal-central.com/standards.html)** - Language specifications and standards
-- **[Academic Research](https://scholar.google.com/scholar?q=pascal+programming+language)** - Pascal in computer science education
-
-## Join the Pascal Community
-
-Pascal has a vibrant, welcoming community of developers, educators, and enthusiasts:
-
-- **[Pascal Forums](https://forum.lazarus.freepascal.org/)** - Discuss Pascal development with experts
-- **[User Groups](/community/#user-groups)** - Find Pascal developers in your area
-- **[Educational Resources](/learn/)** - Materials for teaching and learning Pascal
-- **[Open Source Projects](https://github.com/topics/pascal)** - Contribute to Pascal projects on GitHub
-
 Pascal isn't just a programming language—it's a philosophy of clear thinking, structured problem-solving, and elegant code. Whether you're learning your first programming concepts or building professional applications, Pascal provides the clarity and power you need to succeed.
diff --git a/content/learn/_index.md b/content/learn/_index.md
index 1e230e2..d90d877 100644
--- a/content/learn/_index.md
+++ b/content/learn/_index.md
@@ -2,38 +2,31 @@
 title = 'Learn Pascal'
 date = 2024-05-30T18:56:05+03:00
 draft = false
+layout = 'single-with-sidebar'
 +++
 
-# Learn Pascal Programming
-
-Pascal is an excellent language for learning programming fundamentals. Its clear syntax and structured approach make it perfect for beginners while remaining powerful enough for advanced applications.
-
-## Getting Started
-
-### Installation {#install}
+## Installation
 
 Choose your Pascal development environment:
 
-**Free Pascal Compiler (FPC)**
-- Cross-platform Pascal compiler
-- Command-line based development
-- [Download FPC](https://www.freepascal.org/)
+| Feature | Free Pascal Compiler (FPC) | Lazarus IDE |
+|---------|----------------------------|-------------|
+| **Type** | Command-line compiler | Visual development environment |
+| **Interface** | Terminal/command-line | Graphical IDE with forms designer |
+| **Best for** | Learning fundamentals, scripting | GUI applications, beginners |
+| **Includes** | Pascal compiler only | FPC + IDE + visual designer |
+| **Platform** | Cross-platform | Cross-platform |
+| **Download** | [Download FPC](https://www.freepascal.org/) | [Download Lazarus](https://www.lazarus-ide.org/) |  
 
-**Lazarus IDE**
-- Complete visual development environment
-- Built on Free Pascal
-- Perfect for beginners
-- [Download Lazarus](https://www.lazarus-ide.org/)
 
-### Your First Program
+## Compiling Hello World!
 
 Create a new file called `hello.pas`:
 
 ```objectpascal
 program HelloWorld;
 begin
-    writeln('Hello, Pascal World!');
-    writeln('Ready to learn programming?');
+    writeln('Hello, Pascal!');
 end.
 ```
 
@@ -44,6 +37,7 @@ fpc hello.pas
 ./hello
 ```
 
+
 ## Core Concepts
 
 ### Program Structure
@@ -53,40 +47,87 @@ Every Pascal program follows this basic structure:
 ```objectpascal
 program ProgramName;
 
+{ Constant declarations }
+const
+  MAX_ITEMS = 100;
+  GREETING = 'Welcome to Pascal';
+  PI = 3.14159;
+
+{ Type declarations }
+type
+  TStudent = record
+      name: string;
+      age: integer;
+  end;
+  TScoreArray = array[1..10] of integer;
+
 { Variable declarations }
 var
-    message: string;
-    count: integer;
+  message: string;
+  count: integer;
+  student: TStudent;
+
+{ Procedure and function declarations }
+procedure displayInfo;
+begin
+    writeln('Program: ', GREETING);
+end;
 
 { Main program block }
 begin
-    message := 'Welcome to Pascal';
-    count := 42;
-    writeln(message);
-    writeln('Count: ', count);
+  message := GREETING;
+  count := 42;
+  writeln(message);
+  writeln('Count: ', count);
+  displayInfo;
 end.
 ```
 
 ### Data Types
 
-Pascal has strong typing with these fundamental types:
+Pascal has strong typing with these fundamental and practical types:
 
 ```objectpascal
 var
-    // Integer types
-    age: integer;
-    population: longint;
-    
-    // Real types
-    temperature: real;
-    price: double;
-    
-    // Character and string
-    grade: char;
-    name: string;
-    
-    // Boolean
-    isActive: boolean;
+  // Integer types
+  age: integer;              // -2,147,483,648 to 2,147,483,647
+  population: longint;       // Same as integer
+  fileSize: int64;           // Large numbers: -9,223,372,036,854,775,808 to 9,223,372,036,854,775,807
+  count: cardinal;           // Unsigned: 0 to 4,294,967,295
+  index: word;               // Small positive: 0 to 65,535
+  flags: byte;               // Tiny values: 0 to 255
+  
+  // Real/floating point types
+  temperature: real;         // General purpose floating point
+  price: double;             // High precision: banking, scientific
+  percentage: single;        // Lower precision, memory efficient
+  saving: currency;          // Fixed-point for money calculations
+  
+  // Text and character types
+  grade: char;               // Single character
+  name: string;              // Dynamic string (unlimited length)
+  shortName: string[50];     // Fixed-length string (50 chars max)
+  unicodeStr: UnicodeString; // Unicode support for international text
+  
+  // Boolean and logical
+  isActive: boolean;         // True or false
+  hasPermission: boolean;
+  
+  // Date and time types
+  birthDate: TDateTime;      // Date and time combined
+  startTime: TTime;          // Time only
+  eventDate: TDate;          // Date only
+  
+  // Pointer and reference types
+  dataPtr: pointer;          // Generic pointer
+  objRef: TObject;           // Object reference
+  
+  // Variant types (dynamic typing)
+  dynamicValue: variant;     // Can hold any type
+  
+  // Set types (collections of values)
+  weekDays: set of (Monday, Tuesday, Wednesday, Thursday, Friday);
+  validChars: set of char;   // Set of characters
 ```
 
 ### Control Structures
@@ -95,37 +136,94 @@ var
 
 ```objectpascal
 if age >= 18 then
-    writeln('You are an adult')
+  writeln('You are an adult')
 else
-    writeln('You are a minor');
+  writeln('You are a minor');
 
 case grade of
-    'A': writeln('Excellent!');
-    'B': writeln('Good job!');
-    'C': writeln('Average');
-    else writeln('Keep trying!');
+  'A': writeln('Excellent!');
+  'B': writeln('Good job!');
+  'C': writeln('Average');
+  else writeln('Keep trying!');
 end;
 ```
 
 **Loops:**
 
 ```objectpascal
-{ For loop }
+{ For loop - counting up }
 for i := 1 to 10 do
-    writeln('Number: ', i);
+  writeln('Number: ', i);
 
-{ While loop }
-while count > 0 do
+{ For loop - counting down }
+for i := 10 downto 1 do
+  writeln('Countdown: ', i);
+
+{ For loop with arrays }
+var
+  numbers: array[1..5] of integer = (10, 20, 30, 40, 50);
+  i: integer;
 begin
-    writeln(count);
+  for i := 1 to 5 do
+    writeln('Array[', i, '] = ', numbers[i]);
+end;
+
+{ While loop - condition checked first }
+var
+  count: integer = 5;
+begin
+  while count > 0 do
+  begin
+    writeln('Count: ', count);
     count := count - 1;
+  end;
 end;
 
-{ Repeat-until loop }
-repeat
+{ Repeat-until loop - condition checked last }
+var
+  number: integer;
+begin
+  repeat
     write('Enter a positive number: ');
     readln(number);
-until number > 0;
+  until number > 0;
+  writeln('You entered: ', number);
+end;
+
+{ For-in loop (modern Pascal) }
+var
+  names: array of string = ('Alice', 'Bob', 'Charlie');
+  name: string;
+begin
+  for name in names do
+    writeln('Hello, ', name);
+end;
+
+{ Nested loops - multiplication table }
+var
+  i, j: integer;
+begin
+  for i := 1 to 5 do
+  begin
+    for j := 1 to 5 do
+      write(i * j:4);  // Format with width 4
+    writeln;  // New line after each row
+  end;
+end;
+
+{ Loop control statements }
+var
+  i: integer;
+begin
+  for i := 1 to 10 do
+  begin
+    if i = 5 then
+      continue;  // Skip iteration when i = 5
+    if i = 8 then
+      break;     // Exit loop when i = 8
+    writeln(i);
+  end;
+end;
 ```
 
 ## Procedures and Functions
@@ -135,13 +233,13 @@ until number > 0;
 ```objectpascal
 procedure greetUser(name: string);
 begin
-    writeln('Hello, ', name, '!');
-    writeln('Welcome to Pascal programming.');
+  writeln('Hello, ', name, '!');
+  writeln('Welcome to Pascal programming.');
 end;
 
 { Call the procedure }
 begin
-    greetUser('Alice');
+  greetUser('Alice');
 end.
 ```
 
@@ -150,15 +248,15 @@ end.
 ```objectpascal
 function calculateArea(radius: real): real;
 begin
-    calculateArea := 3.14159 * radius * radius;
+  calculateArea := 3.14159 * radius * radius;
 end;
 
 { Using the function }
 var
-    area: real;
+  area: real;
 begin
-    area := calculateArea(5.0);
-    writeln('Area: ', area:0:2);
+  area := calculateArea(5.0);
+  writeln('Area: ', area:0:2);
 end.
 ```
 
@@ -185,22 +283,22 @@ end.
 ```objectpascal
 program ArrayExample;
 var
-    scores: array[1..5] of integer;
-    names: array[1..3] of string;
-    i: integer;
+  scores: array[1..5] of integer;
+  names: array[1..3] of string;
+  i: integer;
 begin
-    { Initialize array }
-    scores[1] := 95;
-    scores[2] := 87;
-    scores[3] := 92;
+  { Initialize array }
+  scores[1] := 95;
+  scores[2] := 87;
+  scores[3] := 92;
     
-    names[1] := 'Alice';
-    names[2] := 'Bob';
-    names[3] := 'Charlie';
+  names[1] := 'Alice';
+  names[2] := 'Bob';
+  names[3] := 'Charlie';
     
-    { Display results }
-    for i := 1 to 3 do
-        writeln(names[i], ': ', scores[i]);
+  { Display results }
+  for i := 1 to 3 do
+    writeln(names[i], ': ', scores[i]);
 end.
 ```
 
@@ -208,27 +306,27 @@ end.
 ```objectpascal
 program RecordExample;
 type
-    TStudent = record
-        name: string;
-        age: integer;
-        grade: char;
-        gpa: real;
-    end;
+  TStudent = record
+    name: string;
+    age: integer;
+    grade: char;
+    gpa: real;
+  end;
 
 var
-    student: TStudent;
+  student: TStudent;
 begin
-    { Initialize record }
-    student.name := 'Emma Watson';
-    student.age := 20;
-    student.grade := 'A';
-    student.gpa := 3.8;
+  { Initialize record }
+  student.name := 'Emma Watson';
+  student.age := 20;
+  student.grade := 'A';
+  student.gpa := 3.8;
     
-    { Display student info }
-    writeln('Student: ', student.name);
-    writeln('Age: ', student.age);
-    writeln('Grade: ', student.grade);
-    writeln('GPA: ', student.gpa:0:1);
+  { Display student info }
+  writeln('Student: ', student.name);
+  writeln('Age: ', student.age);
+  writeln('Grade: ', student.grade);
+  writeln('GPA: ', student.gpa:0:1);
 end.
 ```
 
@@ -237,118 +335,82 @@ end.
 **Reading from Files:**
 ```objectpascal
 program ReadFile;
+
+uses
+  Classes,
+  SysUtils,
+  streamex;
+
 var
-    inputFile: text;
-    line: string;
+  reader: TStreamReader;
+  fileStream: TFileStream;
+  line, filename:string;
+  i: integer;
 begin
-    assign(inputFile, 'data.txt');
-    {$I-} reset(inputFile); {$I+}
-    
-    if IOResult = 0 then
-    begin
-        while not eof(inputFile) do
+  // filename to read
+  filename:= 'cake-ipsum-.txt';
+  try
+    fileStream := TFileStream.Create(filename, fmOpenRead);
+    try
+      reader := TStreamReader.Create(fileStream);
+      try
+        // Set line counter to 1
+        i := 1;
+        while not reader.EOF do
         begin
-            readln(inputFile, line);
-            writeln('Read: ', line);
+          line := reader.ReadLine;
+          WriteLn(Format('line %d is: %s', [i, line]));
+          i := i + 1;
         end;
-        close(inputFile);
-    end
-    else
-        writeln('Error: Could not open file');
+      finally
+        reader.Free;
+      end;
+    finally
+      fileStream.Free;
+    end;
+  except
+    on E: Exception do
+      WriteLn('Error: ' + E.Message);
+  end;
+
+  // Pause console
+  ReadLn;
 end.
 ```
 
 **Writing to Files:**
 ```objectpascal
-program WriteFile;
-var
-    outputFile: text;
-    i: integer;
-begin
-    assign(outputFile, 'output.txt');
-    rewrite(outputFile);
-    
-    writeln(outputFile, 'Pascal File Output Example');
-    writeln(outputFile, '========================');
-    
-    for i := 1 to 5 do
-        writeln(outputFile, 'Line number: ', i);
-    
-    close(outputFile);
-    writeln('File written successfully!');
-end.
-```
+program NewTextFile;
 
-### Error Handling
+uses
+  Classes, SysUtils;
 
-```objectpascal
-program ErrorHandling;
 var
-    number, divisor: integer;
-    result: real;
+  text: string = 'QILT Surveys';
+  filename :String = 'hello-text.txt';
+  fileStream: TFileStream;
+  size: longint;
+
 begin
-    try
-        write('Enter a number: ');
-        readln(number);
-        
-        write('Enter divisor: ');
-        readln(divisor);
-        
-        if divisor = 0 then
-            raise Exception.Create('Division by zero is not allowed');
-        
-        result := number / divisor;
-        writeln('Result: ', result:0:2);
-        
-    except
-        on E: Exception do
-        begin
-            writeln('Error occurred: ', E.Message);
-            writeln('Please try again with valid input.');
-        end;
-    end;
+  // Create a TFileStream object
+  fileStream := TFileStream.Create(filename, fmCreate);
+  try
+    // set position at the beginning of file
+    fileStream.Position := 0;
+    // Write text into the file
+    size := fileStream.Write(text[1], Length(text));
+    // Show confirmation
+    Writeln(Format('Created %s. %d bytes written.', [filename, size]));
+  finally
+    // Free TFileStream object
+    fileStream.Free;
+  end;
+
+  // Pause console
+  ReadLn;
 end.
 ```
 
-## Learning Path
-
-### Beginner (Week 1-2)
-1. **Setup Environment**: Install Free Pascal or Lazarus
-2. **Basic Syntax**: Variables, data types, input/output
-3. **Control Flow**: If statements, loops, case statements
-4. **Simple Programs**: Calculator, number guessing game
-
-### Intermediate (Week 3-4)
-1. **Procedures & Functions**: Modular programming
-2. **Arrays & Records**: Data organization
-3. **File Operations**: Reading and writing files
-4. **String Manipulation**: Text processing
-
-### Advanced (Week 5-8)
-1. **Object-Oriented Programming**: Classes and inheritance
-2. **Dynamic Memory**: Pointers and dynamic arrays
-3. **GUI Development**: Lazarus forms and controls
-4. **Database Connectivity**: Working with data
-
-## Practice Projects
-
-### Beginner Projects
-- **Simple Calculator**: Basic arithmetic operations
-- **Grade Calculator**: Average grades with letter grades
-- **Number Guessing Game**: Random number generation
-- **Temperature Converter**: Celsius to Fahrenheit
-
-### Intermediate Projects
-- **Student Management System**: Records and file I/O
-- **Text File Analyzer**: Count words, lines, characters
-- **Simple Banking System**: Account management
-- **Inventory Tracker**: Product database
-
-### Advanced Projects
-- **GUI Calculator**: Lazarus-based calculator
-- **Database Application**: Student records with SQLite
-- **Game Development**: Simple 2D games
-- **Web Server**: Basic HTTP server implementation
 
 ## Common Mistakes to Avoid
 
@@ -361,33 +423,34 @@ end.
 ## Development Tools
 
 ### Free Pascal Compiler
+
 - **Cross-platform**: Windows, Linux, macOS, FreeBSD
 - **Command-line**: Compile with `fpc program.pas`
 - **Optimization**: Multiple optimization levels
-- **Debugging**: Built-in debugger support
 
 ### Lazarus IDE
+
 - **Visual Designer**: Drag-and-drop form creation
 - **Code Completion**: IntelliSense-like features
-- **Integrated Debugger**: Step-through debugging
 - **Package System**: Easy library management
 
 ### Text Editors
+
 - **VS Code**: Pascal extensions available
 - **Sublime Text**: Syntax highlighting
 - **Notepad++**: Simple Pascal support
 - **Vim/Emacs**: Advanced editor configurations
 
-## Getting Help
+## When You're Stuck
 
-### When You're Stuck
 1. **Read error messages carefully** - they usually point to the problem
 2. **Check syntax** - missing semicolons, brackets, or keywords
 3. **Use writeln for debugging** - print variable values
 4. **Break down complex problems** - solve step by step
 5. **Ask for help** - community forums and Discord
 
-### Debugging Tips
+## Debugging Tips
+
 ```objectpascal
 { Add debug output }
 writeln('Debug: Variable x = ', x);
@@ -402,5 +465,3 @@ var
 { Calculate compound interest using formula: A = P(1 + r)^t }
 result := principal * Power(1 + rate, years);
 ```
-
-Ready to start coding? [Join our community](/community/) for help and support!
diff --git a/hugo.toml b/hugo.toml
index da0fd1e..ea45f3c 100644
--- a/hugo.toml
+++ b/hugo.toml
@@ -6,6 +6,9 @@ title = 'Object Pascal - Readable, Reliable Programming'
 # theme = 'ananke'
 
 [markup]
+  [markup.goldmark]
+    [markup.goldmark.renderer]
+      unsafe = true
   [markup.highlight]
     style = 'catppuccin-frappe'
     lineNos = true
diff --git a/layouts/_default/single-with-sidebar.html b/layouts/_default/single-with-sidebar.html
new file mode 100644
index 0000000..a7abdc1
--- /dev/null
+++ b/layouts/_default/single-with-sidebar.html
@@ -0,0 +1,401 @@
+{{ define "main" }}
+<div class="content-with-sidebar">
+    <div class="container">
+        <div class="sidebar-layout">
+            <!-- Table of Contents Sidebar -->
+            <aside class="toc-sidebar">
+                <div class="toc-header">
+                    <h3>Table of Contents</h3>
+                </div>
+                <nav class="toc-nav" id="toc-nav">
+                    <!-- TOC will be generated by JavaScript -->
+                </nav>
+            </aside>
+            
+            <!-- Main Content -->
+            <article class="main-content">
+                <header class="article-header">
+                    <h1>{{ .Title }}</h1>
+                    {{ if .Date }}
+                    <time datetime="{{ .Date.Format "2006-01-02" }}" class="article-date">
+                        {{ .Date.Format "January 2, 2006" }}
+                    </time>
+                    {{ end }}
+                </header>
+                
+                <div class="article-content">
+                    {{ .Content }}
+                </div>
+                
+                {{ if .Params.tags }}
+                <div class="article-tags">
+                    <strong>Tags:</strong>
+                    {{ range .Params.tags }}
+                    <span class="tag">{{ . }}</span>
+                    {{ end }}
+                </div>
+                {{ end }}
+            </article>
+        </div>
+    </div>
+</div>
+
+<style>
+.content-with-sidebar {
+    padding: var(--spacing-xl) 0;
+}
+
+.sidebar-layout {
+    display: grid;
+    grid-template-columns: 280px 1fr;
+    gap: var(--spacing-2xl);
+    max-width: 1200px;
+    margin: 0 auto;
+}
+
+/* Table of Contents Sidebar */
+.toc-sidebar {
+    position: sticky;
+    top: 100px;
+    height: fit-content;
+    background: var(--bg-secondary);
+    border-radius: 12px;
+    padding: var(--spacing-lg);
+    border: 1px solid var(--border-color);
+}
+
+.toc-header h3 {
+    margin: 0 0 var(--spacing-md) 0;
+    color: var(--text-primary);
+    font-size: 1.1rem;
+    font-weight: 600;
+}
+
+.toc-nav {
+    max-height: 70vh;
+    overflow-y: auto;
+}
+
+.toc-nav ul {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+
+.toc-nav li {
+    margin: 0;
+}
+
+.toc-nav a {
+    display: block;
+    padding: var(--spacing-xs) var(--spacing-sm);
+    color: var(--text-secondary);
+    text-decoration: none;
+    border-radius: 6px;
+    font-size: 0.9rem;
+    line-height: 1.4;
+    transition: all 0.2s ease;
+}
+
+.toc-nav a:hover {
+    background: var(--accent-primary);
+    color: var(--bg-primary);
+}
+
+.toc-nav a.active {
+    background: var(--accent-primary);
+    color: var(--bg-primary);
+    font-weight: 500;
+}
+
+/* Nested TOC items */
+.toc-nav ul ul {
+    margin-left: var(--spacing-md);
+}
+
+.toc-nav ul ul a {
+    font-size: 0.85rem;
+    color: var(--text-muted);
+}
+
+/* Main Content */
+.main-content {
+    min-width: 0; /* Prevents grid overflow */
+}
+
+.article-header {
+    margin-bottom: var(--spacing-2xl);
+    padding-bottom: var(--spacing-lg);
+    border-bottom: 1px solid var(--border-color);
+}
+
+.article-header h1 {
+    margin: 0 0 var(--spacing-sm) 0;
+    color: var(--text-primary);
+}
+
+.article-date {
+    color: var(--text-muted);
+    font-size: 0.9rem;
+}
+
+.article-content {
+    line-height: 1.7;
+}
+
+.article-content h2,
+.article-content h3,
+.article-content h4 {
+    margin-top: var(--spacing-xl);
+    margin-bottom: var(--spacing-md);
+    scroll-margin-top: 120px; /* Account for sticky header */
+}
+
+.article-content h2 {
+    color: var(--text-primary);
+    font-size: 1.8rem;
+    font-weight: 600;
+}
+
+.article-content h3 {
+    color: var(--text-primary);
+    font-size: 1.4rem;
+    font-weight: 600;
+}
+
+.article-content h4 {
+    color: var(--text-primary);
+    font-size: 1.2rem;
+    font-weight: 600;
+}
+
+.article-tags {
+    margin-top: var(--spacing-2xl);
+    padding-top: var(--spacing-lg);
+    border-top: 1px solid var(--border-color);
+}
+
+.tag {
+    display: inline-block;
+    background: var(--accent-primary);
+    color: var(--bg-primary);
+    padding: var(--spacing-xs) var(--spacing-sm);
+    border-radius: 4px;
+    font-size: 0.8rem;
+    margin-right: var(--spacing-xs);
+}
+
+/* Mobile Responsive */
+@media (max-width: 768px) {
+    .sidebar-layout {
+        grid-template-columns: 1fr;
+        gap: var(--spacing-lg);
+    }
+    
+    .toc-sidebar {
+        position: static;
+        order: 2;
+        margin-top: var(--spacing-lg);
+    }
+    
+    .main-content {
+        order: 1;
+    }
+}
+
+/* Installation Cards */
+.installation-cards {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: var(--spacing-lg);
+    margin: var(--spacing-xl) 0;
+}
+
+.install-card {
+    background: var(--bg-secondary);
+    border: 1px solid var(--border-color);
+    border-radius: 12px;
+    padding: var(--spacing-lg);
+    transition: all 0.3s ease;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+
+.install-card:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
+    border-color: var(--accent-primary);
+}
+
+.card-header h4 {
+    margin: 0 0 var(--spacing-xs) 0;
+    color: var(--text-primary);
+    font-size: 1.2rem;
+    font-weight: 600;
+}
+
+.card-subtitle {
+    margin: 0 0 var(--spacing-md) 0;
+    color: var(--text-muted);
+    font-size: 0.9rem;
+    font-style: italic;
+}
+
+.card-content ul {
+    list-style: none;
+    padding: 0;
+    margin: 0 0 var(--spacing-lg) 0;
+}
+
+.card-content li {
+    padding: var(--spacing-xs) 0;
+    color: var(--text-secondary);
+    position: relative;
+    padding-left: var(--spacing-md);
+}
+
+.card-content li:before {
+    content: '✓';
+    position: absolute;
+    left: 0;
+    color: var(--accent-primary);
+    font-weight: bold;
+}
+
+.install-btn {
+    display: inline-block;
+    padding: var(--spacing-sm) var(--spacing-lg);
+    border-radius: 8px;
+    text-decoration: none;
+    font-weight: 600;
+    text-align: center;
+    transition: all 0.2s ease;
+    border: 2px solid transparent;
+    width: 100%;
+    box-sizing: border-box;
+}
+
+.install-btn.primary {
+    background: var(--accent-primary);
+    color: var(--bg-primary);
+}
+
+.install-btn.primary:hover {
+    background: transparent;
+    border-color: var(--accent-primary);
+    color: var(--accent-primary);
+}
+
+.install-btn.secondary {
+    background: transparent;
+    border-color: var(--accent-primary);
+    color: var(--accent-primary);
+}
+
+.install-btn.secondary:hover {
+    background: var(--accent-primary);
+    color: var(--bg-primary);
+}
+
+/* Mobile responsive for installation cards */
+@media (max-width: 768px) {
+    .installation-cards {
+        grid-template-columns: 1fr;
+        gap: var(--spacing-md);
+    }
+}
+
+/* Smooth scrolling */
+html {
+    scroll-behavior: smooth;
+}
+</style>
+
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+    generateTableOfContents();
+    setupScrollSpy();
+});
+
+function generateTableOfContents() {
+    const tocNav = document.getElementById('toc-nav');
+    const headings = document.querySelectorAll('.article-content h2, .article-content h3, .article-content h4');
+    
+    if (headings.length === 0) return;
+    
+    const tocList = document.createElement('ul');
+    let currentLevel = 2;
+    let currentList = tocList;
+    const listStack = [tocList];
+    
+    headings.forEach((heading, index) => {
+        // Create ID if it doesn't exist
+        if (!heading.id) {
+            heading.id = 'heading-' + index;
+        }
+        
+        const level = parseInt(heading.tagName.charAt(1));
+        const listItem = document.createElement('li');
+        const link = document.createElement('a');
+        
+        link.href = '#' + heading.id;
+        link.textContent = heading.textContent;
+        link.addEventListener('click', function(e) {
+            e.preventDefault();
+            document.getElementById(heading.id).scrollIntoView({
+                behavior: 'smooth',
+                block: 'start'
+            });
+        });
+        
+        listItem.appendChild(link);
+        
+        // Handle nesting
+        if (level > currentLevel) {
+            const newList = document.createElement('ul');
+            const lastItem = currentList.lastElementChild;
+            if (lastItem) {
+                lastItem.appendChild(newList);
+            }
+            currentList = newList;
+            listStack.push(newList);
+        } else if (level < currentLevel) {
+            for (let i = currentLevel; i > level; i--) {
+                listStack.pop();
+                currentList = listStack[listStack.length - 1];
+            }
+        }
+        
+        currentList.appendChild(listItem);
+        currentLevel = level;
+    });
+    
+    tocNav.appendChild(tocList);
+}
+
+function setupScrollSpy() {
+    const headings = document.querySelectorAll('.article-content h2, .article-content h3, .article-content h4');
+    const tocLinks = document.querySelectorAll('.toc-nav a');
+    
+    if (headings.length === 0) return;
+    
+    const observer = new IntersectionObserver((entries) => {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                // Remove active class from all links
+                tocLinks.forEach(link => link.classList.remove('active'));
+                
+                // Add active class to current link
+                const activeLink = document.querySelector(`.toc-nav a[href="#${entry.target.id}"]`);
+                if (activeLink) {
+                    activeLink.classList.add('active');
+                }
+            }
+        });
+    }, {
+        rootMargin: '-100px 0px -50% 0px'
+    });
+    
+    headings.forEach(heading => observer.observe(heading));
+}
+</script>
+{{ end }}
diff --git a/layouts/index.html b/layouts/index.html
index b3cba1d..d91c732 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -4,7 +4,7 @@
     <div class="container">
         <div class="hero-content">
             <div class="hero-text">
-                <h1>Object Pascal</h1>
+                <h1>Pascal</h1>
                 <p class="hero-subtitle">Build readable, fast and reliable software.</p>
                 <div class="hero-actions">
                     <a href="{{ "/learn/" | relURL }}" class="hero-cta primary">Get Started</a>
@@ -141,7 +141,7 @@ <h1>Object Pascal</h1>
                     <div class="code-example" id="example-sqlite">
                         {{ $sqliteCode := `program sqlite;
 
-{$mode objfpc}{$H+}
+{$mode objfpc}{$H+}{$J-}
 
 uses
   SysUtils, sqldb, sqlite3conn;
diff --git a/static/css/main.css b/static/css/main.css
index 07d6d9a..a00103b 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -256,6 +256,8 @@ a:hover {
 .code-examples {
   position: relative;
   height: 420px; /* Fixed height to prevent layout shifts */
+  width: 100%; /* Fixed width to prevent layout shifts */
+  overflow: hidden;
 }
 
 .code-example {
@@ -265,6 +267,7 @@ a:hover {
   left: 0;
   right: 0;
   height: 100%;
+  width: 100%; /* Ensure consistent width */
 }
 
 .code-example.active {
@@ -280,7 +283,7 @@ a:hover {
 }
 
 .hero-code pre {
-  padding: var(--spacing-lg);
+  padding: var(--spacing-md);
   font-size: 0.75rem;
   line-height: 1.4;
   height: 100%;
@@ -425,7 +428,7 @@ a:hover {
 
 pre {
   background-color: var(--code-bg);
-  padding: var(--spacing-lg);
+  padding: var(--spacing-md);
   overflow-x: auto;
   font-family: var(--font-mono);
   font-size: 1rem;
@@ -550,3 +553,95 @@ pre code {
     padding: var(--spacing-lg);
   }
 }
+
+/* Table styling */
+table {
+  width: 100%;
+  border-collapse: collapse;
+  margin: var(--spacing-lg) 0;
+  background-color: var(--bg-primary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--border-radius);
+  overflow: hidden;
+  box-shadow: 0 2px 4px var(--shadow);
+}
+
+table thead {
+  background-color: var(--bg-secondary);
+}
+
+table th {
+  padding: var(--spacing-md) var(--spacing-lg);
+  text-align: left;
+  font-weight: 600;
+  color: var(--text-primary);
+  border-bottom: 2px solid var(--border-color);
+  font-size: 0.95rem;
+}
+
+table td {
+  padding: var(--spacing-md) var(--spacing-lg);
+  border-bottom: 1px solid var(--border-color);
+  color: var(--text-secondary);
+  vertical-align: top;
+}
+
+table tbody tr:hover {
+  background-color: var(--bg-secondary);
+  transition: var(--transition);
+}
+
+table tbody tr:last-child td {
+  border-bottom: none;
+}
+
+/* Table responsive design */
+@media (max-width: 768px) {
+  table {
+    font-size: 0.9rem;
+  }
+  
+  table th,
+  table td {
+    padding: var(--spacing-sm) var(--spacing-md);
+  }
+  
+  /* Stack table on very small screens */
+  @media (max-width: 480px) {
+    table, thead, tbody, th, td, tr {
+      display: block;
+    }
+    
+    table thead tr {
+      position: absolute;
+      top: -9999px;
+      left: -9999px;
+    }
+    
+    table tr {
+      border: 1px solid var(--border-color);
+      margin-bottom: var(--spacing-md);
+      border-radius: var(--border-radius);
+      background-color: var(--bg-primary);
+    }
+    
+    table td {
+      border: none;
+      position: relative;
+      padding-left: 50% !important;
+      padding-top: var(--spacing-sm);
+      padding-bottom: var(--spacing-sm);
+    }
+    
+    table td:before {
+      content: attr(data-label) ": ";
+      position: absolute;
+      left: var(--spacing-md);
+      width: 45%;
+      padding-right: var(--spacing-sm);
+      white-space: nowrap;
+      font-weight: 600;
+      color: var(--text-primary);
+    }
+  }
+}

From 323d70c086e77b0034aae9d6e4129b1c07b5e841 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Wed, 6 Aug 2025 21:14:14 +1000
Subject: [PATCH 14/27] feat: created capsule for pascal dialect indicator

---
 content/about/_index.md |  2 +-
 content/docs/_index.md  | 42 ++++++++++++++++++++---------------------
 content/learn/_index.md | 24 +++++++++++------------
 layouts/index.html      | 14 +++++++-------
 static/css/main.css     | 18 ++++++++++++++++++
 5 files changed, 59 insertions(+), 41 deletions(-)

diff --git a/content/about/_index.md b/content/about/_index.md
index 2b1cd13..0a91c05 100644
--- a/content/about/_index.md
+++ b/content/about/_index.md
@@ -18,7 +18,7 @@ Wirth believed that a programming language should provide a clear conceptual fra
 ### Readability Above All
 Pascal's English-like syntax makes code self-documenting. When you read Pascal code, you understand not just *what* the program does, but *why* it does it. This clarity reduces bugs, simplifies maintenance, and makes collaboration natural.
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program CalculateAverage;
 var
   numbers: array[1..10] of real;
diff --git a/content/docs/_index.md b/content/docs/_index.md
index 17ca7d0..cd903ad 100644
--- a/content/docs/_index.md
+++ b/content/docs/_index.md
@@ -14,7 +14,7 @@ Comprehensive guides and references for Pascal programming.
 
 Pascal uses a clear, structured syntax that emphasizes readability:
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program ExampleProgram;
 
 const
@@ -63,7 +63,7 @@ end.
 
 **Structured Types:**
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 { Arrays }
 type
     TScores = array[1..10] of integer;
@@ -87,7 +87,7 @@ type
 
 ### File Operations
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program FileExample;
 var
     inputFile, outputFile: text;
@@ -114,7 +114,7 @@ end.
 
 ### Dynamic Arrays
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program DynamicArrayExample;
 type
     TIntArray = array of integer;
@@ -146,7 +146,7 @@ end.
 
 ### Object-Oriented Programming
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program OOPExample;
 
 type
@@ -214,14 +214,14 @@ end.
 ### Code Style
 
 1. **Use meaningful names:**
-   ```objectpascal
+   ```objectpascal {class="highlight capsule-fpc"}
    var
        studentCount: integer;    // Good
        sc: integer;              // Avoid
    ```
 
 2. **Consistent indentation:**
-   ```objectpascal
+   ```objectpascal {class="highlight capsule-fpc"}
    if condition then
    begin
        statement1;
@@ -230,7 +230,7 @@ end.
    ```
 
 3. **Comment your code:**
-   ```objectpascal
+   ```objectpascal {class="highlight capsule-fpc"}
    { Calculate compound interest }
    function CompoundInterest(principal, rate: real; years: integer): real;
    begin
@@ -240,7 +240,7 @@ end.
 
 ### Error Handling
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program ErrorHandlingExample;
 var
     number, divisor: integer;
@@ -298,7 +298,7 @@ end.
 The System unit is automatically included and provides core functionality:
 
 **Memory Management:**
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 { Dynamic memory allocation }
 var
     ptr: ^integer;
@@ -311,7 +311,7 @@ end;
 ```
 
 **String Functions:**
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program StringFunctions;
 var
     text: string;
@@ -334,7 +334,7 @@ end.
 
 Provides extended system utilities:
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 uses SysUtils;
 
 program SysUtilsExample;
@@ -364,7 +364,7 @@ end.
 
 Mathematical functions and constants:
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 uses Math;
 
 program MathExample;
@@ -391,7 +391,7 @@ end.
 
 ### Generic Programming
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program GenericExample;
 
 {$mode objfpc}
@@ -462,7 +462,7 @@ end.
 
 ### Interface Programming
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program InterfaceExample;
 
 {$mode objfpc}
@@ -551,7 +551,7 @@ end.
 
 ### Multi-threading
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program ThreadExample;
 
 {$mode objfpc}
@@ -613,7 +613,7 @@ end.
 
 ### SQLite Integration
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program DatabaseExample;
 
 {$mode objfpc}
@@ -684,7 +684,7 @@ end.
 
 ### Basic Form Application
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 unit MainForm;
 
 {$mode objfpc}{$H+}
@@ -738,7 +738,7 @@ end.
 
 ### Memory Management Tips
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program PerformanceExample;
 
 type
@@ -778,7 +778,7 @@ end.
 
 ### Compiler Directives
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program CompilerDirectives;
 
 {$mode objfpc}          // Object Pascal mode
@@ -814,7 +814,7 @@ end.
 
 ### Unit Testing Framework
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program TestExample;
 
 {$mode objfpc}
diff --git a/content/learn/_index.md b/content/learn/_index.md
index d90d877..0910b60 100644
--- a/content/learn/_index.md
+++ b/content/learn/_index.md
@@ -23,7 +23,7 @@ Choose your Pascal development environment:
 
 Create a new file called `hello.pas`:
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program HelloWorld;
 begin
     writeln('Hello, Pascal!');
@@ -44,7 +44,7 @@ fpc hello.pas
 
 Every Pascal program follows this basic structure:
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"} {wrapper="highlight capsule-fpc"}
 program ProgramName;
 
 { Constant declarations }
@@ -87,7 +87,7 @@ end.
 
 Pascal has strong typing with these fundamental and practical types:
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 var
   // Integer types
   age: integer;              // -2,147,483,648 to 2,147,483,647
@@ -134,7 +134,7 @@ var
 
 **Conditional Statements:**
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 if age >= 18 then
   writeln('You are an adult')
 else
@@ -150,7 +150,7 @@ end;
 
 **Loops:**
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 { For loop - counting up }
 for i := 1 to 10 do
   writeln('Number: ', i);
@@ -230,7 +230,7 @@ end;
 
 ### Procedures
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 procedure greetUser(name: string);
 begin
   writeln('Hello, ', name, '!');
@@ -245,7 +245,7 @@ end.
 
 ### Functions
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 function calculateArea(radius: real): real;
 begin
   calculateArea := 3.14159 * radius * radius;
@@ -280,7 +280,7 @@ end.
 ### Arrays and Data Structures
 
 **Static Arrays:**
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program ArrayExample;
 var
   scores: array[1..5] of integer;
@@ -303,7 +303,7 @@ end.
 ```
 
 **Records (Structures):**
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program RecordExample;
 type
   TStudent = record
@@ -333,7 +333,7 @@ end.
 ### File Input/Output
 
 **Reading from Files:**
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program ReadFile;
 
 uses
@@ -379,7 +379,7 @@ end.
 ```
 
 **Writing to Files:**
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 program NewTextFile;
 
 uses
@@ -451,7 +451,7 @@ end.
 
 ## Debugging Tips
 
-```objectpascal
+```objectpascal {class="highlight capsule-fpc"}
 { Add debug output }
 writeln('Debug: Variable x = ', x);
 writeln('Debug: Entering function Calculate');
diff --git a/layouts/index.html b/layouts/index.html
index d91c732..8638042 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -48,7 +48,7 @@ <h1>Pascal</h1>
 
   Application.Run;
 end.` }}
-                        {{ highlight $webserverCode "objectpascal" "linenos=false" }}
+<div class="highlight capsule-fpc">{{ highlight $webserverCode "objectpascal" "linenos=false"}}</div>
                     </div>
                     
                     <div class="code-example" id="example-sorting">
@@ -78,7 +78,7 @@ <h1>Pascal</h1>
     Numbers.Free;
   end;
 end.` }}
-                        {{ highlight $sortingCode "objectpascal" "linenos=false" }}
+<div class="highlight capsule-fpc">{{ highlight $sortingCode "objectpascal" "linenos=false"}}</div>
                     </div>
                     
                     <div class="code-example" id="example-json">
@@ -99,7 +99,7 @@ <h1>Pascal</h1>
     JSON.Free;
   end;
 end.` }}
-                        {{ highlight $jsonCode "objectpascal" "linenos=false" }}
+<div class="highlight capsule-fpc">{{ highlight $jsonCode "objectpascal" "linenos=false"}}</div>
                     </div>
                     
                     <div class="code-example" id="example-filestream">
@@ -135,7 +135,7 @@ <h1>Pascal</h1>
      FileStream.Free;
    end;
  end.` }}
-                        {{ highlight $filestreamCode "objectpascal" "linenos=false" }}
+<div class="highlight capsule-fpc">{{ highlight $filestreamCode "objectpascal" "linenos=false"}}</div>
                     </div>
                     
                     <div class="code-example" id="example-sqlite">
@@ -180,7 +180,7 @@ <h1>Pascal</h1>
     Conn.Free;
   end;
 end.` }}
-                        {{ highlight $sqliteCode "objectpascal" "linenos=false" }}
+<div class="highlight capsule-fpc">{{ highlight $sqliteCode "objectpascal" "linenos=false"}}</div>
                     </div>
                     
                     <div class="code-example" id="example-csv">
@@ -217,7 +217,7 @@ <h1>Pascal</h1>
     CSV.Free;
   end;
 end.` }}
-                        {{ highlight $csvCode "objectpascal" "linenos=false" }}
+<div class="highlight capsule-fpc">{{ highlight $csvCode "objectpascal" "linenos=false"}}</div>
                     </div>
                     
                     <div class="code-example" id="example-concurrent">
@@ -276,7 +276,7 @@ <h1>Pascal</h1>
 end.
 
 ` }}
-                        {{ highlight $concurrentCode "objectpascal" "linenos=false" }}
+<div class="highlight capsule-fpc">{{ highlight $concurrentCode "objectpascal" "linenos=false"}}</div>
                     </div>
                 </div>
             </div>
diff --git a/static/css/main.css b/static/css/main.css
index a00103b..ced9a97 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -424,6 +424,24 @@ a:hover {
   overflow: hidden;
   border: 1px solid var(--border-color);
   box-shadow: 0 2px 4px var(--shadow);
+  position: relative;
+}
+
+/* Pascal compatibility capsule */
+.highlight.capsule-fpc::before {
+  content: 'FPC';
+  position: absolute;
+  top: var(--spacing-sm);
+  right: var(--spacing-sm);
+  background-color: var(--accent-primary);
+  color: white;
+  padding: 0.25rem 0.5rem;
+  border-radius: 12px;
+  font-size: 0.75rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  z-index: 10;
 }
 
 pre {

From 1826fc5346a3567fb5a9b293f4ae001ef04a0c2a Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Wed, 6 Aug 2025 21:25:41 +1000
Subject: [PATCH 15/27] feat: created style for bullet points, and added
 sidebars to all pages.

---
 content/about/_index.md     |  3 +--
 content/community/_index.md |  2 +-
 content/docs/_index.md      |  2 +-
 static/css/main.css         | 33 +++++++++++++++++++++++++++++++++
 4 files changed, 36 insertions(+), 4 deletions(-)

diff --git a/content/about/_index.md b/content/about/_index.md
index 0a91c05..4ecf5c0 100644
--- a/content/about/_index.md
+++ b/content/about/_index.md
@@ -1,10 +1,9 @@
 ---
 title: "About Pascal"
 description: "Learn about Pascal's philosophy, history, and the various implementations available today"
+layout: 'single-with-sidebar'
 ---
 
-# About Pascal
-
 Pascal is a programming language that embodies the principles of clarity, reliability, and educational excellence. Created by Niklaus Wirth in 1970, Pascal was designed to encourage good programming practices and make programming concepts accessible to learners while remaining powerful enough for professional software development.
 
 ## The Philosophy of Pascal
diff --git a/content/community/_index.md b/content/community/_index.md
index bbc949e..8a49902 100644
--- a/content/community/_index.md
+++ b/content/community/_index.md
@@ -2,9 +2,9 @@
 title = 'Community'
 date = 2024-05-30T18:56:05+03:00
 draft = false
+layout = 'single-with-sidebar'
 +++
 
-# Pascal Community
 
 Join the vibrant Pascal programming community! Connect with developers, share knowledge, and contribute to the Pascal ecosystem.
 
diff --git a/content/docs/_index.md b/content/docs/_index.md
index cd903ad..4964293 100644
--- a/content/docs/_index.md
+++ b/content/docs/_index.md
@@ -2,9 +2,9 @@
 title = 'Documentation'
 date = 2024-05-30T18:56:05+03:00
 draft = false
+layout = 'single-with-sidebar'
 +++
 
-# Pascal Documentation
 
 Comprehensive guides and references for Pascal programming.
 
diff --git a/static/css/main.css b/static/css/main.css
index ced9a97..90fa0a4 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -467,6 +467,39 @@ pre code {
   padding: 0;
 }
 
+/* Lists in main content */
+.article-content ul,
+.main-content ul {
+  list-style-type: disc;
+  margin: var(--spacing-md) 0;
+  padding-left: var(--spacing-xl);
+}
+
+.article-content ol,
+.main-content ol {
+  list-style-type: decimal;
+  margin: var(--spacing-md) 0;
+  padding-left: var(--spacing-xl);
+}
+
+.article-content li,
+.main-content li {
+  margin: var(--spacing-xs) 0;
+  line-height: 1.6;
+}
+
+.article-content ul ul,
+.main-content ul ul {
+  margin: var(--spacing-xs) 0;
+  padding-left: var(--spacing-lg);
+}
+
+.article-content ol ol,
+.main-content ol ol {
+  margin: var(--spacing-xs) 0;
+  padding-left: var(--spacing-lg);
+}
+
 /* Footer */
 .site-footer {
   background-color: var(--bg-secondary);

From c2f91ba132fb35fbb17eae5ecab1e25547d1d795 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Thu, 7 Aug 2025 08:35:04 +1000
Subject: [PATCH 16/27] feat: added major implementation to the home page,
 revised major implementations.

---
 content/about/_index.md | 41 +++++++++++++++++++++++++++++++----------
 layouts/index.html      |  3 ++-
 static/css/main.css     | 12 ++++++++++--
 3 files changed, 43 insertions(+), 13 deletions(-)

diff --git a/content/about/_index.md b/content/about/_index.md
index 4ecf5c0..df5c595 100644
--- a/content/about/_index.md
+++ b/content/about/_index.md
@@ -62,10 +62,40 @@ Modern Object Pascal supports:
 - **Rich ecosystems** - Comprehensive libraries and frameworks
 - **Visual development** - Integrated designers and RAD tools
 
-## Other Implementations of Pascal
+## Major Implementations of Pascal
 
 Pascal, as a language family, has numerous implementations beyond the mainstream options. Each brings unique strengths and targets specific development scenarios:
 
+### Free Pascal Compiler (FPC)
+[Free Pascal](https://www.freepascal.org/) is a mature, open-source Pascal compiler that supports multiple processor architectures and operating systems. It's the most widely used open-source Pascal compiler, compatible with Turbo Pascal and Delphi syntax while adding many modern features.
+
+**Key Features:**
+- Cross-platform support (Windows, Linux, macOS, and more)
+- Multiple processor architectures (x86, x86_64, ARM, and others)
+- Highly compatible with Delphi and Turbo Pascal
+- Large standard library and third-party ecosystem
+- Active open-source development and community support
+
+### Lazarus IDE (FPC + GUI Designer)
+[Lazarus](https://www.lazarus-ide.org/) is a professional open-source development environment for the Free Pascal Compiler. It provides a Delphi-like development experience with a visual form designer and a rich set of visual components.
+
+**Key Features:**
+- Cross-platform IDE (Windows, Linux, macOS, and more)
+- Visual form designer with drag-and-drop interface
+- Large collection of visual and non-visual components
+- Integrated debugger and code tools
+- Single source code base for multiple platforms
+
+### Delphi (Embarcadero)
+[Delphi](https://www.embarcadero.com/products/delphi) is a commercial rapid application development (RAD) environment that uses Object Pascal as its primary programming language. Originally developed by Borland, it remains one of the most powerful Pascal implementations with a strong focus on visual development.
+
+**Key Features:**
+- Visual Component Library (VCL) for Windows development
+- FireMonkey framework for cross-platform applications
+- Integrated Development Environment (IDE) with form designer
+- Strong database connectivity and enterprise features
+- Support for mobile platforms (iOS, Android) and desktop (Windows, macOS, Linux)
+
 ### Oxygene (Elements Compiler)
 [Oxygene](https://www.elementscompiler.com/elements/oxygene/) is a modern Object Pascal implementation that compiles to .NET, Java, and native code. Developed by RemObjects Software, Oxygene brings Pascal's clarity to contemporary platforms while adding cutting-edge language features.
 
@@ -94,15 +124,6 @@ Pascal, as a language family, has numerous implementations beyond the mainstream
 - Node.js support for server-side development
 - Active development and community support
 
-### GNU Pascal (GPC)
-[GNU Pascal](https://www.gnu-pascal.de/gpc/h-index.html) is part of the GNU Compiler Collection, providing a free Pascal compiler that aims for ISO Pascal compatibility while adding useful extensions.
-
-**Key Features:**
-- ISO Pascal standard compliance
-- GNU/Linux and Unix platform support
-- Integration with GNU development tools
-- Free and open source
-
 ### Turbo51
 [Turbo51](https://turbo51.com/) is a Pascal compiler specifically designed for 8051 microcontrollers, bringing Pascal's structured approach to embedded systems development.
 
diff --git a/layouts/index.html b/layouts/index.html
index 8638042..6ac08f4 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -6,11 +6,12 @@
             <div class="hero-text">
                 <h1>Pascal</h1>
                 <p class="hero-subtitle">Build readable, fast and reliable software.</p>
+                <p class="hero-ecosystem">With Free Pascal Compiler (FPC), Delphi, PascalABC.Net, and more.</p>
                 <div class="hero-actions">
                     <a href="{{ "/learn/" | relURL }}" class="hero-cta primary">Get Started</a>
                     <a href="{{ "/docs/" | relURL }}" class="hero-cta secondary">Documentation</a>
                 </div>
-                <p class="version-info">Latest: Free Pascal 3.2.2 • Lazarus 4.2</p>
+                <!-- <p class="version-info">Latest: Free Pascal 3.2.2 • Lazarus 4.2</p> -->
             </div>
             <div class="hero-code">
                 <div class="code-selector">
diff --git a/static/css/main.css b/static/css/main.css
index 90fa0a4..b02d79c 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -209,9 +209,17 @@ a:hover {
 
 .hero-subtitle {
   font-size: 1.5rem;
-  margin-bottom: var(--spacing-xl);
+  margin-bottom: var(--spacing-sm);
   color: var(--text-secondary);
-  line-height: 1.4;
+  line-height: 1.6;
+}
+
+.hero-ecosystem {
+  font-size: 1.10rem;
+  margin-bottom: var(--spacing-xl);
+  color: var(--text-muted);
+  line-height: 1.6;
+  font-weight: light;
 }
 
 .hero-code {

From 19003002d00e5748e364ef1d249bec1dff3d8fb8 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Thu, 7 Aug 2025 12:38:53 +1000
Subject: [PATCH 17/27] feat: Edits to pages

---
 content/about/_index.md     |   4 +-
 content/community/_index.md | 352 +++-------------------
 content/learn/_index.md     | 580 +++++++++++++++++++++++++++++++-----
 static/css/main.css         |   9 +-
 4 files changed, 556 insertions(+), 389 deletions(-)

diff --git a/content/about/_index.md b/content/about/_index.md
index df5c595..d6736bc 100644
--- a/content/about/_index.md
+++ b/content/about/_index.md
@@ -58,9 +58,9 @@ Object Pascal extends Pascal's clarity into the world of object-oriented program
 Modern Object Pascal supports:
 
 - **Cross-platform development** - Write once, deploy everywhere
-- **Modern language features** - Generics, RTTI, anonymous methods (in the  _trunk_ branch)
+- **Modern language features** - Generics, RTTI, anonymous methods (FPC: in the  _trunk_ branch)
 - **Rich ecosystems** - Comprehensive libraries and frameworks
-- **Visual development** - Integrated designers and RAD tools
+- **Visual development** - Integrated designers and RAD tools (Lazarus IDE, Delphi PascalABC.Net)
 
 ## Major Implementations of Pascal
 
diff --git a/content/community/_index.md b/content/community/_index.md
index 8a49902..a8d9a9c 100644
--- a/content/community/_index.md
+++ b/content/community/_index.md
@@ -8,43 +8,37 @@ layout = 'single-with-sidebar'
 
 Join the vibrant Pascal programming community! Connect with developers, share knowledge, and contribute to the Pascal ecosystem.
 
-## Get Connected
+## Communities
 
-### 🗨️ Discussion Forums
+### Discussion Forums
 
-**Free Pascal Community**
-- Official Free Pascal forums
-- Technical discussions and support
-- [Visit Forum](https://forum.lazarus.freepascal.org/)
+**Community Forums**: 
 
-**Reddit Pascal Community**
-- r/Pascal - General Pascal discussions
-- r/FreePascal - Free Pascal specific
-- [Join on Reddit](https://reddit.com/r/pascal)
+- Join the [Free Pascal Forum](https://forum.lazarus.freepascal.org/)
 
-### 💬 Real-time Chat
+**Reddit Pascal Community** :
 
-**Discord Server**
-- Instant help and discussions
-- Code sharing and collaboration
-- Community events and challenges
-- [Join Discord](https://discord.gg/pascal) *(Coming Soon)*
+- Discuss at [r/pascal](https://reddit.com/r/pascal)
 
-**IRC Channels**
-- #freepascal on Libera.Chat
-- #lazarus on Libera.Chat
+### Real-time Chat
 
-### 📧 Mailing Lists
+**Discord**: 
+
+- Join the [Unofficial Pascal Programming Discord Server](https://discord.com/channels/570025060312547359/570025060312547361)
+
+### Mailing Lists
 
 **Free Pascal Lists**
-- fpc-announce: Release announcements
-- fpc-pascal: General Pascal discussions
-- fpc-devel: Development discussions
-- [Subscribe](https://lists.freepascal.org/)
+
+- Subscribe to [Mailing lists](https://www.freepascal.org/maillist.html)
+  - `fpc-announce`: Release announcements
+  - `fpc-devel`: Development discussions
+  - `fpc-pascal`: General Pascal discussions
+
 
 ## Open Source Projects
 
-### 🚀 Contribute to Pascal
+### Contribute to Pascal
 
 **Free Pascal Compiler**
 - Core compiler development
@@ -58,11 +52,9 @@ Join the vibrant Pascal programming community! Connect with developers, share kn
 - [GitLab Repository](https://gitlab.com/freepascal.org/lazarus/lazarus)
 
 **Pascal Libraries**
-- Synapse: Internet protocols
-- mORMot: ORM framework
-- Graphics32: 2D graphics library
+- Visit the latest list here: [Awesome Pascal](https://github.com/Fr0sT-Brutal/awesome-pascal)
 
-### 📚 Documentation Projects
+### Documentation Projects
 
 Help improve Pascal documentation:
 - Tutorial writing
@@ -72,7 +64,7 @@ Help improve Pascal documentation:
 
 ## Learning Resources
 
-### 🎓 Educational Content
+### Educational Content
 
 **Online Courses**
 - Pascal programming fundamentals
@@ -89,52 +81,30 @@ Help improve Pascal documentation:
 - "Lazarus Complete Guide"
 - "Object Pascal Handbook"
 
-### 💡 Code Examples
-
-**GitHub Collections**
-- [Pascal-Examples](https://github.com/ObjectPascal-Community/examples)
-- Algorithm implementations
-- Design pattern examples
-- Real-world applications
-
 ## Events and Meetups
 
-### 🏛️ Conferences
-
-**European Pascal Conference**
-- Annual gathering of Pascal developers
-- Technical presentations and workshops
-- Networking opportunities
+### Conferences
 
-**Local Meetups**
-- Check for Pascal groups in your area
-- Online meetups and code reviews
-- Lightning talks and presentations
+_...Coming soon..._
 
-### 🏆 Competitions
+### Competitions
 
-**Pascal Programming Contest**
-- Annual coding challenges
-- Educational and fun problems
-- Prizes and recognition
+_...Coming soon..._
 
-**Open Source Contributions**
-- Hacktoberfest participation
-- Bug fixes and feature additions
-- Documentation improvements
 
 ## Getting Help
 
-### ❓ Where to Ask Questions
+### Where to Ask Questions
 
 1. **Stack Overflow**: Tag your questions with `pascal`, `freepascal`, or `lazarus`
 2. **Forums**: Free Pascal and Lazarus official forums
-3. **Discord/IRC**: Real-time help from community members
+3. **Discord**: Real-time help from community members
 4. **GitHub Issues**: For specific library or tool problems
 
-### 📝 How to Ask Good Questions
+### How to Ask Good Questions
 
 **Include:**
+
 - Pascal/compiler version
 - Operating system
 - Complete error messages
@@ -142,6 +112,7 @@ Help improve Pascal documentation:
 - What you've already tried
 
 **Example:**
+
 ```
 Title: "Array index out of bounds error in Free Pascal 3.2.2"
 
@@ -162,7 +133,7 @@ I understand the error, but how can I prevent this at runtime?
 
 This website is open source and welcomes contributions!
 
-### 🛠️ How to Contribute
+### How to Contribute
 
 1. **Fork** the repository
 2. **Create** a new branch for your changes
@@ -170,7 +141,7 @@ This website is open source and welcomes contributions!
 4. **Test** your changes locally
 5. **Submit** a pull request
 
-### 📖 Content Guidelines
+### Content Guidelines
 
 - Write clear, beginner-friendly explanations
 - Include working code examples
@@ -178,9 +149,10 @@ This website is open source and welcomes contributions!
 - Follow the existing style and format
 - Add proper metadata to markdown files
 
-### 🐛 Report Issues
+### Report Issues
 
 Found a problem? Help us improve:
+
 - [Report bugs](https://github.com/ObjectPascal-Community/ObjectPascal-Community.github.io/issues)
 - Suggest new content
 - Fix typos and errors
@@ -196,30 +168,11 @@ Our community is welcoming and inclusive. We expect all members to:
 - **Give credit** where credit is due
 - **Follow** platform-specific rules and guidelines
 
-## Stay Updated
-
-### 📢 News and Announcements
-
-- Follow [@PascalLang](https://twitter.com/pascallang) on Twitter
-- Subscribe to our newsletter *(Coming Soon)*
-- Watch this repository for updates
-- Join our Discord for real-time updates
-
-### 🔔 Release Notifications
-
-Stay informed about:
-- Free Pascal compiler releases
-- Lazarus IDE updates
-- New library versions
-- Community project launches
-
 ---
 
-**Ready to join?** Pick a platform above and start connecting with fellow Pascal developers today!
-
 ## Featured Community Projects
 
-### 🚀 Active Open Source Projects
+### Active Open Source Projects
 
 **Free Pascal Compiler (FPC)**
 - **Description**: The core Free Pascal compiler and runtime library
@@ -261,7 +214,7 @@ Stay informed about:
 - **Repository**: [SourceForge - Synapse](https://sourceforge.net/projects/synalist/)
 - **Difficulty**: Intermediate
 
-### 📚 Community-Driven Documentation
+### Community-Driven Documentation
 
 **Pascal Wiki**
 - **Description**: Collaborative Pascal knowledge base
@@ -281,38 +234,8 @@ Stay informed about:
 - **Tools**: Standard translation tools and Git workflow
 - **Coordination**: Translation team leads for each language
 
-## Community Showcase
-
-### 🏆 Project Spotlight
-
-**This Month: PascalScript**
-- **Developer**: RemObjects Software
-- **Description**: Scripting engine that allows Pascal code to be executed at runtime
-- **Use cases**: Plugin systems, configuration scripts, embedded scripting
-- **Why it's cool**: Brings dynamic capabilities to Pascal applications
-- **Learn more**: [PascalScript Documentation](https://www.remobjects.com/ps.aspx)
-
-**Previous Spotlights:**
-- **Graphics32**: High-performance 2D graphics library
-- **Indy Project**: Internet protocol components
-- **LazReport**: Reporting system for Lazarus
-- **BGRABitmap**: Advanced bitmap manipulation library
-
-### 👥 Developer Profiles
 
-**Featured Developer: Mattias Gaertner**
-- **Role**: Lazarus IDE core developer
-- **Contributions**: IDE architecture, debugger integration, code tools
-- **Quote**: "Pascal's clarity makes complex IDE features manageable"
-- **Projects**: Lazarus IDE, CodeTools, FPC integration
-
-**Featured Developer: Arnaud Bouchez**
-- **Role**: mORMot framework creator
-- **Contributions**: High-performance ORM, SOA architecture
-- **Quote**: "Pascal's performance rivals C++ while maintaining readability"
-- **Projects**: mORMot, SynPDF, SynCrypto
-
-### 🎯 Success Stories
+### Success Stories
 
 **Commercial Applications**
 - **Skype**: Original client written in Object Pascal (Delphi)
@@ -323,201 +246,4 @@ Stay informed about:
 **Educational Institutions**
 - **Universities**: 50+ universities teaching Pascal worldwide
 - **Online Courses**: 10,000+ students learning Pascal annually
-- **Coding Competitions**: Pascal remains popular in programming contests
-
-## Learning Together
-
-### 📖 Study Groups
-
-**Beginner Study Group**
-- **Schedule**: Every Tuesday, 7 PM UTC
-- **Platform**: Discord voice channel
-- **Topics**: Basic syntax, control structures, simple programs
-- **Materials**: Shared exercises and solutions
-- **Mentor**: Rotating experienced community members
-
-**Advanced Topics Group**
-- **Schedule**: Every Friday, 8 PM UTC
-- **Platform**: Discord + screen sharing
-- **Topics**: OOP, generics, advanced memory management
-- **Format**: Code reviews and architectural discussions
-- **Prerequisites**: Comfortable with basic Pascal
-
-**GUI Development Workshop**
-- **Schedule**: Monthly, first Saturday
-- **Platform**: Lazarus IDE + Discord
-- **Topics**: Form design, event handling, custom components
-- **Projects**: Build real applications together
-- **Duration**: 3-hour sessions
-
-### 🏃‍♂️ Code Challenges
-
-**Weekly Coding Challenge**
-- **Day**: Every Monday
-- **Difficulty**: Rotating (Easy → Medium → Hard)
-- **Platform**: GitHub repository with submissions
-- **Prizes**: Community recognition, Pascal swag
-- **Examples**: Algorithm puzzles, data structure problems
-
-**Monthly Project Challenge**
-- **Theme**: Changes monthly (Games, Utilities, Libraries)
-- **Duration**: 4 weeks to complete
-- **Judging**: Community voting + expert review
-- **Categories**: Innovation, Code Quality, Documentation
-- **Prizes**: Featured on website, mentorship opportunities
-
-**Annual Hackathon**
-- **Event**: Pascal Global Hackathon
-- **Duration**: 48 hours
-- **Teams**: 2-4 people, global participation
-- **Themes**: Education, Open Source, Innovation
-- **Prizes**: Cash prizes, conference tickets, mentorship
-
-## Mentorship Program
-
-### 🎓 Become a Mentee
-
-**Application Process**
-1. **Submit Application**: Background, goals, time commitment
-2. **Skill Assessment**: Basic Pascal knowledge test
-3. **Matching**: Paired with compatible mentor
-4. **Kickoff Meeting**: Set goals and schedule
-5. **Regular Check-ins**: Weekly progress meetings
-
-**What You Get**
-- **One-on-one guidance** from experienced Pascal developer
-- **Code reviews** and architectural feedback
-- **Career advice** and industry insights
-- **Project collaboration** opportunities
-- **Community connections** and networking
-
-**Commitment**
-- **Duration**: 3-6 months
-- **Time**: 2-3 hours per week
-- **Activities**: Coding sessions, project work, discussions
-- **Goals**: Skill improvement, project completion, confidence building
-
-### 👨‍🏫 Become a Mentor
-
-**Requirements**
-- **Experience**: 2+ years professional Pascal development
-- **Skills**: Strong technical knowledge, teaching ability
-- **Time**: 3-4 hours per week availability
-- **Communication**: Good English, patient personality
-
-**Benefits**
-- **Give back** to the Pascal community
-- **Develop leadership** and teaching skills
-- **Stay current** with new Pascal developments
-- **Build network** of junior developers
-- **Recognition** in community and resume
-
-**Application Process**
-1. **Submit Profile**: Experience, specialties, availability
-2. **Interview**: Video call with program coordinators
-3. **Training**: Mentorship best practices workshop
-4. **Matching**: Paired with suitable mentee
-5. **Ongoing Support**: Regular mentor meetings and resources
-
-## Regional Communities
-
-### 🌍 Local User Groups
-
-**North America**
-- **Pascal Users Group - Silicon Valley**: Monthly meetups, tech talks
-- **Toronto Pascal Developers**: Quarterly workshops, networking
-- **Pascal Mexico**: Spanish-language community, tutorials
-
-**Europe**
-- **German Pascal Community**: Large active forum, annual conference
-- **French Pascal Users**: Monthly Paris meetups, online resources
-- **UK Pascal Society**: London meetups, university partnerships
-- **Scandinavian Pascal Group**: Nordic countries collaboration
-
-**Asia-Pacific**
-- **Japan Pascal Community**: Tokyo meetups, Japanese documentation
-- **Australian Pascal Users**: Sydney/Melbourne chapters
-- **Pascal India**: Growing community, educational focus
-
-**South America**
-- **Brazilian Pascal Community**: Large Portuguese-speaking group
-- **Argentina Pascal Developers**: Buenos Aires meetups
-
-### 📅 Upcoming Events
-
-**March 2024**
-- **15th**: Pascal Global Meetup (Online)
-- **22nd**: Lazarus GUI Workshop (Berlin)
-- **29th**: Free Pascal Compiler Deep Dive (Online)
-
-**April 2024**
-- **5th**: Pascal in Education Conference (Online)
-- **12th**: Game Development with Pascal (London)
-- **19th**: Database Programming Workshop (Online)
-- **26th**: Pascal Performance Optimization (San Francisco)
-
-**May 2024**
-- **3rd**: Annual Pascal Hackathon (Global, 48 hours)
-- **10th**: Mobile Development with Pascal (Online)
-- **17th**: Pascal Web Development (Amsterdam)
-- **24th**: Community Contributors Summit (Online)
-
-## Community Guidelines
-
-### 🤝 Code of Conduct
-
-**Our Values**
-- **Respect**: Treat all community members with dignity
-- **Inclusivity**: Welcome developers of all backgrounds and skill levels
-- **Collaboration**: Share knowledge and help others succeed
-- **Quality**: Strive for excellence in code and communication
-- **Growth**: Support continuous learning and improvement
-
-**Expected Behavior**
-- **Be helpful and patient** with newcomers
-- **Provide constructive feedback** on code and ideas
-- **Share knowledge freely** and credit others appropriately
-- **Communicate clearly** and professionally
-- **Respect different opinions** and approaches
-
-**Unacceptable Behavior**
-- **Harassment or discrimination** of any kind
-- **Spam or off-topic content** in community channels
-- **Sharing proprietary code** without permission
-- **Personal attacks** or inflammatory language
-- **Disrupting community events** or discussions
-
-**Enforcement**
-- **First violation**: Warning and guidance
-- **Second violation**: Temporary suspension
-- **Serious violations**: Immediate permanent ban
-- **Appeals process**: Contact community moderators
-
-### 📋 Contribution Guidelines
-
-**Code Contributions**
-1. **Follow coding standards**: Consistent formatting and naming
-2. **Write clear comments**: Explain complex logic and algorithms
-3. **Include tests**: Unit tests for new functionality
-4. **Update documentation**: Keep docs in sync with code changes
-5. **Submit pull requests**: Use standard Git workflow
-
-**Documentation Contributions**
-1. **Write for your audience**: Consider skill level and context
-2. **Use clear examples**: Working code snippets with explanations
-3. **Keep it current**: Update outdated information
-4. **Follow style guide**: Consistent formatting and structure
-5. **Proofread carefully**: Check grammar and technical accuracy
-
-**Community Participation**
-1. **Be active and engaged**: Regular participation in discussions
-2. **Help newcomers**: Answer questions and provide guidance
-3. **Share your projects**: Show what you're building with Pascal
-4. **Attend events**: Join meetups, workshops, and conferences
-5. **Provide feedback**: Help improve community resources and events
-
----
-
-**Ready to join?** Pick a platform above and start connecting with fellow Pascal developers today!
-
-*Questions about the community? [Contact us](mailto:community@pascal-lang.org)*
+- **Coding Competitions**: Pascal remains popular in programming contests
\ No newline at end of file
diff --git a/content/learn/_index.md b/content/learn/_index.md
index 0910b60..c0cd3b9 100644
--- a/content/learn/_index.md
+++ b/content/learn/_index.md
@@ -5,7 +5,11 @@ draft = false
 layout = 'single-with-sidebar'
 +++
 
-## Installation
+## Quick Start with Free Pascal Compiler (FPC)
+
+This quick start guide uses the Free Pascal Compiler (FPC), a free, open-source Pascal compiler that works across multiple platforms. FPC is a great choice for learning Pascal as it's widely used and well-documented.
+
+### Installation
 
 Choose your Pascal development environment:
 
@@ -14,16 +18,26 @@ Choose your Pascal development environment:
 | **Type** | Command-line compiler | Visual development environment |
 | **Interface** | Terminal/command-line | Graphical IDE with forms designer |
 | **Best for** | Learning fundamentals, scripting | GUI applications, beginners |
-| **Includes** | Pascal compiler only | FPC + IDE + visual designer |
+| **Includes** | Pascal compiler + Text-based IDE | FPC + IDE + visual designer |
 | **Platform** | Cross-platform | Cross-platform |
 | **Download** | [Download FPC](https://www.freepascal.org/) | [Download Lazarus](https://www.lazarus-ide.org/) |  
 
+### Try Online (No Installation Required)
+
+If you want to try Pascal without installing anything, you can use these online compilers (note: they have limited functionality compared to a full installation):
+
+- [FPC Playground](https://fpc-playground-app-mgeib.ondigitalocean.app/) - Online Free Pascal Compiler
+- [OneCompiler](https://onecompiler.com/pascal) - Online Pascal compiler with basic features
+- [OnlineGDB](https://www.onlinegdb.com/online_pascal_compiler) - Online Pascal compiler with debugging
+
 
 ## Compiling Hello World!
 
 Create a new file called `hello.pas`:
 
 ```objectpascal {class="highlight capsule-fpc"}
+{$mode objfpc}{$H+}{$J-}
+
 program HelloWorld;
 begin
     writeln('Hello, Pascal!');
@@ -47,6 +61,8 @@ Every Pascal program follows this basic structure:
 ```objectpascal {class="highlight capsule-fpc"} {wrapper="highlight capsule-fpc"}
 program ProgramName;
 
+{$mode objfpc}{$H+}{$J-} // use this for modern Pascal features
+
 { Constant declarations }
 const
   MAX_ITEMS = 100;
@@ -226,47 +242,106 @@ begin
 end;
 ```
 
-## Procedures and Functions
+## Functions and Procedures
 
-### Procedures
+Functions return values, procedures don't:
 
 ```objectpascal {class="highlight capsule-fpc"}
-procedure greetUser(name: string);
+// Function - returns a value
+function Add(a, b: Integer): Integer;
+begin
+  Result := a + b;  // or Add := a + b;
+end;
+
+// Procedure - performs an action
+procedure PrintGreeting(const name: string);
 begin
   writeln('Hello, ', name, '!');
-  writeln('Welcome to Pascal programming.');
 end;
 
-{ Call the procedure }
+// Using them
+var
+  sum: Integer;
 begin
-  greetUser('Alice');
+  sum := Add(5, 3);           // sum = 8
+  PrintGreeting('Pascal');    // prints: Hello, Pascal!
 end.
 ```
 
-### Functions
+## Practice Exercises
+
+Try these exercises to reinforce what you've learned:
 
+### Exercise 1: Basic Calculator
 ```objectpascal {class="highlight capsule-fpc"}
-function calculateArea(radius: real): real;
+program Calculator;
+
+{$mode objfpc}{$H+}{$J-} 
+
+var
+  num1, num2: real;
+  operation: char;
 begin
-  calculateArea := 3.14159 * radius * radius;
-end;
+  write('Enter first number: ');
+  readln(num1);
+  write('Enter operation (+, -, *, /): ');
+  readln(operation);
+  write('Enter second number: ');
+  readln(num2);
+  
+  case operation of
+    '+': writeln('Result: ', num1 + num2:0:2);
+    '-': writeln('Result: ', num1 - num2:0:2);
+    '*': writeln('Result: ', num1 * num2:0:2);
+    '/': if num2 <> 0 then
+           writeln('Result: ', num1 / num2:0:2)
+         else
+           writeln('Error: Division by zero!');
+    else
+      writeln('Invalid operation!');
+  end;
+end.
+```
+
+### Exercise 2: Number Guessing Game
+```objectpascal {class="highlight capsule-fpc"}
+program GuessNumber;
 
-{ Using the function }
+{$mode objfpc}{$H+}{$J-} 
 var
-  area: real;
+  secretNumber, guess, attempts: Integer;
 begin
-  area := calculateArea(5.0);
-  writeln('Area: ', area:0:2);
+  Randomize;  // Initialize random number generator
+  secretNumber := Random(100) + 1;  // 1-100
+  attempts := 0;
+  
+  writeln('Guess the number between 1 and 100!');
+  
+  repeat
+    write('Enter your guess: ');
+    readln(guess);
+    Inc(attempts);
+    
+    if guess < secretNumber then
+      writeln('Too low!')
+    else if guess > secretNumber then
+      writeln('Too high!')
+    else
+      writeln('Congratulations! You got it in ', attempts, ' attempts!');
+  until guess = secretNumber;
 end.
 ```
 
 ## Next Steps
 
-1. **Practice Basic Programs**: Start with simple console applications
-2. **Learn Data Structures**: Arrays, records, and sets
-3. **Object-Oriented Programming**: Classes and inheritance in Object Pascal
-4. **GUI Development**: Create desktop applications with Lazarus
-5. **Advanced Topics**: File handling, dynamic memory, and libraries
+Once you're comfortable with the basics above:
+
+1. **Practice More**: Write small programs using what you've learned
+2. **Learn Arrays**: Work with collections of data
+3. **Master Records**: Group related data together  
+4. **Try File I/O**: Read and write files
+5. **Explore GUI**: Use Lazarus to create visual applications
+6. **Join the Community**: Ask questions and share your progress
 
 ## Resources
 
@@ -275,13 +350,21 @@ end.
 - [Pascal Programming Examples](/docs/)
 - [Community Forum](/community/)
 
+---
+
 ## Advanced Topics
 
+The following sections are for those ready to dive deeper into Pascal programming.
+
+
 ### Arrays and Data Structures
 
 **Static Arrays:**
 ```objectpascal {class="highlight capsule-fpc"}
 program ArrayExample;
+
+{$mode objfpc}{$H+}{$J-} 
+
 var
   scores: array[1..5] of integer;
   names: array[1..3] of string;
@@ -305,6 +388,9 @@ end.
 **Records (Structures):**
 ```objectpascal {class="highlight capsule-fpc"}
 program RecordExample;
+
+{$mode objfpc}{$H+}{$J-} 
+
 type
   TStudent = record
     name: string;
@@ -332,14 +418,15 @@ end.
 
 ### File Input/Output
 
-**Reading from Files:**
+#### Reading from Files
+
 ```objectpascal {class="highlight capsule-fpc"}
 program ReadFile;
 
+{$mode objfpc}{$H+}{$J-} 
+
 uses
-  Classes,
-  SysUtils,
-  streamex;
+  Classes, SysUtils, streamex;
 
 var
   reader: TStreamReader;
@@ -378,90 +465,439 @@ begin
 end.
 ```
 
-**Writing to Files:**
+#### Writing to Files
 ```objectpascal {class="highlight capsule-fpc"}
-program NewTextFile;
+program AppendTextFile;
+
+{$mode objfpc}{$H+}{$J-}
 
 uses
   Classes, SysUtils;
 
 var
-  text: string = 'QILT Surveys';
-  filename :String = 'hello-text.txt';
+  filename: string = 'log.txt';
   fileStream: TFileStream;
-  size: longint;
+  size: int64;
+  newText: string;
 
 begin
-  // Create a TFileStream object
-  fileStream := TFileStream.Create(filename, fmCreate);
+
+  // First, does the file exist?
+  if FileExists(fileName) then
+    // If yes, open the file in append mode.
+    fileStream := TFileStream.Create(filename, fmOpenWrite or fmShareDenyNone)
+  else
+    // If not, create a a new file.
+    fileStream := TFileStream.Create(filename, fmCreate);
+
+  // Next, start appending.
   try
-    // set position at the beginning of file
-    fileStream.Position := 0;
+    // set position at the end of the file
+    fileStream.Seek(0, soFromEnd);
     // Write text into the file
-    size := fileStream.Write(text[1], Length(text));
+    newText := LineEnding + 'A new line!';
+    size := fileStream.Write(newText[1], Length(newText));
     // Show confirmation
-    Writeln(Format('Created %s. %d bytes written.', [filename, size]));
+    Writeln(Format('Appended %s. %d bytes written.', [filename, size]));
   finally
     // Free TFileStream object
     fileStream.Free;
   end;
 
   // Pause console
+  WriteLn('Press Enter to quit.');
   ReadLn;
 end.
 ```
 
+---
 
-## Common Mistakes to Avoid
+## Debugging & Troubleshooting Guide
 
-1. **Forgetting semicolons**: Every statement needs a semicolon
-2. **Array bounds**: Pascal arrays are 1-indexed by default
-3. **Variable initialization**: Always initialize variables before use
-4. **Case sensitivity**: Pascal is not case-sensitive, but be consistent
-5. **Memory management**: Free dynamically allocated memory
+### Getting Started with Debugging
 
-## Development Tools
+When your program doesn't work as expected, follow this step-by-step approach:
 
-### Free Pascal Compiler
+#### Step 1: Read the Error Message Carefully
+- Compile errors usually tell you the exact line number and what's wrong
+- Don't ignore warnings - they often point to real problems
+- Take note of the error type (syntax error, runtime error, etc.)
 
-- **Cross-platform**: Windows, Linux, macOS, FreeBSD
-- **Command-line**: Compile with `fpc program.pas`
-- **Optimization**: Multiple optimization levels
+#### Step 2: Use WriteLn to See What's Happening
 
-### Lazarus IDE
+The simplest and most effective debugging technique for beginners:
 
-- **Visual Designer**: Drag-and-drop form creation
-- **Code Completion**: IntelliSense-like features
-- **Package System**: Easy library management
+```objectpascal {class="highlight capsule-fpc"}
+program DebugExample;
 
-### Text Editors
+{$mode objfpc}{$H+}{$J-} 
 
-- **VS Code**: Pascal extensions available
-- **Sublime Text**: Syntax highlighting
-- **Notepad++**: Simple Pascal support
-- **Vim/Emacs**: Advanced editor configurations
+var
+  x, y, result: Integer;
+begin
+  x := 10;
+  y := 5;
+  
+  writeln('Before calculation: x=', x, ', y=', y);
+  result := x * y;
+  writeln('After calculation: result=', result);
+  
+  if result > 40 then
+    writeln('Result is greater than 40')
+  else
+    writeln('Result is 40 or less');
+end.
+```
 
-## When You're Stuck
+#### Step 3: Check Your Assumptions
 
-1. **Read error messages carefully** - they usually point to the problem
-2. **Check syntax** - missing semicolons, brackets, or keywords
-3. **Use writeln for debugging** - print variable values
-4. **Break down complex problems** - solve step by step
-5. **Ask for help** - community forums and Discord
+Always validate what you think should be happening:
 
-## Debugging Tips
+```objectpascal {class="highlight capsule-fpc"}
+// Always validate input
+function SafeDivide(a, b: Real): Real;
+begin
+  writeln('Dividing ', a:0:2, ' by ', b:0:2);
+  
+  if b = 0 then
+  begin
+    writeln('Error: Cannot divide by zero!');
+    Result := 0;
+  end
+  else
+  begin
+    Result := a / b;
+    writeln('Result: ', Result:0:2);
+  end;
+end;
+```
+
+#### Step 4: Debugging Different Scenarios
+
+**Array Operations:**
+```objectpascal {class="highlight capsule-fpc"}
+// Good - safe with bounds checking
+if (i >= 0) and (i < Length(myArray)) then
+begin
+  writeln('Setting myArray[', i, '] = ', value);
+  myArray[i] := value;
+end
+else
+  writeln('Array index error: i = ', i, ', array length = ', Length(myArray));
+```
+
+**Debugging Loops:**
+```objectpascal {class="highlight capsule-fpc"}
+for i := 0 to High(myArray) do
+begin
+  writeln('Processing item ', i, ': ', myArray[i]);  // Shows progress
+  // Your code here
+end;
+```
+
+**File Operations:**
+```objectpascal {class="highlight capsule-fpc"}
+if not FileExists(filename) then
+begin
+  writeln('File not found: ', filename);
+  Exit;
+end;
+
+writeln('Opening file: ', filename);  // Confirm file is being processed
+// File operations here
+```
+
+### Common Beginner Mistakes & Solutions
+
+Here are the most frequent issues newcomers encounter:
 
+#### Missing Semicolons
 ```objectpascal {class="highlight capsule-fpc"}
-{ Add debug output }
-writeln('Debug: Variable x = ', x);
-writeln('Debug: Entering function Calculate');
+// Problem: Missing semicolons
+begin
+  writeln('Hello')     // Need semicolon here
+  writeln('World')     // And here
+end.                   // Period ends the program
+
+// Solution: Add semicolons after statements
+begin
+  writeln('Hello');    // Correct
+  writeln('World');    // Correct
+end.
+```
 
-{ Use meaningful variable names }
+#### Array Index Errors
+```objectpascal {class="highlight capsule-fpc"}
+// Problem: Wrong array bounds
 var
-    studentCount: integer;     // Good
-    sc: integer;               // Avoid
+  numbers: array[1..5] of Integer;  // Arrays are 1-indexed by default
+  i: Integer;
+begin
+  for i := 0 to 5 do  // Wrong! Should start at 1, end at 5
+    numbers[i] := i * 2;
+end;
 
-{ Add comments for complex logic }
-{ Calculate compound interest using formula: A = P(1 + r)^t }
-result := principal * Power(1 + rate, years);
+// Solution: Use correct bounds
+var
+  numbers: array[1..5] of Integer;
+  i: Integer;
+begin
+  for i := 1 to 5 do  // Correct
+    numbers[i] := i * 2;
+  
+  // Or use High() function for dynamic arrays
+  for i := 0 to High(numbers) do
+    numbers[i] := i * 2;
+end;
 ```
+
+#### Uninitialized Variables
+```objectpascal {class="highlight capsule-fpc"}
+// Problem: Forgetting to initialize variables
+var
+  count: Integer;
+begin
+  writeln('count: ', count); // Bad: count has undefined value
+  // ... rest of code
+end;
+
+// Solution: Always initialize variables
+var
+  count: Integer;
+begin
+  count := 0;  // Good: explicitly set initial value
+  writeln('count: ', count);
+  // ... rest of code
+end;
+```
+
+#### Case Sensitivity Confusion
+Pascal isn't case-sensitive, but being consistent helps readability:
+```objectpascal {class="highlight capsule-fpc"}
+// These are all the same to Pascal:
+WriteLn('Hello');
+writeln('Hello');
+WRITELN('Hello');
+
+// But pick one style and stick with it
+writeln('Hello');  // Most common convention
+```
+
+### Setting Up for Debugging
+
+#### Compiler Flags for Debugging
+
+Essential compiler flags when compiling from command line:
+
+```bash
+# Basic debugging
+fpc -g myprogram.pas           # Add debug info
+fpc -gl myprogram.pas          # Line info for backtraces
+fpc -gh myprogram.pas          # Memory leak detection
+
+# Runtime checks  
+fpc -Cr myprogram.pas          # Range checking
+fpc -Co myprogram.pas          # Object method checking
+
+# Combine multiple flags
+fpc -g -gl -Cr -Co myprogram.pas
+```
+
+#### Using Lazarus IDE
+
+**For Lazarus Users**: When you create a project in Lazarus and use the default **Debug** build profile, Lazarus automatically includes the necessary debugging flags (`-g`, `-gl`, `-Cr`, etc.). You don't need to add them manually - just make sure you're using the **Debug** profile instead of **Release** when developing and testing your programs.
+
+To switch build modes in Lazarus:
+1. Go to **Project** → **Project Options**
+2. Select **Compiler Options** → **Config and Target**
+3. Choose **Debug** from the build mode dropdown
+
+### Intermediate Debugging Techniques
+
+#### Using Assertions
+
+Assertions help catch problems early in development:
+
+```objectpascal {class="highlight capsule-fpc"}
+program AssertExample;
+
+{$mode objfpc}{$H+}{$J-}
+{$C+}  // Enable assertions
+
+uses sysutils;
+
+// Simple function that uses assertions
+function SafeDivide(a, b: Real): Real;
+begin
+  Assert(b <> 0, 'Division by zero is not allowed!');
+  Result := a / b;
+end;
+
+// Function with array bounds checking
+function GetArrayElement(arr: array of Integer; index: Integer): Integer;
+begin
+  Assert((index >= 0) and (index <= High(arr)), 
+    Format('Index %d is out of bounds (0-%d)', [index, High(arr)]));
+  Result := arr[index];
+end;
+
+var
+  numbers: array[0..4] of Integer = (10, 20, 30, 40, 50);
+  result: Real;
+begin
+  writeln('Testing assertions...');
+  
+  // This will work fine
+  result := SafeDivide(10, 2);
+  writeln('10 / 2 = ', result:0:2);
+  
+  // This will work fine
+  writeln('numbers[2] = ', GetArrayElement(numbers, 2));
+  
+  // Uncomment these lines to see assertion failures:
+  // result := SafeDivide(10, 0);  // Will trigger assertion
+  // writeln('numbers[10] = ', GetArrayElement(numbers, 10));  // Will trigger assertion
+  
+  writeln('All tests passed!');
+end.
+```
+
+#### Conditional Compilation for Debugging
+
+Use compiler directives to include debug code only when needed:
+
+```objectpascal {class="highlight capsule-fpc"}
+{$IFDEF DEBUG}
+  // Debug-specific code
+  {$DEFINE ENABLE_LOGGING}
+  const DEBUG_MODE = True;
+{$ELSE}
+  // Release configuration
+  const DEBUG_MODE = False;
+{$ENDIF}
+
+procedure DebugLog(const msg: string);
+begin
+  {$IFDEF ENABLE_LOGGING}
+  writeln('[DEBUG] ', msg);
+  {$ENDIF}
+end;
+```
+
+#### Memory Leak Detection
+
+Find memory leaks in your programs:
+
+```bash
+# Compile with heap tracing
+fpc -gh myprogram.pas
+
+# Run your program (creates heap.trc file)
+./myprogram
+
+# Check the heap.trc file for leaks
+cat heap.trc
+```
+
+### Advanced Debugging
+
+#### Exception Handling
+
+For more robust error handling:
+
+```objectpascal {class="highlight capsule-fpc"}
+uses sysutils;
+
+try
+  // Potentially problematic code
+  result := ProcessData(input);
+except
+  on E: EDivByZero do
+    writeln('Division by zero error: ', E.Message);
+    
+  on E: EAccessViolation do
+  begin
+    writeln('Memory access violation:');
+    DumpExceptionBackTrace(Output);
+  end;
+    
+  on E: Exception do
+    writeln('Error (', E.ClassName, '): ', E.Message);
+    
+  else
+    writeln('Unknown error occurred');
+end;
+```
+
+#### Using the Debugger
+
+When WriteLn debugging isn't enough:
+
+- **Set breakpoints** to pause execution at specific lines
+- **Step through code** line by line to see exactly what happens
+- **Watch variables** to see how values change over time
+- **Examine the call stack** to understand how you got to the current point
+
+#### Performance Debugging
+
+For timing critical sections:
+```objectpascal {class="highlight capsule-fpc"}
+uses SysUtils;
+
+var
+  StartTime, EndTime: TDateTime;
+begin
+  StartTime := Now;
+  // Your code here
+  EndTime := Now;
+  writeln('Execution time: ', FormatDateTime('hh:nn:ss.zzz', EndTime - StartTime));
+end;
+```
+
+
+
+### Debugging Checklist & Getting Help
+
+#### Quick Debugging Checklist
+
+**For Beginners:**
+
+1. [ ] **Read error messages carefully** - they usually point to the exact problem
+2. [ ] **Add writeln statements** around problem areas to see what's happening
+3. [ ] **Check common mistakes** - semicolons, array bounds, initialization
+4. [ ] **Test with simple values** first, then try edge cases
+5. [ ] **Ask for help** - community forums and Discord
+
+**For Advanced Users:**
+
+6. [ ] **Compile with debug flags**: `-g -gl -Cr` (or use Lazarus Debug profile)
+7. [ ] **Use the debugger** to step through code line by line
+8. [ ] **Check for memory leaks** with `-gh` flag and heap.trc file
+9. [ ] **Write simple tests** for your functions
+10. [ ] **Handle exceptions** properly with try/except blocks
+
+#### Common Error Types & Quick Fixes
+
+- **Compile errors**: Usually syntax problems - check semicolons, brackets, keywords
+- **Runtime errors**: Use assertions and exception handling to catch issues early
+- **Logic errors**: Add debug output and use the debugger to trace execution
+- **Memory issues**: Compile with `-gh` and check heap.trc for leaks
+- **Performance issues**: Time critical sections to identify bottlenecks
+
+---
+
+## Getting Help
+
+When you're stuck, here's where to get help:
+
+- **Community Forums**: [Free Pascal Forum](https://forum.lazarus.freepascal.org/)
+- **Discord**: Join the [Unofficial Pascal Programming Discord Server](https://discord.com/channels/570025060312547359/570025060312547361)
+- **Documentation**: [Free Pascal Docs](https://www.freepascal.org/docs.html)
+- **Stack Overflow**: Tag your questions with `pascal`, `free-pascal` or `lazarus`
+
+**When asking for help**, include:
+
+- Your complete code (or minimal example that reproduces the problem)
+- Exact error messages
+- What you expected to happen vs. what actually happened
+- Your Free Pascal/Lazarus version and operating system
\ No newline at end of file
diff --git a/static/css/main.css b/static/css/main.css
index b02d79c..d25e0a9 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -457,7 +457,7 @@ pre {
   padding: var(--spacing-md);
   overflow-x: auto;
   font-family: var(--font-mono);
-  font-size: 1rem;
+  font-size: 0.85rem;
   line-height: 1.4;
   margin: 0;
 }
@@ -467,7 +467,7 @@ code {
   background-color: var(--code-bg);
   padding: 0.2em 0.4em;
   border-radius: 4px;
-  font-size: 1em;
+  font-size: 1.0em;
 }
 
 pre code {
@@ -475,6 +475,11 @@ pre code {
   padding: 0;
 }
 
+hr {
+  margin: var(--spacing-3xl);
+  border: 1px solid #ccc;
+}
+
 /* Lists in main content */
 .article-content ul,
 .main-content ul {

From 032a6f718e6d2d166a87f61243df7129e70a40e7 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Fri, 8 Aug 2025 08:11:24 +1000
Subject: [PATCH 18/27] feat: added initial documentation

---
 content/docs/_index.md | 690 ++++++++++++++++++++++++++++++++---------
 static/css/main.css    |  34 +-
 2 files changed, 572 insertions(+), 152 deletions(-)

diff --git a/content/docs/_index.md b/content/docs/_index.md
index 4964293..4d4e459 100644
--- a/content/docs/_index.md
+++ b/content/docs/_index.md
@@ -5,65 +5,87 @@ draft = false
 layout = 'single-with-sidebar'
 +++
 
+Comprehensive guides and references for Pascal programming across all implementations.
 
-Comprehensive guides and references for Pascal programming.
+## 1. Core Pascal Language (Universal)
 
-## Language Reference
+These features work across all Pascal implementations including Free Pascal, Delphi, PascalABC.NET, and others.
 
-### Syntax Guide
+### Basic Syntax and Structure
 
 Pascal uses a clear, structured syntax that emphasizes readability:
 
-```objectpascal {class="highlight capsule-fpc"}
-program ExampleProgram;
+```objectpascal {class="highlight capsule-universal"}
+program HelloWorld;
+begin
+    writeln('Hello, Pascal World!');
+end.
+```
 
+### Program Structure
+
+Every Pascal program follows this basic structure:
+
+```objectpascal {class="highlight capsule-universal"}
+program ProgramName;
+
+{ Optional: Uses clause for including units }
+uses
+    SysUtils;
+
+{ Optional: Constant declarations }
 const
     MAX_SIZE = 100;
     PI = 3.14159;
 
+{ Optional: Type declarations }
 type
     TIntArray = array[1..MAX_SIZE] of integer;
     TPoint = record
         x, y: real;
     end;
 
+{ Optional: Variable declarations }
 var
     numbers: TIntArray;
     point: TPoint;
     i: integer;
 
+{ Main program block }
 begin
-    { Initialize array }
-    for i := 1 to 10 do
-        numbers[i] := i * i;
-    
-    { Initialize record }
-    point.x := 10.5;
-    point.y := 20.3;
-    
-    { Output results }
-    writeln('First 10 squares:');
-    for i := 1 to 10 do
-        writeln(i, '^2 = ', numbers[i]);
-    
-    writeln('Point: (', point.x:0:1, ', ', point.y:0:1, ')');
+    { Program statements go here }
+    writeln('Program executed successfully');
 end.
 ```
 
-### Data Types
+### Standard Data Types
 
-**Basic Types:**
-- `integer`: Whole numbers (-32768 to 32767)
-- `longint`: Extended integers (-2147483648 to 2147483647)
+**Basic Types (Universal):**
+- `integer`: Whole numbers
 - `real`: Floating-point numbers
-- `double`: Double-precision floating-point
 - `char`: Single character
-- `string`: Text strings
 - `boolean`: True or false values
+- `string`: Text strings (implementation may vary)
+
+```objectpascal {class="highlight capsule-universal"}
+var
+    count: integer;
+    temperature: real;
+    initial: char;
+    isValid: boolean;
+    name: string;
+begin
+    count := 42;
+    temperature := 98.6;
+    initial := 'A';
+    isValid := true;
+    name := 'Pascal';
+end.
+```
 
 **Structured Types:**
 
-```objectpascal {class="highlight capsule-fpc"}
+```objectpascal {class="highlight capsule-universal"}
 { Arrays }
 type
     TScores = array[1..10] of integer;
@@ -83,71 +105,162 @@ type
     TLetters = set of 'A'..'Z';
 ```
 
-## Code Examples
+### Control Structures
 
-### File Operations
+**Conditional Statements:**
 
-```objectpascal {class="highlight capsule-fpc"}
-program FileExample;
+```objectpascal {class="highlight capsule-universal"}
+program ConditionalExample;
 var
-    inputFile, outputFile: text;
-    line: string;
+    age: integer;
 begin
-    assign(inputFile, 'input.txt');
-    assign(outputFile, 'output.txt');
+    write('Enter your age: ');
+    readln(age);
     
-    reset(inputFile);
-    rewrite(outputFile);
+    if age >= 18 then
+        writeln('You are an adult')
+    else
+        writeln('You are a minor');
     
-    while not eof(inputFile) do
-    begin
-        readln(inputFile, line);
-        writeln(outputFile, 'Processed: ', line);
+    { Case statement }
+    case age of
+        0..12: writeln('Child');
+        13..19: writeln('Teenager');
+        20..64: writeln('Adult');
+        else writeln('Senior');
     end;
+end.
+```
+
+**Loops:**
+
+```objectpascal {class="highlight capsule-universal"}
+program LoopExamples;
+var
+    i, sum: integer;
+begin
+    { For loop }
+    sum := 0;
+    for i := 1 to 10 do
+        sum := sum + i;
+    writeln('Sum 1-10: ', sum);
     
-    close(inputFile);
-    close(outputFile);
+    { While loop }
+    i := 1;
+    while i <= 5 do
+    begin
+        writeln('Count: ', i);
+        i := i + 1;
+    end;
     
-    writeln('File processing complete.');
+    { Repeat-until loop }
+    i := 1;
+    repeat
+        writeln('Repeat: ', i);
+        i := i + 1;
+    until i > 3;
 end.
 ```
 
-### Dynamic Arrays
+### Procedures and Functions
 
-```objectpascal {class="highlight capsule-fpc"}
-program DynamicArrayExample;
-type
-    TIntArray = array of integer;
+```objectpascal {class="highlight capsule-universal"}
+program ProcedureFunctionExample;
 
-var
-    numbers: TIntArray;
-    i, size: integer;
+{ Procedure - performs action, no return value }
+procedure PrintMessage(msg: string);
+begin
+    writeln('Message: ', msg);
+end;
 
+{ Function - returns a value }
+function Add(a, b: integer): integer;
 begin
-    write('Enter array size: ');
-    readln(size);
-    
-    { Allocate memory }
-    SetLength(numbers, size);
-    
-    { Fill array }
-    for i := 0 to size - 1 do
-        numbers[i] := Random(100);
+    Add := a + b;  { or Result := a + b; }
+end;
+
+{ Function with multiple parameters }
+function CalculateArea(length, width: real): real;
+begin
+    CalculateArea := length * width;
+end;
+
+var
+    result: integer;
+    area: real;
+begin
+    PrintMessage('Hello from procedure!');
     
-    { Display array }
-    writeln('Random numbers:');
-    for i := 0 to size - 1 do
-        write(numbers[i], ' ');
-    writeln;
+    result := Add(5, 3);
+    writeln('5 + 3 = ', result);
     
-    { Free memory automatically when program ends }
+    area := CalculateArea(10.5, 8.2);
+    writeln('Area: ', area:0:2);
 end.
 ```
 
-### Object-Oriented Programming
+## 2. Object Pascal Extensions (Widely Supported)
 
-```objectpascal {class="highlight capsule-fpc"}
-program OOPExample;
+These features are supported by most modern Pascal implementations including Delphi, Free Pascal, and others.
+
+### Classes and Objects
+
+```objectpascal {class="highlight capsule-universal"}
+program BasicOOP;
+
+type
+    { Simple class definition }
+    TCounter = class
+    private
+        FValue: integer;
+    public
+        constructor Create;
+        procedure Increment;
+        procedure Decrement;
+        function GetValue: integer;
+    end;
+
+{ Constructor }
+constructor TCounter.Create;
+begin
+    FValue := 0;
+end;
+
+{ Methods }
+procedure TCounter.Increment;
+begin
+    FValue := FValue + 1;
+end;
+
+procedure TCounter.Decrement;
+begin
+    FValue := FValue - 1;
+end;
+
+function TCounter.GetValue: integer;
+begin
+    GetValue := FValue;
+end;
+
+{ Main program }
+var
+    counter: TCounter;
+begin
+    counter := TCounter.Create;
+    try
+        counter.Increment;
+        counter.Increment;
+        writeln('Counter value: ', counter.GetValue);
+    finally
+        counter.Free;
+    end;
+end.
+```
+
+### Inheritance and Polymorphism
+
+```objectpascal {class="highlight capsule-universal"}
+program InheritanceExample;
 
 type
     { Base class }
@@ -156,9 +269,8 @@ type
         FColor: string;
     public
         constructor Create(AColor: string);
-        procedure SetColor(AColor: string);
-        function GetColor: string;
         function GetArea: real; virtual; abstract;
+        property Color: string read FColor write FColor;
     end;
     
     { Derived class }
@@ -176,16 +288,6 @@ begin
     FColor := AColor;
 end;
 
-procedure TShape.SetColor(AColor: string);
-begin
-    FColor := AColor;
-end;
-
-function TShape.GetColor: string;
-begin
-    Result := FColor;
-end;
-
 { TCircle implementation }
 constructor TCircle.Create(AColor: string; ARadius: real);
 begin
@@ -195,7 +297,7 @@ end;
 
 function TCircle.GetArea: real;
 begin
-    Result := 3.14159 * FRadius * FRadius;
+    GetArea := 3.14159 * FRadius * FRadius;
 end;
 
 { Main program }
@@ -203,93 +305,379 @@ var
     circle: TCircle;
 begin
     circle := TCircle.Create('Red', 5.0);
-    writeln('Circle color: ', circle.GetColor);
-    writeln('Circle area: ', circle.GetArea:0:2);
-    circle.Free;
+    try
+        writeln('Circle color: ', circle.Color);
+        writeln('Circle area: ', circle.GetArea:0:2);
+    finally
+        circle.Free;
+    end;
 end.
 ```
 
-## Best Practices
-
-### Code Style
-
-1. **Use meaningful names:**
-   ```objectpascal {class="highlight capsule-fpc"}
-   var
-       studentCount: integer;    // Good
-       sc: integer;              // Avoid
-   ```
-
-2. **Consistent indentation:**
-   ```objectpascal {class="highlight capsule-fpc"}
-   if condition then
-   begin
-       statement1;
-       statement2;
-   end;
-   ```
-
-3. **Comment your code:**
-   ```objectpascal {class="highlight capsule-fpc"}
-   { Calculate compound interest }
-   function CompoundInterest(principal, rate: real; years: integer): real;
-   begin
-       Result := principal * Power(1 + rate, years);
-   end;
-   ```
-
-### Error Handling
+## 3. Implementation-Specific Features
+
+### Free Pascal / Lazarus
+
+**Generics in Free Pascal:**
 
 ```objectpascal {class="highlight capsule-fpc"}
-program ErrorHandlingExample;
+program FPCGenericsDemo;
+
+{$mode objfpc}{$H+}{$J-}
+
+type
+    { Generic class }
+    generic TList<T> = class
+    private
+        FItems: array of T;
+        FCount: integer;
+    public
+        procedure Add(const Item: T);
+        function Get(Index: integer): T;
+        property Count: integer read FCount;
+    end;
+
+procedure TList.Add(const Item: T);
+begin
+    SetLength(FItems, FCount + 1);
+    FItems[FCount] := Item;
+    Inc(FCount);
+end;
+
+function TList.Get(Index: integer): T;
+begin
+    if (Index >= 0) and (Index < FCount) then
+        Result := FItems[Index];
+end;
+
+type
+    TIntList = specialize TList<integer>;
+    TStringList = specialize TList<string>;
+
 var
-    number, divisor: integer;
-    result: real;
+    intList: TIntList;
+    i: integer;
 begin
+    intList := TIntList.Create;
     try
-        write('Enter a number: ');
-        readln(number);
-        write('Enter divisor: ');
-        readln(divisor);
-        
-        if divisor = 0 then
-            raise Exception.Create('Division by zero not allowed');
+        intList.Add(10);
+        intList.Add(20);
+        intList.Add(30);
         
-        result := number / divisor;
-        writeln('Result: ', result:0:2);
-        
-    except
-        on E: Exception do
-            writeln('Error: ', E.Message);
+        writeln('Integer list:');
+        for i := 0 to intList.Count - 1 do
+            writeln('  ', intList.Get(i));
+    finally
+        intList.Free;
     end;
 end.
 ```
 
-## Tools and Libraries
+**Free Pascal Generics.Collections**
+
+```objectpascal {class="highlight capsule-fpc"}
+program SimpleIntegerList;
+
+{$mode objfpc}{$H+}{$J-}
+
+uses
+  Math,
+  Generics.Defaults,
+  Generics.Collections;
+
+type
+  TIntegerList = specialize TList<integer>;
+
+var
+  myIntList: TIntegerList;
+  i: integer;
+
+begin
+  // Create a new generic list
+  myIntList := TIntegerList.Create;
+  try
+    // Add some elements to the list, use Add or AddRange (append)
+    myIntList.Add(0);
+    myIntList.Add(1);
+    myIntList.AddRange([9, 8, 7, 6, 5]);
+
+    // Access the n-th element, 0-indexed
+    WriteLn('The 3rd item is: ', myIntList[2]);
+
+    // Sorting it ascending
+    myIntList.Sort;
+
+    // Iterate through the list
+    for i := 0 to myIntList.Count - 1 do
+      Writeln(myIntList[i]);
+
+    // Get the mean
+    WriteLn('The mean is: ', Math.Mean(myIntList.ToArray): 0: 2);
+
+    // Empty the list
+    myIntList.Clear;
+
+  finally
+    // Free the memory used by the list
+    myIntList.Free;
+  end;
+
+  // Pause console
+  ReadLn;
+end.
+```
+
+### Delphi
+
+**Inline variable declaration:** 
+
+Ref: https://docwiki.embarcadero.com/RADStudio/Sydney/en/Inline_Variable_Declaration
+
+```objectpascal {class="highlight capsule-delphi"}
+procedure Test;
+begin
+  var I: Integer;
+  I := 22;
+  ShowMessage (I.ToString);
+end;
+
+procedure Test2;
+begin
+  var I, K: Integer;
+  I := 22;
+  K := I + 10;
+  ShowMessage (K.ToString);
+end;
+```
+
+**Scoped inline variable:** 
+
+Ref: https://docwiki.embarcadero.com/RADStudio/Sydney/en/Inline_Variable_Declaration
+
+```objectpascal {class="highlight capsule-delphi"}
+procedure Test; // declaration and initialization in a single statement
+begin
+  var I: Integer := 22;
+  ShowMessage (I.ToString);
+end;
+
+procedure Test1; // multiple inline declarations (symbols declared when used)
+begin
+  var I: Integer := 22;
+  var J: Integer;
+  J := 22 + I;
+  var K: Integer := I + J;
+  ShowMessage (K.ToString);
+end;
+
+procedure Test2; // scope limited to local block
+begin
+  var I: Integer := 22;
+  if I > 10 then
+  begin
+    var J: Integer := 3;
+    ShowMessage (J.ToString);
+  end
+  else
+  begin
+    var K: Integer := 3;
+    ShowMessage (J.ToString); // COMPILER ERROR: “Undeclared identifier: ‘J’”
+  end;
+end;
+```
+
+**Generics:**
+
+
+```objectpascal {class="highlight capsule-delphi"}
+program GenericClassExample;
+
+{$APPTYPE CONSOLE}
+
+type
+  TMyGenericClass<T> = class
+  private
+    FValue: T;
+  public
+    constructor Create(AValue: T);
+    function GetValue: T;
+    procedure SetValue(AValue: T);
+  end;
+
+constructor TMyGenericClass<T>.Create(AValue: T);
+begin
+  FValue := AValue;
+end;
+
+function TMyGenericClass<T>.GetValue: T;
+begin
+  Result := FValue;
+end;
+
+procedure TMyGenericClass<T>.SetValue(AValue: T);
+begin
+  FValue := AValue;
+end;
+
+begin
+  // Instantiate TMyGenericClass with Integer
+  var IntInstance: TMyGenericClass<Integer>;
+  IntInstance := TMyGenericClass<Integer>.Create(10);
+  Writeln('Integer Value: ' + IntToStr(IntInstance.GetValue));
+  IntInstance.SetValue(20);
+  Writeln('New Integer Value: ' + IntToStr(IntInstance.GetValue));
+  IntInstance.Free;
+
+  // Instantiate TMyGenericClass with String
+  var StringInstance: TMyGenericClass<string>;
+  StringInstance := TMyGenericClass<string>.Create('Hello');
+  Writeln('String Value: ' + StringInstance.GetValue);
+  StringInstance.SetValue('World');
+  Writeln('New String Value: ' + StringInstance.GetValue);
+  StringInstance.Free;
+
+  Readln;
+end.
+```
+
+### Other Pascal Implementations
+
+**PascalABC.NET:**
+- .NET-based Pascal implementation
+- Modern language features
+- Integrated development environment
+- Supports both console and Windows Forms applications
+
+
+## 4. Cross-Platform Development
+
+### Universal Approaches
+
+**Console Applications:**
+
+```objectpascal {class="highlight capsule-universal"}
+program CrossPlatform;
+
+{$IFDEF WINDOWS}
+  {$APPTYPE CONSOLE}
+{$ENDIF}
+
+uses
+  {$IFDEF UNIX}
+  cthreads,
+  {$ENDIF}
+  SysUtils;
+
+begin
+  writeln('This program runs on:');
+  {$IFDEF WINDOWS}
+  writeln('- Windows');
+  {$ENDIF}
+  {$IFDEF LINUX}
+  writeln('- Linux');
+  {$ENDIF}
+  {$IFDEF DARWIN}
+  writeln('- macOS');
+  {$ENDIF}
+  
+  writeln('Pascal version: ', {$I %FPCVERSION%});
+  writeln('Target CPU: ', {$I %FPCTARGETCPU%});
+  writeln('Target OS: ', {$I %FPCTARGETOS%});
+end.
+```
+
+### Common Libraries and Frameworks
+
+**For GUI Development:**
+
+- **Lazarus LCL**: Cross-platform native widgets
+- **fpGUI**: Lightweight, custom-drawn GUI
+- **Delphi VCL & FireMonkey**: GUI Frameworks in Delphi
+
+**For Web Development:**
+
+- **Brook Framework**: Microframework for web applications
+- **Horse**: Fast, minimalist web framework
+- **Pas2JS**: Compile Pascal to JavaScript
+
+**For Database Access:**
+
+- **SQLDB**: Built-in database components
+- **ZeosLib**: High-performance database connectivity
+- **FireDAC**: Enterprise database access (Delphi)
+
+### Best Practices for Cross-Platform Code
+
+```objectpascal {class="highlight capsule-universal"}
+program BestPractices;
+
+uses
+  SysUtils, Classes
+  {$IFDEF UNIX}
+  , BaseUnix
+  {$ENDIF}
+  {$IFDEF WINDOWS}
+  , Windows
+  {$ENDIF};
+
+function GetConfigPath: string;
+begin
+  {$IFDEF WINDOWS}
+  Result := GetEnvironmentVariable('APPDATA') + '\MyApp\';
+  {$ENDIF}
+  {$IFDEF UNIX}
+  Result := GetEnvironmentVariable('HOME') + '/.config/myapp/';
+  {$ENDIF}
+end;
+
+procedure CreateDirectoryIfNotExists(const Path: string);
+begin
+  if not DirectoryExists(Path) then
+    ForceDirectories(Path);
+end;
+
+var
+  configPath: string;
+begin
+  configPath := GetConfigPath;
+  CreateDirectoryIfNotExists(configPath);
+  writeln('Config directory: ', configPath);
+end.
+```
+
+## Getting Started
+
+### Choose Your Pascal Implementation
+
+**For Beginners:**
+- **Free Pascal + Lazarus**: Free, cross-platform, excellent learning environment
+- **PascalABC.NET**: Modern features, good for education
+
+**For Professional Development:**
+- **Delphi**: Commercial, extensive libraries, Windows-focused
+- **Free Pascal**: Open source, highly compatible, cross-platform
+
+**For Web Development:**
+- **Pas2JS**: Compile Pascal to JavaScript
+- **Brook Framework**: Web applications with Free Pascal
+
+### Development Environment Setup
 
-### Free Pascal Compiler
-- Cross-platform compilation
-- Extensive standard library
-- Compatible with Turbo Pascal and Delphi
+1. **Install a Pascal compiler** (Free Pascal recommended for beginners)
+2. **Choose an IDE** (Lazarus for visual development, VS Code with Pascal extensions for text editing)
+3. **Set up your first project** using the examples above
+4. **Join the community** at [pascal-lang.org/community](/community/)
 
-### Lazarus IDE
-- Visual form designer
-- Integrated debugger
-- Component library (LCL)
-- Cross-platform GUI development
+### Next Steps
 
-### Popular Libraries
-- **LCL**: Lazarus Component Library for GUI
-- **FCL**: Free Component Library for utilities
-- **Synapse**: Network and internet protocols
-- **ZeosDBO**: Database connectivity
+- Explore [Learning Resources](/learn/) for tutorials and guides
+- Check out [Community Projects](/community/) for real-world examples
+- Contribute to open-source Pascal projects
+- Share your Pascal knowledge with others
 
-## Further Reading
+---
 
-- [Free Pascal Reference Guide](https://www.freepascal.org/docs-html/ref/ref.html)
-- [Lazarus Documentation](https://wiki.lazarus.freepascal.org/)
-- [Pascal Programming Tutorials](/learn/)
-- [Community Examples and Projects](/community/)
+*This documentation covers Pascal features across multiple implementations. Code examples are marked with compatibility indicators: **UNIVERSAL** for standard Pascal features, **FPC** for Free Pascal specific features.*
 
 ## Standard Library Reference
 
diff --git a/static/css/main.css b/static/css/main.css
index d25e0a9..eb1f475 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -435,7 +435,7 @@ a:hover {
   position: relative;
 }
 
-/* Pascal compatibility capsule */
+/* Pascal compatibility capsules */
 .highlight.capsule-fpc::before {
   content: 'FPC';
   position: absolute;
@@ -452,6 +452,38 @@ a:hover {
   z-index: 10;
 }
 
+.highlight.capsule-universal::before {
+  content: 'UNIVERSAL';
+  position: absolute;
+  top: var(--spacing-sm);
+  right: var(--spacing-sm);
+  background-color: #28a745;
+  color: white;
+  padding: 0.25rem 0.5rem;
+  border-radius: 12px;
+  font-size: 0.75rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  z-index: 10;
+}
+
+.highlight.capsule-delphi::before {
+  content: 'DELPHI';
+  position: absolute;
+  top: var(--spacing-sm);
+  right: var(--spacing-sm);
+  background-color: #dc3545;
+  color: white;
+  padding: 0.25rem 0.5rem;
+  border-radius: 12px;
+  font-size: 0.75rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  z-index: 10;
+}
+
 pre {
   background-color: var(--code-bg);
   padding: var(--spacing-md);

From 89c6f5fa5af3a0d263286cfa4e1f0995386bbfa6 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Sun, 10 Aug 2025 22:28:19 +1000
Subject: [PATCH 19/27] feat: added a new page: Resources. Removed an  old
 page: Docs (Will be replaced with someting else)

---
 content/community/_index.md |  150 +---
 content/docs/_index.md      | 1345 -----------------------------------
 content/learn/_index.md     | 1000 +++++---------------------
 content/resources/_index.md |  219 ++++++
 hugo.toml                   |    6 +-
 5 files changed, 438 insertions(+), 2282 deletions(-)
 delete mode 100644 content/docs/_index.md
 create mode 100644 content/resources/_index.md

diff --git a/content/community/_index.md b/content/community/_index.md
index a8d9a9c..b01f136 100644
--- a/content/community/_index.md
+++ b/content/community/_index.md
@@ -14,7 +14,8 @@ Join the vibrant Pascal programming community! Connect with developers, share kn
 
 **Community Forums**: 
 
-- Join the [Free Pascal Forum](https://forum.lazarus.freepascal.org/)
+-   [Free Pascal and Lazarus](https://forum.lazarus.freepascal.org/index.php): The main official forum.
+-   [Begin End](https://www.beginend.net/): A site that gathers blog posts about Object Pascal (Delphi, Lazarus, Free Pascal).
 
 **Reddit Pascal Community** :
 
@@ -24,17 +25,27 @@ Join the vibrant Pascal programming community! Connect with developers, share kn
 
 **Discord**: 
 
-- Join the [Unofficial Pascal Programming Discord Server](https://discord.com/channels/570025060312547359/570025060312547361)
+Real-time chat servers for quick questions and community interaction.
+
+-   [Unofficial Free Pascal](https://discord.com/invite/GPFyAc2UJ2)
+-   [Delphi Community](https://delphi-community.com/) (Delphi is a close cousin to Free Pascal, many topics overlap)
 
 ### Mailing Lists
 
 **Free Pascal Lists**
 
-- Subscribe to [Mailing lists](https://www.freepascal.org/maillist.html)
-  - `fpc-announce`: Release announcements
-  - `fpc-devel`: Development discussions
-  - `fpc-pascal`: General Pascal discussions
+Stay informed through these mailing lists. You can subscribe to get emails about specific topics.
+
+-   [Free Pascal Mailing Lists](https://lists.freepascal.org/mailman/listinfo):
+    -   **FPC-Pascal**: For general questions, help, and discussions about using Free Pascal.
+    -   **FPC-Devel**: For technical discussions, bug reports, and if you're interested in how FPC is developed.
+    -   **FPC-Announce**: Get notified about important news, like new Free Pascal releases.
+    -   **pas2js**: Discussions about the pas2js tool, which converts Pascal code to JavaScript.
+    -   **FPC-Other**: For topics that don't fit into the other categories.
+    -   **MacPascal**: Focused on using FPC on macOS and for iOS development.
+-   [Lazarus Mailing Lists](https://lists.lazarus-ide.org/listinfo): Similar lists specifically for the Lazarus IDE.
 
+---
 
 ## Open Source Projects
 
@@ -42,55 +53,24 @@ Join the vibrant Pascal programming community! Connect with developers, share kn
 
 **Free Pascal Compiler**
 - Core compiler development
-- Platform support and optimization
-- [GitHub Repository](https://github.com/graemeg/freepascal)
+- [GitLab Repository](https://gitlab.com/freepascal.org/fpc)
 
 **Lazarus IDE**
 - IDE features and improvements
-- Component development
-- Documentation
-- [GitLab Repository](https://gitlab.com/freepascal.org/lazarus/lazarus)
+- [GitLab Repository](https://gitlab.com/freepascal.org/lazarus)
 
 **Pascal Libraries**
 - Visit the latest list here: [Awesome Pascal](https://github.com/Fr0sT-Brutal/awesome-pascal)
 
-### Documentation Projects
-
-Help improve Pascal documentation:
-- Tutorial writing
-- Code examples
-- Translation projects
-- API documentation
-
-## Learning Resources
-
-### Educational Content
-
-**Online Courses**
-- Pascal programming fundamentals
-- Object-oriented programming with Pascal
-- GUI development with Lazarus
-
-**YouTube Channels**
-- Pascal programming tutorials
-- Lazarus IDE walkthroughs
-- Advanced Pascal techniques
-
-**Books and eBooks**
-- "Modern Pascal Introduction" *(Free)*
-- "Lazarus Complete Guide"
-- "Object Pascal Handbook"
-
-## Events and Meetups
-
-### Conferences
+---
 
-_...Coming soon..._
 
-### Competitions
+## Conferences & Events
 
-_...Coming soon..._
+- [DelphiCon](https://delphicon.embarcadero.com/) - Annual Delphi conference
+- [Free Pascal and Lazarus events](https://wiki.freepascal.org/Conferences_and_Events) - A list of past and upcoming events
 
+---
 
 ## Getting Help
 
@@ -129,6 +109,8 @@ Error: "Range check error while trying to access array element"
 I understand the error, but how can I prevent this at runtime?
 ```
 
+---
+
 ## Contributing to This Site
 
 This website is open source and welcomes contributions!
@@ -167,83 +149,3 @@ Our community is welcoming and inclusive. We expect all members to:
 - **Share knowledge** freely and constructively
 - **Give credit** where credit is due
 - **Follow** platform-specific rules and guidelines
-
----
-
-## Featured Community Projects
-
-### Active Open Source Projects
-
-**Free Pascal Compiler (FPC)**
-- **Description**: The core Free Pascal compiler and runtime library
-- **Language**: Pascal, Assembly, C
-- **Contributors**: 100+ active developers worldwide
-- **How to contribute**: Bug reports, patches, documentation, testing
-- **Repository**: [GitHub - Free Pascal](https://github.com/graemeg/freepascal)
-- **Difficulty**: Beginner to Expert
-
-**Lazarus IDE**
-- **Description**: Cross-platform visual IDE for Free Pascal
-- **Language**: Object Pascal
-- **Contributors**: 50+ active developers
-- **How to contribute**: UI improvements, components, bug fixes
-- **Repository**: [GitLab - Lazarus](https://gitlab.com/freepascal.org/lazarus/lazarus)
-- **Difficulty**: Intermediate to Expert
-
-**mORMot Framework**
-- **Description**: High-performance ORM and SOA framework
-- **Language**: Object Pascal
-- **Contributors**: 20+ developers
-- **How to contribute**: Examples, documentation, performance testing
-- **Repository**: [GitHub - mORMot](https://github.com/synopse/mORMot2)
-- **Difficulty**: Advanced
-
-**Castle Game Engine**
-- **Description**: 3D and 2D game engine for Pascal
-- **Language**: Object Pascal
-- **Contributors**: 15+ developers
-- **How to contribute**: Game examples, engine features, documentation
-- **Repository**: [GitHub - Castle Game Engine](https://github.com/castle-engine/castle-engine)
-- **Difficulty**: Intermediate to Advanced
-
-**Synapse TCP/IP Library**
-- **Description**: Network communication library
-- **Language**: Object Pascal
-- **Contributors**: 10+ developers
-- **How to contribute**: Protocol implementations, examples, testing
-- **Repository**: [SourceForge - Synapse](https://sourceforge.net/projects/synalist/)
-- **Difficulty**: Intermediate
-
-### Community-Driven Documentation
-
-**Pascal Wiki**
-- **Description**: Collaborative Pascal knowledge base
-- **How to contribute**: Write tutorials, improve existing articles
-- **Topics needed**: Modern Pascal features, best practices, examples
-- **Repository**: [Free Pascal Wiki](https://wiki.freepascal.org/)
-
-**Pascal Cookbook**
-- **Description**: Collection of practical Pascal recipes
-- **How to contribute**: Submit code examples, review submissions
-- **Focus areas**: Algorithms, GUI programming, web development
-- **Repository**: [GitHub - Pascal Cookbook](https://github.com/ObjectPascal-Community/pascal-cookbook)
-
-**Translation Projects**
-- **Languages needed**: Spanish, French, German, Portuguese, Russian, Chinese
-- **Content**: Documentation, tutorials, error messages
-- **Tools**: Standard translation tools and Git workflow
-- **Coordination**: Translation team leads for each language
-
-
-### Success Stories
-
-**Commercial Applications**
-- **Skype**: Original client written in Object Pascal (Delphi)
-- **Total Commander**: Popular file manager
-- **Dev-C++**: IDE development environment
-- **Cheat Engine**: Memory scanner and debugger
-
-**Educational Institutions**
-- **Universities**: 50+ universities teaching Pascal worldwide
-- **Online Courses**: 10,000+ students learning Pascal annually
-- **Coding Competitions**: Pascal remains popular in programming contests
\ No newline at end of file
diff --git a/content/docs/_index.md b/content/docs/_index.md
deleted file mode 100644
index 4d4e459..0000000
--- a/content/docs/_index.md
+++ /dev/null
@@ -1,1345 +0,0 @@
-+++
-title = 'Documentation'
-date = 2024-05-30T18:56:05+03:00
-draft = false
-layout = 'single-with-sidebar'
-+++
-
-Comprehensive guides and references for Pascal programming across all implementations.
-
-## 1. Core Pascal Language (Universal)
-
-These features work across all Pascal implementations including Free Pascal, Delphi, PascalABC.NET, and others.
-
-### Basic Syntax and Structure
-
-Pascal uses a clear, structured syntax that emphasizes readability:
-
-```objectpascal {class="highlight capsule-universal"}
-program HelloWorld;
-begin
-    writeln('Hello, Pascal World!');
-end.
-```
-
-### Program Structure
-
-Every Pascal program follows this basic structure:
-
-```objectpascal {class="highlight capsule-universal"}
-program ProgramName;
-
-{ Optional: Uses clause for including units }
-uses
-    SysUtils;
-
-{ Optional: Constant declarations }
-const
-    MAX_SIZE = 100;
-    PI = 3.14159;
-
-{ Optional: Type declarations }
-type
-    TIntArray = array[1..MAX_SIZE] of integer;
-    TPoint = record
-        x, y: real;
-    end;
-
-{ Optional: Variable declarations }
-var
-    numbers: TIntArray;
-    point: TPoint;
-    i: integer;
-
-{ Main program block }
-begin
-    { Program statements go here }
-    writeln('Program executed successfully');
-end.
-```
-
-### Standard Data Types
-
-**Basic Types (Universal):**
-- `integer`: Whole numbers
-- `real`: Floating-point numbers
-- `char`: Single character
-- `boolean`: True or false values
-- `string`: Text strings (implementation may vary)
-
-```objectpascal {class="highlight capsule-universal"}
-var
-    count: integer;
-    temperature: real;
-    initial: char;
-    isValid: boolean;
-    name: string;
-begin
-    count := 42;
-    temperature := 98.6;
-    initial := 'A';
-    isValid := true;
-    name := 'Pascal';
-end.
-```
-
-**Structured Types:**
-
-```objectpascal {class="highlight capsule-universal"}
-{ Arrays }
-type
-    TScores = array[1..10] of integer;
-    TMatrix = array[1..3, 1..3] of real;
-
-{ Records }
-type
-    TPerson = record
-        name: string;
-        age: integer;
-        salary: real;
-    end;
-
-{ Sets }
-type
-    TDigits = set of 0..9;
-    TLetters = set of 'A'..'Z';
-```
-
-### Control Structures
-
-**Conditional Statements:**
-
-```objectpascal {class="highlight capsule-universal"}
-program ConditionalExample;
-var
-    age: integer;
-begin
-    write('Enter your age: ');
-    readln(age);
-    
-    if age >= 18 then
-        writeln('You are an adult')
-    else
-        writeln('You are a minor');
-    
-    { Case statement }
-    case age of
-        0..12: writeln('Child');
-        13..19: writeln('Teenager');
-        20..64: writeln('Adult');
-        else writeln('Senior');
-    end;
-end.
-```
-
-**Loops:**
-
-```objectpascal {class="highlight capsule-universal"}
-program LoopExamples;
-var
-    i, sum: integer;
-begin
-    { For loop }
-    sum := 0;
-    for i := 1 to 10 do
-        sum := sum + i;
-    writeln('Sum 1-10: ', sum);
-    
-    { While loop }
-    i := 1;
-    while i <= 5 do
-    begin
-        writeln('Count: ', i);
-        i := i + 1;
-    end;
-    
-    { Repeat-until loop }
-    i := 1;
-    repeat
-        writeln('Repeat: ', i);
-        i := i + 1;
-    until i > 3;
-end.
-```
-
-### Procedures and Functions
-
-```objectpascal {class="highlight capsule-universal"}
-program ProcedureFunctionExample;
-
-{ Procedure - performs action, no return value }
-procedure PrintMessage(msg: string);
-begin
-    writeln('Message: ', msg);
-end;
-
-{ Function - returns a value }
-function Add(a, b: integer): integer;
-begin
-    Add := a + b;  { or Result := a + b; }
-end;
-
-{ Function with multiple parameters }
-function CalculateArea(length, width: real): real;
-begin
-    CalculateArea := length * width;
-end;
-
-var
-    result: integer;
-    area: real;
-begin
-    PrintMessage('Hello from procedure!');
-    
-    result := Add(5, 3);
-    writeln('5 + 3 = ', result);
-    
-    area := CalculateArea(10.5, 8.2);
-    writeln('Area: ', area:0:2);
-end.
-```
-
-## 2. Object Pascal Extensions (Widely Supported)
-
-These features are supported by most modern Pascal implementations including Delphi, Free Pascal, and others.
-
-### Classes and Objects
-
-```objectpascal {class="highlight capsule-universal"}
-program BasicOOP;
-
-type
-    { Simple class definition }
-    TCounter = class
-    private
-        FValue: integer;
-    public
-        constructor Create;
-        procedure Increment;
-        procedure Decrement;
-        function GetValue: integer;
-    end;
-
-{ Constructor }
-constructor TCounter.Create;
-begin
-    FValue := 0;
-end;
-
-{ Methods }
-procedure TCounter.Increment;
-begin
-    FValue := FValue + 1;
-end;
-
-procedure TCounter.Decrement;
-begin
-    FValue := FValue - 1;
-end;
-
-function TCounter.GetValue: integer;
-begin
-    GetValue := FValue;
-end;
-
-{ Main program }
-var
-    counter: TCounter;
-begin
-    counter := TCounter.Create;
-    try
-        counter.Increment;
-        counter.Increment;
-        writeln('Counter value: ', counter.GetValue);
-    finally
-        counter.Free;
-    end;
-end.
-```
-
-### Inheritance and Polymorphism
-
-```objectpascal {class="highlight capsule-universal"}
-program InheritanceExample;
-
-type
-    { Base class }
-    TShape = class
-    private
-        FColor: string;
-    public
-        constructor Create(AColor: string);
-        function GetArea: real; virtual; abstract;
-        property Color: string read FColor write FColor;
-    end;
-    
-    { Derived class }
-    TCircle = class(TShape)
-    private
-        FRadius: real;
-    public
-        constructor Create(AColor: string; ARadius: real);
-        function GetArea: real; override;
-    end;
-
-{ TShape implementation }
-constructor TShape.Create(AColor: string);
-begin
-    FColor := AColor;
-end;
-
-{ TCircle implementation }
-constructor TCircle.Create(AColor: string; ARadius: real);
-begin
-    inherited Create(AColor);
-    FRadius := ARadius;
-end;
-
-function TCircle.GetArea: real;
-begin
-    GetArea := 3.14159 * FRadius * FRadius;
-end;
-
-{ Main program }
-var
-    circle: TCircle;
-begin
-    circle := TCircle.Create('Red', 5.0);
-    try
-        writeln('Circle color: ', circle.Color);
-        writeln('Circle area: ', circle.GetArea:0:2);
-    finally
-        circle.Free;
-    end;
-end.
-```
-
-## 3. Implementation-Specific Features
-
-### Free Pascal / Lazarus
-
-**Generics in Free Pascal:**
-
-```objectpascal {class="highlight capsule-fpc"}
-program FPCGenericsDemo;
-
-{$mode objfpc}{$H+}{$J-}
-
-type
-    { Generic class }
-    generic TList<T> = class
-    private
-        FItems: array of T;
-        FCount: integer;
-    public
-        procedure Add(const Item: T);
-        function Get(Index: integer): T;
-        property Count: integer read FCount;
-    end;
-
-procedure TList.Add(const Item: T);
-begin
-    SetLength(FItems, FCount + 1);
-    FItems[FCount] := Item;
-    Inc(FCount);
-end;
-
-function TList.Get(Index: integer): T;
-begin
-    if (Index >= 0) and (Index < FCount) then
-        Result := FItems[Index];
-end;
-
-type
-    TIntList = specialize TList<integer>;
-    TStringList = specialize TList<string>;
-
-var
-    intList: TIntList;
-    i: integer;
-begin
-    intList := TIntList.Create;
-    try
-        intList.Add(10);
-        intList.Add(20);
-        intList.Add(30);
-        
-        writeln('Integer list:');
-        for i := 0 to intList.Count - 1 do
-            writeln('  ', intList.Get(i));
-    finally
-        intList.Free;
-    end;
-end.
-```
-
-**Free Pascal Generics.Collections**
-
-```objectpascal {class="highlight capsule-fpc"}
-program SimpleIntegerList;
-
-{$mode objfpc}{$H+}{$J-}
-
-uses
-  Math,
-  Generics.Defaults,
-  Generics.Collections;
-
-type
-  TIntegerList = specialize TList<integer>;
-
-var
-  myIntList: TIntegerList;
-  i: integer;
-
-begin
-  // Create a new generic list
-  myIntList := TIntegerList.Create;
-  try
-    // Add some elements to the list, use Add or AddRange (append)
-    myIntList.Add(0);
-    myIntList.Add(1);
-    myIntList.AddRange([9, 8, 7, 6, 5]);
-
-    // Access the n-th element, 0-indexed
-    WriteLn('The 3rd item is: ', myIntList[2]);
-
-    // Sorting it ascending
-    myIntList.Sort;
-
-    // Iterate through the list
-    for i := 0 to myIntList.Count - 1 do
-      Writeln(myIntList[i]);
-
-    // Get the mean
-    WriteLn('The mean is: ', Math.Mean(myIntList.ToArray): 0: 2);
-
-    // Empty the list
-    myIntList.Clear;
-
-  finally
-    // Free the memory used by the list
-    myIntList.Free;
-  end;
-
-  // Pause console
-  ReadLn;
-end.
-```
-
-### Delphi
-
-**Inline variable declaration:** 
-
-Ref: https://docwiki.embarcadero.com/RADStudio/Sydney/en/Inline_Variable_Declaration
-
-```objectpascal {class="highlight capsule-delphi"}
-procedure Test;
-begin
-  var I: Integer;
-  I := 22;
-  ShowMessage (I.ToString);
-end;
-
-procedure Test2;
-begin
-  var I, K: Integer;
-  I := 22;
-  K := I + 10;
-  ShowMessage (K.ToString);
-end;
-```
-
-**Scoped inline variable:** 
-
-Ref: https://docwiki.embarcadero.com/RADStudio/Sydney/en/Inline_Variable_Declaration
-
-```objectpascal {class="highlight capsule-delphi"}
-procedure Test; // declaration and initialization in a single statement
-begin
-  var I: Integer := 22;
-  ShowMessage (I.ToString);
-end;
-
-procedure Test1; // multiple inline declarations (symbols declared when used)
-begin
-  var I: Integer := 22;
-  var J: Integer;
-  J := 22 + I;
-  var K: Integer := I + J;
-  ShowMessage (K.ToString);
-end;
-
-procedure Test2; // scope limited to local block
-begin
-  var I: Integer := 22;
-  if I > 10 then
-  begin
-    var J: Integer := 3;
-    ShowMessage (J.ToString);
-  end
-  else
-  begin
-    var K: Integer := 3;
-    ShowMessage (J.ToString); // COMPILER ERROR: “Undeclared identifier: ‘J’”
-  end;
-end;
-```
-
-**Generics:**
-
-
-```objectpascal {class="highlight capsule-delphi"}
-program GenericClassExample;
-
-{$APPTYPE CONSOLE}
-
-type
-  TMyGenericClass<T> = class
-  private
-    FValue: T;
-  public
-    constructor Create(AValue: T);
-    function GetValue: T;
-    procedure SetValue(AValue: T);
-  end;
-
-constructor TMyGenericClass<T>.Create(AValue: T);
-begin
-  FValue := AValue;
-end;
-
-function TMyGenericClass<T>.GetValue: T;
-begin
-  Result := FValue;
-end;
-
-procedure TMyGenericClass<T>.SetValue(AValue: T);
-begin
-  FValue := AValue;
-end;
-
-begin
-  // Instantiate TMyGenericClass with Integer
-  var IntInstance: TMyGenericClass<Integer>;
-  IntInstance := TMyGenericClass<Integer>.Create(10);
-  Writeln('Integer Value: ' + IntToStr(IntInstance.GetValue));
-  IntInstance.SetValue(20);
-  Writeln('New Integer Value: ' + IntToStr(IntInstance.GetValue));
-  IntInstance.Free;
-
-  // Instantiate TMyGenericClass with String
-  var StringInstance: TMyGenericClass<string>;
-  StringInstance := TMyGenericClass<string>.Create('Hello');
-  Writeln('String Value: ' + StringInstance.GetValue);
-  StringInstance.SetValue('World');
-  Writeln('New String Value: ' + StringInstance.GetValue);
-  StringInstance.Free;
-
-  Readln;
-end.
-```
-
-### Other Pascal Implementations
-
-**PascalABC.NET:**
-- .NET-based Pascal implementation
-- Modern language features
-- Integrated development environment
-- Supports both console and Windows Forms applications
-
-
-## 4. Cross-Platform Development
-
-### Universal Approaches
-
-**Console Applications:**
-
-```objectpascal {class="highlight capsule-universal"}
-program CrossPlatform;
-
-{$IFDEF WINDOWS}
-  {$APPTYPE CONSOLE}
-{$ENDIF}
-
-uses
-  {$IFDEF UNIX}
-  cthreads,
-  {$ENDIF}
-  SysUtils;
-
-begin
-  writeln('This program runs on:');
-  {$IFDEF WINDOWS}
-  writeln('- Windows');
-  {$ENDIF}
-  {$IFDEF LINUX}
-  writeln('- Linux');
-  {$ENDIF}
-  {$IFDEF DARWIN}
-  writeln('- macOS');
-  {$ENDIF}
-  
-  writeln('Pascal version: ', {$I %FPCVERSION%});
-  writeln('Target CPU: ', {$I %FPCTARGETCPU%});
-  writeln('Target OS: ', {$I %FPCTARGETOS%});
-end.
-```
-
-### Common Libraries and Frameworks
-
-**For GUI Development:**
-
-- **Lazarus LCL**: Cross-platform native widgets
-- **fpGUI**: Lightweight, custom-drawn GUI
-- **Delphi VCL & FireMonkey**: GUI Frameworks in Delphi
-
-**For Web Development:**
-
-- **Brook Framework**: Microframework for web applications
-- **Horse**: Fast, minimalist web framework
-- **Pas2JS**: Compile Pascal to JavaScript
-
-**For Database Access:**
-
-- **SQLDB**: Built-in database components
-- **ZeosLib**: High-performance database connectivity
-- **FireDAC**: Enterprise database access (Delphi)
-
-### Best Practices for Cross-Platform Code
-
-```objectpascal {class="highlight capsule-universal"}
-program BestPractices;
-
-uses
-  SysUtils, Classes
-  {$IFDEF UNIX}
-  , BaseUnix
-  {$ENDIF}
-  {$IFDEF WINDOWS}
-  , Windows
-  {$ENDIF};
-
-function GetConfigPath: string;
-begin
-  {$IFDEF WINDOWS}
-  Result := GetEnvironmentVariable('APPDATA') + '\MyApp\';
-  {$ENDIF}
-  {$IFDEF UNIX}
-  Result := GetEnvironmentVariable('HOME') + '/.config/myapp/';
-  {$ENDIF}
-end;
-
-procedure CreateDirectoryIfNotExists(const Path: string);
-begin
-  if not DirectoryExists(Path) then
-    ForceDirectories(Path);
-end;
-
-var
-  configPath: string;
-begin
-  configPath := GetConfigPath;
-  CreateDirectoryIfNotExists(configPath);
-  writeln('Config directory: ', configPath);
-end.
-```
-
-## Getting Started
-
-### Choose Your Pascal Implementation
-
-**For Beginners:**
-- **Free Pascal + Lazarus**: Free, cross-platform, excellent learning environment
-- **PascalABC.NET**: Modern features, good for education
-
-**For Professional Development:**
-- **Delphi**: Commercial, extensive libraries, Windows-focused
-- **Free Pascal**: Open source, highly compatible, cross-platform
-
-**For Web Development:**
-- **Pas2JS**: Compile Pascal to JavaScript
-- **Brook Framework**: Web applications with Free Pascal
-
-### Development Environment Setup
-
-1. **Install a Pascal compiler** (Free Pascal recommended for beginners)
-2. **Choose an IDE** (Lazarus for visual development, VS Code with Pascal extensions for text editing)
-3. **Set up your first project** using the examples above
-4. **Join the community** at [pascal-lang.org/community](/community/)
-
-### Next Steps
-
-- Explore [Learning Resources](/learn/) for tutorials and guides
-- Check out [Community Projects](/community/) for real-world examples
-- Contribute to open-source Pascal projects
-- Share your Pascal knowledge with others
-
----
-
-*This documentation covers Pascal features across multiple implementations. Code examples are marked with compatibility indicators: **UNIVERSAL** for standard Pascal features, **FPC** for Free Pascal specific features.*
-
-## Standard Library Reference
-
-### System Unit
-
-The System unit is automatically included and provides core functionality:
-
-**Memory Management:**
-```objectpascal {class="highlight capsule-fpc"}
-{ Dynamic memory allocation }
-var
-    ptr: ^integer;
-begin
-    New(ptr);           // Allocate memory
-    ptr^ := 42;         // Assign value
-    writeln(ptr^);      // Use value
-    Dispose(ptr);       // Free memory
-end;
-```
-
-**String Functions:**
-```objectpascal {class="highlight capsule-fpc"}
-program StringFunctions;
-var
-    text: string;
-    position: integer;
-begin
-    text := 'Hello, Pascal World!';
-    
-    writeln('Length: ', Length(text));
-    writeln('Uppercase: ', UpperCase(text));
-    writeln('Lowercase: ', LowerCase(text));
-    
-    position := Pos('Pascal', text);
-    writeln('Position of "Pascal": ', position);
-    
-    writeln('Substring: ', Copy(text, 8, 6)); // "Pascal"
-end.
-```
-
-### SysUtils Unit
-
-Provides extended system utilities:
-
-```objectpascal {class="highlight capsule-fpc"}
-uses SysUtils;
-
-program SysUtilsExample;
-var
-    fileName: string;
-    fileAge: integer;
-begin
-    fileName := 'example.txt';
-    
-    { File operations }
-    if FileExists(fileName) then
-    begin
-        fileAge := FileAge(fileName);
-        writeln('File exists, age: ', fileAge);
-        writeln('File size: ', FileSize(fileName), ' bytes');
-    end
-    else
-        writeln('File does not exist');
-    
-    { String formatting }
-    writeln(Format('Today is %s', [DateToStr(Date)]));
-    writeln(Format('Current time: %s', [TimeToStr(Time)]));
-end.
-```
-
-### Math Unit
-
-Mathematical functions and constants:
-
-```objectpascal {class="highlight capsule-fpc"}
-uses Math;
-
-program MathExample;
-var
-    angle, result: double;
-begin
-    angle := Pi / 4;  // 45 degrees in radians
-    
-    writeln('Sin(45°): ', Sin(angle):0:4);
-    writeln('Cos(45°): ', Cos(angle):0:4);
-    writeln('Tan(45°): ', Tan(angle):0:4);
-    
-    writeln('Square root of 16: ', Sqrt(16):0:2);
-    writeln('2 to the power of 8: ', Power(2, 8):0:0);
-    writeln('Natural log of e: ', Ln(Exp(1)):0:4);
-    
-    { Random numbers }
-    Randomize;
-    writeln('Random number (0-99): ', Random(100));
-end.
-```
-
-## Advanced Programming Patterns
-
-### Generic Programming
-
-```objectpascal {class="highlight capsule-fpc"}
-program GenericExample;
-
-{$mode objfpc}
-{$H+}
-
-type
-    generic TList<T> = class
-    private
-        FItems: array of T;
-        FCount: integer;
-    public
-        procedure Add(const Item: T);
-        function Get(Index: integer): T;
-        property Count: integer read FCount;
-    end;
-
-procedure TList.Add(const Item: T);
-begin
-    SetLength(FItems, FCount + 1);
-    FItems[FCount] := Item;
-    Inc(FCount);
-end;
-
-function TList.Get(Index: integer): T;
-begin
-    if (Index >= 0) and (Index < FCount) then
-        Result := FItems[Index]
-    else
-        raise Exception.Create('Index out of bounds');
-end;
-
-type
-    TIntegerList = specialize TList<integer>;
-    TStringList = specialize TList<string>;
-
-var
-    intList: TIntegerList;
-    strList: TStringList;
-    i: integer;
-begin
-    intList := TIntegerList.Create;
-    strList := TStringList.Create;
-    
-    try
-        { Add integers }
-        for i := 1 to 5 do
-            intList.Add(i * 10);
-        
-        { Add strings }
-        strList.Add('Apple');
-        strList.Add('Banana');
-        strList.Add('Cherry');
-        
-        { Display results }
-        writeln('Integers:');
-        for i := 0 to intList.Count - 1 do
-            writeln('  ', intList.Get(i));
-        
-        writeln('Strings:');
-        for i := 0 to strList.Count - 1 do
-            writeln('  ', strList.Get(i));
-    finally
-        intList.Free;
-        strList.Free;
-    end;
-end.
-```
-
-### Interface Programming
-
-```objectpascal {class="highlight capsule-fpc"}
-program InterfaceExample;
-
-{$mode objfpc}
-{$interfaces corba}
-
-type
-    { Interface definition }
-    IDrawable = interface
-        procedure Draw;
-        function GetArea: double;
-    end;
-    
-    { Circle implementation }
-    TCircle = class(TInterfacedObject, IDrawable)
-    private
-        FRadius: double;
-    public
-        constructor Create(ARadius: double);
-        procedure Draw;
-        function GetArea: double;
-    end;
-    
-    { Rectangle implementation }
-    TRectangle = class(TInterfacedObject, IDrawable)
-    private
-        FWidth, FHeight: double;
-    public
-        constructor Create(AWidth, AHeight: double);
-        procedure Draw;
-        function GetArea: double;
-    end;
-
-{ TCircle implementation }
-constructor TCircle.Create(ARadius: double);
-begin
-    inherited Create;
-    FRadius := ARadius;
-end;
-
-procedure TCircle.Draw;
-begin
-    writeln('Drawing a circle with radius: ', FRadius:0:2);
-end;
-
-function TCircle.GetArea: double;
-begin
-    Result := Pi * FRadius * FRadius;
-end;
-
-{ TRectangle implementation }
-constructor TRectangle.Create(AWidth, AHeight: double);
-begin
-    inherited Create;
-    FWidth := AWidth;
-    FHeight := AHeight;
-end;
-
-procedure TRectangle.Draw;
-begin
-    writeln('Drawing a rectangle: ', FWidth:0:2, ' x ', FHeight:0:2);
-end;
-
-function TRectangle.GetArea: double;
-begin
-    Result := FWidth * FHeight;
-end;
-
-{ Main program }
-var
-    shapes: array[0..1] of IDrawable;
-    shape: IDrawable;
-begin
-    { Create shapes }
-    shapes[0] := TCircle.Create(5.0);
-    shapes[1] := TRectangle.Create(4.0, 6.0);
-    
-    { Use polymorphism }
-    for shape in shapes do
-    begin
-        shape.Draw;
-        writeln('Area: ', shape.GetArea:0:2);
-        writeln;
-    end;
-end.
-```
-
-### Multi-threading
-
-```objectpascal {class="highlight capsule-fpc"}
-program ThreadExample;
-
-{$mode objfpc}
-{$H+}
-
-uses
-    Classes, SysUtils;
-
-type
-    TWorkerThread = class(TThread)
-    private
-        FThreadID: integer;
-    protected
-        procedure Execute; override;
-    public
-        constructor Create(AThreadID: integer);
-    end;
-
-constructor TWorkerThread.Create(AThreadID: integer);
-begin
-    FThreadID := AThreadID;
-    inherited Create(False); // Start immediately
-end;
-
-procedure TWorkerThread.Execute;
-var
-    i: integer;
-begin
-    for i := 1 to 5 do
-    begin
-        writeln('Thread ', FThreadID, ' - Step ', i);
-        Sleep(1000); // Wait 1 second
-    end;
-    writeln('Thread ', FThreadID, ' completed');
-end;
-
-var
-    threads: array[1..3] of TWorkerThread;
-    i: integer;
-begin
-    writeln('Starting multiple threads...');
-    
-    { Create and start threads }
-    for i := 1 to 3 do
-        threads[i] := TWorkerThread.Create(i);
-    
-    { Wait for all threads to complete }
-    for i := 1 to 3 do
-    begin
-        threads[i].WaitFor;
-        threads[i].Free;
-    end;
-    
-    writeln('All threads completed');
-end.
-```
-
-## Database Programming
-
-### SQLite Integration
-
-```objectpascal {class="highlight capsule-fpc"}
-program DatabaseExample;
-
-{$mode objfpc}
-{$H+}
-
-uses
-    Classes, SysUtils, sqldb, sqlite3conn;
-
-var
-    connection: TSQLite3Connection;
-    transaction: TSQLTransaction;
-    query: TSQLQuery;
-begin
-    { Create database components }
-    connection := TSQLite3Connection.Create(nil);
-    transaction := TSQLTransaction.Create(nil);
-    query := TSQLQuery.Create(nil);
-    
-    try
-        { Setup connection }
-        connection.DatabaseName := 'example.db';
-        connection.Transaction := transaction;
-        transaction.DataBase := connection;
-        query.DataBase := connection;
-        
-        { Open connection }
-        connection.Open;
-        
-        { Create table }
-        query.SQL.Text := 'CREATE TABLE IF NOT EXISTS users (' +
-                         'id INTEGER PRIMARY KEY, ' +
-                         'name TEXT NOT NULL, ' +
-                         'email TEXT UNIQUE)';
-        query.ExecSQL;
-        transaction.Commit;
-        
-        { Insert data }
-        query.SQL.Text := 'INSERT INTO users (name, email) VALUES (?, ?)';
-        query.Params[0].AsString := 'John Doe';
-        query.Params[1].AsString := 'john@example.com';
-        query.ExecSQL;
-        transaction.Commit;
-        
-        { Query data }
-        query.SQL.Text := 'SELECT * FROM users';
-        query.Open;
-        
-        while not query.EOF do
-        begin
-            writeln('ID: ', query.FieldByName('id').AsInteger);
-            writeln('Name: ', query.FieldByName('name').AsString);
-            writeln('Email: ', query.FieldByName('email').AsString);
-            writeln('---');
-            query.Next;
-        end;
-        
-    finally
-        query.Free;
-        transaction.Free;
-        connection.Free;
-    end;
-    
-    writeln('Database operations completed');
-end.
-```
-
-## GUI Development with Lazarus
-
-### Basic Form Application
-
-```objectpascal {class="highlight capsule-fpc"}
-unit MainForm;
-
-{$mode objfpc}{$H+}
-
-interface
-
-uses
-    Classes, SysUtils, Forms, Controls, Graphics, Dialogs, StdCtrls;
-
-type
-    TForm1 = class(TForm)
-        Button1: TButton;
-        Edit1: TEdit;
-        Label1: TLabel;
-        procedure Button1Click(Sender: TObject);
-        procedure FormCreate(Sender: TObject);
-    private
-    public
-    end;
-
-var
-    Form1: TForm1;
-
-implementation
-
-{$R *.lfm}
-
-procedure TForm1.FormCreate(Sender: TObject);
-begin
-    Caption := 'Pascal GUI Example';
-    Label1.Caption := 'Enter your name:';
-    Button1.Caption := 'Greet';
-    Edit1.Text := '';
-end;
-
-procedure TForm1.Button1Click(Sender: TObject);
-var
-    userName: string;
-begin
-    userName := Trim(Edit1.Text);
-    if userName <> '' then
-        ShowMessage('Hello, ' + userName + '!')
-    else
-        ShowMessage('Please enter your name first.');
-end;
-
-end.
-```
-
-## Performance Optimization
-
-### Memory Management Tips
-
-```objectpascal {class="highlight capsule-fpc"}
-program PerformanceExample;
-
-type
-    PIntegerArray = ^TIntegerArray;
-    TIntegerArray = array[0..0] of integer;
-
-var
-    data: PIntegerArray;
-    size, i: integer;
-begin
-    size := 1000000; // One million integers
-    
-    { Allocate memory efficiently }
-    GetMem(data, size * SizeOf(integer));
-    
-    try
-        { Initialize data }
-        for i := 0 to size - 1 do
-            data^[i] := i;
-        
-        { Process data efficiently }
-        writeln('Processing ', size, ' integers...');
-        
-        { Example: Find sum }
-        var sum: int64 := 0;
-        for i := 0 to size - 1 do
-            sum := sum + data^[i];
-        
-        writeln('Sum: ', sum);
-        
-    finally
-        { Always free allocated memory }
-        FreeMem(data);
-    end;
-end.
-```
-
-### Compiler Directives
-
-```objectpascal {class="highlight capsule-fpc"}
-program CompilerDirectives;
-
-{$mode objfpc}          // Object Pascal mode
-{$H+}                   // Long strings
-{$R+}                   // Range checking (debug)
-{$I+}                   // I/O checking
-{$Q+}                   // Overflow checking
-{$optimization level3}   // High optimization
-
-{ Conditional compilation }
-{$IFDEF DEBUG}
-    {$DEFINE VERBOSE}
-{$ENDIF}
-
-{$IFDEF WINDOWS}
-    {$DEFINE PLATFORM_SPECIFIC}
-{$ENDIF}
-
-begin
-    writeln('Pascal program with compiler directives');
-    
-    {$IFDEF VERBOSE}
-    writeln('Debug mode: Verbose output enabled');
-    {$ENDIF}
-    
-    {$IFDEF PLATFORM_SPECIFIC}
-    writeln('Windows-specific code would go here');
-    {$ENDIF}
-end.
-```
-
-## Testing and Quality Assurance
-
-### Unit Testing Framework
-
-```objectpascal {class="highlight capsule-fpc"}
-program TestExample;
-
-{$mode objfpc}
-{$H+}
-
-uses
-    Classes, SysUtils;
-
-type
-    TTestCase = class
-    private
-        FTestName: string;
-        FPassed: boolean;
-    public
-        constructor Create(const ATestName: string);
-        procedure AssertEquals(Expected, Actual: integer; const Message: string = '');
-        procedure AssertTrue(Condition: boolean; const Message: string = '');
-        property TestName: string read FTestName;
-        property Passed: boolean read FPassed;
-    end;
-
-constructor TTestCase.Create(const ATestName: string);
-begin
-    FTestName := ATestName;
-    FPassed := True;
-end;
-
-procedure TTestCase.AssertEquals(Expected, Actual: integer; const Message: string);
-begin
-    if Expected <> Actual then
-    begin
-        FPassed := False;
-        writeln('FAIL: ', FTestName);
-        writeln('  Expected: ', Expected, ', Actual: ', Actual);
-        if Message <> '' then
-            writeln('  Message: ', Message);
-    end
-    else
-        writeln('PASS: ', FTestName);
-end;
-
-procedure TTestCase.AssertTrue(Condition: boolean; const Message: string);
-begin
-    if not Condition then
-    begin
-        FPassed := False;
-        writeln('FAIL: ', FTestName);
-        if Message <> '' then
-            writeln('  Message: ', Message);
-    end
-    else
-        writeln('PASS: ', FTestName);
-end;
-
-{ Example function to test }
-function Add(a, b: integer): integer;
-begin
-    Result := a + b;
-end;
-
-function IsEven(n: integer): boolean;
-begin
-    Result := (n mod 2) = 0;
-end;
-
-{ Test cases }
-var
-    test: TTestCase;
-begin
-    writeln('Running Pascal Unit Tests');
-    writeln('========================');
-    
-    { Test addition }
-    test := TTestCase.Create('Add function test');
-    test.AssertEquals(5, Add(2, 3), 'Basic addition');
-    test.Free;
-    
-    test := TTestCase.Create('Add negative numbers');
-    test.AssertEquals(-1, Add(-3, 2), 'Adding negative numbers');
-    test.Free;
-    
-    { Test even number detection }
-    test := TTestCase.Create('Even number test');
-    test.AssertTrue(IsEven(4), '4 should be even');
-    test.Free;
-    
-    test := TTestCase.Create('Odd number test');
-    test.AssertTrue(not IsEven(3), '3 should be odd');
-    test.Free;
-    
-    writeln('Tests completed');
-end.
-```
-
-## Deployment and Distribution
-
-### Cross-Platform Compilation
-
-```bash
-# Compile for Windows (64-bit)
-fpc -Twin64 -O3 program.pas
-
-# Compile for Linux (64-bit)
-fpc -Tlinux -O3 program.pas
-
-# Compile for macOS
-fpc -Tdarwin -O3 program.pas
-
-# Create optimized release build
-fpc -O3 -Xs -XX -CX program.pas
-```
-
-### Build Scripts
-
-**Windows Batch File (build.bat):**
-```batch
-@echo off
-echo Building Pascal project...
-fpc -O3 -Xs -XX -CX src\main.pas
-if %errorlevel% == 0 (
-    echo Build successful!
-    copy main.exe bin\
-) else (
-    echo Build failed!
-)
-pause
-```
-
-**Linux Shell Script (build.sh):**
-```bash
-#!/bin/bash
-echo "Building Pascal project..."
-fpc -O3 -Xs -XX -CX src/main.pas
-if [ $? -eq 0 ]; then
-    echo "Build successful!"
-    cp main bin/
-else
-    echo "Build failed!"
-fi
-```
diff --git a/content/learn/_index.md b/content/learn/_index.md
index c0cd3b9..2eecca4 100644
--- a/content/learn/_index.md
+++ b/content/learn/_index.md
@@ -5,899 +5,279 @@ draft = false
 layout = 'single-with-sidebar'
 +++
 
-## Quick Start with Free Pascal Compiler (FPC)
+# Get Started in 30 Minutes! 🚀
 
-This quick start guide uses the Free Pascal Compiler (FPC), a free, open-source Pascal compiler that works across multiple platforms. FPC is a great choice for learning Pascal as it's widely used and well-documented.
+Welcome to Pascal! This guide will get you writing your first Pascal programs quickly using Free Pascal. Pascal is perfect for learning programming because it's clear, structured, and teaches good habits.
 
-### Installation
+## Quick Setup
 
-Choose your Pascal development environment:
+### Option 1: Try Online (No Installation) ⚡
 
-| Feature | Free Pascal Compiler (FPC) | Lazarus IDE |
-|---------|----------------------------|-------------|
-| **Type** | Command-line compiler | Visual development environment |
-| **Interface** | Terminal/command-line | Graphical IDE with forms designer |
-| **Best for** | Learning fundamentals, scripting | GUI applications, beginners |
-| **Includes** | Pascal compiler + Text-based IDE | FPC + IDE + visual designer |
-| **Platform** | Cross-platform | Cross-platform |
-| **Download** | [Download FPC](https://www.freepascal.org/) | [Download Lazarus](https://www.lazarus-ide.org/) |  
+Start coding immediately with these online compilers:
 
-### Try Online (No Installation Required)
+- **[FPC Playground](https://fpc-playground-app-mgeib.ondigitalocean.app/)** - Best for learning
+- **[OneCompiler](https://onecompiler.com/pascal)** - Simple and fast
+- **[OnlineGDB](https://www.onlinegdb.com/online_pascal_compiler)** - Has debugging features
 
-If you want to try Pascal without installing anything, you can use these online compilers (note: they have limited functionality compared to a full installation):
+### Option 2: Install on Your Computer 💻
 
-- [FPC Playground](https://fpc-playground-app-mgeib.ondigitalocean.app/) - Online Free Pascal Compiler
-- [OneCompiler](https://onecompiler.com/pascal) - Online Pascal compiler with basic features
-- [OnlineGDB](https://www.onlinegdb.com/online_pascal_compiler) - Online Pascal compiler with debugging
+| Option | Best For | Download |
+|--------|----------|----------|
+| **Lazarus IDE** | Complete beginners, GUI apps | [Download Lazarus](https://www.lazarus-ide.org/) |
+| **Free Pascal** | Command line, learning fundamentals | [Download FPC](https://www.freepascal.org/) |
 
+**Recommendation**: Start with Lazarus - it includes everything you need!
 
-## Compiling Hello World!
 
-Create a new file called `hello.pas`:
+## Your First Program - Hello World! 👋
 
-```objectpascal {class="highlight capsule-fpc"}
-{$mode objfpc}{$H+}{$J-}
+Let's write your first Pascal program. Create a file called `hello.pas`:
 
+```objectpascal {class="highlight capsule-universal"}
 program HelloWorld;
 begin
     writeln('Hello, Pascal!');
+    writeln('Welcome to programming!');
+    readln; // Wait for Enter key
 end.
 ```
 
-Compile and run:
+**How to run it:**
 
-```bash
-fpc hello.pas
-./hello
-```
-
-
-## Core Concepts
-
-### Program Structure
-
-Every Pascal program follows this basic structure:
-
-```objectpascal {class="highlight capsule-fpc"} {wrapper="highlight capsule-fpc"}
-program ProgramName;
-
-{$mode objfpc}{$H+}{$J-} // use this for modern Pascal features
-
-{ Constant declarations }
-const
-  MAX_ITEMS = 100;
-  GREETING = 'Welcome to Pascal';
-  PI = 3.14159;
-
-{ Type declarations }
-type
-  TStudent = record
-      name: string;
-      age: integer;
-  end;
-  TScoreArray = array[1..10] of integer;
-
-{ Variable declarations }
-var
-  message: string;
-  count: integer;
-  student: TStudent;
-
-{ Procedure and function declarations }
-procedure displayInfo;
-begin
-    writeln('Program: ', GREETING);
-end;
+- **Online**: Copy-paste into any online compiler and click "Run"
+- **Lazarus**: Create new program, replace code, press F9
+- **Command line**: `fpc hello.pas` then `./hello` (Linux/Mac) or `hello.exe` (Windows)
 
-{ Main program block }
-begin
-  message := GREETING;
-  count := 42;
-  writeln(message);
-  writeln('Count: ', count);
-  displayInfo;
-end.
-```
-
-### Data Types
-
-Pascal has strong typing with these fundamental and practical types:
-
-```objectpascal {class="highlight capsule-fpc"}
-var
-  // Integer types
-  age: integer;              // -2,147,483,648 to 2,147,483,647
-  population: longint;       // Same as integer
-  fileSize: int64;           // Large numbers: -9,223,372,036,854,775,808 to 9,223,372,036,854,775,807
-  count: cardinal;           // Unsigned: 0 to 4,294,967,295
-  index: word;               // Small positive: 0 to 65,535
-  flags: byte;               // Tiny values: 0 to 255
-  
-  // Real/floating point types
-  temperature: real;         // General purpose floating point
-  price: double;             // High precision: banking, scientific
-  percentage: single;        // Lower precision, memory efficient
-  saving: currency;          // Fixed-point for money calculations
-  
-  // Text and character types
-  grade: char;               // Single character
-  name: string;              // Dynamic string (unlimited length)
-  shortName: string[50];     // Fixed-length string (50 chars max)
-  unicodeStr: UnicodeString; // Unicode support for international text
-  
-  // Boolean and logical
-  isActive: boolean;         // True or false
-  hasPermission: boolean;
-  
-  // Date and time types
-  birthDate: TDateTime;      // Date and time combined
-  startTime: TTime;          // Time only
-  eventDate: TDate;          // Date only
-  
-  // Pointer and reference types
-  dataPtr: pointer;          // Generic pointer
-  objRef: TObject;           // Object reference
-  
-  // Variant types (dynamic typing)
-  dynamicValue: variant;     // Can hold any type
-  
-  // Set types (collections of values)
-  weekDays: set of (Monday, Tuesday, Wednesday, Thursday, Friday);
-  validChars: set of char;   // Set of characters
-```
-
-### Control Structures
-
-**Conditional Statements:**
-
-```objectpascal {class="highlight capsule-fpc"}
-if age >= 18 then
-  writeln('You are an adult')
-else
-  writeln('You are a minor');
-
-case grade of
-  'A': writeln('Excellent!');
-  'B': writeln('Good job!');
-  'C': writeln('Average');
-  else writeln('Keep trying!');
-end;
-```
 
-**Loops:**
+## Essential Concepts 🧠
 
-```objectpascal {class="highlight capsule-fpc"}
-{ For loop - counting up }
-for i := 1 to 10 do
-  writeln('Number: ', i);
+### Variables - Storing Information
 
-{ For loop - counting down }
-for i := 10 downto 1 do
-  writeln('Countdown: ', i);
+Think of variables as labeled boxes that hold information:
 
-{ For loop with arrays }
+```objectpascal {class="highlight capsule-universal"}
+program Variables;
 var
-  numbers: array[1..5] of integer = (10, 20, 30, 40, 50);
-  i: integer;
-begin
-  for i := 1 to 5 do
-    writeln('Array[', i, '] = ', numbers[i]);
-end;
-
-{ While loop - condition checked first }
-var
-  count: integer = 5;
-begin
-  while count > 0 do
-  begin
-    writeln('Count: ', count);
-    count := count - 1;
-  end;
-end;
-
-{ Repeat-until loop - condition checked last }
-var
-  number: integer;
-begin
-  repeat
-    write('Enter a positive number: ');
-    readln(number);
-  until number > 0;
-  writeln('You entered: ', number);
-end;
-
-{ For-in loop (modern Pascal) }
-var
-  names: array of string = ('Alice', 'Bob', 'Charlie');
-  name: string;
-begin
-  for name in names do
-    writeln('Hello, ', name);
-end;
-
-{ Nested loops - multiplication table }
-var
-  i, j: integer;
-begin
-  for i := 1 to 5 do
-  begin
-    for j := 1 to 5 do
-      write(i * j:4);  // Format with width 4
-    writeln;  // New line after each row
-  end;
-end;
-
-{ Loop control statements }
-var
-  i: integer;
-begin
-  for i := 1 to 10 do
-  begin
-    if i = 5 then
-      continue;  // Skip iteration when i = 5
-    if i = 8 then
-      break;     // Exit loop when i = 8
-    writeln(i);
-  end;
-end;
-```
-
-## Functions and Procedures
-
-Functions return values, procedures don't:
-
-```objectpascal {class="highlight capsule-fpc"}
-// Function - returns a value
-function Add(a, b: Integer): Integer;
-begin
-  Result := a + b;  // or Add := a + b;
-end;
-
-// Procedure - performs an action
-procedure PrintGreeting(const name: string);
-begin
-  writeln('Hello, ', name, '!');
-end;
-
-// Using them
-var
-  sum: Integer;
-begin
-  sum := Add(5, 3);           // sum = 8
-  PrintGreeting('Pascal');    // prints: Hello, Pascal!
+    name: string;        // Text
+    age: integer;        // Whole numbers
+    height: real;        // Decimal numbers
+    isStudent: boolean;  // True or false
+begin
+    name := 'Alice';
+    age := 20;
+    height := 5.6;
+    isStudent := true;
+    
+    writeln('Name: ', name);
+    writeln('Age: ', age);
+    writeln('Height: ', height:0:1, ' feet');
+    writeln('Student: ', isStudent);
+    
+    readln;
 end.
 ```
 
-## Practice Exercises
+**Key Points:**
 
-Try these exercises to reinforce what you've learned:
+- Declare variables with `var`
+- Assign values with `:=` (not `=`)
+- Always end statements with `;`
 
-### Exercise 1: Basic Calculator
-```objectpascal {class="highlight capsule-fpc"}
-program Calculator;
+### Making Decisions - If Statements
 
-{$mode objfpc}{$H+}{$J-} 
+Programs need to make choices based on conditions:
 
+```objectpascal {class="highlight capsule-universal"}
+program Decisions;
 var
-  num1, num2: real;
-  operation: char;
-begin
-  write('Enter first number: ');
-  readln(num1);
-  write('Enter operation (+, -, *, /): ');
-  readln(operation);
-  write('Enter second number: ');
-  readln(num2);
-  
-  case operation of
-    '+': writeln('Result: ', num1 + num2:0:2);
-    '-': writeln('Result: ', num1 - num2:0:2);
-    '*': writeln('Result: ', num1 * num2:0:2);
-    '/': if num2 <> 0 then
-           writeln('Result: ', num1 / num2:0:2)
-         else
-           writeln('Error: Division by zero!');
-    else
-      writeln('Invalid operation!');
-  end;
-end.
-```
-
-### Exercise 2: Number Guessing Game
-```objectpascal {class="highlight capsule-fpc"}
-program GuessNumber;
-
-{$mode objfpc}{$H+}{$J-} 
-var
-  secretNumber, guess, attempts: Integer;
+    age: integer;
 begin
-  Randomize;  // Initialize random number generator
-  secretNumber := Random(100) + 1;  // 1-100
-  attempts := 0;
-  
-  writeln('Guess the number between 1 and 100!');
-  
-  repeat
-    write('Enter your guess: ');
-    readln(guess);
-    Inc(attempts);
+    write('Enter your age: ');
+    readln(age);
     
-    if guess < secretNumber then
-      writeln('Too low!')
-    else if guess > secretNumber then
-      writeln('Too high!')
+    if age >= 18 then
+        writeln('You can vote!')
     else
-      writeln('Congratulations! You got it in ', attempts, ' attempts!');
-  until guess = secretNumber;
+        writeln('Too young to vote.');
+        
+    // Multiple conditions
+    if age < 13 then
+        writeln('You are a child')
+    else if age < 20 then
+        writeln('You are a teenager')
+    else
+        writeln('You are an adult');
+        
+    readln;
 end.
 ```
 
-## Next Steps
-
-Once you're comfortable with the basics above:
-
-1. **Practice More**: Write small programs using what you've learned
-2. **Learn Arrays**: Work with collections of data
-3. **Master Records**: Group related data together  
-4. **Try File I/O**: Read and write files
-5. **Explore GUI**: Use Lazarus to create visual applications
-6. **Join the Community**: Ask questions and share your progress
+### Repeating Actions - Loops
 
-## Resources
-
-- [Free Pascal Documentation](https://www.freepascal.org/docs.html)
-- [Lazarus Wiki](https://wiki.lazarus.freepascal.org/)
-- [Pascal Programming Examples](/docs/)
-- [Community Forum](/community/)
-
----
-
-## Advanced Topics
-
-The following sections are for those ready to dive deeper into Pascal programming.
-
-
-### Arrays and Data Structures
-
-**Static Arrays:**
-```objectpascal {class="highlight capsule-fpc"}
-program ArrayExample;
-
-{$mode objfpc}{$H+}{$J-} 
+Loops let you repeat code multiple times:
 
+```objectpascal {class="highlight capsule-fpc capsule-delphi"}
+program Loops;
 var
-  scores: array[1..5] of integer;
-  names: array[1..3] of string;
-  i: integer;
+    i: integer;
 begin
-  { Initialize array }
-  scores[1] := 95;
-  scores[2] := 87;
-  scores[3] := 92;
+    // Count from 1 to 5
+    writeln('Counting up:');
+    for i := 1 to 5 do
+        writeln('Number: ', i);
     
-  names[1] := 'Alice';
-  names[2] := 'Bob';
-  names[3] := 'Charlie';
+    // Count down from 5 to 1
+    writeln('Counting down:');
+    for i := 5 downto 1 do
+        writeln('Number: ', i);
     
-  { Display results }
-  for i := 1 to 3 do
-    writeln(names[i], ': ', scores[i]);
-end.
-```
-
-**Records (Structures):**
-```objectpascal {class="highlight capsule-fpc"}
-program RecordExample;
-
-{$mode objfpc}{$H+}{$J-} 
-
-type
-  TStudent = record
-    name: string;
-    age: integer;
-    grade: char;
-    gpa: real;
-  end;
-
-var
-  student: TStudent;
-begin
-  { Initialize record }
-  student.name := 'Emma Watson';
-  student.age := 20;
-  student.grade := 'A';
-  student.gpa := 3.8;
+    // While loop - keep going while condition is true
+    i := 1;
+    writeln('While loop:');
+    while i <= 3 do
+    begin
+        writeln('Step: ', i);
+        i := i + 1;
+    end;
     
-  { Display student info }
-  writeln('Student: ', student.name);
-  writeln('Age: ', student.age);
-  writeln('Grade: ', student.grade);
-  writeln('GPA: ', student.gpa:0:1);
+    readln;
 end.
 ```
 
-### File Input/Output
-
-#### Reading from Files
+## Practice Time! 🏆
 
-```objectpascal {class="highlight capsule-fpc"}
-program ReadFile;
+Let's build some real programs to practice what you've learned.
 
-{$mode objfpc}{$H+}{$J-} 
-
-uses
-  Classes, SysUtils, streamex;
+### Exercise 1: Simple Calculator
 
+```objectpascal {class="highlight capsule-universal"}
+program Calculator;
 var
-  reader: TStreamReader;
-  fileStream: TFileStream;
-  line, filename:string;
-  i: integer;
-begin
-  // filename to read
-  filename:= 'cake-ipsum-.txt';
-  try
-    fileStream := TFileStream.Create(filename, fmOpenRead);
-    try
-      reader := TStreamReader.Create(fileStream);
-      try
-        // Set line counter to 1
-        i := 1;
-        while not reader.EOF do
-        begin
-          line := reader.ReadLine;
-          WriteLn(Format('line %d is: %s', [i, line]));
-          i := i + 1;
-        end;
-      finally
-        reader.Free;
-      end;
-    finally
-      fileStream.Free;
+    num1, num2: real;
+    operation: char;
+begin
+    writeln('=== Simple Calculator ===');
+    write('Enter first number: ');
+    readln(num1);
+    write('Enter operation (+, -, *, /): ');
+    readln(operation);
+    write('Enter second number: ');
+    readln(num2);
+    
+    case operation of
+        '+': writeln('Result: ', num1 + num2:0:2);
+        '-': writeln('Result: ', num1 - num2:0:2);
+        '*': writeln('Result: ', num1 * num2:0:2);
+        '/': if num2 <> 0 then
+                 writeln('Result: ', num1 / num2:0:2)
+             else
+                 writeln('Error: Cannot divide by zero!');
+        else writeln('Error: Unknown operation!');
     end;
-  except
-    on E: Exception do
-      WriteLn('Error: ' + E.Message);
-  end;
-
-  // Pause console
-  ReadLn;
-end.
-```
-
-#### Writing to Files
-```objectpascal {class="highlight capsule-fpc"}
-program AppendTextFile;
-
-{$mode objfpc}{$H+}{$J-}
-
-uses
-  Classes, SysUtils;
-
-var
-  filename: string = 'log.txt';
-  fileStream: TFileStream;
-  size: int64;
-  newText: string;
-
-begin
-
-  // First, does the file exist?
-  if FileExists(fileName) then
-    // If yes, open the file in append mode.
-    fileStream := TFileStream.Create(filename, fmOpenWrite or fmShareDenyNone)
-  else
-    // If not, create a a new file.
-    fileStream := TFileStream.Create(filename, fmCreate);
-
-  // Next, start appending.
-  try
-    // set position at the end of the file
-    fileStream.Seek(0, soFromEnd);
-    // Write text into the file
-    newText := LineEnding + 'A new line!';
-    size := fileStream.Write(newText[1], Length(newText));
-    // Show confirmation
-    Writeln(Format('Appended %s. %d bytes written.', [filename, size]));
-  finally
-    // Free TFileStream object
-    fileStream.Free;
-  end;
-
-  // Pause console
-  WriteLn('Press Enter to quit.');
-  ReadLn;
+    
+    readln;
 end.
 ```
 
----
-
-## Debugging & Troubleshooting Guide
-
-### Getting Started with Debugging
-
-When your program doesn't work as expected, follow this step-by-step approach:
-
-#### Step 1: Read the Error Message Carefully
-- Compile errors usually tell you the exact line number and what's wrong
-- Don't ignore warnings - they often point to real problems
-- Take note of the error type (syntax error, runtime error, etc.)
-
-#### Step 2: Use WriteLn to See What's Happening
-
-The simplest and most effective debugging technique for beginners:
-
-```objectpascal {class="highlight capsule-fpc"}
-program DebugExample;
-
-{$mode objfpc}{$H+}{$J-} 
+### Exercise 2: Number Guessing Game
 
+```objectpascal {class="highlight capsule-universal"}
+program GuessingGame;
 var
-  x, y, result: Integer;
-begin
-  x := 10;
-  y := 5;
-  
-  writeln('Before calculation: x=', x, ', y=', y);
-  result := x * y;
-  writeln('After calculation: result=', result);
-  
-  if result > 40 then
-    writeln('Result is greater than 40')
-  else
-    writeln('Result is 40 or less');
-end.
-```
-
-#### Step 3: Check Your Assumptions
-
-Always validate what you think should be happening:
-
-```objectpascal {class="highlight capsule-fpc"}
-// Always validate input
-function SafeDivide(a, b: Real): Real;
+    secretNumber, guess, attempts: integer;
 begin
-  writeln('Dividing ', a:0:2, ' by ', b:0:2);
-  
-  if b = 0 then
-  begin
-    writeln('Error: Cannot divide by zero!');
-    Result := 0;
-  end
-  else
-  begin
-    Result := a / b;
-    writeln('Result: ', Result:0:2);
-  end;
-end;
-```
-
-#### Step 4: Debugging Different Scenarios
-
-**Array Operations:**
-```objectpascal {class="highlight capsule-fpc"}
-// Good - safe with bounds checking
-if (i >= 0) and (i < Length(myArray)) then
-begin
-  writeln('Setting myArray[', i, '] = ', value);
-  myArray[i] := value;
-end
-else
-  writeln('Array index error: i = ', i, ', array length = ', Length(myArray));
-```
-
-**Debugging Loops:**
-```objectpascal {class="highlight capsule-fpc"}
-for i := 0 to High(myArray) do
-begin
-  writeln('Processing item ', i, ': ', myArray[i]);  // Shows progress
-  // Your code here
-end;
-```
-
-**File Operations:**
-```objectpascal {class="highlight capsule-fpc"}
-if not FileExists(filename) then
-begin
-  writeln('File not found: ', filename);
-  Exit;
-end;
-
-writeln('Opening file: ', filename);  // Confirm file is being processed
-// File operations here
-```
-
-### Common Beginner Mistakes & Solutions
-
-Here are the most frequent issues newcomers encounter:
-
-#### Missing Semicolons
-```objectpascal {class="highlight capsule-fpc"}
-// Problem: Missing semicolons
-begin
-  writeln('Hello')     // Need semicolon here
-  writeln('World')     // And here
-end.                   // Period ends the program
-
-// Solution: Add semicolons after statements
-begin
-  writeln('Hello');    // Correct
-  writeln('World');    // Correct
+    writeln('=== Number Guessing Game ===');
+    writeln('I''m thinking of a number between 1 and 10!');
+    
+    secretNumber := 7; // In real game, this would be random
+    attempts := 0;
+    
+    repeat
+        write('Enter your guess: ');
+        readln(guess);
+        attempts := attempts + 1;
+        
+        if guess < secretNumber then
+            writeln('Too low! Try again.')
+        else if guess > secretNumber then
+            writeln('Too high! Try again.')
+        else
+            writeln('Congratulations! You got it in ', attempts, ' attempts!');
+            
+    until guess = secretNumber;
+    
+    readln;
 end.
 ```
 
-#### Array Index Errors
-```objectpascal {class="highlight capsule-fpc"}
-// Problem: Wrong array bounds
-var
-  numbers: array[1..5] of Integer;  // Arrays are 1-indexed by default
-  i: Integer;
-begin
-  for i := 0 to 5 do  // Wrong! Should start at 1, end at 5
-    numbers[i] := i * 2;
-end;
-
-// Solution: Use correct bounds
-var
-  numbers: array[1..5] of Integer;
-  i: Integer;
-begin
-  for i := 1 to 5 do  // Correct
-    numbers[i] := i * 2;
-  
-  // Or use High() function for dynamic arrays
-  for i := 0 to High(numbers) do
-    numbers[i] := i * 2;
-end;
-```
-
-#### Uninitialized Variables
-```objectpascal {class="highlight capsule-fpc"}
-// Problem: Forgetting to initialize variables
-var
-  count: Integer;
-begin
-  writeln('count: ', count); // Bad: count has undefined value
-  // ... rest of code
-end;
-
-// Solution: Always initialize variables
-var
-  count: Integer;
-begin
-  count := 0;  // Good: explicitly set initial value
-  writeln('count: ', count);
-  // ... rest of code
-end;
-```
-
-#### Case Sensitivity Confusion
-Pascal isn't case-sensitive, but being consistent helps readability:
-```objectpascal {class="highlight capsule-fpc"}
-// These are all the same to Pascal:
-WriteLn('Hello');
-writeln('Hello');
-WRITELN('Hello');
-
-// But pick one style and stick with it
-writeln('Hello');  // Most common convention
-```
-
-### Setting Up for Debugging
-
-#### Compiler Flags for Debugging
-
-Essential compiler flags when compiling from command line:
-
-```bash
-# Basic debugging
-fpc -g myprogram.pas           # Add debug info
-fpc -gl myprogram.pas          # Line info for backtraces
-fpc -gh myprogram.pas          # Memory leak detection
-
-# Runtime checks  
-fpc -Cr myprogram.pas          # Range checking
-fpc -Co myprogram.pas          # Object method checking
-
-# Combine multiple flags
-fpc -g -gl -Cr -Co myprogram.pas
-```
-
-#### Using Lazarus IDE
-
-**For Lazarus Users**: When you create a project in Lazarus and use the default **Debug** build profile, Lazarus automatically includes the necessary debugging flags (`-g`, `-gl`, `-Cr`, etc.). You don't need to add them manually - just make sure you're using the **Debug** profile instead of **Release** when developing and testing your programs.
-
-To switch build modes in Lazarus:
-1. Go to **Project** → **Project Options**
-2. Select **Compiler Options** → **Config and Target**
-3. Choose **Debug** from the build mode dropdown
-
-### Intermediate Debugging Techniques
-
-#### Using Assertions
-
-Assertions help catch problems early in development:
+## Basic Debugging 🔍
 
-```objectpascal {class="highlight capsule-fpc"}
-program AssertExample;
+When your program doesn't work as expected, try these simple debugging techniques:
 
-{$mode objfpc}{$H+}{$J-}
-{$C+}  // Enable assertions
-
-uses sysutils;
-
-// Simple function that uses assertions
-function SafeDivide(a, b: Real): Real;
-begin
-  Assert(b <> 0, 'Division by zero is not allowed!');
-  Result := a / b;
-end;
-
-// Function with array bounds checking
-function GetArrayElement(arr: array of Integer; index: Integer): Integer;
-begin
-  Assert((index >= 0) and (index <= High(arr)), 
-    Format('Index %d is out of bounds (0-%d)', [index, High(arr)]));
-  Result := arr[index];
-end;
+### 1. Use `writeln` to Check Values
 
+```objectpascal {class="highlight capsule-universal"}
+program Debug;
 var
-  numbers: array[0..4] of Integer = (10, 20, 30, 40, 50);
-  result: Real;
+    x, y, result: integer;
 begin
-  writeln('Testing assertions...');
-  
-  // This will work fine
-  result := SafeDivide(10, 2);
-  writeln('10 / 2 = ', result:0:2);
-  
-  // This will work fine
-  writeln('numbers[2] = ', GetArrayElement(numbers, 2));
-  
-  // Uncomment these lines to see assertion failures:
-  // result := SafeDivide(10, 0);  // Will trigger assertion
-  // writeln('numbers[10] = ', GetArrayElement(numbers, 10));  // Will trigger assertion
-  
-  writeln('All tests passed!');
-end.
-```
-
-#### Conditional Compilation for Debugging
-
-Use compiler directives to include debug code only when needed:
-
-```objectpascal {class="highlight capsule-fpc"}
-{$IFDEF DEBUG}
-  // Debug-specific code
-  {$DEFINE ENABLE_LOGGING}
-  const DEBUG_MODE = True;
-{$ELSE}
-  // Release configuration
-  const DEBUG_MODE = False;
-{$ENDIF}
-
-procedure DebugLog(const msg: string);
-begin
-  {$IFDEF ENABLE_LOGGING}
-  writeln('[DEBUG] ', msg);
-  {$ENDIF}
-end;
-```
-
-#### Memory Leak Detection
-
-Find memory leaks in your programs:
-
-```bash
-# Compile with heap tracing
-fpc -gh myprogram.pas
-
-# Run your program (creates heap.trc file)
-./myprogram
-
-# Check the heap.trc file for leaks
-cat heap.trc
-```
-
-### Advanced Debugging
-
-#### Exception Handling
-
-For more robust error handling:
-
-```objectpascal {class="highlight capsule-fpc"}
-uses sysutils;
-
-try
-  // Potentially problematic code
-  result := ProcessData(input);
-except
-  on E: EDivByZero do
-    writeln('Division by zero error: ', E.Message);
+    x := 10;
+    y := 5;
     
-  on E: EAccessViolation do
-  begin
-    writeln('Memory access violation:');
-    DumpExceptionBackTrace(Output);
-  end;
+    writeln('Debug: x = ', x, ', y = ', y);  // Check values
     
-  on E: Exception do
-    writeln('Error (', E.ClassName, '): ', E.Message);
+    result := x + y;
+    writeln('Debug: result = ', result);     // Check calculation
     
-  else
-    writeln('Unknown error occurred');
-end;
+    if result > 20 then
+        writeln('Result is big')
+    else
+        writeln('Result is small');
+        
+    readln;
+end.
 ```
 
-#### Using the Debugger
+### 2. Common Mistakes to Watch For
 
-When WriteLn debugging isn't enough:
+- **Assignment vs Comparison**: Use `:=` for assignment, `=` for comparison
+- **Missing semicolons**: Every statement needs `;` except before `else` and `end`
+- **Case sensitivity**: Pascal is not case-sensitive, but be consistent
+- **Parentheses**: Make sure they match `()` and `begin`/`end` pairs
 
-- **Set breakpoints** to pause execution at specific lines
-- **Step through code** line by line to see exactly what happens
-- **Watch variables** to see how values change over time
-- **Examine the call stack** to understand how you got to the current point
+### 3. Reading Error Messages
 
-#### Performance Debugging
+When you get an error:
+1. Look at the **line number** - that's where the problem is (or nearby)
+2. Read the error message carefully
+3. Common errors:
+   - "Identifier not found" = you misspelled a variable name
+   - "Type mismatch" = you're mixing different data types
+   - "Syntax error" = you have a typo or missing punctuation
 
-For timing critical sections:
-```objectpascal {class="highlight capsule-fpc"}
-uses SysUtils;
+## What's Next? 🚀
 
-var
-  StartTime, EndTime: TDateTime;
-begin
-  StartTime := Now;
-  // Your code here
-  EndTime := Now;
-  writeln('Execution time: ', FormatDateTime('hh:nn:ss.zzz', EndTime - StartTime));
-end;
-```
-
-
-
-### Debugging Checklist & Getting Help
+Congratulations! You now know the basics of Pascal programming. Here's your learning path:
 
-#### Quick Debugging Checklist
+### 🎯 **Ready for More?**
 
-**For Beginners:**
+Head over to our **[Documentation Page](/docs/)** for:
+- Advanced programming concepts (arrays, records, functions)
+- Object-oriented programming with classes
+- File handling and database programming
+- GUI development with Lazarus
+- Professional development practices
+- Implementation-specific features (Free Pascal, Delphi, etc.)
 
-1. [ ] **Read error messages carefully** - they usually point to the exact problem
-2. [ ] **Add writeln statements** around problem areas to see what's happening
-3. [ ] **Check common mistakes** - semicolons, array bounds, initialization
-4. [ ] **Test with simple values** first, then try edge cases
-5. [ ] **Ask for help** - community forums and Discord
+### 📚 **Additional Resources**
 
-**For Advanced Users:**
+- [Free Pascal Documentation](https://www.freepascal.org/docs.html) - Official FPC docs
+- [Lazarus Wiki](https://wiki.lazarus.freepascal.org/) - GUI development guide
+- [Pascal Community Forum](https://forum.lazarus.freepascal.org/) - Get help and share projects
 
-6. [ ] **Compile with debug flags**: `-g -gl -Cr` (or use Lazarus Debug profile)
-7. [ ] **Use the debugger** to step through code line by line
-8. [ ] **Check for memory leaks** with `-gh` flag and heap.trc file
-9. [ ] **Write simple tests** for your functions
-10. [ ] **Handle exceptions** properly with try/except blocks
-
-#### Common Error Types & Quick Fixes
-
-- **Compile errors**: Usually syntax problems - check semicolons, brackets, keywords
-- **Runtime errors**: Use assertions and exception handling to catch issues early
-- **Logic errors**: Add debug output and use the debugger to trace execution
-- **Memory issues**: Compile with `-gh` and check heap.trc for leaks
-- **Performance issues**: Time critical sections to identify bottlenecks
+### 💡 **Keep Practicing**
+The best way to learn programming is by doing! Try modifying the examples above, create your own small projects, and don't be afraid to experiment.
 
 ---
 
-## Getting Help
-
-When you're stuck, here's where to get help:
-
-- **Community Forums**: [Free Pascal Forum](https://forum.lazarus.freepascal.org/)
-- **Discord**: Join the [Unofficial Pascal Programming Discord Server](https://discord.com/channels/570025060312547359/570025060312547361)
-- **Documentation**: [Free Pascal Docs](https://www.freepascal.org/docs.html)
-- **Stack Overflow**: Tag your questions with `pascal`, `free-pascal` or `lazarus`
-
-**When asking for help**, include:
-
-- Your complete code (or minimal example that reproduces the problem)
-- Exact error messages
-- What you expected to happen vs. what actually happened
-- Your Free Pascal/Lazarus version and operating system
\ No newline at end of file
+**Happy coding! Welcome to the Pascal community! 🎉**
\ No newline at end of file
diff --git a/content/resources/_index.md b/content/resources/_index.md
new file mode 100644
index 0000000..c66cf50
--- /dev/null
+++ b/content/resources/_index.md
@@ -0,0 +1,219 @@
++++
+title = 'Resources'
+date = 2024-05-30T18:56:05+03:00
+draft = false
+layout = 'single-with-sidebar'
++++
+
+
+# Learning Object Pascal
+
+Welcome to the Object Pascal learning resources page! Below you'll find a curated collection of resources for learning Object Pascal across different implementations.
+
+## Getting Started
+
+### Free Pascal
+
+- [Free Pascal Reference Guide](https://www.freepascal.org/docs-html/ref/ref.html) - Detailed language reference
+- [Free Pascal User's Guide](https://www.freepascal.org/docs-html/current/user/user.html) - Getting started with the compiler
+- [Free Pascal Programmer's Guide](https://www.freepascal.org/docs-html/current/prog/prog.html) - Comprehensive programming guide
+- [Free Pascal Units Reference](https://www.freepascal.org/docs-html/current/rtl/index.html) - Standard library documentation
+- [Free Pascal Documentation](https://www.freepascal.org/docs.html) - Official documentation
+- [Free Pascal Wiki](https://wiki.freepascal.org/Main_Page) - Community-maintained knowledge base
+- [Learn Pascal in Y Minutes](https://learnxinyminutes.com/docs/pascal/) - Quick syntax reference
+
+
+### Delphi
+
+- [Delphi Documentation](https://docwiki.embarcadero.com/) - Official Embarcadero documentation
+- [Learn Delphi](https://learndelphi.org/) - Free video tutorials for beginners
+- [Delphi Basics](http://www.delphibasics.co.uk/) - Simple, clear tutorials
+
+### PascalABC.NET
+- [PascalABC.NET Official Site](http://pascalabc.net/en/) - Official website with downloads and docs
+- [PascalABC.NET Wiki](https://pascalabcnet.github.io/) - Documentation and examples
+- [PascalABC.NET on GitHub](https://github.com/pascalabcnet/pascalabcnet) - Source code and issues
+
+---
+
+## Tutorials and Cookbooks
+
+- [Free Pascal and Lazarus](http://www.freepascal.ru/download/book/tutorial_fpc&lazarus.pdf) - A textbook on programming by Alekseev E.R., Chesnokova O.V., Kucher T.V, 2021.
+- [Introduction to the Lazarus IDE](https://lazarus.bg-lazarus.com/en/categories/books/book3.html) by Lazar Hristov, 2024.
+- [Laz Planet Tutorials](https://lazplanet.blogspot.com/search/label/Tutorials)
+- [Tao Yue's Pascal Tutorial](https://www.taoyue.com/tutorials/pascal)
+- [Pascal Programming](https://www.tutorialspoint.com/pascal/index.htm) - Comprehensive tutorial at TutorialsPoint
+- [Free Pascal Cookbook](https://ikelaiah.github.io/free-pascal-cookbook/) - Practical examples and recipes
+
+---
+
+## Video Tutorials
+
+### Udemy Courses
+
+-   [Learn Pascal Programming from Scratch](https://www.udemy.com/course/learn-pascal-programming-from-scratch/?) by Stone River eLearning. Last updated 02/2017.
+-   [Learn To Program with Delphi and Object Pascal](https://www.udemy.com/course/learn-to-program-with-pascal/) by Huw Collingbourne. Last updated 02/2023.
+-   [Learn Algorithms with Object Pascal/Delphi 2022](https://www.udemy.com/course/learn-algorithms-with-object-pascal/) by Muminjon Abduraimov. Last updated 01/2023.
+
+### Swinbourne University of Technology
+
+- [Introduction to programming in Free Pascal](https://commons.swinburne.edu.au/hierarchy.do?topic=43f9f37f-41bd-4d61-9643-954a1de4a5ff)
+
+Published 2015. Last updated 2021.
+
+
+-   [0.1 Introduction to programming in FPC](https://commons.swinburne.edu.au/items/10e59366-9159-4adc-aa45-459f225817dd/1/)
+-   [0.2 Installing FPC in Linux](https://commons.swinburne.edu.au/items/cce8ad29-73f1-4e19-8e5e-ec21cc49b157/1/)
+-   [0.3 Installing FPC in macOS](https://commons.swinburne.edu.au/items/6181721e-29db-433c-8cce-c5e2a4c8a69d/1/)
+-   [0.4 Installing FPC in Windows](https://commons.swinburne.edu.au/items/87bc60ce-7ae6-43b8-851f-f689d040ec16/1/)
+-   [1.1 Programs and sequence](https://commons.swinburne.edu.au/items/48211ca9-b899-45eb-9fe0-4aeb5c9b9d1a/1/)
+-   [1.2 Programs and Procedures](https://commons.swinburne.edu.au/items/18055e35-bcd5-4251-b04d-9a9ddc88f57f/1/)
+-   [2.1 Variables](https://commons.swinburne.edu.au/items/eae98114-92a9-4b1d-b31a-f6822e289305/1/)
+-   [2.2 Procedures with parameters](https://commons.swinburne.edu.au/items/c0b1e93e-0c35-40c9-9e56-49db7e4fa5e1/1/)
+-   [2.3 Functions](https://commons.swinburne.edu.au/items/d0924baf-04b9-40a1-9e99-cbe612d95724/1/)
+-   [2.4 Hand execution](https://commons.swinburne.edu.au/items/da39028b-ee53-46fe-82c9-09c0a573cc95/1/)
+-   [3.1 Control flow](https://commons.swinburne.edu.au/items/5cd92d4b-0c7a-4111-9864-040193950d39/1/)
+-   [3.2 If statements](https://commons.swinburne.edu.au/items/2401e11b-ea15-4bf1-a06c-744bf0b094a4/1/)
+-   [3.3 Looping](https://commons.swinburne.edu.au/items/c4884589-09cd-42df-8e8c-35d856199d77/1/)
+-   [3.4 Case statements](https://commons.swinburne.edu.au/items/f6d8686b-e054-427c-ac9d-348b25f68d6c/1/)
+-   [3.5 Modules](https://commons.swinburne.edu.au/items/69197033-473b-4ec5-9947-78227d7bc7c1/1/)
+-   [3.6 File I/O](https://commons.swinburne.edu.au/items/d369f5f6-750a-42d9-be59-68ed287b7c2c/1/)
+-   [4.1 Records](https://commons.swinburne.edu.au/items/845d5925-d4b0-4958-87be-57286e620b9f/1/)
+-   [4.2 Enumerations](https://commons.swinburne.edu.au/items/f81d63e1-5d5c-4dea-8b63-8e043af87ff1/1/)
+-   [4.3 Pointers](https://commons.swinburne.edu.au/items/94a3d93b-2201-4a56-bb26-21455325b839/1/)
+-   [4.4 Function Pointers](https://commons.swinburne.edu.au/items/d05b86a1-d637-44fb-b37b-9422539bee3a/1/)
+-   [5.1 Arrays](https://commons.swinburne.edu.au/items/5885f774-a436-49b6-a47e-83e0f597034f/1/)
+-   [5.2 Dynamic arrays](https://commons.swinburne.edu.au/items/07f4ab4a-3d6e-47f4-9da6-be115e3bafad/1/)
+-   [6.1 Abstraction](https://commons.swinburne.edu.au/items/7ead1f5f-76c0-46d3-b136-5b554572b390/1/)
+
+### Tim Coates
+
+- WordPress: [https://timcoatesinsights.wordpress.com](https://timcoatesinsights.wordpress.com/)
+- [The Silver Coder](https://www.youtube.com/@silvercoder70)
+
+Last updated Aug 2025.
+
+### Hello World Computing
+
+Last updated on 30 May 2014.
+
+-   [Part 1 - Getting to know Pascal](http://www.youtube.com/watch?v=Kavjz_CXOTM)
+-   [Part 2 - Hello, World!](http://www.youtube.com/watch?v=dVkoeoIpGlE)
+-   [Part 3 - Input / Output](http://www.youtube.com/watch?v=e4xUHtRGzHM)
+-   [Part 4 - Variables and their roles](http://www.youtube.com/watch?v=mE8f60w2d48)
+-   [Part 5 - Simple Mathematics](http://www.youtube.com/watch?v=rRsE7U2eaOA)
+-   [Part 6 - Simple Calculator](http://www.youtube.com/watch?v=fhE-ctZEaa8)
+
+### SchoolFreeware
+
+- [Free Pascal Tutorial](https://www.youtube.com/playlist?list=PLB24C56953A79987A)
+
+Last updated on 2 Jul 2014.
+
+-   [1 - Getting Started - Lazarus Download Link](http://www.youtube.com/watch?v=0VPvQ_dXMhw)
+-   [2 - Math Examples](http://www.youtube.com/watch?v=rZ_2iN-64QQ)
+-   [3 - Variables and Data Types](http://www.youtube.com/watch?v=Yt-YTrabs8g)
+-   [4 - User Input](http://www.youtube.com/watch?v=-ZPUlapENNU)
+-   [5 - If Statements](http://www.youtube.com/watch?v=xp2kdOj34xE)
+-   [6 - Case Statement](http://www.youtube.com/watch?v=41uoA9PvV1k)
+-   [7 - While Loop](http://www.youtube.com/watch?v=A2ummLkXUGg)
+-   [8 - Repeat Until Loop](http://www.youtube.com/watch?v=lRRRqb6Yg_w)
+-   [9 - For Loop](http://www.youtube.com/watch?v=ofUy_ddjyhA)
+-   [10 - Input Validation](http://www.youtube.com/watch?v=ZD05Gl1bD-Q)
+-   [11 - Preventing Crashes With Val](http://www.youtube.com/watch?v=HJSfbZXX2Ro)
+-   [12 - Menus For User Friendly Programs](http://www.youtube.com/watch?v=fTH_GcB24Xc)
+-   [13 - Random Numbers Code Example](http://www.youtube.com/watch?v=qS4ufVXJeEg)
+-   [14 - Guess My Number Game](http://www.youtube.com/watch?v=oyCwGhqxFUg)
+-   [15 - Procedures](http://www.youtube.com/watch?v=39RVqGGXE-0)
+-   [16 - Passing Values To Procedures](http://www.youtube.com/watch?v=ytJiZt5WLq0)
+-   [17 - Function Examples](http://www.youtube.com/watch?v=eQh37zBWEqM)
+-   [18 - Arrays](http://www.youtube.com/watch?v=sv1GZnCx-PM)
+-   [19 - Gotoxy Screen Location](http://www.youtube.com/watch?v=mhd-xYEat4g)
+-   [20 - Parallel Arrays](http://www.youtube.com/watch?v=XqP7ml1f_9k)
+-   [21 - 2 Dimensional Arrays - Matrix](http://www.youtube.com/watch?v=F7tiVi0hcZM)
+-   [22 - Finding The Highest And Lowest Array Element](http://www.youtube.com/watch?v=BBB70uI1NT8)
+-   [23 - Preventing Duplicate Data In Arrays](http://www.youtube.com/watch?v=NauSuONa1kI)
+-   [24 - String Manipulation](http://www.youtube.com/watch?v=rqpOQtSWp-g)
+-   [25 - Palindrome Strings](http://www.youtube.com/watch?v=Vk5gye_3DD8)
+-   [26 - Separating Strings With ASCII Codes](http://www.youtube.com/watch?v=_YoAexQTD-M)
+-   [27 - Separating Strings With Ranges](http://www.youtube.com/watch?v=TjBW3EbcFdQ)
+-   [28 - Running External Programs - IE Batch MS Paint](http://www.youtube.com/watch?v=Wa4txD7QFCU)
+-   [29 - On The Record](http://www.youtube.com/watch?v=FMqXiEHxU84)
+-   [30 - Array Of Record](http://www.youtube.com/watch?v=6KZudd510C4)
+-   [31 - Making And Writing To Text Files](http://www.youtube.com/watch?v=iXix_hJMNpc)
+-   [32 - Reading Text Files](http://www.youtube.com/watch?v=FdSNlRdNtbs)
+
+### Free Pascal App Tutorial
+
+-   [App Tutorial 1 - Getting Started And Free Download Link](http://www.youtube.com/watch?v=7PuvsyLapgw)
+-   [App Tutorial 2 - Shrinking The Application File Size](http://www.youtube.com/watch?v=cm9c0FVNiuc)
+-   [App Tutorial 3 - Events Example Code](http://www.youtube.com/watch?v=PZglDDDD0w8)
+-   [App Tutorial 4 - The Meaning Of Life Explained](http://www.youtube.com/watch?v=CBzfLBBvkSo)
+-   [App Tutorial 5 - Simple Calculator Part 1 - Form Setup](http://www.youtube.com/watch?v=lyN825ELhmI)
+-   [App Tutorial 6 - Simple Calculator Part 2 - String Conversion](http://www.youtube.com/watch?v=uWvwioAbsMU)
+-   [App Tutorial 7 - Simple Calculator Part 3 - Radio Buttons](http://www.youtube.com/watch?v=wLpj5THHTY0)
+-   [App Tutorial 8 - Simple Calculator Part 4 - Try Except Error Handling](http://www.youtube.com/watch?v=fU6qVPF3TN8)
+-   [App Tutorial 9 - Simple Calculator Part 5 - Tabs - Finished Application](http://www.youtube.com/watch?v=zbZJm7oB0-Y)
+-   [App Tutorial 10 - Playing Wav Sound Files On Windows computers](http://www.youtube.com/watch?v=SkhV7FuUpI4)
+-   [App Tutorial 11 - Playing Wav Sound Files On Mac computers](http://www.youtube.com/watch?v=pHp9oGdy7Iw)
+-   [App Tutorial 12 - System Timer Bouncing Ball Animation - Shapes](http://www.youtube.com/watch?v=hNaZTtJkZ0s)
+-   [App Tutorial 13 - Bouncing Balls Animation - Parallel Arrays](http://www.youtube.com/watch?v=MahHxXEkFF0)
+-   [App Tutorial 14 - OnPaint Drawing](https://www.youtube.com/watch?v=UP7d9HyTGlE)
+
+### Marcus Fernström
+
+- [Tech & Swords](https://www.youtube.com/@TechSwords)
+
+Last updated 2022.
+
+-   [Install FreePascal, Lazarus, Packages, Cross Compilers, and OPM the EASY way](https://www.youtube.com/watch?v=Q1BQ_6w8whc&t=6s)
+-   [Lazarus build modes, cross compiling, and testing the app in a Linux virtual machine](https://www.youtube.com/watch?v=qOzreCx2xWA&t=4s)
+-   [Create REST APIs in FreePascal & Lazarus](https://www.youtube.com/watch?v=9N0cxI1Hp0U&t=2s)
+-   [Generate JSON Data in FreePascal / Lazarus](https://www.youtube.com/watch?v=EglZ_f_CGPg&t=181s)
+-   [Create REST APIs in FreePascal & Lazarus (with zoom)](https://www.youtube.com/watch?v=rEqVnwE8_Us&t=4s)
+-   [Learn how to consume JSON data in FreePascal](https://www.youtube.com/watch?v=Gy-OcEPgTHg&t=455s)
+-   [MySQL and FreePascal](https://www.youtube.com/watch?v=WpmdRWX2sl0)
+
+---
+
+## Books
+
+### Free Books
+- [Free Pascal From Square One](http://www.copperwood.com/pub/FreePascalFromSquareOne.pdf) by Jeff Duntemann
+- [Modern Object Pascal Introduction](https://castle-engine.io/modern_pascal_introduction.html) - Comprehensive modern Pascal guide
+- [Object Pascal Handbook](https://www.marcocantu.com/objectpascal/) - Free online book by Marco Cantù
+- [Essential Pascal](https://www.marcocantu.com/epascal/) - By Marco Cantù
+- [Pascal Programming](https://en.wikibooks.org/wiki/Pascal_Programming) - Wikibook
+
+---
+
+## Development Environments
+
+- [Lazarus IDE](https://www.lazarus-ide.org/) - Free cross-platform IDE for Free Pascal
+- [Delphi Community Edition](https://www.embarcadero.com/products/delphi/starter) - Free version of Delphi
+- [PascalABC.NET IDE](http://pascalabc.net/en/) - Lightweight IDE for PascalABC.NET
+- [VS Code with Pascal Extension](https://marketplace.visualstudio.com/items?itemName=alefragnani.pascal) - Lightweight Pascal support in VS Code
+
+---
+
+## Online Compilers
+
+- [OnlineGDB Pascal](https://www.onlinegdb.com/online_pascal_compiler) - Free online Pascal compiler
+- [JDoodle Free Pascal](https://www.jdoodle.com/execute-pascal-online) - Online Free Pascal environment
+- [Rextester](https://rextester.com/l/pascal_online_compiler) - Online Pascal compiler and executor
+- [FPC Playground](https://fpc-playground-app-mgeib.ondigitalocean.app/) - Compile nd run Free Pascal code in your browser
+
+
+---
+
+## News & Blogs
+
+- [Tim Coates Blog](https://timcoatesinsights.wordpress.com/) - Blogs on coding in Delphi and Free Pascal
+- [DelphiFeeds](https://delphifeeds.com/) - Aggregator of Delphi-related blogs
+- [Marco Cantù's Blog](https://blog.marcocantu.com/) - Updates from Pascal expert
+
+---
+
+## Contributing
+
+Found a great resource that's not listed here? Please [submit a pull request](https://github.com/ObjectPascal-Community/ObjectPascal-Community.github.io) to add it!
\ No newline at end of file
diff --git a/hugo.toml b/hugo.toml
index ea45f3c..82a2515 100644
--- a/hugo.toml
+++ b/hugo.toml
@@ -16,7 +16,7 @@ title = 'Object Pascal - Readable, Reliable Programming'
     codeFences = true
 
 [params]
-  description = 'Object Pascal programming language - readable, reliable, and educational'
+  description = 'Pascal programming language - readable, reliable, and educational'
   author = 'Object Pascal Community'
 
 [menu]
@@ -29,8 +29,8 @@ title = 'Object Pascal - Readable, Reliable Programming'
     url = '/learn/'
     weight = 20
   [[menu.main]]
-    name = 'Docs'
-    url = '/docs/'
+    name = 'Resources'
+    url = '/resources/'
     weight = 30
   [[menu.main]]
     name = 'Community'

From 731820cd13baf0e565663609d2e15dd7053d1194 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Mon, 11 Aug 2025 08:03:09 +1000
Subject: [PATCH 20/27] feat: added bettter Pascal learning guide with code
 examples and tutorials

---
 content/learn/_index.md | 282 +++++++++++++++++++++++++++++++++++++---
 1 file changed, 263 insertions(+), 19 deletions(-)

diff --git a/content/learn/_index.md b/content/learn/_index.md
index 2eecca4..4fb32e1 100644
--- a/content/learn/_index.md
+++ b/content/learn/_index.md
@@ -5,13 +5,15 @@ draft = false
 layout = 'single-with-sidebar'
 +++
 
-# Get Started in 30 Minutes! 🚀
+# Get Started in Quickly using Free Pascal!
 
 Welcome to Pascal! This guide will get you writing your first Pascal programs quickly using Free Pascal. Pascal is perfect for learning programming because it's clear, structured, and teaches good habits.
 
+---
+
 ## Quick Setup
 
-### Option 1: Try Online (No Installation) ⚡
+### Option 1: Try Online (No Installation)
 
 Start coding immediately with these online compilers:
 
@@ -19,7 +21,7 @@ Start coding immediately with these online compilers:
 - **[OneCompiler](https://onecompiler.com/pascal)** - Simple and fast
 - **[OnlineGDB](https://www.onlinegdb.com/online_pascal_compiler)** - Has debugging features
 
-### Option 2: Install on Your Computer 💻
+### Option 2: Install on Your Computer
 
 | Option | Best For | Download |
 |--------|----------|----------|
@@ -28,13 +30,17 @@ Start coding immediately with these online compilers:
 
 **Recommendation**: Start with Lazarus - it includes everything you need!
 
+---
 
-## Your First Program - Hello World! 👋
+## Your First Program - Hello World!
 
 Let's write your first Pascal program. Create a file called `hello.pas`:
 
 ```objectpascal {class="highlight capsule-universal"}
 program HelloWorld;
+
+{$mode objfpc}{$H+}{$J-}
+
 begin
     writeln('Hello, Pascal!');
     writeln('Welcome to programming!');
@@ -48,15 +54,19 @@ end.
 - **Lazarus**: Create new program, replace code, press F9
 - **Command line**: `fpc hello.pas` then `./hello` (Linux/Mac) or `hello.exe` (Windows)
 
+---
 
-## Essential Concepts 🧠
+## Essential Concepts
 
 ### Variables - Storing Information
 
 Think of variables as labeled boxes that hold information:
 
-```objectpascal {class="highlight capsule-universal"}
+```objectpascal {class="highlight capsule-fpc"}
 program Variables;
+
+{$mode objfpc}{$H+}{$J-}
+
 var
     name: string;        // Text
     age: integer;        // Whole numbers
@@ -79,6 +89,10 @@ end.
 
 **Key Points:**
 
+- `{$mode objfpc}{$H+}{$J-}` enable modern Object Pascal features in Free Pascal
+    - [`{$mode objfpc}`](https://wiki.freepascal.org/Mode_ObjFPC) - Enable exceptions, classes, interfaces, overloading, etc
+    - `{$H+}` - Enable long string
+    - `{$J-}` - Disable writing to constants
 - Declare variables with `var`
 - Assign values with `:=` (not `=`)
 - Always end statements with `;`
@@ -87,8 +101,11 @@ end.
 
 Programs need to make choices based on conditions:
 
-```objectpascal {class="highlight capsule-universal"}
+```objectpascal {class="highlight capsule-fpc"}
 program Decisions;
+
+{$mode objfpc}{$H+}{$J-}
+
 var
     age: integer;
 begin
@@ -116,8 +133,11 @@ end.
 
 Loops let you repeat code multiple times:
 
-```objectpascal {class="highlight capsule-fpc capsule-delphi"}
+```objectpascal {class="highlight capsule-fpc"}
 program Loops;
+
+{$mode objfpc}{$H+}{$J-}
+
 var
     i: integer;
 begin
@@ -144,14 +164,20 @@ begin
 end.
 ```
 
-## Practice Time! 🏆
+---
+
+
+## Practice Time!
 
 Let's build some real programs to practice what you've learned.
 
 ### Exercise 1: Simple Calculator
 
-```objectpascal {class="highlight capsule-universal"}
+```objectpascal {class="highlight capsule-fpc"}
 program Calculator;
+
+{$mode objfpc}{$H+}{$J-}
+
 var
     num1, num2: real;
     operation: char;
@@ -181,8 +207,11 @@ end.
 
 ### Exercise 2: Number Guessing Game
 
-```objectpascal {class="highlight capsule-universal"}
+```objectpascal {class="highlight capsule-fpc"}
 program GuessingGame;
+
+{$mode objfpc}{$H+}{$J-}
+
 var
     secretNumber, guess, attempts: integer;
 begin
@@ -210,14 +239,19 @@ begin
 end.
 ```
 
-## Basic Debugging 🔍
+---
+
+## Basic Debugging
 
 When your program doesn't work as expected, try these simple debugging techniques:
 
 ### 1. Use `writeln` to Check Values
 
-```objectpascal {class="highlight capsule-universal"}
+```objectpascal {class="highlight capsule-fpc"}
 program Debug;
+
+{$mode objfpc}{$H+}{$J-}
+
 var
     x, y, result: integer;
 begin
@@ -255,13 +289,225 @@ When you get an error:
    - "Type mismatch" = you're mixing different data types
    - "Syntax error" = you have a typo or missing punctuation
 
-## What's Next? 🚀
+---
+
+## Working with Data Structures
+
+As your programs grow, you'll need better ways to organize data. Pascal provides several powerful tools for this.
+
+### Records - Grouping Related Data
+
+Records let you group related information together:
+
+```objectpascal {class="highlight capsule-fpc"}
+program RecordsDemo;
+
+{$mode objfpc}{$H+}{$J-}
+
+type
+    TPerson = record
+        name: string;
+        age: integer;
+        email: string;
+    end;
+
+var
+    student: TPerson;
+begin
+    // Assign values
+    student.name := 'Alice';
+    student.age := 20;
+    student.email := 'alice@example.com';
+    
+    // Display information
+    writeln('Student Info:');
+    writeln('Name: ', student.name);
+    writeln('Age: ', student.age);
+    writeln('Email: ', student.email);
+end.
+```
+
+### Classes - Objects with Behavior
+
+Classes combine data and methods (functions) that work on that data:
+
+```objectpascal {class="highlight capsule-fpc"}
+program ClassesDemo;
+
+{$mode objfpc}{$H+}{$J-}
+
+type
+    TBankAccount = class
+    private
+        FBalance: real;
+    public
+        constructor Create(InitialBalance: real);
+        procedure Deposit(Amount: real);
+        procedure Withdraw(Amount: real);
+        function GetBalance: real;
+    end;
+
+constructor TBankAccount.Create(InitialBalance: real);
+begin
+    FBalance := InitialBalance;
+end;
+
+procedure TBankAccount.Deposit(Amount: real);
+begin
+    if Amount > 0 then
+        FBalance := FBalance + Amount;
+end;
+
+procedure TBankAccount.Withdraw(Amount: real);
+begin
+    if (Amount > 0) and (Amount <= FBalance) then
+        FBalance := FBalance - Amount;
+end;
+
+function TBankAccount.GetBalance: real;
+begin
+    Result := FBalance;
+end;
+
+var
+    account: TBankAccount;
+begin
+    account := TBankAccount.Create(100.0);
+    try
+        writeln('Initial balance: $', account.GetBalance:0:2);
+        
+        account.Deposit(50.0);
+        writeln('After deposit: $', account.GetBalance:0:2);
+        
+        account.Withdraw(25.0);
+        writeln('After withdrawal: $', account.GetBalance:0:2);
+    finally
+        account.Free;
+    end;
+end.
+```
+
+### Interfaces - Contracts for Classes
+
+Interfaces define what methods a class must implement:
+
+```objectpascal {class="highlight capsule-fpc"}
+program InterfacesDemo;
+
+{$mode objfpc}{$H+}{$J-}
+
+type
+    ISpeaker = interface
+        procedure Speak;
+    end;
+    
+    TPerson = class(TInterfacedObject, ISpeaker)
+    private
+        FName: string;
+    public
+        constructor Create(AName: string);
+        procedure Speak;
+    end;
+    
+    TRobot = class(TInterfacedObject, ISpeaker)
+    public
+        procedure Speak;
+    end;
+
+constructor TPerson.Create(AName: string);
+begin
+    FName := AName;
+end;
+
+procedure TPerson.Speak;
+begin
+    writeln('Hello, I am ', FName);
+end;
+
+procedure TRobot.Speak;
+begin
+    writeln('BEEP BOOP - ROBOT SPEAKING');
+end;
+
+var
+    speakers: array[1..2] of ISpeaker;
+begin
+    speakers[1] := TPerson.Create('Alice');
+    speakers[2] := TRobot.Create;
+    
+    speakers[1].Speak;  // Hello, I am Alice
+    speakers[2].Speak;  // BEEP BOOP - ROBOT SPEAKING
+end.
+```
+
+### Advanced Records - Records with Methods
+
+Modern Pascal allows records to have methods like classes:
+
+```objectpascal {class="highlight capsule-fpc"}
+program AdvancedRecordsDemo;
+
+{$mode objfpc}{$H+}{$J-}
+{$modeswitch advancedrecords}
+
+type
+    TPoint = record
+        X, Y: real;
+        procedure SetCoords(AX, AY: real);
+        function DistanceFromOrigin: real;
+        function ToString: string;
+    end;
+
+procedure TPoint.SetCoords(AX, AY: real);
+begin
+    X := AX;
+    Y := AY;
+end;
+
+function TPoint.DistanceFromOrigin: real;
+begin
+    Result := sqrt(X * X + Y * Y);
+end;
+
+function TPoint.ToString: string;
+begin
+    Result := '(' + FloatToStr(X) + ', ' + FloatToStr(Y) + ')';
+end;
+
+var
+    point1, point2: TPoint;
+begin
+    // Using methods on records
+    point1.SetCoords(3.0, 4.0);
+    writeln('Point 1: ', point1.ToString);
+    writeln('Distance from origin: ', point1.DistanceFromOrigin:0:2);
+    
+    // Direct field access still works
+    point2.X := 1.0;
+    point2.Y := 2.0;
+    writeln('Point 2: ', point2.ToString);
+    writeln('Distance from origin: ', point2.DistanceFromOrigin:0:2);
+
+end.
+```
+
+**Key Points:**
+
+- **Records**: Simple data containers, good for grouping related values
+- **Classes**: Full object-oriented programming with inheritance and polymorphism
+- **Interfaces**: Define contracts that classes must follow
+- [**Advanced Records**](https://wiki.freepascal.org/modeswitch): Combine the simplicity of records with some class features
+
+---
+
+## What's Next?
 
 Congratulations! You now know the basics of Pascal programming. Here's your learning path:
 
-### 🎯 **Ready for More?**
+### Ready for More?
+
+Head over to our **[Resources Page](/resources/)** for:
 
-Head over to our **[Documentation Page](/docs/)** for:
 - Advanced programming concepts (arrays, records, functions)
 - Object-oriented programming with classes
 - File handling and database programming
@@ -269,14 +515,12 @@ Head over to our **[Documentation Page](/docs/)** for:
 - Professional development practices
 - Implementation-specific features (Free Pascal, Delphi, etc.)
 
-### 📚 **Additional Resources**
+### Additional Resources
 
 - [Free Pascal Documentation](https://www.freepascal.org/docs.html) - Official FPC docs
 - [Lazarus Wiki](https://wiki.lazarus.freepascal.org/) - GUI development guide
 - [Pascal Community Forum](https://forum.lazarus.freepascal.org/) - Get help and share projects
 
-### 💡 **Keep Practicing**
-The best way to learn programming is by doing! Try modifying the examples above, create your own small projects, and don't be afraid to experiment.
 
 ---
 

From 0e52e7f9f46d986cbd6d5bae2a8ae9b2f472b78e Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Tue, 12 Aug 2025 06:03:57 +1000
Subject: [PATCH 21/27] feat: edits to pages

---
 content/about/_index.md | 15 +++++++++++++--
 content/learn/_index.md | 19 +++++++++----------
 layouts/index.html      |  2 +-
 3 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/content/about/_index.md b/content/about/_index.md
index d6736bc..3a48e73 100644
--- a/content/about/_index.md
+++ b/content/about/_index.md
@@ -12,6 +12,8 @@ Pascal was born from a simple yet profound philosophy: **programming should be c
 
 Wirth believed that a programming language should provide a clear conceptual framework for thinking about programming. Pascal provides exactly that—a clean, logical framework that mirrors how we naturally think about solving problems.
 
+---
+
 ## Pascal's Enduring Principles
 
 ### Readability Above All
@@ -43,6 +45,8 @@ Pascal teaches fundamental programming concepts without the complexity that can
 ### Reliability Through Structure
 Pascal's strong typing system and structured programming approach prevent entire classes of errors before they occur. The compiler catches mistakes early, leading to more robust software.
 
+---
+
 ## Pascal's Evolution and Growth
 
 Since its creation in 1970, Pascal has evolved far beyond its educational origins. Modern Pascal implementations power everything from desktop applications to web services, mobile apps to embedded systems.
@@ -51,6 +55,8 @@ The language gained massive popularity in the 1980s and 1990s with Turbo Pascal
 
 Today, Pascal continues to thrive with active development communities, modern language features, and cross-platform capabilities that rival any contemporary programming language.
 
+---
+
 ## Object Pascal: The Modern Evolution
 
 Object Pascal extends Pascal's clarity into the world of object-oriented programming. It maintains Pascal's readable syntax while adding powerful features like classes, inheritance, interfaces, and generics.
@@ -62,6 +68,8 @@ Modern Object Pascal supports:
 - **Rich ecosystems** - Comprehensive libraries and frameworks
 - **Visual development** - Integrated designers and RAD tools (Lazarus IDE, Delphi PascalABC.Net)
 
+---
+
 ## Major Implementations of Pascal
 
 Pascal, as a language family, has numerous implementations beyond the mainstream options. Each brings unique strengths and targets specific development scenarios:
@@ -132,6 +140,7 @@ Pascal, as a language family, has numerous implementations beyond the mainstream
 - Optimized code generation for resource-constrained environments
 - Pascal syntax for embedded systems programming
 
+---
 
 ## Why Pascal Matters Today
 
@@ -145,12 +154,14 @@ In an era of complex frameworks and rapidly changing technologies, Pascal's core
 
 **Cross-Platform Reality**: Today's Pascal tools enable true cross-platform development with native performance.
 
+---
+
 ## Get Started with Pascal
 
 Ready to experience Pascal's unique combination of clarity and power?
 
-- **[Learn Pascal](/learn/)** - Start with our comprehensive tutorials
-- **[Documentation](/docs/)** - Explore Pascal's features and capabilities  
+- **[Learn Pascal](/learn/)** - Start with our brief tutorials
+- **[Resources](/resources/)** - Explore Pascal's features and capabilities  
 - **[Community](/community/)** - Connect with Pascal developers worldwide
 
 Pascal isn't just a programming language—it's a philosophy of clear thinking, structured problem-solving, and elegant code. Whether you're learning your first programming concepts or building professional applications, Pascal provides the clarity and power you need to succeed.
diff --git a/content/learn/_index.md b/content/learn/_index.md
index 4fb32e1..0470bc8 100644
--- a/content/learn/_index.md
+++ b/content/learn/_index.md
@@ -5,9 +5,9 @@ draft = false
 layout = 'single-with-sidebar'
 +++
 
-# Get Started in Quickly using Free Pascal!
+**Get Started in Quickly using Free Pascal!**
 
-Welcome to Pascal! This guide will get you writing your first Pascal programs quickly using Free Pascal. Pascal is perfect for learning programming because it's clear, structured, and teaches good habits.
+Welcome to Pascal! This guide will get you writing your first Pascal programs quickly using Free Pascal.
 
 ---
 
@@ -17,9 +17,9 @@ Welcome to Pascal! This guide will get you writing your first Pascal programs qu
 
 Start coding immediately with these online compilers:
 
-- **[FPC Playground](https://fpc-playground-app-mgeib.ondigitalocean.app/)** - Best for learning
 - **[OneCompiler](https://onecompiler.com/pascal)** - Simple and fast
 - **[OnlineGDB](https://www.onlinegdb.com/online_pascal_compiler)** - Has debugging features
+- **[FPC Playground](https://fpc-playground-app-mgeib.ondigitalocean.app/)** - Best for simple codes
 
 ### Option 2: Install on Your Computer
 
@@ -43,7 +43,6 @@ program HelloWorld;
 
 begin
     writeln('Hello, Pascal!');
-    writeln('Welcome to programming!');
     readln; // Wait for Enter key
 end.
 ```
@@ -91,8 +90,8 @@ end.
 
 - `{$mode objfpc}{$H+}{$J-}` enable modern Object Pascal features in Free Pascal
     - [`{$mode objfpc}`](https://wiki.freepascal.org/Mode_ObjFPC) - Enable exceptions, classes, interfaces, overloading, etc
-    - `{$H+}` - Enable long string
-    - `{$J-}` - Disable writing to constants
+    - [`{$H+}`](https://wiki.freepascal.org/$H) - Enable long string
+    - [`{$J-}`](https://www.freepascal.org/docs-html/current/prog/progsu42.html) - Disable writing to constants
 - Declare variables with `var`
 - Assign values with `:=` (not `=`)
 - Always end statements with `;`
@@ -201,7 +200,6 @@ begin
         else writeln('Error: Unknown operation!');
     end;
     
-    readln;
 end.
 ```
 
@@ -235,7 +233,6 @@ begin
             
     until guess = secretNumber;
     
-    readln;
 end.
 ```
 
@@ -268,7 +265,6 @@ begin
     else
         writeln('Result is small');
         
-    readln;
 end.
 ```
 
@@ -314,7 +310,7 @@ type
 var
     student: TPerson;
 begin
-    // Assign values
+    // Set values
     student.name := 'Alice';
     student.age := 20;
     student.email := 'alice@example.com';
@@ -450,6 +446,9 @@ program AdvancedRecordsDemo;
 {$mode objfpc}{$H+}{$J-}
 {$modeswitch advancedrecords}
 
+uses
+  SysUtils;
+
 type
     TPoint = record
         X, Y: real;
diff --git a/layouts/index.html b/layouts/index.html
index 6ac08f4..6f25ebf 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -9,7 +9,7 @@ <h1>Pascal</h1>
                 <p class="hero-ecosystem">With Free Pascal Compiler (FPC), Delphi, PascalABC.Net, and more.</p>
                 <div class="hero-actions">
                     <a href="{{ "/learn/" | relURL }}" class="hero-cta primary">Get Started</a>
-                    <a href="{{ "/docs/" | relURL }}" class="hero-cta secondary">Documentation</a>
+                    <a href="{{ "/resources/" | relURL }}" class="hero-cta secondary">Resources</a>
                 </div>
                 <!-- <p class="version-info">Latest: Free Pascal 3.2.2 • Lazarus 4.2</p> -->
             </div>

From a125055ae75fa59adcb199b492285b9fb81baa7b Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Tue, 12 Aug 2025 06:59:20 +1000
Subject: [PATCH 22/27] fix: Updated link on the ladning page to correct
 destinations.

---
 content/learn/_index.md | 217 ++++++++++++++++++++++++++++++++++------
 layouts/index.html      |  12 +--
 2 files changed, 192 insertions(+), 37 deletions(-)

diff --git a/content/learn/_index.md b/content/learn/_index.md
index 0470bc8..ac1f515 100644
--- a/content/learn/_index.md
+++ b/content/learn/_index.md
@@ -36,7 +36,7 @@ Start coding immediately with these online compilers:
 
 Let's write your first Pascal program. Create a file called `hello.pas`:
 
-```objectpascal {class="highlight capsule-universal"}
+```objectpascal {class="highlight capsule-fpc"}
 program HelloWorld;
 
 {$mode objfpc}{$H+}{$J-}
@@ -101,30 +101,39 @@ end.
 Programs need to make choices based on conditions:
 
 ```objectpascal {class="highlight capsule-fpc"}
-program Decisions;
+program Controls;
 
 {$mode objfpc}{$H+}{$J-}
 
 var
-    age: integer;
+    score: integer;
+    grade: char;
 begin
-    write('Enter your age: ');
-    readln(age);
+    write('Enter your score (0-100): ');
+    readln(score);
     
-    if age >= 18 then
-        writeln('You can vote!')
-    else
-        writeln('Too young to vote.');
-        
-    // Multiple conditions
-    if age < 13 then
-        writeln('You are a child')
-    else if age < 20 then
-        writeln('You are a teenager')
+    // If-then-else statement
+    if score >= 90 then
+        grade := 'A'
+    else if score >= 80 then
+        grade := 'B'
+    else if score >= 70 then
+        grade := 'C'
+    else if score >= 60 then
+        grade := 'D'
     else
-        writeln('You are an adult');
+        grade := 'F';
         
-    readln;
+    writeln('Your grade is: ', grade);
+    
+    // Case statement for multiple choices
+    case grade of
+        'A': writeln('Excellent!');
+        'B': writeln('Good job!');
+        'C': writeln('Average');
+        'D': writeln('Below average');
+        'F': writeln('Failed');
+    end;
 end.
 ```
 
@@ -133,39 +142,55 @@ end.
 Loops let you repeat code multiple times:
 
 ```objectpascal {class="highlight capsule-fpc"}
-program Loops;
+program LoopsDemo;
 
 {$mode objfpc}{$H+}{$J-}
 
 var
-    i: integer;
+    i, sum: integer;
+    numbers: array[1..5] of integer;
+    num: integer;
 begin
-    // Count from 1 to 5
-    writeln('Counting up:');
+    // For loop - count from 1 to 5
+    writeln('For loop:');
     for i := 1 to 5 do
         writeln('Number: ', i);
     
-    // Count down from 5 to 1
-    writeln('Counting down:');
-    for i := 5 downto 1 do
-        writeln('Number: ', i);
+    // For-in loop with array
+    numbers[1] := 10; numbers[2] := 20; numbers[3] := 30;
+    numbers[4] := 40; numbers[5] := 50;
+    
+    writeln('For-in loop:');
+    for num in numbers do
+        writeln('Value: ', num);
     
-    // While loop - keep going while condition is true
+    // While loop - sum numbers until we reach 100
+    sum := 0;
     i := 1;
-    writeln('While loop:');
-    while i <= 3 do
+    writeln('While loop (sum until >= 100):');
+    while sum < 100 do
     begin
-        writeln('Step: ', i);
+        sum := sum + i;
+        writeln('Adding ', i, ', sum = ', sum);
         i := i + 1;
     end;
     
-    readln;
+    // Repeat-until loop - ask for positive number
+    writeln('Repeat-until loop:');
+    repeat
+        write('Enter a positive number: ');
+        readln(num);
+        if num <= 0 then
+            writeln('Please enter a positive number!');
+    until num > 0;
+    writeln('Thank you! You entered: ', num);
 end.
 ```
 
----
 
 
+---
+
 ## Practice Time!
 
 Let's build some real programs to practice what you've learned.
@@ -323,6 +348,136 @@ begin
 end.
 ```
 
+### Arrays - Static and Dynamic
+
+Arrays store multiple values of the same type:
+
+```objectpascal {class="highlight capsule-fpc"}
+program ArraysDemo;
+
+{$mode objfpc}{$H+}{$J-}
+
+var
+    // Static array - fixed size
+    staticNumbers: array[1..5] of integer;
+    
+    // Dynamic array - size can change
+    dynamicNumbers: array of integer;
+    
+    i: integer;
+begin
+    // Working with static arrays
+    writeln('Static Array:');
+    staticNumbers[1] := 10;
+    staticNumbers[2] := 20;
+    staticNumbers[3] := 30;
+    staticNumbers[4] := 40;
+    staticNumbers[5] := 50;
+    
+    for i := 1 to 5 do
+        writeln('staticNumbers[', i, '] = ', staticNumbers[i]);
+    
+    // Working with dynamic arrays
+    writeln('Dynamic Array:');
+    SetLength(dynamicNumbers, 3);  // Set size to 3 elements
+    
+    dynamicNumbers[0] := 100;  // Dynamic arrays start at index 0
+    dynamicNumbers[1] := 200;
+    dynamicNumbers[2] := 300;
+    
+    for i := 0 to High(dynamicNumbers) do
+        writeln('dynamicNumbers[', i, '] = ', dynamicNumbers[i]);
+    
+    // Resize dynamic array
+    SetLength(dynamicNumbers, 5);
+    dynamicNumbers[3] := 400;
+    dynamicNumbers[4] := 500;
+    
+    writeln('After resize:');
+    for i := 0 to High(dynamicNumbers) do
+        writeln('dynamicNumbers[', i, '] = ', dynamicNumbers[i]);
+end.
+```
+
+**Key Points:**
+
+- Use `SetLength` to resize dynamic arrays
+- Use `High` to get the highest index of an array
+
+### Generics Collections
+
+FPC 3.2.2 includes generic collections for flexible data storage:
+
+```objectpascal {class="highlight capsule-fpc"}
+program CollectionsDemo;
+
+{$mode objfpc}{$H+}{$J-}
+
+uses
+    Generics.Collections;
+
+type
+    TStringList = specialize TList<string>;
+    TIntList = specialize TList<integer>;
+    TStrIntDictionary = specialize TDictionary<string, integer>;
+
+var
+    stringList: TStringList;
+    numberList: TIntList;
+    dictionary: TStrIntDictionary;
+    i: integer;
+    key: string;
+begin
+    // Generic List of strings
+    stringList := TStringList.Create;
+    try
+        stringList.Add('Apple');
+        stringList.Add('Banana');
+        stringList.Add('Cherry');
+        
+        writeln('String List:');
+        for i := 0 to stringList.Count - 1 do
+            writeln(i + 1, '. ', stringList[i]);
+    finally
+        stringList.Free;
+    end;
+    
+    // Generic List of integers
+    numberList := TIntList.Create;
+    try
+        numberList.Add(10);
+        numberList.Add(20);
+        numberList.Add(30);
+        
+        writeln('Number List:');
+        for i := 0 to numberList.Count - 1 do
+            writeln('Item ', i, ': ', numberList[i]);
+    finally
+        numberList.Free;
+    end;
+    
+    // Dictionary (key-value pairs)
+    dictionary := TStrIntDictionary.Create;
+    try
+        dictionary.Add('Alice', 25);
+        dictionary.Add('Bob', 30);
+        dictionary.Add('Charlie', 35);
+        
+        writeln('Dictionary:');
+        for key in dictionary.Keys do
+            writeln(key, ' is ', dictionary[key], ' years old');
+    finally
+        dictionary.Free;
+    end;
+end.
+```
+
+**Key Points:**
+
+- Pair `try`/`finally` to ensure resources are cleaned up
+- Create objects using `Create`
+- Use `Free` to release resources
+
 ### Classes - Objects with Behavior
 
 Classes combine data and methods (functions) that work on that data:
diff --git a/layouts/index.html b/layouts/index.html
index 6f25ebf..2af1145 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -313,18 +313,18 @@ <h2 class="section-title">Quick Start</h2>
         <div class="cards">
             <div class="card">
                 <h3>1. Install</h3>
-                <p>Download and install Free Pascal or Lazarus IDE to start coding immediately with a complete development environment.</p>
-                <a href="{{ "/learn/#install" | relURL }}">Installation Guide →</a>
+                <p>Download and install Free Pascal or Lazarus IDE to start coding immediately.</p>
+                <a href="{{ "/learn/#quick-setup" | relURL }}">Quick Setup →</a>
             </div>
             <div class="card">
                 <h3>2. Learn</h3>
-                <p>Follow our comprehensive tutorials covering Pascal fundamentals, from basic syntax to advanced programming concepts.</p>
-                <a href="{{ "/learn/" | relURL }}">Start Learning →</a>
+                <p>Learn the essential concepts of Pascal and build your first program.</p>
+                <a href="{{ "/learn/#essential-concepts" | relURL }}">Start Learning →</a>
             </div>
             <div class="card">
                 <h3>3. Build</h3>
-                <p>Create your first Pascal program and explore our examples, from simple console apps to complex desktop applications.</p>
-                <a href="{{ "/docs/" | relURL }}">View Examples →</a>
+                <p>Explore Pascal resources; docs, examples, tutorials and more.</p>
+                <a href="{{ "/resources/" | relURL }}">View Resources →</a>
             </div>
         </div>
     </div>

From 748936bddc0e221ae5b2cf6a82223b2dcef39444 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Fri, 22 Aug 2025 08:13:26 +1000
Subject: [PATCH 23/27] Fix - Hamburger is working now, manually implemented.

---
 layouts/_default/baseof.html | 34 +++++++++++++++++++++++
 layouts/partials/header.html |  4 +--
 static/css/main.css          | 54 +++++++++++++++++++++++++++++++++++-
 3 files changed, 89 insertions(+), 3 deletions(-)

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 49c8b1f..b92916f 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -45,6 +45,8 @@
         document.addEventListener('DOMContentLoaded', function() {
             const codeTabs = document.querySelectorAll('.code-tab');
             const codeExamples = document.querySelectorAll('.code-example');
+            const mobileToggle = document.querySelector('.mobile-menu-toggle');
+            const navbarMenu = document.querySelector('.navbar-menu');
             
             codeTabs.forEach(tab => {
                 tab.addEventListener('click', () => {
@@ -62,6 +64,38 @@
                     }
                 });
             });
+
+            // Mobile menu toggle
+            if (mobileToggle && navbarMenu) {
+                const setAria = (open) => {
+                    mobileToggle.setAttribute('aria-expanded', open ? 'true' : 'false');
+                };
+                setAria(false);
+
+                mobileToggle.addEventListener('click', () => {
+                    const isOpen = navbarMenu.classList.toggle('is-open');
+                    mobileToggle.classList.toggle('active', isOpen);
+                    setAria(isOpen);
+                });
+
+                // Close menu when clicking a link (good UX)
+                navbarMenu.addEventListener('click', (e) => {
+                    if (e.target instanceof Element && e.target.closest('a')) {
+                        navbarMenu.classList.remove('is-open');
+                        mobileToggle.classList.remove('active');
+                        setAria(false);
+                    }
+                });
+
+                // Ensure menu resets when resizing to desktop
+                window.addEventListener('resize', () => {
+                    if (window.innerWidth > 768) {
+                        navbarMenu.classList.remove('is-open');
+                        mobileToggle.classList.remove('active');
+                        setAria(false);
+                    }
+                });
+            }
         });
     </script>
 </body>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 20f4bbb..85306f4 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -7,7 +7,7 @@
                 </a>
             </div>
             
-            <div class="navbar-menu">
+            <div class="navbar-menu" id="primary-navigation">
                 <ul class="navbar-nav">
                     {{ range .Site.Menus.main }}
                     <li class="nav-item">
@@ -24,7 +24,7 @@
             </div>
             
             <!-- Mobile menu button -->
-            <button class="mobile-menu-toggle" aria-label="Toggle menu">
+            <button class="mobile-menu-toggle" aria-label="Toggle menu" aria-controls="primary-navigation" aria-expanded="false">
                 <span></span>
                 <span></span>
                 <span></span>
diff --git a/static/css/main.css b/static/css/main.css
index eb1f475..713fe6c 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -115,6 +115,7 @@ a:hover {
   align-items: center;
   justify-content: space-between;
   padding: var(--spacing-md) 0;
+  position: relative;
 }
 
 .navbar-brand .logo {
@@ -182,6 +183,18 @@ a:hover {
   background-color: var(--text-primary);
   margin: 3px 0;
   transition: var(--transition);
+  transform-origin: center;
+}
+
+/* Animate hamburger -> X */
+.mobile-menu-toggle.active span:nth-child(1) {
+  transform: translateY(12px) rotate(45deg);
+}
+.mobile-menu-toggle.active span:nth-child(2) {
+  opacity: 0;
+}
+.mobile-menu-toggle.active span:nth-child(3) {
+  transform: translateY(-6px) rotate(-45deg);
 }
 
 /* Hero section */
@@ -590,12 +603,51 @@ hr {
     padding: 0 var(--spacing-md);
   }
   
+  /* Mobile dropdown menu (smooth transition) */
   .navbar-menu {
-    display: none;
+    display: flex;               /* keep layout consistent */
+    flex-direction: column;
+    position: absolute;
+    top: 100%;
+    left: 0;
+    right: 0;
+    background-color: var(--bg-primary);
+    border-bottom: 1px solid var(--border-color);
+    gap: var(--spacing-md);
+    padding: var(--spacing-md) var(--spacing-lg);
+    box-shadow: 0 8px 25px var(--shadow);
+    z-index: 110;
+    /* hidden state */
+    max-height: 0;
+    overflow: hidden;
+    opacity: 0;
+    transform: translateY(-8px);
+    pointer-events: none;
+    visibility: hidden;
+    transition: max-height 0.25s ease, opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
+  }
+  /* Shown when hamburger is toggled */
+  .navbar-menu.is-open {
+    max-height: 60vh;
+    opacity: 1;
+    transform: translateY(0);
+    pointer-events: auto;
+    visibility: visible;
+  }
+  /* Keep column layout during both open and closing transitions to prevent sideways shift */
+  .navbar-menu .navbar-nav {
+    flex-direction: column;
+    gap: var(--spacing-sm);
+  }
+  .navbar-menu.is-open .nav-link {
+    display: block;
+    padding: var(--spacing-sm) 0;
   }
   
   .mobile-menu-toggle {
     display: flex;
+    position: relative; /* allow z-index */
+    z-index: 120;       /* above the dropdown so the X isn't clipped */
   }
   
   .hero-content {

From d7f7eebbd661ad284d1a71e733ee68cffe949eb6 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Fri, 22 Aug 2025 08:19:23 +1000
Subject: [PATCH 24/27] feat: added more comments for clarity

---
 layouts/index.html  | 17 +++++++++++++++++
 static/css/main.css | 38 +++++++++++++++++++++++++++++++-------
 2 files changed, 48 insertions(+), 7 deletions(-)

diff --git a/layouts/index.html b/layouts/index.html
index 2af1145..f6ea88b 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -14,6 +14,15 @@ <h1>Pascal</h1>
                 <!-- <p class="version-info">Latest: Free Pascal 3.2.2 • Lazarus 4.2</p> -->
             </div>
             <div class="hero-code">
+                <!--
+                  Code tabs
+                  - To add a new example:
+                    1) Add a button here with data-example="yourkey"
+                    2) Add a matching <div class="code-example" id="example-yourkey"> below.
+                    3) Define a Hugo variable with backticks (e.g., $yourCode := `...`) and render with
+                       {{ highlight $yourCode "objectpascal" "linenos=false" }}
+                  - The tab switching is implemented in JS inside layouts/_default/baseof.html.
+                -->
                 <div class="code-selector">
                     <button class="code-tab active" data-example="webserver">Web Server</button>
                     <button class="code-tab" data-example="sorting">Data Processing</button>
@@ -24,6 +33,12 @@ <h1>Pascal</h1>
                     <button class="code-tab" data-example="concurrent">Concurrency</button>
                 </div>
                 
+                <!--
+                  Code examples container
+                  - Each .code-example corresponds to a tab via id="example-<key>".
+                  - We use Hugo's built-in Chroma highlighter. Language: "objectpascal"
+                  - The extra class "capsule-fpc" adds an FPC label via CSS (see static/css/main.css).
+                -->
                 <div class="code-examples">
                     <div class="code-example active" id="example-webserver">
                         {{ $webserverCode := `program webserver;
@@ -309,6 +324,7 @@ <h3>Productivity</h3>
 <!-- Getting Started Section -->
 <section class="content-section">
     <div class="container">
+        <!-- Three-step quick start cards. Update links/titles as content grows. -->
         <h2 class="section-title">Quick Start</h2>
         <div class="cards">
             <div class="card">
@@ -333,6 +349,7 @@ <h3>3. Build</h3>
 <!-- Community Section -->
 <section class="content-section" style="background-color: var(--bg-secondary);">
     <div class="container">
+        <!-- Call-to-action to join the community. Adjust copy/URL as needed. -->
         <h2 class="section-title">Join the Community</h2>
         <p style="text-align: center; font-size: 1.1rem; max-width: 600px; margin: 0 auto var(--spacing-xl);">
             Connect with Pascal developers worldwide, share knowledge, and contribute to the growing Pascal ecosystem.
diff --git a/static/css/main.css b/static/css/main.css
index 713fe6c..c6b223d 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -1,4 +1,8 @@
-/* CSS Variables for theming */
+/*
+  Global CSS variables and design system tokens.
+  These drive light/dark colors, spacing, typography, and layout.
+  If you need to tweak the look-and-feel, prefer changing these first.
+*/
 :root {
   /* Light theme colors */
   --bg-primary: #fafbfc;
@@ -32,7 +36,10 @@
   --transition: all 0.2s ease;
 }
 
-/* Dark theme colors - Professional and modern */
+/*
+  Dark theme overrides.
+  The <body> gets data-theme="dark" via JS (see baseof.html) which triggers these vars.
+*/
 [data-theme="dark"] {
   --bg-primary: #0d1117;
   --bg-secondary: #161b22;
@@ -101,7 +108,10 @@ a:hover {
   color: var(--accent-hover);
 }
 
-/* Header */
+/*
+  Header and top navigation bar.
+  The mobile experience uses a hamburger that toggles a dropdown (see media query section).
+*/
 .site-header {
   background-color: var(--bg-primary);
   border-bottom: 1px solid var(--border-color);
@@ -186,7 +196,10 @@ a:hover {
   transform-origin: center;
 }
 
-/* Animate hamburger -> X */
+/*
+  Animate hamburger -> X when menu is open.
+  JS toggles .mobile-menu-toggle.active (see baseof.html).
+*/
 .mobile-menu-toggle.active span:nth-child(1) {
   transform: translateY(12px) rotate(45deg);
 }
@@ -448,7 +461,9 @@ a:hover {
   position: relative;
 }
 
-/* Pascal compatibility capsules */
+/*
+  Compatibility "capsules" shown on code blocks (e.g., FPC). Purely decorative labels.
+*/
 .highlight.capsule-fpc::before {
   content: 'FPC';
   position: absolute;
@@ -597,13 +612,20 @@ hr {
   color: var(--text-muted);
 }
 
-/* Responsive design */
+/*
+  Responsive design
+  Mobile navigation lives here: a dropdown that expands/collapses with a smooth transition.
+*/
 @media (max-width: 768px) {
   .container {
     padding: 0 var(--spacing-md);
   }
   
-  /* Mobile dropdown menu (smooth transition) */
+  /*
+    Mobile dropdown menu (smooth transition)
+    Hidden state uses max-height + opacity + translateY for a smooth open/close.
+    We also keep the nav list in column layout in both states to avoid sideways shifting.
+  */
   .navbar-menu {
     display: flex;               /* keep layout consistent */
     flex-direction: column;
@@ -626,6 +648,7 @@ hr {
     visibility: hidden;
     transition: max-height 0.25s ease, opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
   }
+
   /* Shown when hamburger is toggled */
   .navbar-menu.is-open {
     max-height: 60vh;
@@ -634,6 +657,7 @@ hr {
     pointer-events: auto;
     visibility: visible;
   }
+
   /* Keep column layout during both open and closing transitions to prevent sideways shift */
   .navbar-menu .navbar-nav {
     flex-direction: column;

From 457a97533053417bf59af37d46f8c919f8f0e10b Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Fri, 22 Aug 2025 08:50:10 +1000
Subject: [PATCH 25/27] feat: updated code comments and modified the shadow's
 intensity of light theme.

---
 layouts/index.html  |  4 ++--
 static/css/main.css | 12 +++++++-----
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/layouts/index.html b/layouts/index.html
index f6ea88b..1734b8a 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -19,8 +19,8 @@ <h1>Pascal</h1>
                   - To add a new example:
                     1) Add a button here with data-example="yourkey"
                     2) Add a matching <div class="code-example" id="example-yourkey"> below.
-                    3) Define a Hugo variable with backticks (e.g., $yourCode := `...`) and render with
-                       {{ highlight $yourCode "objectpascal" "linenos=false" }}
+                    3) Define a Hugo variable with backticks and render with appropriate options
+
                   - The tab switching is implemented in JS inside layouts/_default/baseof.html.
                 -->
                 <div class="code-selector">
diff --git a/static/css/main.css b/static/css/main.css
index c6b223d..d9c283f 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -15,7 +15,7 @@
   --accent-hover: #0256cc;
   --border-color: #e1e4e8;
   --code-bg: #f6f8fa;
-  --shadow: rgba(27, 31, 35, 0.04);
+  --shadow: rgba(27, 31, 35, 0.25);
   
   /* Typography */
   --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
@@ -51,7 +51,7 @@
   --accent-hover: #1f6feb;
   --border-color: #30363d;
   --code-bg: #161b22;
-  --shadow: rgba(0, 0, 0, 0.4);
+  --shadow: rgba(0, 0, 0, 0.35);
 }
 
 /* Reset and base styles */
@@ -637,7 +637,6 @@ hr {
     border-bottom: 1px solid var(--border-color);
     gap: var(--spacing-md);
     padding: var(--spacing-md) var(--spacing-lg);
-    box-shadow: 0 8px 25px var(--shadow);
     z-index: 110;
     /* hidden state */
     max-height: 0;
@@ -646,9 +645,12 @@ hr {
     transform: translateY(-8px);
     pointer-events: none;
     visibility: hidden;
-    transition: max-height 0.25s ease, opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
+    transition: max-height 0.25s ease,
+                opacity 0.2s ease,
+                transform 0.2s ease,
+                visibility 0.2s ease,
+                box-shadow 0.2s ease; /* animate shadow */
   }
-
   /* Shown when hamburger is toggled */
   .navbar-menu.is-open {
     max-height: 60vh;

From 72b86de5d0e8a32c2d1d470b590c949020546682 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Fri, 22 Aug 2025 08:53:30 +1000
Subject: [PATCH 26/27] update: updated dates

---
 content/about/_index.md     | 12 +++++++-----
 content/community/_index.md |  2 +-
 content/learn/_index.md     |  2 +-
 content/resources/_index.md |  2 +-
 4 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/content/about/_index.md b/content/about/_index.md
index 3a48e73..0f249d5 100644
--- a/content/about/_index.md
+++ b/content/about/_index.md
@@ -1,8 +1,10 @@
----
-title: "About Pascal"
-description: "Learn about Pascal's philosophy, history, and the various implementations available today"
-layout: 'single-with-sidebar'
----
++++
+title = 'About Pascal'
+date = 2025-08-22T08:50:00+10:00
+draft = false
+description = 'Learn about the philosophy of Pascal history, and the various implementations available today'
+layout = 'single-with-sidebar'
++++
 
 Pascal is a programming language that embodies the principles of clarity, reliability, and educational excellence. Created by Niklaus Wirth in 1970, Pascal was designed to encourage good programming practices and make programming concepts accessible to learners while remaining powerful enough for professional software development.
 
diff --git a/content/community/_index.md b/content/community/_index.md
index b01f136..adf6d27 100644
--- a/content/community/_index.md
+++ b/content/community/_index.md
@@ -1,6 +1,6 @@
 +++
 title = 'Community'
-date = 2024-05-30T18:56:05+03:00
+date = 2025-08-22T08:50:00+10:00
 draft = false
 layout = 'single-with-sidebar'
 +++
diff --git a/content/learn/_index.md b/content/learn/_index.md
index ac1f515..13fff6b 100644
--- a/content/learn/_index.md
+++ b/content/learn/_index.md
@@ -1,6 +1,6 @@
 +++
 title = 'Learn Pascal'
-date = 2024-05-30T18:56:05+03:00
+date = 2025-08-22T08:50:00+10:00
 draft = false
 layout = 'single-with-sidebar'
 +++
diff --git a/content/resources/_index.md b/content/resources/_index.md
index c66cf50..df2f786 100644
--- a/content/resources/_index.md
+++ b/content/resources/_index.md
@@ -1,6 +1,6 @@
 +++
 title = 'Resources'
-date = 2024-05-30T18:56:05+03:00
+date = 2025-08-22T08:50:00+10:00
 draft = false
 layout = 'single-with-sidebar'
 +++

From 651772e999710cdd96fd65d5d055bf689d95a982 Mon Sep 17 00:00:00 2001
From: Iwan Kelaiah <iwan.kelaiah@gmail.com>
Date: Fri, 22 Aug 2025 08:55:12 +1000
Subject: [PATCH 27/27] feat: using cascadia mono font instead of cascadia
 code.

---
 static/css/main.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/static/css/main.css b/static/css/main.css
index d9c283f..5d726fe 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -19,7 +19,7 @@
   
   /* Typography */
   --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
-  --font-mono: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
+  --font-mono: 'SF Mono', Monaco, 'Cascadia Mono', 'Roboto Mono', Consolas, 'Courier New', monospace;
   
   /* Spacing */
   --spacing-xs: 0.25rem;