add KAO banner

re-adding everything since repo moved
Update a few things
2026-08-06 20:46:08 -05:00 · 2026-08-06 20:41:00 -05:00 · 2026-03-15 20:50:30 -05:00 · 2026-01-31 22:14:27 -06:00 · 2026-01-31 21:44:45 -06:00 · 2026-01-31 21:44:05 -06:00
47 changed files with 397 additions and 40 deletions
--- a/.gitignore
+++ b/.gitignore
--- a/LICENSE.txt
+++ b/LICENSE.txt
--- a/README.md
+++ b/README.md
--- a/colorpallete.png
+++ b/colorpallete.png
--- a/critterfolio/critterfolio.apk
+++ b/critterfolio/critterfolio.apk
--- a/critterfolio/icon.ico
+++ b/critterfolio/icon.ico
--- a/critterfolio/icon.svg
+++ b/critterfolio/icon.svg
--- a/critterfolio/index.html
+++ b/critterfolio/index.html
--- a/css/main.css
+++ b/css/main.css
@@ -1,6 +1,11 @@
 :root {
  --color-background: #010101;
-  --color-foreground: #aa0000;
+  --color-foreground: #4d6e8d;
  --frame-spacing: 15px;
  --frame-border-radius: 10px;
  --main-view-width: 80vw;
 }
 * {
@@ -14,26 +19,158 @@ html {
  color: var(--color-foreground);
 }
-.tui-box {
+#page-heading {
-  width: 100%;
+  font-size: 30pt;
  text-align: center;
  font-style: italic;
  letter-spacing: 0.10em;
 }
@media (max-width: 900px) {
  #main {
    width: 90vw !important;
  }
  #page-heading {
    font-size: 20pt;
  }
 }
 #main {
  margin-top: 20px;
  margin-bottom: 100px;
  width: var(--main-view-width);
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  padding: 20px;
  gap: var(--frame-spacing);
  margin-inline: auto;
 } 
 #main > * {
  flex: 1 1 auto;
 }
 #tui-status-bar {
  width: 100vw;
  border-top: 2px solid var(--color-foreground);
  position: fixed;
  left: 0;
  bottom: 0;
  background-color: var(--color-background);
  color: var(--color-foreground);
  padding: 20px;
  max-height: 30px;
  display: flex;
  font-size: 10pt;
 }
 #tui-status-bar p {
  margin-left: 10px;
  margin-right: 10px;
 }
 #tui-status-bar p::before {
  content: ':';
  margin-right: 3px;
 }
 /* TUI FRAME */
 .tui-frame {
  width: auto;
  height: auto;
  padding: 20px;
  border: 2px solid var(--color-foreground);
-  border-radius: 10px;
+  border-radius: var(--frame-border-radius);
  margin: 20px;
  position: relative;
  display: flex;
 }
-.tui-header {
+.tui-frame-header {
  position: absolute;
  top: 0;
-  left: 25px;
+  left: 20px;
  transform: translateY(-50%);
  background-color: var(--color-background);
  padding: 0 10px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
 }
-.tui-content p{
+.tui-frame-content * {
-  font-size: 12pt;
+  font-size: 14pt;
-  margin: 15px 0 15px 0;
+  /* display: block; */
 }
 .tui-frame-content p {
  margin-bottom: 30px;
 }
 .tui-frame-content h2 {
  font-size: 19pt;
  font-style: italic;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin-top: 20px;
 }
 .tui-frame-content h2::before {
  content: '//';
 }
 .tui-frame-content li {
  display: flex; 
  align-items: center;
  margin-top: 5px; 
  align-items: baseline;
 }
 .tui-frame-content li::before {
  content: "*";
  display: inline;
  margin-right: 5px;
 }
 .tui-frame-single-image {
  display: block;
  margin: auto;
  width: 80%;
 }
 .tui-frame-section {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  margin-bottom: 10px;
  gap: 10px;
 }
 .tui-frame-section * {
  margin-right: 10px;
 }
 /* CONTROLS */
 button {
  color: var(--color-foreground);
  background-color: transparent;
  border: 2px solid var(--color-foreground);
  padding: 5px;
  text-decoration: underline;
 } 
 button:hover {
  transform: scale(1.05, 1.05);
 }
 a {
  text-decoration: underline;
  color: var(--color-foreground);
  font-style: italic;
  display: inline !important;
 }
 input {
  color: var(--color-foreground);
  background-color: transparent;
  border: 2px solid var(--color-foreground);
  padding: 5px;
  text-decoration: underline;
 }
--- a/dev/.htaccess-backup
+++ b/dev/.htaccess-backup
--- a/dev/blight/coi-serviceworker.js
+++ b/dev/blight/coi-serviceworker.js
--- a/dev/blight/index.apple-touch-icon.png
+++ b/dev/blight/index.apple-touch-icon.png
--- a/dev/blight/index.audio.worklet.js
+++ b/dev/blight/index.audio.worklet.js
--- a/dev/blight/index.html
+++ b/dev/blight/index.html
--- a/dev/blight/index.icon.png
+++ b/dev/blight/index.icon.png
--- a/dev/blight/index.js
+++ b/dev/blight/index.js
--- a/dev/blight/index.pck
+++ b/dev/blight/index.pck
--- a/dev/blight/index.png
+++ b/dev/blight/index.png
--- a/dev/blight/index.wasm
+++ b/dev/blight/index.wasm
--- a/dev/blight/index.worker.js
+++ b/dev/blight/index.worker.js
--- a/dev/interactive-angular-map/.htaccess
+++ b/dev/interactive-angular-map/.htaccess
--- a/dev/interactive-angular-map/assets/mapimage.svg
+++ b/dev/interactive-angular-map/assets/mapimage.svg
--- a/dev/interactive-angular-map/favicon.ico
+++ b/dev/interactive-angular-map/favicon.ico
--- a/dev/interactive-angular-map/index.html
+++ b/dev/interactive-angular-map/index.html
--- a/dev/interactive-angular-map/main-4Z6S77FU.js
+++ b/dev/interactive-angular-map/main-4Z6S77FU.js
--- a/dev/interactive-angular-map/polyfills-FFHMD2TL.js
+++ b/dev/interactive-angular-map/polyfills-FFHMD2TL.js
--- a/dev/interactive-angular-map/styles-U3BIK65T.css
+++ b/dev/interactive-angular-map/styles-U3BIK65T.css
--- a/dev/stars/index.html
+++ b/dev/stars/index.html
--- a/hex-logo-animate.html
+++ b/hex-logo-animate.html
--- a/index.html
+++ b/index.html
@@ -6,22 +6,151 @@
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/main.css">
-    <title>// Hex Studios //</title>
+    <script type="module" src="scripts/main.js"></script>
    <title>// HEX STUDIOS //</title>
 </head>
 <body>
  <div style="width: 50vh; margin-left: 30px; margin-top: 50px;">
-    <div class="tui-box">
+
-      <h2 class="tui-header">// HEX STUDIOS //</h2>
+  <div id="main">
-      <div class="tui-content">
+
-        <p>Hello! My name is Chris, aka Spudnut2000. Welcome to my personal portfolio site!</p>
+    <h1 id="page-heading">// HEX STUDIOS //</h1>
    <div class="tui-frame">
      <h2 class="tui-frame-header">WELCOME</h2>
      <div class="tui-frame-content">
        <p>Hello! My name is Chris. Welcome to my personal portfolio site!</p>
        <h2>About Me</h2>
-        <p>I am a husband, programmer, musician, and all around nerd. I like to develop both software and games.</p>
+        <p>I am a husband, programmer, musician, and all around nerd! I like to make games and software, as well as tinker with robots and motorcycles. I am a huge advocate for FOSS (Free and Open Source Software), a Linux user for well over 12 years, and a novice homelabber.</p>
        <p>I am primarily a Software Engineer by trade with a Bachelor's in Sotware Engineering and ~5 years of professional experience, where the majority of my knowledge is in C#/.NET, XAML, and HTML/CSS. I am also proficient in many other languages like Odin, C/C++, Java, QML, and JavaScript.</p>
        <p>I am also the CEO and Co-Founder of <a href="https://bellsworne.com">Bellsworne LLC.</a> with my wife Alex.</p>
      </div>
    </div>
    <div class="tui-frame">
      <h2 class="tui-frame-header">IMAGE</h2>
      <div class="tui-frame-content">
        <img class="tui-frame-single-image" src="res/chris2.jpg" />
      </div>
    </div>
    <div class="tui-frame">
      <h2 class="tui-frame-header">credentials</h2>
      <div class="tui-frame-content">
        <h2>Education</h2>
        <ul>
          <li>Bachelors, Software Engineering - 2026</li>
          <li>Associates, Computer Science - 2022</li>
        </ul>
        <h2>Experience</h2>
        <ul>
          <li>Software Engineer (C#, .NET, Unity) - 4 years</li>
          <li>Computer Technician (Repair, IT) - 2 years</li>
        </ul>
        <h2>Certs</h2>
        <ul>
          <li>CompTIA Project+</li>
          <li>AWS Certified Cloud Practitioner</li>
        </ul>
      </div>
    </div>
    <div class="tui-frame">
      <h2 class="tui-frame-header">LINKS</h2>
      <div class="tui-frame-content">
        <ul>
          <li><a href="https://git.bellsworne.tech">Git repos</a></li>
          <li><a href="https://bellsworne.com">Bellsworne</a></li>
          <li><a href="https://youtube.com/@hexstudios">Youtube</a></li>
          <li><a href="https://www.linkedin.com/in/christopher-i-bell/">LinkedIn</a></li>
        </ul>
      </div>
    </div>
    <div class="tui-frame">
      <h2 class="tui-frame-header">SITE SETTINGS</h2>
      <div class="tui-frame-content">
        <p>Change site colors, spacing, and borders</p>
        <div class="tui-frame-section" id="settings-form">
          <label for="foreground-setting">Foreground Color</label>
          <input type="text" name="foreground-setting" id="foreground-setting">
          <label for="background-setting">Background Color</label>
          <input type="text" name="background-setting" id="background-setting">
          <label for="frame-spacing-setting">Frame Spacing</label>
          <input type="number" name="frame-spacing-setting" id="frame-spacing-setting" min="5" max="50" value="10">
          <label for="frame-border-radius-setting">Frame Rounding</label>
          <input type="number" name="frame-border-radius-setting" id="frame-border-radius-setting" min="0" max="50" value="10">
          <button type="button" id="save-settings-button">SAVE</button>
          <button type="button" id="reset-settings-button">RESET</button>
        </div>
      </div>
    </div>
    <div class="tui-frame">
      <h2 class="tui-frame-header">projects</h2>
      <div class="tui-frame-content">
        <h2>SessionZero</h2>
        <p>SessionZero is a data-driven TTRPG companion application for managing characters, sessions, and game data.</p>
        <p>This is my passion project, and is currently a work in progress. Its core is developed using C# with .NET 8.</p>
        <p>Visit <a href="https://sessionzero.app">sessionzero.app</a> to learn more, or <a href="https://git.bellsworne.tech/Bellsworne/sessionzero-cs">view the source code.</a></p>
        <h2>Critterfolio</h2>
        <p>A simple cross-platform full-stack application for managing your critters, for farms or pet owners. Made in C# with Avalonia UI.</p>
        <p>This project was developed as my Software Engineering Capstone project, but the idea came from my wife who breeds goats and needed an easy way to track linage and other notes about her goats. It still needs some work, but you can download it for Windows, Linux, or Android <a href="critterfolio/index.html">HERE</a>.</p>
        <h2>Let there be blight</h2>
        <p>A game made in 72 hours for the MiniJam #150 game jam, made in Godot. <a href="/dev/blight">-- Click here to play in your browser! --</a></p>
        <h2>Cogwheel</h2>
        <p>A C# .NET 9 library that provides a robust and extendible Command and Developer Console system for Games and Software applications. <a href="https://git.bellsworne.tech/Bellsworne/Cogwheel">-- Click here to view on Gitea --</a></p>
        <h2>Interactive Map</h2>
        <p>An interactive world map that uses the <a href="https://worldbank.org">World Bank</a> REST API to display country information. Made as a school project in AngularJS. <a href="dev/interactive-angular-map">-- Click here to access-- </a></p>
        <h2>Stars</h2>
        <p>A really simple plain JS webpage that randomly generates a lot of stars. <a href="dev/stars/index.html">-- Click here to view --</a></p>
        <h2>More</h2>
        <p>To see more of my personal or professional projects, see my <a href="https://git.bellsworne.tech">Git repos</a> page.</p>
      </div>
    </div>
    <!-- <div class="tui-frame"> -->
      <!-- <h2 class="tui-frame-header">notice</h2> -->
      <!-- <div class="tui-frame-content" style="width: 100%; display: flex; justify-content: center; text-align: center;"> -->
        <!-- <p style="font-size: 20pt; color: darkred;">SAY NO TO GENERATIVE AI</p> -->
      <!-- </div> -->
    <!-- </div> -->
    <!-- <div class="tui-frame">
      <h2 class="tui-frame-header">motto</h2>
      <p>Say No To AI</p>
    </div>
    <div class="tui-frame">
      <h2 class="tui-frame-header">motto</h2>
      <p>Say No To AI</p>
    </div> -->
  </div>
  <div id="tui-status-bar">
    <p>COPYRIGHT 2026 <a href="https://bellsworne.com">BELLSWORNE LLC</a></p>
    <p><a href="https://git.bellsworne.tech/chrisbell/hexstudios-co">Source Code</a></p>
  </div>
  <!-- Keep android open banner -->
  <script src="https://keepandroidopen.org/banner.js"></script>
 </body>
--- a/old/css/hex-logo.animate.css
+++ b/old/css/hex-logo.animate.css
--- a/old/css/master.css
+++ b/old/css/master.css
@@ -154,30 +154,25 @@ body {
    width: 100%;
 }
-.projects-box {
+.project-card {
-    display: flex;
+    margin-bottom: 40px;
-    flex-wrap: wrap;
+}
    margin: auto;
    max-width: 70%;
-}  .projects-box .card {
+.project-card img {
-    margin: auto;
+    width: 10%;
-    padding-bottom: 30px;
+    height: auto;
-} .projects-box img {
+    margin-top: 20px;
-    width: 100%;
+    border: 2px solid var(--color-pallete-red);
-    height: 100%;
+}
-    border-top-right-radius: 10%;
+
-    border-top-left-radius: 1%;
+.project-card .hexlink {
    font-size: 2em;
 }
@media (max-width: 1000px)
 {
-    .projects-box {
+    .project-card img {
-        display: block;
+        width: 40%;
        margin: 0 30px 0 30px;
    } .projects-box .card {
        margin: auto;
        padding: 20px 0 20px 0;
    }
 }
--- a/projectvii.html
+++ b/projectvii.html
--- a/res/blight.png
+++ b/res/blight.png
--- a/res/chris.jpg
+++ b/res/chris.jpg
--- a/res/chris2.jpg
+++ b/res/chris2.jpg
--- a/res/cogwheel.png
+++ b/res/cogwheel.png
--- a/res/hex-logo.svg
+++ b/res/hex-logo.svg
--- a/res/map.png
+++ b/res/map.png
--- a/res/project7-1080p.png
+++ b/res/project7-1080p.png
--- a/res/project7-card.png
+++ b/res/project7-card.png
--- a/res/project7-splash.png
+++ b/res/project7-splash.png
--- a/res/seshzero.png
+++ b/res/seshzero.png
--- a/res/shots.png
+++ b/res/shots.png
--- a/res/stars.png
+++ b/res/stars.png
--- a/scripts/main.js
+++ b/scripts/main.js
@@ -0,0 +1,96 @@
 const r = document.querySelector(':root');
 const fgInput = document.getElementById('foreground-setting');
 const bgInput = document.getElementById('background-setting');
 const spacingInput = document.getElementById('frame-spacing-setting');
 const radiusInput = document.getElementById('frame-border-radius-setting');
 const saveBtn = document.getElementById('save-settings-button');
 const resetBtn = document.getElementById('reset-settings-button');
 let lightMode = false;
 const defaultSettings = {
    foreground: "#4d6e8d",
    background: "#010101",
    spacing: "15px",
    radius: "10px"
 };
 saveBtn.addEventListener('click', () => {
    const currentSettings = {
        foreground: fgInput.value,
        background: bgInput.value,
        spacing: spacingInput.value + 'px',
        radius: radiusInput.value + 'px'
    };
    setForegroundColor(currentSettings.foreground);
    setBackgroundColor(currentSettings.background);
    setFrameSpacing(currentSettings.spacing);
    setFrameBorderRadius(currentSettings.radius);
    localStorage.setItem('user-settings', JSON.stringify(currentSettings));
 });
 resetBtn.addEventListener('click', () => {
    localStorage.setItem('user-settings', JSON.stringify(defaultSettings));
    loadStoredSettings();
    syncSettings();
 });
 function setForegroundColor(color) {
    r.style.setProperty('--color-foreground', color);
 }
 function setBackgroundColor(color) {
    r.style.setProperty('--color-background', color);
 }
 function setFrameSpacing(amount) {
    r.style.setProperty('--frame-spacing', amount);
 }
 function setFrameBorderRadius(amount) {
    r.style.setProperty('--frame-border-radius', amount);
 }
 function syncSettings() {
    const rootStyles = getComputedStyle(document.documentElement);
    const varMap = {
        'foreground-setting': '--color-foreground',
        'background-setting': '--color-background',
        'frame-spacing-setting': '--frame-spacing',
        'frame-border-radius-setting': '--frame-border-radius'
    };
    for (const [id, variable] of Object.entries(varMap)) {
        const element = document.getElementById(id);
        if (element) {
            let cssValue = rootStyles.getPropertyValue(variable).trim();
            if (element.type === 'number') {
                element.value = parseFloat(cssValue) || 0;
            } else {
                element.value = cssValue;
            }
        }
    }
 }
 function loadStoredSettings() {
    const saved = localStorage.getItem('user-settings');
    if (saved) {
        const settings = JSON.parse(saved);
        setForegroundColor(settings.foreground);
        setBackgroundColor(settings.background);
        setFrameSpacing(settings.spacing);
        setFrameBorderRadius(settings.radius);
    }
 }
 loadStoredSettings();
 syncSettings();
--- a/secret.html
+++ b/secret.html
Author	SHA1	Message	Date
chris bell	6119e000a5	add KAO banner	2026-08-06 20:46:08 -05:00
chris bell	bbe1a2d322	re-adding everything since repo moved	2026-08-06 20:41:00 -05:00
chris bell	cf38e6b07c	Update a few things	2026-03-15 20:50:30 -05:00
chris bell	5335afd88c	Update spelling and adding notice at bottom	2026-01-31 22:14:27 -06:00
chris bell	3e1aec3867	change image	2026-01-31 21:44:45 -06:00
chris bell	37c4f8d2aa	fix bad link on cogwheel	2026-01-31 21:44:05 -06:00
chris bell	d99dc901ac	add more projects and change default colors	2026-01-31 21:40:57 -06:00
chris bell	bdcc5d0dc8	Merge branch 'main' of https://git.bellsworne.tech/chrisbell/hexstudios-co	2026-01-31 19:28:27 -06:00
chris bell	0ea57cf4c3	Merge branch 'develop'	2026-01-31 19:25:16 -06:00
Chris Bell	a01bc4eb2b	Merge pull request 'Pull rewrite into develop' (#5 ) from rewrite into develop Reviewed-on: #5	2026-02-01 01:18:04 +00:00
chris bell	a006bd418c	Lots of new stuff for rework	2026-01-31 19:16:51 -06:00
chrisbell	622e62d4b4	More edits to main index	2026-01-31 11:35:24 -05:00
Chris Bell	a7e67503e5	Merge pull request 'Adding a description' (#4 ) from develop into main Reviewed-on: #4	2026-01-17 01:00:13 +00:00
Chris Bell	92d3899de7	Merge pull request 'Update critterfolio apk, again' (#3 ) from develop into main Reviewed-on: #3	2026-01-09 05:27:49 +00:00
Chris Bell	2ac913a9b9	Merge pull request 'update critterfolio apk' (#2 ) from develop into main Reviewed-on: #2	2026-01-08 23:04:34 +00:00
Chris Bell	c57f8d82ca	Merge pull request 'added critterfolio page' (#1 ) from develop into main Reviewed-on: #1	2026-01-08 22:52:45 +00:00
Spudnut2000	1d7144640e	testing webhook	2025-06-20 22:56:59 -05:00
Spudnut2000	eb0e0125bc	fixed stars description	2025-06-20 22:54:21 -05:00
Spudnut2000	b68bd4cea6	Merge remote-tracking branch 'origin/develop'	2025-06-20 22:37:22 -05:00
Spudnut2000	9624ba2ee3	updates June 2025	2025-06-20 22:34:05 -05:00
Chris Bell	a984a1f5c0	Merge branch 'develop'	2023-08-09 09:09:34 -05:00
Chris Bell	860a8af7c4	Added new project card, removed phone number	2023-08-09 09:04:07 -05:00
Chrisopher Bell	9168c5f807	Merge pull request #1 from HexStudios/develop Merging dev into main	2022-09-13 22:00:44 -05:00