borderless-deviant/about.html at main · dev-without-borders/borderless-deviant · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>borderless deviant - Zu Mir</title>

    <!-- Anti-White-Flash Script -->
    <script>
        (function() {
            // Holt Einstellung oder nimmt 'dark' als Standard
            const savedTheme = localStorage.getItem('theme') || 'dark';
            document.documentElement.setAttribute('data-theme', savedTheme);
        })();
    </script>

<link rel="stylesheet" href="css/variables.css">
<link rel="stylesheet" href="css/global.css">
<link rel="stylesheet" href="css/typography.css">
<link rel="stylesheet" href="css/layout.css">
<link rel="stylesheet" href="css/components.css">
<link rel="stylesheet" href="css/forms.css">
<link rel="stylesheet" href="css/utilities.css">
<link rel="stylesheet" href="css/site-about.css">
</head>
<body>
    <my-header></my-header>
    <my-nav></my-nav>

    <main class="container text-content">
        <section class="page-header">
            <h2>Über mich & das Projekt</h2>
        </section>

        <article class="card">
            <section>
                <h3>Was ist Borderless Deviant?</h3>
                <p>
                    Borderless Deviant ist der bewusste Bruch mit der Nische. Es ist eine digitale Nachdenkstube an der Schnittstelle von Technologie, Gesellschaft und Selbstoptimierung.
                </p>
                <p>
                    Hier treffen FPGA-Hardware auf Lobbymonitoring und ADHS-Deep-Dives auf puristische Web-Architektur. Ein Versuch, über 700 Notizen aus meiner privaten Obsidian-Vault strukturiert nach außen zu bringen – ohne Redaktionsplan und ohne den Zwang zum perfekten Hochglanz-Content.
                </p>
            </section>

            <section>
                <h3>Warum das Ganze?</h3>
                <ul>
                    <li><strong>Strukturierung durch Output:</strong> Der Zwang zur Einordnung schärft das eigene Denken.</li>
                    <li><strong>Connecting the Dots:</strong> Sichtbarmachen von Verbindungen zwischen scheinbar getrennten Themenwelten.</li>
                    <li><strong>Experimentierfeld:</strong> Ein Spielplatz für Obsidian-Workflows und Web-Technologien "close to the metal".</li>
                    <li><strong>Archiv:</strong> Ein Persistenz-Layer für Gedanken, die im Feed-Rauschen sonst verloren gehen.</li>
                </ul>
            </section>

            <section>
                <h3>Wer schreibt hier?</h3>
                <p>
                    Ein Entwickler und Analyst, der Systeme verstehen will – egal ob es sich um Legacy-Code, gesellschaftliche Strukturen oder die eigene Neurodiversität handelt.
                </p>
                <p>
                    Ich bin Fan von technischer Autonomie und "Reparieren statt Wegwerfen". In diesem Projekt nehme ich die Rolle des Gärtners und Mechanikers gleichzeitig ein: Ich refactore historisch gewachsenes Chaos in funktionierende Strukturen und lasse dabei Neues wachsen.
                </p>
            </section>

            <section>
                <h3>Tech-Stack & Philosophie</h3>
                <p>
                    Dieses Projekt ist bewusstes "Slow Web".
                </p>
                <ul style="list-style-type: square; margin-left: 20px;">
                    <li><strong>Frontend:</strong> Vanilla JS, HTML, CSS. Keine Frameworks, kein React-Overhead.</li>
                    <li><strong>Daten:</strong> JSON-Dateien statt Datenbank.</li>
                    <li><strong>Workflow:</strong> Geschrieben in Obsidian, gehostet auf NeoCities.</li>
                </ul>
            </section>
        </article>
    </main>

    <my-footer></my-footer>

    <script src="/js/layout-components.js" defer></script>
    <script type="module" src="/js/main.js"></script>
</body>
</html>