Blog/index.html at main · sam1425/Blog · 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
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
<!doctype html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="preload" as="image" href="/assets/img/background.webp">
        <link rel="stylesheet" type="text/css" href="/css/main.css" />
        <link rel="stylesheet" type="text/css" href="/css/gruv.css" />
        <link rel="icon" type="image/X-icon" href="/assets/img/kirbyj.ico" />
        <title>sam's</title>
    </head>
    <body>
        <div class="navbar">
            <span id="c0mplex">c0mplex</span>
        </div>
        <div id="content">
            <div id="leftside">
                <div id="sidebar-placeholder"></div>
            </div>
            <div class="CardContainer">
                <div class="card cardmax" >
                    <h2>
                        Welcome,
                        <span
                            class="tooltip"
                            style="
                                --tooltip-content: &quot;A frequent traveler of the digital world&quot;;
                            "
                            >surfer</span
                        >.
                    </h2>
                    <p>
                        If you've found your way here, you're likely a friend or an avid
                        explorer of the web's quieter corners. In either case,
                        welcome to this small, isolated patch of the internet.
                    </p>
                </div>
                <div class="card cardmax">
                    <h2>why neocities?</h2>
                    <p>
                        The short answer is accessibility. The longer answer is that
                        this platform provides a sense of community and personal
                        expression that makes the web feel a bit more human again.
                    </p>
                </div>

                <div class="card cardmax">
                    <h2>On games</h2>
                    <p>
                        I haven't been playing a lot lately just focusing on programming
                    </p>
                </div>

                <div class="card cardmax">
                    <h2>digital garden</h2>
                    <p>
                        I view this website as a "digital garden"—a place to
                        plant ideas, experiment with layouts, and watch things
                        grow over time. It’s not meant to be a polished
                        portfolio, but a honest reflection of what I’m
                        learning and building.
                    </p>
                </div>

                <div class="card cardmax">
                    <h2>the craft</h2>
                    <p>
                        I have a deep appreciation for the intersection of
                        logic and aesthetics. Whether it's optimizing a
                        script or hunting for the perfect pixel font, I enjoy
                        the process of making things that feel "right."
                        To me, the small details are what make a space personal.
                    </p>
                </div>

                <div class="card cardmax" id="cool-stuff">                    <h2>some thoughts:</h2>
                    <p id="random-quote"
                       class="tooltip"
                       style="--tooltip-content: 'Click for a new quote'; cursor: pointer; transition: opacity 0.4s;"
                       onclick="newQuote()">“Programming isn’t about what you know; it’s about what you can figure out.”</p>
                </div>

                <script>
                    const quotes = [
                        "If you can’t explain it simply, you don’t understand it well enough.",
                        "Any fool can write code that a computer can understand. Good programmers write code that humans can understand.",
                        "Programming is just thinking with more semicolons.",
                        "Make it work, make it right, make it fast.",
                        "Are you a double? The thought of you always floats inside my head.",
                        "Fork my heart because I'm ready to commit ",
                        "I must be an exception because you have sure caught me. ",
                        "with all the variables in life...baby can you be my constant...",
                        "Are you a computer keyboard? Because you're my type.",
                        "Ah! is the Element of Surprise",
                        "You don't have to be a genius to code, do you have to be a genius to read?",
                        "In another life, I would've loved just doing laundry and taxes with you.",
                        "The only thing I do know, is that we have to be kind",
                        "There are 10 kins of people in the world... those who understand binary and those who don't",
                        "Decay seems to happen when you’re looking away",
                        "Above all else, guard your heart, for everything you do flows from it.",
                        "Those who blame their mistakes on everything but themselves they are doomed to repeat it"
                    ];
                    function newQuote() {
                        const el = document.getElementById('random-quote');

                        // Remove the tooltip hint after the first interaction
                        if (el.classList.contains('tooltip')) {
                            el.classList.remove('tooltip');
                        }

                        const q = quotes[Math.floor(Math.random() * quotes.length)];
                        el.style.opacity = 0;
                        setTimeout(() => {
                            el.textContent = `“${q}”`;
                            el.style.opacity = 1;
                        }, 200);
                    }
                </script>
            </div>

            <div id="sidebar2-placeholder"></div>
        </div>

        <footer></footer>

        <script src="/js/spa.js"></script>
    </body>
</html>