HaverLab
/
sdl
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added light/dark theme CSS

This commit is contained in:
John Haverlack 2026-02-01 11:15:07 -09:00
parent 06d85ba9ce
commit d322358115
5 changed files with 112 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
README.md
View File

@ -10,7 +10,7 @@
## Overview ## Overview
The Software Defined Laboratory (SDL) project provides a generalized distributed computing platform for managing parallel computational workflows across a cluster of distributed nodes. SDL is a minimalistic High Performance Compute (HPC) platform focused on extreme minimizaton of technical debt associated configuration, deployability, and maintenance of the cluster. The Software Defined Laboratory (SDL) project provides a generalized distributed computing platform for managing parallel computational workflows across a cluster of distributed nodes. SDL is a minimalistic High Performance Compute (HPC) platform focused on minimizaton of technical debt associated configuration, deployability, and maintenance of the cluster.
## Design ## Design
@ -21,7 +21,7 @@ For more information, see the [Design](docs/DESIGN.md) document.
See also: [Installation](docs/INSTALL.md) See also: [Installation](docs/INSTALL.md)
``` ```
$ git clone https://github.com/jhaverlack/sdl.git $ git clone https://github.com/jehaverlack/sdl.git
$ cd sdl $ cd sdl
$ ./install-sdl.sh $ ./install-sdl.sh
``` ```
@ -47,7 +47,7 @@ Listen to UDP 10101 for beacon messages broadcast by your SDL Manager.
nc -u 127.0.0.1 10101 nc -u 127.0.0.1 10101
``` ```
> NOTE: CTRL-C to exit `nc`. It cannot run on port 10101 in parallel with the sdl-wkr. > NOTE: CTRL-C to exit `nc`. You cannot run `nc` on port 10101 in parallel with the sdl-wkr. So run it once to get the install command. Tnen install sdl-wkr.
Run the **curl** or **wget** command provided by SDL Manager UDP beacon to install SDL Worker locally. Run the **curl** or **wget** command provided by SDL Manager UDP beacon to install SDL Worker locally.

82
sdl-mgr/html/css/custom-styles.css
View File

@ -212,3 +212,85 @@ json-viewer .property:hover {
#sidepanel i { #sidepanel i {
color: hwb(0 55% 45%); color: hwb(0 55% 45%);
} }
/* Dark Theme */
/* Dark mode for callouts */
[data-bs-theme="dark"] .callout-established,
[data-bs-theme="dark"] .callout-proposed,
[data-bs-theme="dark"] .callout-speculative,
[data-bs-theme="dark"] .callout-caution,
[data-bs-theme="dark"] .callout-warning,
[data-bs-theme="dark"] .callout-danger {
background: #1a1a1a;
color: #e9ecef;
}
[data-bs-theme="dark"] .callout-established {
background: #1a3a1a;
border-left-color: #5cb85c;
}
[data-bs-theme="dark"] .callout-proposed {
background: #1a2a3a;
border-left-color: #5b8fd8;
}
[data-bs-theme="dark"] .callout-speculative {
background: #2a1a3a;
border-left-color: #ab5bea;
}
[data-bs-theme="dark"] .callout-caution,
[data-bs-theme="dark"] .callout-warning {
background: #3a2a1a;
border-left-color: #f5a22f;
}
[data-bs-theme="dark"] .callout-danger {
background: #3a1a1a;
border-left-color: #d83b3a;
}
/* Dark mode for side panel */
[data-bs-theme="dark"] #sidepanel {
border-right-color: #495057;
}
[data-bs-theme="dark"] #sidepanel-rail {
border-bottom-color: #495057;
}
[data-bs-theme="dark"] #sidepanel .nav-link {
color: #adb5bd;
}
/* Dark mode for json-viewer */
[data-bs-theme="dark"] json-viewer {
background: #212529;
color: #e9ecef;
border-color: #495057;
}
[data-bs-theme="dark"] json-viewer .property {
color: #58a6ff;
}
[data-bs-theme="dark"] json-viewer .string {
color: #7ee787;
}
[data-bs-theme="dark"] json-viewer .number {
color: #ff7b72;
}
/* Dark mode for tables */
[data-bs-theme="dark"] th {
background: #343a40;
}
[data-bs-theme="dark"] th,
[data-bs-theme="dark"] td {
border-color: #495057;
}

4
sdl-mgr/html/index.html
View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en" data-bs-theme="dark">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<title></title> <title></title>
@ -63,7 +63,7 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row d-flex flex-nowrap"> <div class="row d-flex flex-nowrap">
<aside id="sidepanel" class="bg-light"> <aside id="sidepanel" class="">
<!-- Collapse / expand rail --> <!-- Collapse / expand rail -->
<div id="sidepanel-rail"> <div id="sidepanel-rail">
<button <button

20
sdl-mgr/html/js/dash.js
View File

@ -302,6 +302,26 @@ function renderModulesTable(msg) {
</tr> </tr>
`; `;
sdl_html += `
<tr>
<th><span class="fa fa-microchip" title="CPU Cores" style="font-size:1.2em"></span> CPU</th>
<td class="text-success" style=" font-size:1em"></td>
</tr>
`;
sdl_html += `
<tr>
<th><span class="fa fa-memory" title="RAM" style="font-size:1.2em"></span> RAM</th>
<td class="text-success" style=" font-size:1em"></td>
</tr>
`;
sdl_html += `
<tr>
<th><span class="fa fa-dice-d20" title="GPU" style="font-size:1.2em"></span> GPU</th>
<td class="text-success" style=" font-size:1em"></td>
</tr>
`;
sdl_html += ` sdl_html += `
</tbody> </tbody>

10
sdl-mgr/html/js/weblib.js
View File

@ -521,13 +521,13 @@ function loadFooter() {
.then(res => res.json()) .then(res => res.json())
.then(config => { .then(config => {
let html = ''; let html = '';
html += '<footer class="bg-light text-center text-muted py-4">\n'; html += '<footer class="text-center text-muted py-4">\n';
html += '<div class="row">\n'; html += '<div class="row">\n';
html += '<div class="col-2"></div>'; html += '<div class="col-2"></div>';
html += '<div class="col-4">\n'; html += '<div class="col-4">\n';
html += ` <a href="${config.package.homepage}" target="_blank" class="text-dark">\n`; html += ` <a href="${config.package.homepage}" target="_blank" class="">\n`;
html += ' <i class="fas fa-square-binary"></i> ' + config.package.description + '\n'; html += ' <i class="fas fa-square-binary"></i> ' + config.package.description + '\n';
html += ' </a><br>\n'; html += ' </a><br>\n';
html += '</div>\n'; html += '</div>\n';
@ -535,7 +535,7 @@ function loadFooter() {
// Add GitHub link from config.package.homepage // Add GitHub link from config.package.homepage
html += '<div class="col-4">\n'; html += '<div class="col-4">\n';
if (config.package.repository.url) { if (config.package.repository.url) {
html += ` <a href="${config.package.repository.url}" target="_blank" class="text-dark">\n`; html += ` <a href="${config.package.repository.url}" target="_blank" class="">\n`;
html += ' <i class="fab fa-github fa-lg me-1"></i> ' + config.package.repository.url + '\n'; html += ' <i class="fab fa-github fa-lg me-1"></i> ' + config.package.repository.url + '\n';
html += ' </a><br>\n'; html += ' </a><br>\n';
} }
@ -553,7 +553,7 @@ function loadFooter() {
html += '</div>'; html += '</div>';
html += '<div class="col-3">'; html += '<div class="col-3">';
html += `Copyright &copy; <span class="text-dark">${config.package.copyright || ''}</span>`; html += `Copyright &copy; <span class="">${config.package.copyright || ''}</span>`;
html += '</div>'; html += '</div>';
// Add license if present // Add license if present
@ -573,7 +573,7 @@ function loadFooter() {
}) })
.catch(err => { .catch(err => {
console.error('Error loading config:', err); console.error('Error loading config:', err);
document.getElementById('footer').innerHTML = '<footer class="bg-light text-center text-muted py-4">Footer could not be loaded</footer>'; document.getElementById('footer').innerHTML = '<footer class="text-center text-muted py-4">Footer could not be loaded</footer>';
}); });
} }