cybersecurity/HacktivityLabSheets
1
0
Fork 0
mirror of https://github.com/cliffe/HacktivityLabSheets.git synced 2026-02-21 11:18:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update theme toggle functionality and default theme settings

Browse Source 
- Changed the default theme from light to dark mode in the theme toggle functionality.
- Updated the setup documentation to reflect the new default theme.
- Added Google Fonts integration for improved typography in the Hacktivity theme.
- Enhanced the lab layout with a theme toggle button for user convenience.
This commit is contained in:
Z. Cliffe Schreuders
2025-09-15 23:56:46 +01:00
parent 72fdaed37f
commit aabede25b8
5 changed files with 98 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
assets/css/hacktivity-theme.scss
View File

@@ -2,50 +2,18 @@
---
// Hacktivity Theme CSS Variables and Styles
:root {
--navbg-color: #1a1d22;
--navfg-color: whitesmoke;
--link-color: #503883;
--challenge-link-color: #333333;
--highlight-color: #f9f9f9;
--scoreboard-highlight-color: plum;
--default-btnbg-color: none;
--default-btnfg-color: #333;
--default-btnborder-color: #adadad;
--default-btnfghov-color: #333;
--default-btnbghov-color: #e6e6e6;
--default-btnborderhov-color: #adadad;
--primary-btnbg-color: #503883;
--primary-btnhov-color: #271753;
--panelbg-color: #fff;
--panelborder-color: #ddd;
--panel-primary-border-color: plum;
--panel-headbg-color: #f5f5f5;
--panel-headfg-color: #333333;
--panel-info-color: #fff;
--panel-infoborder-color: #bce8f1;
--alert-infobg-color: #d9edf7;
--alert-infofg-color: #31708f;
--alert-infoborder-color: #bce8f1;
--alert-warningbg-color: #fcf8e3;
--alert-warningfg-color: #8a6d3b;
--alert-warningborder-color: #faebcc;
--alert-dangerbg-color: #f2dede;
--alert-dangerfg-color: #a94442;
--alert-dangerborder-color: #ebccd1;
--alert-successbg-color: #dff0d8;
--alert-successfg-color: #3c763d;
--alert-successborder-color: #d6e9c6;
--close-color: #333333;
--vmfg-color: #333333;
--bg-color: white;
--fg-color: #333333;
// Set default font family
body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
[data-theme="dark"] {
code, pre, .highlight {
font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
}
// Dark mode as default
:root {
--navbg-color: #503883;
--navfg-color: whitesmoke;
--link-color: plum;
@@ -88,6 +56,49 @@
--fg-color: whitesmoke;
}
[data-theme="light"] {
--navbg-color: #1a1d22;
--navfg-color: whitesmoke;
--link-color: #503883;
--challenge-link-color: #333333;
--highlight-color: #f9f9f9;
--scoreboard-highlight-color: plum;
--default-btnbg-color: none;
--default-btnfg-color: #333;
--default-btnborder-color: #adadad;
--default-btnfghov-color: #333;
--default-btnbghov-color: #e6e6e6;
--default-btnborderhov-color: #adadad;
--primary-btnbg-color: #503883;
--primary-btnhov-color: #271753;
--panelbg-color: #fff;
--panelborder-color: #ddd;
--panel-primary-border-color: plum;
--panel-headbg-color: #f5f5f5;
--panel-headfg-color: #333333;
--panel-info-color: #fff;
--panel-infoborder-color: #bce8f1;
--alert-infobg-color: #d9edf7;
--alert-infofg-color: #31708f;
--alert-infoborder-color: #bce8f1;
--alert-warningbg-color: #fcf8e3;
--alert-warningfg-color: #8a6d3b;
--alert-warningborder-color: #faebcc;
--alert-dangerbg-color: #f2dede;
--alert-dangerfg-color: #a94442;
--alert-dangerborder-color: #ebccd1;
--alert-successbg-color: #dff0d8;
--alert-successfg-color: #3c763d;
--alert-successborder-color: #d6e9c6;
--close-color: #333333;
--vmfg-color: #333333;
--bg-color: white;
--fg-color: #333333;
}
// Base styles
body {
background: var(--bg-color);