blackroad-os/blackroad-io-site
9
0
Fork 0
mirror of https://github.com/blackboxprogramming/blackroad.io.git synced 2026-03-18 04:34:01 -05:00
Code Issues Packages Projects Releases Wiki Activity

Deploy static site for blackroad.io

Browse Source
This commit is contained in:
Your Name
2025-10-24 22:05:56 +00:00
commit b7d86e1aa3
9 changed files with 325 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
CNAME Normal file
View File

@@ -0,0 +1 @@
blackroad.io

41
README.md Normal file
View File

@@ -0,0 +1,41 @@
# BlackRoad Static Site
This directory contains the static site served at **blackroad.io** via GitHub Pages.
## Contents
- `index.html` – Landing page with links to the AI chat and Composer Playground.
- `login.html` – Development login form accepting any non-empty credentials.
- `chat.html` – Placeholder for the Lucidia public-facing AI chat and terminal.
- `composer.html` – Placeholder for the Composer Playground.
- `status.html` – Manual system status page.
- `style.css` – Shared styling for all pages.
- `script.js` – Client-side login handler.
- `CNAME` – Configures the custom domain `blackroad.io` for GitHub Pages.
## Development
1. Clone the repository and ensure these files remain inside the `BlackRoad/` directory.
2. From this folder you can serve the site locally:
```bash
cd BlackRoad
python3 -m http.server 8000
```
Then visit `http://localhost:8000` in your browser.
3. The `lucidia-agent.py` watcher automatically pushes changes in this directory to the `blackroad.io` repository. Ensure new files are added here so they are deployed.
## Deployment
The site is deployed on GitHub Pages. Pushing to the `blackroad.io` repository publishes the contents of this directory. The `CNAME` file tells GitHub Pages to serve the site at **blackroad.io**.
## Next Steps
- Replace the development login with real authentication.
- Implement the AI chat and terminal functionality.
- Build out the Composer Playground.
- Automate updates to the status page.
_Last updated on 2025-09-11_

21
chat.html Normal file
View File

@@ -0,0 +1,21 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>AI Chat &amp; Terminal · BlackRoad</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header>
<h1>AI Chat &amp; Terminal</h1>
</header>
<main>
<p>Coming soon. Stay tuned!</p>
<p><a href="index.html">Back to Home</a></p>
</main>
<footer>
<p>&copy; 2024 BlackRoad Inc.</p>
</footer>
</body>
</html>

21
composer.html Normal file
View File

@@ -0,0 +1,21 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Composer Playground · BlackRoad</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header>
<h1>Composer Playground</h1>
</header>
<main>
<p>Coming soon. Stay tuned!</p>
<p><a href="index.html">Back to Home</a></p>
</main>
<footer>
<p>&copy; 2024 BlackRoad Inc.</p>
</footer>
</body>
</html>

37
index.html Normal file
View File

@@ -0,0 +1,37 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>BlackRoad · Lucidia</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header>
<h1>BlackRoad · Lucidia</h1>
<nav>
<a href="login.html">Login</a>
<a href="status.html">Status</a>
</nav>
</header>
<main>
<div class="card-container">
<section class="card">
<h2>Lucidia Public-facing AI Chat &amp; Terminal</h2>
<p>
Explore our upcoming AI chat interface and terminal environment.
</p>
<a href="chat.html">Enter Chat &amp; Terminal</a>
</section>
<section class="card">
<h2>Composer Playground</h2>
<p>Create and experiment with musical ideas in the browser.</p>
<a href="composer.html">Launch Composer</a>
</section>
</div>
</main>
<footer>
<p>&copy; 2024 BlackRoad Inc.</p>
</footer>
</body>
</html>

37
login.html Normal file
View File

@@ -0,0 +1,37 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Login · BlackRoad</title>
<link rel="stylesheet" href="style.css" />
<script src="script.js" defer></script>
</head>
<body>
<header>
<h1>Login</h1>
</header>
<main>
<form onsubmit="handleLogin(event)">
<div>
<label for="username">Username</label>
<input type="text" id="username" name="username" />
</div>
<div>
<label for="password">Password</label>
<input type="password" id="password" name="password" />
</div>
<button type="submit">Sign In</button>
<p>
<small
>Development credentials: user=blackboxprogramming,
pass=Codex2025</small
>
</p>
</form>
</main>
<footer>
<p>&copy; 2024 BlackRoad Inc.</p>
</footer>
</body>
</html>

11
script.js Normal file
View File

@@ -0,0 +1,11 @@
function handleLogin(event) {
event.preventDefault();
const username = document.getElementById('username').value.trim();
const password = document.getElementById('password').value.trim();
if (username && password) {
window.location.href = 'index.html';
} else {
alert('Please enter both username and password.');
}
}

26
status.html Normal file
View File

@@ -0,0 +1,26 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Status · BlackRoad</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header>
<h1>System Status</h1>
</header>
<main>
<ul class="status-list">
<li class="status-ok">API: OK</li>
<li class="status-ok">LLM Bridge: OK</li>
<li class="status-down">NGINX: Down</li>
</ul>
<p><small>Status is manually updated.</small></p>
<p><a href="index.html">Back to Home</a></p>
</main>
<footer>
<p>&copy; 2024 BlackRoad Inc.</p>
</footer>
</body>
</html>

130
style.css Normal file
View File

@@ -0,0 +1,130 @@
:root {
--primary-color: #1a1a1a;
--accent-color: #0077cc;
--ok-color: #2ecc71;
--down-color: #e74c3c;
--bg-color: #f9f9f9;
--text-color: #333333;
--font-family: 'Segoe UI', Tahoma, Arial, sans-serif;
}
* {
box-sizing: border-box;
}
body {
margin: 0;
font-family: var(--font-family);
background: var(--bg-color);
color: var(--text-color);
line-height: 1.6;
}
header,
footer {
background: var(--primary-color);
color: #ffffff;
padding: 1rem;
}
header nav a {
color: #ffffff;
margin-right: 1rem;
text-decoration: none;
}
header nav a:hover {
text-decoration: underline;
}
main {
padding: 1rem;
max-width: 960px;
margin: 0 auto;
}
.card-container {
display: flex;
flex-wrap: wrap;
gap: 1rem;
}
.card {
flex: 1 1 300px;
background: #ffffff;
padding: 1rem;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.card h2 {
margin-top: 0;
}
.card a {
color: var(--accent-color);
text-decoration: none;
font-weight: bold;
}
.card a:hover {
text-decoration: underline;
}
form {
display: flex;
flex-direction: column;
gap: 0.75rem;
max-width: 400px;
margin: 2rem auto;
background: #ffffff;
padding: 2rem;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
form label {
font-weight: 600;
}
form input[type='text'],
form input[type='password'] {
padding: 0.5rem;
border: 1px solid #cccccc;
border-radius: 4px;
}
form button {
padding: 0.75rem;
border: none;
border-radius: 4px;
background: var(--accent-color);
color: #ffffff;
font-size: 1rem;
cursor: pointer;
}
form button:hover {
background: #005fa3;
}
.status-list {
list-style: none;
padding: 0;
}
.status-list li {
margin-bottom: 0.5rem;
}
.status-ok {
color: var(--ok-color);
}
.status-down {
color: var(--down-color);
}
footer {
text-align: center;
}