Styling bs

This commit is contained in:
Christopher Cookman 2026-06-29 10:25:11 -06:00
parent b39b7aff9c
commit 62441f3718
13 changed files with 77 additions and 10 deletions

View file

@ -0,0 +1,61 @@
/* AstroCom Theme — consistent dark palette applied over Bootstrap */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');
body {
background-color: #111 !important;
color: #f0f0f0 !important;
font-family: 'Inter', sans-serif;
}
/* ── Navbar ─────────────────────────────────── */
.navbar.bg-dark {
background-color: #0d0d0d !important;
border-bottom: 1px solid #2e2e2e;
}
/* ── Cards ──────────────────────────────────── */
.card.bg-dark,
.card.bg-secondary {
background-color: #1e1e1e !important;
border: 1px solid #2e2e2e !important;
color: #f0f0f0 !important;
}
.card.bg-dark .card-title,
.card.bg-secondary .card-title {
color: #f0f0f0;
}
/* ── Tables ─────────────────────────────────── */
.table-dark {
--bs-table-bg: #1e1e1e;
--bs-table-striped-bg: #252525;
--bs-table-border-color: #2e2e2e;
--bs-table-color: #f0f0f0;
}
/* ── Form controls ──────────────────────────── */
.form-control,
.form-control.bg-dark {
background-color: #1a1a1a !important;
border-color: #3a3a3a !important;
color: #f0f0f0 !important;
}
.form-control:focus {
background-color: #222 !important;
border-color: #555 !important;
color: #f0f0f0 !important;
box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.08) !important;
}
.form-control::placeholder {
color: #666;
}
/* ── Alerts ─────────────────────────────────── */
.alert-secondary {
background-color: #2a2a2a;
border-color: #3a3a3a;
color: #f0f0f0;
}

View file

@ -5,6 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<title>AstroCom Directory</title> <title>AstroCom Directory</title>
<script> <script>
(function (d, t) { (function (d, t) {

View file

@ -5,6 +5,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/> <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<title>AstroCom API Docs</title> <title>AstroCom API Docs</title>
<script> <script>
(function (d, t) { (function (d, t) {
@ -24,7 +25,7 @@
</script> </script>
<style> <style>
.doc-section { max-width: 900px; margin: 1.5rem auto; } .doc-section { max-width: 900px; margin: 1.5rem auto; }
.endpoint { background: rgba(255,255,255,0.03); padding: 1rem; border-radius: .4rem; margin-bottom: .75rem; } .endpoint { background: #1e1e1e; border: 1px solid #2e2e2e; padding: 1rem; border-radius: .5rem; margin-bottom: .75rem; }
.code { background:#0d1117; color:#9ad8ff; padding:.5rem; border-radius:.25rem; font-family:monospace; white-space:pre-wrap; } .code { background:#0d1117; color:#9ad8ff; padding:.5rem; border-radius:.25rem; font-family:monospace; white-space:pre-wrap; }
.small-muted { color: rgba(255,255,255,0.6); font-size:.9rem; } .small-muted { color: rgba(255,255,255,0.6); font-size:.9rem; }
</style> </style>

View file

@ -5,15 +5,10 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.1/css/all.min.css" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.1/css/all.min.css" />
<title>AstroCom — Server Status</title> <title>AstroCom — Server Status</title>
<style> <style>
body {
background-color: #111;
color: #f0f0f0;
font-family: 'Inter', sans-serif;
}
.status-card { .status-card {
background-color: #1e1e1e; background-color: #1e1e1e;
border: 1px solid #2e2e2e; border: 1px solid #2e2e2e;
@ -79,7 +74,7 @@
} }
.summary-bar { .summary-bar {
background-color: #1a1a1a; background-color: #1e1e1e;
border: 1px solid #2e2e2e; border: 1px solid #2e2e2e;
border-radius: 10px; border-radius: 10px;
padding: 14px 20px; padding: 14px 20px;
@ -130,7 +125,7 @@
</head> </head>
<body> <body>
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color:#0d0d0d; border-bottom: 1px solid #2e2e2e;"> <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid"> <div class="container-fluid">
<a class="navbar-brand fw-bold" href="/">AstroCom</a> <a class="navbar-brand fw-bold" href="/">AstroCom</a>
<span id="footer"></span> <span id="footer"></span>

View file

@ -5,6 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<title>AstroCom Availability Checker</title> <title>AstroCom Availability Checker</title>
<script> <script>
(function (d, t) { (function (d, t) {

View file

@ -4,6 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<title>AstroCom Admin - Create new server</title> <title>AstroCom Admin - Create new server</title>
</head> </head>
<body class="bg-dark text-white"> <body class="bg-dark text-white">

View file

@ -4,6 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<title>AstroCom Admin - Editing <%= data.id %></title> <title>AstroCom Admin - Editing <%= data.id %></title>
</head> </head>
<body class="bg-dark text-white"> <body class="bg-dark text-white">

View file

@ -5,6 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<title>AstroCom Admin</title> <title>AstroCom Admin</title>
</head> </head>

View file

@ -5,6 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<title>AstroCom Admin Login</title> <title>AstroCom Admin Login</title>
</head> </head>

View file

@ -5,6 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<title>AstroCom Admin Registration</title> <title>AstroCom Admin Registration</title>
</head> </head>

View file

@ -4,6 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<title>AstroCom User - Edit</title> <title>AstroCom User - Edit</title>
</head> </head>
<body class="bg-dark text-white"> <body class="bg-dark text-white">

View file

@ -5,6 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<title>AstroCom User Panel</title> <title>AstroCom User Panel</title>
</head> </head>
@ -25,7 +26,7 @@
<h2 class="m-0 text-center w-100">User Dashboard</h2> <h2 class="m-0 text-center w-100">User Dashboard</h2>
</div> </div>
<div class="container mt-4"> <div class="container mt-4">
<div class="card bg-secondary mb-4 text-white"> <div class="card bg-dark mb-4 text-white">
<div class="card-body"> <div class="card-body">
<div class="position-absolute top-0 end-0 m-3"> <div class="position-absolute top-0 end-0 m-3">
<a href="/user/edit" class="btn btn-primary" id="editInfoBtn">Edit Information</a> <a href="/user/edit" class="btn btn-primary" id="editInfoBtn">Edit Information</a>

View file

@ -5,6 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/assets/css/bootstrap.min.css"> <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="/assets/css/theme.css">
<title>AstroCom User Login</title> <title>AstroCom User Login</title>
</head> </head>