You've already forked computing-box
Added show on hover for dropdown menu items
This commit is contained in:
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,9 +70,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col centred" style="width: 30%;">
|
<div class="col centred" style="width: 30%;">
|
||||||
@@ -234,7 +145,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred">
|
<div class="container d-xl-flex justify-content-xl-center centred">
|
||||||
<form oninput="updateNumbers()">
|
<form oninput="updateNumbers()">
|
||||||
<div class="table-responsive text-center d-xl-flex justify-content-xl-center">
|
<div class="table-responsive text-center d-xl-flex justify-content-xl-center">
|
||||||
@@ -287,21 +198,18 @@
|
|||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -316,26 +224,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,10 +55,9 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
<section class="py-5">
|
<section class="py-5">
|
||||||
<!-- Start: Features Cards -->
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row mb-4 mb-lg-5">
|
<div class="row mb-4 mb-lg-5">
|
||||||
<div class="col-md-8 col-xl-6 text-center mx-auto">
|
<div class="col-md-8 col-xl-6 text-center mx-auto">
|
||||||
@@ -181,80 +92,77 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Features Cards -->
|
</div>
|
||||||
<!-- Start: Service Cards -->
|
|
||||||
<section>
|
<section>
|
||||||
<!-- Start: Features Cards -->
|
|
||||||
<div class="container bg-dark py-5">
|
<div class="container bg-dark py-5">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-8 col-xl-6 text-center mx-auto">
|
<div class="col-md-8 col-xl-6 text-center mx-auto">
|
||||||
<h3 class="fw-bold">Key Features of CS:Box</h3>
|
<h3 class="fw-bold">Key Features of CS:Box</h3>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="py-5 p-lg-5">
|
<div class="p-lg-5 py-5">
|
||||||
<div class="row row-cols-1 row-cols-md-2 mx-auto" style="max-width: 900px;">
|
<div class="row row-cols-1 row-cols-md-2 mx-auto" style="max-width: 900px;">
|
||||||
<div class="col mb-5">
|
<div class="col mb-5">
|
||||||
<div class="card shadow-sm">
|
<div class="card shadow-sm">
|
||||||
<div class="card-body px-4 py-5 px-md-5">
|
<div class="card-body px-4 px-md-5 py-5">
|
||||||
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-diagram-3 text-success">
|
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-diagram-3 text-success">
|
||||||
<path fill-rule="evenodd" d="M6 3.5A1.5 1.5 0 0 1 7.5 2h1A1.5 1.5 0 0 1 10 3.5v1A1.5 1.5 0 0 1 8.5 6v1H14a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-1 0V8h-5v.5a.5.5 0 0 1-1 0V8h-5v.5a.5.5 0 0 1-1 0v-1A.5.5 0 0 1 2 7h5.5V6A1.5 1.5 0 0 1 6 4.5zM8.5 5a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5zM0 11.5A1.5 1.5 0 0 1 1.5 10h1A1.5 1.5 0 0 1 4 11.5v1A1.5 1.5 0 0 1 2.5 14h-1A1.5 1.5 0 0 1 0 12.5zm1.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm4.5.5A1.5 1.5 0 0 1 7.5 10h1a1.5 1.5 0 0 1 1.5 1.5v1A1.5 1.5 0 0 1 8.5 14h-1A1.5 1.5 0 0 1 6 12.5zm1.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm4.5.5a1.5 1.5 0 0 1 1.5-1.5h1a1.5 1.5 0 0 1 1.5 1.5v1a1.5 1.5 0 0 1-1.5 1.5h-1a1.5 1.5 0 0 1-1.5-1.5zm1.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5z"></path>
|
<path fill-rule="evenodd" d="M6 3.5A1.5 1.5 0 0 1 7.5 2h1A1.5 1.5 0 0 1 10 3.5v1A1.5 1.5 0 0 1 8.5 6v1H14a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-1 0V8h-5v.5a.5.5 0 0 1-1 0V8h-5v.5a.5.5 0 0 1-1 0v-1A.5.5 0 0 1 2 7h5.5V6A1.5 1.5 0 0 1 6 4.5zM8.5 5a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5zM0 11.5A1.5 1.5 0 0 1 1.5 10h1A1.5 1.5 0 0 1 4 11.5v1A1.5 1.5 0 0 1 2.5 14h-1A1.5 1.5 0 0 1 0 12.5zm1.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm4.5.5A1.5 1.5 0 0 1 7.5 10h1a1.5 1.5 0 0 1 1.5 1.5v1A1.5 1.5 0 0 1 8.5 14h-1A1.5 1.5 0 0 1 6 12.5zm1.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm4.5.5a1.5 1.5 0 0 1 1.5-1.5h1a1.5 1.5 0 0 1 1.5 1.5v1a1.5 1.5 0 0 1-1.5 1.5h-1a1.5 1.5 0 0 1-1.5-1.5zm1.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5z"></path>
|
||||||
</svg></div>
|
</svg></div>
|
||||||
<h5 class="fw-bold card-title">Binary Simulations</h5>
|
<h5 class="fw-bold card-title">Binary Simulations</h5>
|
||||||
<p class="text-muted card-text mb-4">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
|
<p class="text-muted mb-4 card-text">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col mb-5">
|
<div class="col mb-5">
|
||||||
<div class="card shadow-sm">
|
<div class="card shadow-sm">
|
||||||
<div class="card-body px-4 py-5 px-md-5">
|
<div class="card-body px-4 px-md-5 py-5">
|
||||||
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-hash text-success">
|
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-hash text-success">
|
||||||
<path d="M8.39 12.648a1.32 1.32 0 0 0-.015.18c0 .305.21.508.5.508.266 0 .492-.172.555-.477l.554-2.703h1.204c.421 0 .617-.234.617-.547 0-.312-.188-.53-.617-.53h-.985l.516-2.524h1.265c.43 0 .618-.227.618-.547 0-.313-.188-.524-.618-.524h-1.046l.476-2.304a1.06 1.06 0 0 0 .016-.164.51.51 0 0 0-.516-.516.54.54 0 0 0-.539.43l-.523 2.554H7.617l.477-2.304c.008-.04.015-.118.015-.164a.512.512 0 0 0-.523-.516.539.539 0 0 0-.531.43L6.53 5.484H5.414c-.43 0-.617.22-.617.532 0 .312.187.539.617.539h.906l-.515 2.523H4.609c-.421 0-.609.219-.609.531 0 .313.188.547.61.547h.976l-.516 2.492c-.008.04-.015.125-.015.18 0 .305.21.508.5.508.265 0 .492-.172.554-.477l.555-2.703h2.242l-.515 2.492zm-1-6.109h2.266l-.515 2.563H6.859l.532-2.563z"></path>
|
<path d="M8.39 12.648a1.32 1.32 0 0 0-.015.18c0 .305.21.508.5.508.266 0 .492-.172.555-.477l.554-2.703h1.204c.421 0 .617-.234.617-.547 0-.312-.188-.53-.617-.53h-.985l.516-2.524h1.265c.43 0 .618-.227.618-.547 0-.313-.188-.524-.618-.524h-1.046l.476-2.304a1.06 1.06 0 0 0 .016-.164.51.51 0 0 0-.516-.516.54.54 0 0 0-.539.43l-.523 2.554H7.617l.477-2.304c.008-.04.015-.118.015-.164a.512.512 0 0 0-.523-.516.539.539 0 0 0-.531.43L6.53 5.484H5.414c-.43 0-.617.22-.617.532 0 .312.187.539.617.539h.906l-.515 2.523H4.609c-.421 0-.609.219-.609.531 0 .313.188.547.61.547h.976l-.516 2.492c-.008.04-.015.125-.015.18 0 .305.21.508.5.508.265 0 .492-.172.554-.477l.555-2.703h2.242l-.515 2.492zm-1-6.109h2.266l-.515 2.563H6.859l.532-2.563z"></path>
|
||||||
</svg></div>
|
</svg></div>
|
||||||
<h5 class="fw-bold card-title">Hexadecimal Tools</h5>
|
<h5 class="fw-bold card-title">Hexadecimal Tools</h5>
|
||||||
<p class="text-muted card-text mb-4">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
|
<p class="text-muted mb-4 card-text">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col mb-4">
|
<div class="col mb-4">
|
||||||
<div class="card shadow-sm">
|
<div class="card shadow-sm">
|
||||||
<div class="card-body px-4 py-5 px-md-5">
|
<div class="card-body px-4 px-md-5 py-5">
|
||||||
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-toggle2-on text-success">
|
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-toggle2-on text-success">
|
||||||
<path d="M7 5H3a3 3 0 0 0 0 6h4a4.995 4.995 0 0 1-.584-1H3a2 2 0 1 1 0-4h3.416c.156-.357.352-.692.584-1"></path>
|
<path d="M7 5H3a3 3 0 0 0 0 6h4a4.995 4.995 0 0 1-.584-1H3a2 2 0 1 1 0-4h3.416c.156-.357.352-.692.584-1"></path>
|
||||||
<path d="M16 8A5 5 0 1 1 6 8a5 5 0 0 1 10 0"></path>
|
<path d="M16 8A5 5 0 1 1 6 8a5 5 0 0 1 10 0"></path>
|
||||||
</svg></div>
|
</svg></div>
|
||||||
<h5 class="fw-bold card-title">Logic Gates</h5>
|
<h5 class="fw-bold card-title">Logic Gates</h5>
|
||||||
<p class="text-muted card-text mb-4">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
|
<p class="text-muted mb-4 card-text">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col mb-4">
|
<div class="col mb-4">
|
||||||
<div class="card shadow-sm">
|
<div class="card shadow-sm">
|
||||||
<div class="card-body px-4 py-5 px-md-5">
|
<div class="card-body px-4 px-md-5 py-5">
|
||||||
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-palette text-success">
|
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-palette text-success">
|
||||||
<path d="M8 5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3m4 3a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3M5.5 7a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m.5 6a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3"></path>
|
<path d="M8 5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3m4 3a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3M5.5 7a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m.5 6a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3"></path>
|
||||||
<path d="M16 8c0 3.15-1.866 2.585-3.567 2.07C11.42 9.763 10.465 9.473 10 10c-.603.683-.475 1.819-.351 2.92C9.826 14.495 9.996 16 8 16a8 8 0 1 1 8-8m-8 7c.611 0 .654-.171.655-.176.078-.146.124-.464.07-1.119-.014-.168-.037-.37-.061-.591-.052-.464-.112-1.005-.118-1.462-.01-.707.083-1.61.704-2.314.369-.417.845-.578 1.272-.618.404-.038.812.026 1.16.104.343.077.702.186 1.025.284l.028.008c.346.105.658.199.953.266.653.148.904.083.991.024C14.717 9.38 15 9.161 15 8a7 7 0 1 0-7 7"></path>
|
<path d="M16 8c0 3.15-1.866 2.585-3.567 2.07C11.42 9.763 10.465 9.473 10 10c-.603.683-.475 1.819-.351 2.92C9.826 14.495 9.996 16 8 16a8 8 0 1 1 8-8m-8 7c.611 0 .654-.171.655-.176.078-.146.124-.464.07-1.119-.014-.168-.037-.37-.061-.591-.052-.464-.112-1.005-.118-1.462-.01-.707.083-1.61.704-2.314.369-.417.845-.578 1.272-.618.404-.038.812.026 1.16.104.343.077.702.186 1.025.284l.028.008c.346.105.658.199.953.266.653.148.904.083.991.024C14.717 9.38 15 9.161 15 8a7 7 0 1 0-7 7"></path>
|
||||||
</svg></div>
|
</svg></div>
|
||||||
<h5 class="fw-bold card-title">Hex Colors</h5>
|
<h5 class="fw-bold card-title">Hex Colors</h5>
|
||||||
<p class="text-muted card-text mb-4">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
|
<p class="text-muted mb-4 card-text">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-8 col-xl-6 text-center mx-auto">
|
<div class="col-md-8 col-xl-6 text-center mx-auto">
|
||||||
<div class="card shadow-sm">
|
<div class="card shadow-sm">
|
||||||
<div class="card-body px-4 py-5 px-md-5">
|
<div class="card-body px-4 px-md-5 py-5">
|
||||||
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-globe text-success">
|
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-globe text-success">
|
||||||
<path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8m7.5-6.923c-.67.204-1.335.82-1.887 1.855A7.97 7.97 0 0 0 5.145 4H7.5zM4.09 4a9.267 9.267 0 0 1 .64-1.539 6.7 6.7 0 0 1 .597-.933A7.025 7.025 0 0 0 2.255 4zm-.582 3.5c.03-.877.138-1.718.312-2.5H1.674a6.958 6.958 0 0 0-.656 2.5zM4.847 5a12.5 12.5 0 0 0-.338 2.5H7.5V5zM8.5 5v2.5h2.99a12.495 12.495 0 0 0-.337-2.5zM4.51 8.5a12.5 12.5 0 0 0 .337 2.5H7.5V8.5zm3.99 0V11h2.653c.187-.765.306-1.608.338-2.5zM5.145 12c.138.386.295.744.468 1.068.552 1.035 1.218 1.65 1.887 1.855V12zm.182 2.472a6.696 6.696 0 0 1-.597-.933A9.268 9.268 0 0 1 4.09 12H2.255a7.024 7.024 0 0 0 3.072 2.472M3.82 11a13.652 13.652 0 0 1-.312-2.5h-2.49c.062.89.291 1.733.656 2.5zm6.853 3.472A7.024 7.024 0 0 0 13.745 12H11.91a9.27 9.27 0 0 1-.64 1.539 6.688 6.688 0 0 1-.597.933M8.5 12v2.923c.67-.204 1.335-.82 1.887-1.855.173-.324.33-.682.468-1.068zm3.68-1h2.146c.365-.767.594-1.61.656-2.5h-2.49a13.65 13.65 0 0 1-.312 2.5zm2.802-3.5a6.959 6.959 0 0 0-.656-2.5H12.18c.174.782.282 1.623.312 2.5zM11.27 2.461c.247.464.462.98.64 1.539h1.835a7.024 7.024 0 0 0-3.072-2.472c.218.284.418.598.597.933zM10.855 4a7.966 7.966 0 0 0-.468-1.068C9.835 1.897 9.17 1.282 8.5 1.077V4z"></path>
|
<path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8m7.5-6.923c-.67.204-1.335.82-1.887 1.855A7.97 7.97 0 0 0 5.145 4H7.5zM4.09 4a9.267 9.267 0 0 1 .64-1.539 6.7 6.7 0 0 1 .597-.933A7.025 7.025 0 0 0 2.255 4zm-.582 3.5c.03-.877.138-1.718.312-2.5H1.674a6.958 6.958 0 0 0-.656 2.5zM4.847 5a12.5 12.5 0 0 0-.338 2.5H7.5V5zM8.5 5v2.5h2.99a12.495 12.495 0 0 0-.337-2.5zM4.51 8.5a12.5 12.5 0 0 0 .337 2.5H7.5V8.5zm3.99 0V11h2.653c.187-.765.306-1.608.338-2.5zM5.145 12c.138.386.295.744.468 1.068.552 1.035 1.218 1.65 1.887 1.855V12zm.182 2.472a6.696 6.696 0 0 1-.597-.933A9.268 9.268 0 0 1 4.09 12H2.255a7.024 7.024 0 0 0 3.072 2.472M3.82 11a13.652 13.652 0 0 1-.312-2.5h-2.49c.062.89.291 1.733.656 2.5zm6.853 3.472A7.024 7.024 0 0 0 13.745 12H11.91a9.27 9.27 0 0 1-.64 1.539 6.688 6.688 0 0 1-.597.933M8.5 12v2.923c.67-.204 1.335-.82 1.887-1.855.173-.324.33-.682.468-1.068zm3.68-1h2.146c.365-.767.594-1.61.656-2.5h-2.49a13.65 13.65 0 0 1-.312 2.5zm2.802-3.5a6.959 6.959 0 0 0-.656-2.5H12.18c.174.782.282 1.623.312 2.5zM11.27 2.461c.247.464.462.98.64 1.539h1.835a7.024 7.024 0 0 0-3.072-2.472c.218.284.418.598.597.933zM10.855 4a7.966 7.966 0 0 0-.468-1.068C9.835 1.897 9.17 1.282 8.5 1.077V4z"></path>
|
||||||
</svg></div>
|
</svg></div>
|
||||||
<h5 class="fw-bold card-title">User-Focused Design</h5>
|
<h5 class="fw-bold card-title">User-Focused Design</h5>
|
||||||
<p class="text-muted card-text mb-4">CS:Box is accessible on any device with a browser. Its web-based design ensures students can engage with computing concepts from any location, promoting independent learning and experimentation.</p>
|
<p class="text-muted mb-4 card-text">CS:Box is accessible on any device with a browser. Its web-based design ensures students can engage with computing concepts from any location, promoting independent learning and experimentation.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Features Cards -->
|
</div>
|
||||||
</section><!-- End: Service Cards -->
|
</section>
|
||||||
<!-- Start: Features Cards -->
|
|
||||||
<div class="container py-5">
|
<div class="container py-5">
|
||||||
<div class="row row-cols-1 row-cols-md-2 mx-auto">
|
<div class="row row-cols-1 row-cols-md-2 mx-auto">
|
||||||
<div class="col mb-5"><img class="rounded img-fluid shadow" src="assets/img/Educational_Impact.webp?h=63a87115577f492ad78640012051f84a"></div>
|
<div class="col mb-5"><img class="rounded img-fluid shadow" src="assets/img/Educational_Impact.webp?h=63a87115577f492ad78640012051f84a"></div>
|
||||||
@@ -265,22 +173,19 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Features Cards -->
|
</div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -295,26 +200,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,9 +70,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col" style="height: 120px;"></div>
|
<div class="col" style="height: 120px;"></div>
|
||||||
@@ -170,8 +81,7 @@
|
|||||||
<h1 id="pageHeading" class="simHeading">AND Gate</h1>
|
<h1 id="pageHeading" class="simHeading">AND Gate</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<!-- Start: 1 Row 3 Columns -->
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/thumb/6/64/AND_ANSI.svg/1920px-AND_ANSI.svg.png" width="460" height="240">
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/thumb/6/64/AND_ANSI.svg/1920px-AND_ANSI.svg.png" width="460" height="240">
|
||||||
@@ -181,23 +91,20 @@
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 3 Columns -->
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -212,26 +119,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
File diff suppressed because one or more lines are too long
1
Export/assets/css/styles.min.css
vendored
Normal file
1
Export/assets/css/styles.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
BIN
Export/assets/fonts/Inter-19884df4a8102ca66ed497ef7f549816.woff2
Normal file
BIN
Export/assets/fonts/Inter-19884df4a8102ca66ed497ef7f549816.woff2
Normal file
Binary file not shown.
BIN
Export/assets/fonts/Inter-2083c91140e7bbb7db951151ac57a155.woff2
Normal file
BIN
Export/assets/fonts/Inter-2083c91140e7bbb7db951151ac57a155.woff2
Normal file
Binary file not shown.
BIN
Export/assets/fonts/Inter-990bab229e94ccb55fad37cff3dae646.woff2
Normal file
BIN
Export/assets/fonts/Inter-990bab229e94ccb55fad37cff3dae646.woff2
Normal file
Binary file not shown.
BIN
Export/assets/fonts/Inter-b076fc26c61e86fdfdbd5a3b96aa9a56.woff2
Normal file
BIN
Export/assets/fonts/Inter-b076fc26c61e86fdfdbd5a3b96aa9a56.woff2
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
1
Export/assets/js/script.min.js
vendored
Normal file
1
Export/assets/js/script.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,9 +70,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col centred" style="width: 30%;">
|
<div class="col centred" style="width: 30%;">
|
||||||
@@ -234,7 +145,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred">
|
<div class="container d-xl-flex justify-content-xl-center centred">
|
||||||
<form oninput="updateNumbers()">
|
<form oninput="updateNumbers()">
|
||||||
<div class="table-responsive text-center d-xl-flex justify-content-xl-center">
|
<div class="table-responsive text-center d-xl-flex justify-content-xl-center">
|
||||||
@@ -279,21 +190,18 @@
|
|||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -308,26 +216,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,9 +70,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col centred" style="width: 30%;">
|
<div class="col centred" style="width: 30%;">
|
||||||
@@ -210,7 +121,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<div class="col-md-6 col-xl-4" style="width: 100%;">
|
<div class="col-md-6 col-xl-4" style="width: 100%;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-xl-12" style="height: 56px;">
|
<div class="col-xl-12" style="height: 56px;">
|
||||||
@@ -222,7 +133,7 @@
|
|||||||
<h1 id="denaryNumber" class="simData">0, 0, 0</h1>
|
<h1 id="denaryNumber" class="simData">0, 0, 0</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- Start: 1 Row 2 Columns -->
|
</div>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-6">
|
<div class="col-md-6">
|
||||||
@@ -236,7 +147,7 @@
|
|||||||
<div class="col-md-6" id="colouredHex" style="border: solid;background-color: #000000;"></div>
|
<div class="col-md-6" id="colouredHex" style="border: solid;background-color: #000000;"></div>
|
||||||
<div class="col-md-6" id="invertedHex" style="border: solid;background: #ffffff;"></div>
|
<div class="col-md-6" id="invertedHex" style="border: solid;background: #ffffff;"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<div class="d-xl-flex justify-content-xl-center centred">
|
<div class="d-xl-flex justify-content-xl-center centred">
|
||||||
<div class="hexColourToggles">
|
<div class="hexColourToggles">
|
||||||
<table class="table table-borderless">
|
<table class="table table-borderless">
|
||||||
@@ -383,21 +294,18 @@
|
|||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -412,26 +320,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -30,134 +30,45 @@
|
|||||||
"name": "CS:Box",
|
"name": "CS:Box",
|
||||||
"url": "https://csbox.mrdaviscsit.uk"
|
"url": "https://csbox.mrdaviscsit.uk"
|
||||||
}
|
}
|
||||||
</script>
|
</script><script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
<script>
|
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
<ul class="navbar-nav ms-auto">
|
<ul class="navbar-nav ms-auto">
|
||||||
<li class="nav-item"><a class="nav-link active" href="/">Home</a></li>
|
<li class="nav-item"><a class="nav-link active" href="/">Home</a></li>
|
||||||
<li class="nav-item"><a class="nav-link" href="about">About</a></li>
|
<li class="nav-item"><a class="nav-link" href="about">About</a></li>
|
||||||
<li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
|
<li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown">Binary</a>
|
||||||
<div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
|
<div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
|
<li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown">Hexadecimal</a>
|
||||||
<div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
|
<div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
|
<li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
|
||||||
<li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
|
<li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown">Logic Gates</a>
|
||||||
<div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
|
<div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -166,9 +77,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block">
|
||||||
<!-- Start: Hero Clean Reverse -->
|
|
||||||
<div class="container py-5">
|
<div class="container py-5">
|
||||||
<div class="row py-5">
|
<div class="row py-5">
|
||||||
<div class="col-md-6 text-center text-md-start d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-end mb-4">
|
<div class="col-md-6 text-center text-md-start d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-end mb-4">
|
||||||
@@ -185,22 +95,19 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="col"></div>
|
<div class="col"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Hero Clean Reverse -->
|
</div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -215,26 +122,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,9 +70,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col" style="height: 120px;"></div>
|
<div class="col" style="height: 120px;"></div>
|
||||||
@@ -170,8 +81,7 @@
|
|||||||
<h1 id="pageHeading" class="simHeading">NAND Gate</h1>
|
<h1 id="pageHeading" class="simHeading">NAND Gate</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<!-- Start: 1 Row 3 Columns -->
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/f/f2/NAND_ANSI.svg" width="460" height="240">
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/f/f2/NAND_ANSI.svg" width="460" height="240">
|
||||||
@@ -181,23 +91,20 @@
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 3 Columns -->
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -212,26 +119,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,9 +70,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col" style="height: 120px;"></div>
|
<div class="col" style="height: 120px;"></div>
|
||||||
@@ -170,8 +81,7 @@
|
|||||||
<h1 id="pageHeading" class="simHeading">NOR Gate</h1>
|
<h1 id="pageHeading" class="simHeading">NOR Gate</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<!-- Start: 1 Row 3 Columns -->
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/6/6c/NOR_ANSI.svg" width="460" height="240">
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/6/6c/NOR_ANSI.svg" width="460" height="240">
|
||||||
@@ -181,23 +91,20 @@
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 3 Columns -->
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -212,26 +119,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,9 +70,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col" style="height: 120px;"></div>
|
<div class="col" style="height: 120px;"></div>
|
||||||
@@ -170,8 +81,7 @@
|
|||||||
<h1 id="pageHeading" class="simHeading">NOT Gate</h1>
|
<h1 id="pageHeading" class="simHeading">NOT Gate</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<!-- Start: 1 Row 3 Columns -->
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;margin-top: 2.8em;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/bc/NOT_ANSI.svg/1920px-NOT_ANSI.svg.png" width="460" height="240">
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;margin-top: 2.8em;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/bc/NOT_ANSI.svg/1920px-NOT_ANSI.svg.png" width="460" height="240">
|
||||||
@@ -181,23 +91,20 @@
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 3 Columns -->
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -212,26 +119,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,9 +70,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col" style="height: 120px;"></div>
|
<div class="col" style="height: 120px;"></div>
|
||||||
@@ -170,8 +81,7 @@
|
|||||||
<h1 id="pageHeading" class="simHeading">OR Gate</h1>
|
<h1 id="pageHeading" class="simHeading">OR Gate</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<!-- Start: 1 Row 3 Columns -->
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b5/OR_ANSI.svg/1920px-OR_ANSI.svg.png" width="460" height="240">
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b5/OR_ANSI.svg/1920px-OR_ANSI.svg.png" width="460" height="240">
|
||||||
@@ -181,23 +91,20 @@
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 3 Columns -->
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -212,26 +119,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,10 +55,9 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
<section class="py-5">
|
<section class="py-5">
|
||||||
<!-- Start: Projects Grid -->
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row mb-5">
|
<div class="row mb-5">
|
||||||
<div class="col text-center mx-auto">
|
<div class="col text-center mx-auto">
|
||||||
@@ -188,22 +99,19 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Projects Grid -->
|
</div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -218,26 +126,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,13 +70,12 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<!-- Start: Hero Banner Color -->
|
|
||||||
<section class="py-4 py-xl-5">
|
<section class="py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">Page Unavailable</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">Page Unavailable</h1>
|
||||||
<p class="mb-4">This page is currently offline for maintenance.<br>Please try again later.</p>
|
<p class="mb-4">This page is currently offline for maintenance.<br>Please try again later.</p>
|
||||||
@@ -173,9 +84,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-none d-sm-none d-md-none d-lg-none d-xl-none d-xxl-none" style="background: rgb(39,38,46);">
|
<section class="d-none d-print-none d-sm-none d-md-none d-lg-none d-xl-none d-xxl-none" style="background: rgb(39,38,46);">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col centred" style="width: 35%;">
|
<div class="col centred" style="width: 35%;">
|
||||||
@@ -238,7 +148,7 @@
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col spacer" style="width: 100%;"></div>
|
<div class="col spacer" style="width: 100%;"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred">
|
<div class="container d-xl-flex justify-content-xl-center centred">
|
||||||
<div class="text-center d-xl-flex justify-content-xl-center" style="width: 100%;">
|
<div class="text-center d-xl-flex justify-content-xl-center" style="width: 100%;">
|
||||||
<table class="table table-borderless">
|
<table class="table table-borderless">
|
||||||
@@ -312,21 +222,18 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -341,26 +248,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,9 +70,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col centred" style="width: 35%;">
|
<div class="col centred" style="width: 35%;">
|
||||||
@@ -223,7 +134,7 @@
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col spacer" style="width: 100%;"></div>
|
<div class="col spacer" style="width: 100%;"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred">
|
<div class="container d-xl-flex justify-content-xl-center centred">
|
||||||
<div class="text-center d-xl-flex justify-content-xl-center" style="width: 100%;">
|
<div class="text-center d-xl-flex justify-content-xl-center" style="width: 100%;">
|
||||||
<table class="table table-borderless">
|
<table class="table table-borderless">
|
||||||
@@ -297,21 +208,18 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -326,26 +234,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,9 +70,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col" style="height: 120px;"></div>
|
<div class="col" style="height: 120px;"></div>
|
||||||
@@ -170,8 +81,7 @@
|
|||||||
<h1 id="pageHeading" class="simHeading">XNOR Gate</h1>
|
<h1 id="pageHeading" class="simHeading">XNOR Gate</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<!-- Start: 1 Row 3 Columns -->
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/d/d6/XNOR_ANSI.svg" width="460" height="240">
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/d/d6/XNOR_ANSI.svg" width="460" height="240">
|
||||||
@@ -181,23 +91,20 @@
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 3 Columns -->
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -212,26 +119,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -23,107 +23,19 @@
|
|||||||
<meta name="twitter:card" content="summary_large_image">
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
<meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
|
||||||
<script>
|
<script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
|
||||||
(function() {
|
|
||||||
|
|
||||||
// JavaScript snippet handling Dark/Light mode switching
|
|
||||||
|
|
||||||
const getStoredTheme = () => localStorage.getItem('theme');
|
|
||||||
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
||||||
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
||||||
|
|
||||||
const getPreferredTheme = () => {
|
|
||||||
|
|
||||||
if (forcedTheme) return forcedTheme;
|
|
||||||
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme) {
|
|
||||||
return storedTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
||||||
|
|
||||||
if (pageTheme) {
|
|
||||||
return pageTheme;
|
|
||||||
}
|
|
||||||
|
|
||||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
||||||
}
|
|
||||||
|
|
||||||
const setTheme = theme => {
|
|
||||||
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
||||||
} else {
|
|
||||||
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
const showActiveTheme = (theme, focus = false) => {
|
|
||||||
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
||||||
|
|
||||||
if (!themeSwitchers.length) return;
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
||||||
element.classList.remove('active');
|
|
||||||
element.setAttribute('aria-pressed', 'false');
|
|
||||||
});
|
|
||||||
|
|
||||||
for (const themeSwitcher of themeSwitchers) {
|
|
||||||
|
|
||||||
const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
||||||
|
|
||||||
if (btnToActivate) {
|
|
||||||
btnToActivate.classList.add('active');
|
|
||||||
btnToActivate.setAttribute('aria-pressed', 'true');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
||||||
const storedTheme = getStoredTheme();
|
|
||||||
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
||||||
setTheme(getPreferredTheme());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
|
||||||
showActiveTheme(getPreferredTheme());
|
|
||||||
|
|
||||||
document.querySelectorAll('[data-bs-theme-value]')
|
|
||||||
.forEach(toggle => {
|
|
||||||
toggle.addEventListener('click', (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
||||||
setStoredTheme(theme);
|
|
||||||
setTheme(theme);
|
|
||||||
showActiveTheme(theme);
|
|
||||||
})
|
|
||||||
})
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
<link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
|
||||||
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=1bd2fff2799ca0c747d7b2f342f09263">
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
|
||||||
<link rel="stylesheet" href="assets/css/DSEG7%20Classic%20Regular.css">
|
<link rel="stylesheet" href="assets/css/styles.min.css?h=6be15fe0d1cfa81af69e0d5a16f5c85d">
|
||||||
<link rel="stylesheet" href="assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/Inter.css?h=e5f10e8edea6724df772779293114dec">
|
|
||||||
<link rel="stylesheet" href="assets/css/Open%20Sans.css?h=50bf27dcf1a8b0240d3e6638c4b5b7d2">
|
|
||||||
<link rel="stylesheet" href="assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
|
|
||||||
<link rel="stylesheet" href="assets/css/bs-theme-overrides.css?h=c211b632aade4ff7985e7a32a316c7b8">
|
|
||||||
<link rel="stylesheet" href="assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
|
|
||||||
<link rel="stylesheet" href="assets/css/styles.css?h=3e090fbf977edce98dcf9e4faea134e4">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="bg-dark">
|
<header class="bg-dark">
|
||||||
<!-- Start: Site Navigation -->
|
|
||||||
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
<nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
|
||||||
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
<div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
||||||
<div class="collapse navbar-collapse" id="navcol-5">
|
<div class="collapse navbar-collapse" id="navcol-5">
|
||||||
@@ -143,13 +55,13 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav><!-- End: Site Navigation -->
|
</nav>
|
||||||
</header><!-- Start: Hero Banner Color -->
|
</header>
|
||||||
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
<section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
|
||||||
<div class="container h-100">
|
<div class="container h-100">
|
||||||
<div class="text-white border rounded border-0 bg-danger p-1">
|
<div class="text-white border rounded border-0 p-1 bg-danger">
|
||||||
<div class="row h-100">
|
<div class="row h-100">
|
||||||
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center mx-auto justify-content-md-start align-items-md-center justify-content-xl-center">
|
<div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
|
||||||
<div>
|
<div>
|
||||||
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
<h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
|
||||||
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
<p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
|
||||||
@@ -158,9 +70,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section><!-- End: Hero Banner Color -->
|
</section>
|
||||||
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
<section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
|
||||||
<!-- Start: 1 Row 2 Columns -->
|
|
||||||
<div class="container" style="width: 100%;margin-top: 15px;">
|
<div class="container" style="width: 100%;margin-top: 15px;">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col" style="height: 120px;"></div>
|
<div class="col" style="height: 120px;"></div>
|
||||||
@@ -170,8 +81,7 @@
|
|||||||
<h1 id="pageHeading" class="simHeading">XOR Gate</h1>
|
<h1 id="pageHeading" class="simHeading">XOR Gate</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 2 Columns -->
|
</div>
|
||||||
<!-- Start: 1 Row 3 Columns -->
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/0/01/XOR_ANSI.svg" width="460" height="240">
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/0/01/XOR_ANSI.svg" width="460" height="240">
|
||||||
@@ -181,23 +91,20 @@
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
<div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: 1 Row 3 Columns -->
|
</div>
|
||||||
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
<div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
|
||||||
</section><!-- Start: Footer Multi Column -->
|
</section>
|
||||||
<footer style="background: rgb(45,44,56);">
|
<footer style="background: rgb(45,44,56);">
|
||||||
<div class="container py-4 py-lg-5">
|
<div class="container py-4 py-lg-5">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<!-- Start: About Project -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
<div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
|
||||||
</svg><span>GitHub</span></div>
|
</svg><span>GitHub</span></div>
|
||||||
</a>
|
</a>
|
||||||
</div><!-- End: About Project -->
|
</div>
|
||||||
<!-- Start: About -->
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div>
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
|
|
||||||
<!-- Start: Social Links -->
|
|
||||||
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
<div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
|
||||||
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
<h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@@ -212,26 +119,21 @@
|
|||||||
</svg></a></div>
|
</svg></a></div>
|
||||||
<div class="col-md-3"></div>
|
<div class="col-md-3"></div>
|
||||||
</div>
|
</div>
|
||||||
</div><!-- End: Social Links -->
|
</div>
|
||||||
<!-- Start: Branding -->
|
|
||||||
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
<div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
|
||||||
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
<div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
|
||||||
<p class="text-muted">Computer Science Concept Simulators</p>
|
<p class="text-muted">Computer Science Concept Simulators</p>
|
||||||
</div><!-- End: Branding -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
||||||
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
<p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer><!-- End: Footer Multi Column -->
|
</footer>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
|
<script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
|
||||||
<script src="assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
|
|
||||||
<script src="assets/js/hexadecimal.js?h=ed5c6d92d71af17004fe145227303d9d"></script>
|
|
||||||
<script src="assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
|
|
||||||
<script src="assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
Reference in New Issue
Block a user