foxphantom203.github.io/index.html at main · FoxPhantom203/foxphantom203.github.io · 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
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="FoxPhantom203 — Creative fox portfolio with Foxor AI widgets and multiple styles.">
<title>FoxPhantom203 | Foxor AI</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Orbitron:wght@500;700&family=Fredoka:wght@400;500;600;700&family=Share+Tech+Mono&family=Press+Start+2P&display=swap" rel="stylesheet">
<link rel="stylesheet" href="styles.css">
  <link rel="stylesheet" href="immersive.css">
</head>
<body data-style="default">
<div class="orb orb-1" aria-hidden="true"></div>
<div class="orb orb-2" aria-hidden="true"></div>
<div class="orb orb-3" aria-hidden="true"></div>

<!-- Packed links — fixed top-left corner -->
<div class="packed-links" id="packedLinks">
  <button type="button" class="packed-btn" id="packedBtn" aria-expanded="false" aria-controls="packedMenu">
    <span class="packed-icon">🔗</span>
    <span class="packed-text" data-i18n="links">Links</span>
    <span class="packed-chevron">▾</span>
  </button>
  <div class="packed-menu" id="packedMenu" role="menu">
    <a href="https://archive.org/details/@architect787" target="_blank" rel="noopener noreferrer" class="packed-item" role="menuitem">
      <span class="packed-item-icon">🏛️</span>
      <span>
        <strong data-i18n="ia">Internet Archive</strong>
        <small>@architect787</small>
      </span>
    </a>
    <a href="#" class="packed-item mock" title="Mock YouTube channel" role="menuitem">
      <span class="packed-item-icon">▶️</span>
      <span>
        <strong data-i18n="ytFox">YouTube · FoxPhantom</strong>
        <small data-i18n="comingSoonMock">Mock channel · coming soon</small>
      </span>
    </a>
    <a href="#" class="packed-item mock" title="Mock YouTube channel" role="menuitem">
      <span class="packed-item-icon">🎮</span>
      <span>
        <strong data-i18n="ytGames">YouTube · Games & Builds</strong>
        <small data-i18n="comingSoonMock">Mock channel · coming soon</small>
      </span>
    </a>
    <a href="https://github.com/FoxPhantom203" target="_blank" rel="noopener noreferrer" class="packed-item" role="menuitem">
      <span class="packed-item-icon">💻</span>
      <span>
        <strong>GitHub</strong>
        <small>@FoxPhantom203</small>
      </span>
    </a>
    <div class="packed-item coming-soon" role="menuitem">
      <span class="packed-item-icon">✨</span>
      <span>
        <strong data-i18n="moreLinks">More links</strong>
        <small data-i18n="comingSoon">Coming soon…</small>
      </span>
    </div>
  </div>
</div>

<div class="page">
  <aside class="profile">
    <div class="deco-row" aria-hidden="true">✦ 🦊 ✦</div>
    <div class="avatar-wrap" id="avatar" role="button" tabindex="0" aria-label="Fox avatar">🦊</div>
    <h1>FoxPhantom203</h1>
    <p class="tagline" data-i18n="tagline">Creative fox · coding & building</p>

    <!-- Language -->
    <div class="styles-panel lang-panel">
      <label class="styles-label" for="langSelect" data-i18n="language">Language</label>
      <select id="langSelect" class="style-select" aria-label="Choose language">
        <option value="en">English (US)</option>
        <option value="ru">Русский</option>
        <option value="tr">Türkçe</option>
        <option value="no">Norsk</option>
        <option value="lt">Lietuvių</option>
        <option value="ar">العربية</option>
        <option value="ja">日本語</option>
        <option value="ko">한국어</option>
        <option value="zh-Hans">简体中文</option>
        <option value="zh-Hant">繁體中文</option>
        <option value="la">Latina</option>
        <option value="cu">Црькъвьнословѣньскъ</option>
        <option value="shx">Shakespearean English</option>
        <option value="lol">LOLCAT</option>
        <option value="en-AU">English (Australia)</option>
      </select>
    </div>

    <!-- Styles feature -->
    <div class="styles-panel">
      <label class="styles-label" for="styleSelect" data-i18n="style">Style</label>
      <select id="styleSelect" class="style-select" aria-label="Choose site style">
        <option value="default" data-i18n="styleDefault">Default</option>
        <option value="playful" data-i18n="stylePlayful">Playful Minimalism</option>
        <option value="scifi" data-i18n="styleScifi">Sci-Fi Dystopia</option>
        <option value="voxel" data-i18n="styleVoxel">Voxel</option>
        <option value="aurora" data-i18n="styleAurora">Aurora</option>
      </select>
    </div>

    <div class="links">
      <a href="https://github.com/FoxPhantom203" target="_blank" rel="noopener">GitHub</a>
      <a class="secondary" href="games/" data-i18n="games">Games</a>
      <a class="secondary" href="mailto:foxphantom203@tutamail.com" data-i18n="email">Email</a>
    </div>
    <button type="button" class="cursor-toggle" id="cursorToggle" data-i18n="toggleCursor">Toggle Foxy Cursor</button>
    <p class="oss"><span data-i18n="ossBefore">Foxor AI is</span> <strong data-i18n="ossStrong">open source</strong> <span data-i18n="ossAfter">on this site. Fork the</span> <a href="https://github.com/FoxPhantom203/foxphantom203.github.io" target="_blank" rel="noopener" data-i18n="repo">repo</a>.</p>
    <div class="clock" id="clock"></div>
  </aside>
  <div class="widget-container">
    <div class="widget-header">
      <span class="widget-title" data-i18n="widgetsTitle">Foxor AI Widgets</span>
      <div class="widget-nav">
        <button class="widget-nav-btn prev" aria-label="Previous">‹</button>
        <button class="widget-nav-btn next" aria-label="Next">›</button>
      </div>
    </div>
    <div class="widget-scroll">
      <div class="window material-window"><div class="window-header material-header"><span class="window-title">Foxor AI</span><div class="window-controls"><span class="window-dot"></span><span class="window-dot"></span><span class="window-dot"></span></div></div><div class="window-content material-content" data-i18n="wFoxor">Chat with Foxor AI — open-source assistant</div></div>
      <div class="window"><div class="window-header"><span class="window-title" data-i18n="games">Games</span><div class="window-controls"><span class="window-dot"></span><span class="window-dot"></span><span class="window-dot"></span></div></div><div class="window-content" data-i18n="wGames">Snake, Memory, Reaction, Clicker, Maze</div></div>
      <div class="window"><div class="window-header"><span class="window-title" data-i18n="codeSamples">Code Samples</span><div class="window-controls"><span class="window-dot"></span><span class="window-dot"></span><span class="window-dot"></span></div></div><div class="window-content">Python, JavaScript, Rust, Go, Java</div></div>
      <div class="window"><div class="window-header"><span class="window-title" data-i18n="projects">Projects</span><div class="window-controls"><span class="window-dot"></span><span class="window-dot"></span><span class="window-dot"></span></div></div><div class="window-content" data-i18n="wProjects">Web pages and creative builds</div></div>
      <div class="window"><div class="window-header"><span class="window-title" data-i18n="about">About</span><div class="window-controls"><span class="window-dot"></span><span class="window-dot"></span><span class="window-dot"></span></div></div><div class="window-content" data-i18n="wAbout">FoxPhantom203 creative portfolio</div></div>
      <div class="window"><div class="window-header"><span class="window-title" data-i18n="contact">Contact</span><div class="window-controls"><span class="window-dot"></span><span class="window-dot"></span><span class="window-dot"></span></div></div><div class="window-content" data-i18n="wContact">Email & GitHub for collaboration</div></div>
    </div>
  </div>
  <div class="switch-vercel-wrap">
    <a class="switch-vercel-btn" id="switchVercel" href="https://foxphantom203-two.vercel.app" target="_blank" rel="noopener noreferrer">
      <svg class="vercel-mark" viewBox="0 0 76 65" aria-hidden="true"><path d="M37.5274 0L75.0548 65H0L37.5274 0Z"/></svg>
      <span data-i18n="switchVercel">Switch To Vercel</span>
    </a>
    <a class="switch-vercel-btn switch-hatchable-btn" id="switchHatchable" href="https://foxphantom203.hatchable.site/?_hbpvclear=1" target="_blank" rel="noopener noreferrer">
      <span>Switch to Hatchable</span>
    </a>
  </div>
  <footer>
    <a href="games/" data-i18n="games">Games</a> ·
    <a href="https://github.com/FoxPhantom203/foxphantom203.github.io" data-i18n="source">Source</a> ·
    <a href="https://archive.org/details/@architect787" target="_blank" rel="noopener">IA @architect787</a> ·
    foxphantom203.github.io
  </footer>
</div>
<script src="app.js?v=languages-2"></script>
<script src="immersive.js"></script>
</body>
</html>