Deployment

Gemfile

@@ -5,3 +5,8 @@ gem "jekyll", "~> 4.3.3" # installed by `gem jekyll`
 
 gem "just-the-docs", "0.8.1" # pinned to the current release
 # gem "just-the-docs"        # always download the latest release
+
+gem "csv"
+gem "base64"
+gem "logger"
+gem "bigdecimal"

Gemfile.lock

@@ -3,15 +3,20 @@ GEM
   specs:
     addressable (2.8.6)
       public_suffix (>= 2.0.2, < 6.0)
+    base64 (0.2.0)
+    bigdecimal (3.1.9)
     colorator (1.1.0)
     concurrent-ruby (1.2.2)
+    csv (3.3.3)
     em-websocket (0.5.3)
       eventmachine (>= 0.12.9)
       http_parser.rb (~> 0)
     eventmachine (1.2.7)
     ffi (1.16.3)
     forwardable-extended (2.6.0)
     google-protobuf (3.25.1)
+    google-protobuf (3.25.1-arm64-darwin)
+    google-protobuf (3.25.1-x86_64-darwin)
     http_parser.rb (0.8.0)
     i18n (1.14.1)
       concurrent-ruby (~> 1.0)
@@ -52,6 +57,7 @@ GEM
     listen (3.8.0)
       rb-fsevent (~> 0.10, >= 0.10.3)
       rb-inotify (~> 0.9, >= 0.9.10)
+    logger (1.7.0)
     mercenary (0.4.0)
     pathutil (0.16.2)
       forwardable-extended (~> 2.6)
@@ -65,6 +71,8 @@ GEM
     safe_yaml (1.0.5)
     sass-embedded (1.69.5-arm64-darwin)
       google-protobuf (~> 3.23)
+    sass-embedded (1.69.5-x64-mingw-ucrt)
+      google-protobuf (~> 3.23)
     sass-embedded (1.69.5-x86_64-darwin)
       google-protobuf (~> 3.23)
     sass-embedded (1.69.5-x86_64-linux-gnu)
@@ -76,12 +84,19 @@ GEM
 
 PLATFORMS
   arm64-darwin-23
+  arm64-darwin-24
+  x64-mingw-ucrt
+  x86_64-darwin-22
   x86_64-darwin-23
   x86_64-linux
 
 DEPENDENCIES
+  base64
+  bigdecimal
+  csv
   jekyll (~> 4.3.3)
   just-the-docs (= 0.8.1)
+  logger
 
 BUNDLED WITH
    2.3.26

_config.yml

@@ -24,4 +24,8 @@ callouts:
     color: blue
   lab:
     title: Access The Lab
-    color: purple
+    color: purple
+
+sass:
+  sass_dir: _sass
+  style: compressed

_data/quizzes/topic2/chapter1.yml

@@ -0,0 +1,44 @@
+questions:
+    - prompt: "What is the primary purpose of version control in software development?"
+      options:
+        - "It prevents unauthorized users from editing a file."
+        - "It allows developers to track changes, collaborate, and revert to previous versions of files if necessary."
+        - "It automates the process of building software from source code."
+        - "It helps manage user authentication systems in a project."
+      correct_index: 1
+      explanation: "Version control allows developers to track changes, collaborate, and revert to previous versions of files if necessary. This helps maintain a history of changes and prevents conflicts when working collaboratively."
+
+    - prompt: "What is one of the key advantages of using version control in the scenario where Armine and Tigran are working on the same project?"
+      options:
+        - "Version control allows them to share the same file without needing to merge their changes."
+        - "It ensures that both of their changes are automatically merged, without requiring them to review the changes."
+        - "It enables them to track their changes independently and merge their updates later, preventing conflicts."
+        - "It prevents them from making any changes to each other's files."
+      correct_index: 2
+      explanation: "Version control enables Armine and Tigran to track their changes independently and merge their updates later, preventing conflicts. This process is essential when multiple developers are working on the same codebase."
+
+    - prompt: "True or False: Version control systems, like GitHub, prevent all types of conflicts between developers working on the same project by automatically merging all changes."
+      options:
+        - "True"
+        - "False"
+      correct_index: 1
+      explanation: "False. Version control systems help manage changes and alert developers to conflicts, but they do not automatically merge all changes. Developers must manually resolve conflicts."
+
+    - prompt: "Which of the following is NOT true about version control systems?"
+      options:
+        - "They allow developers to view the history of changes made to files and revert to any previous state."
+        - "They can automatically detect and resolve any conflicts between different versions of a file."
+        - "They facilitate collaboration by allowing multiple developers to work on different parts of a project without interfering with each other."
+        - "They store different versions of files, enabling developers to work on multiple features simultaneously."
+      correct_index: 1
+      explanation: "Version control systems help detect conflicts, but they do not automatically resolve them. Developers must review and merge conflicting changes manually."
+
+    - prompt: "Which of the following best describes how GitHub helps in the version control process?"
+      options:
+        - "GitHub is used exclusively for backing up files and does not include version control features."
+        - "GitHub only serves as a cloud-based storage system for completed software projects and does not support versioning."
+        - "GitHub is a platform for organizing and managing tasks related to software development but does not play a role in version control."
+        - "GitHub integrates with version control systems to store files and track changes, while also providing a user interface for collaboration and version history."
+      correct_index: 3
+      explanation: "GitHub is a version control platform that integrates with Git to store files, track changes, and provide collaboration features like issue tracking, pull requests, and version history."
+

_data/quizzes/topic2/chapter2.yml

@@ -0,0 +1,41 @@
+questions:
+  - prompt: "In Git, all changes in your working directory are committed to the repository when you run <code>git commit</code>, even if they haven't been added to the staging area."
+    options:
+     - "True"
+     - "False"
+    correct_index: 1
+    explanation: "False — Only changes that have been added to the staging area using <code>git add</code> will be included in a commit. Unstaged changes in the working directory are not committed."
+
+  - prompt: "What happens when you run the command <code>git checkout &lt;branch-name&gt;</code>?"
+    options:
+     - "It creates a new branch called <code>&lt;branch-name&gt;</code> but doesn't switch to it."
+     - "It deleted the <code>&lt;branch-name&gt;</code> branch from the respository."
+     - "It uploads your changes to the remote repository."
+     - "It switches your local branch to <code>&lt;branch-name&gt;</code> and updates the working directory with that branch's files."
+    correct_index: 3
+    explanation: "<code>git checkout &lt;branch-name&gt;</code> switches to the specified branch and updates the working directory with that branch's contents."
+
+  - prompt: "In Git, the term _________ refers to a snapshot of your project at a specific point in time, which is stored in the repository after running <code>git commit</code>."
+    options:
+     - "Working Directory"
+     - "Staging Area"
+     - "Commit"
+     - "Branch"
+    correct_index: 2
+    explanation: "A commit in Git represents a snapshot of your project at a specific point in time."
+
+  - prompt: "Which of the following statements is FALSE regarding Git branches?"
+    options:
+      - "A branch in Git does not copy files but simply creates a new pointer to them."
+      - "You can use branches to experiment with new features without affecting the main codebase."
+      - "Once a branch is created, it automatically merges into the <code>main</code> branch after a set period."
+      - "A branch isolates development work, enabling concurrent tasks without conflicts."
+    correct_index: 2
+    explanation: "A branch does NOT automatically merge into the <code>main</code> branch; you have to do it manually using <code>git merge</code>."
+
+  - prompt: "If you delete a branch using <code>git branch -d &lt;branch-name&gt;</code>, the branch is permanently deleted from both your local and remote repositories."
+    options:
+      - "True"
+      - "False"
+    correct_index: 1
+    explanation: "<code>git branch -d</code> only deletes the LOCAL branch. To delete a branch from the remote, you would use <code>git push origin --delete &lt;branch-name&gt;</code>."

_includes/head_custom.html

@@ -1,5 +1,6 @@
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tocbot/4.25.0/tocbot.css">
 <script src="https://cdnjs.cloudflare.com/ajax/libs/tocbot/4.25.0/tocbot.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/canvas-confetti@1.9.3/dist/confetti.browser.min.js"></script>
 <meta http-equiv="cache-control" content="no-cache, no-store, must-revalidate">
 <meta http-equiv="pragma" content="no-cache">
 <meta http-equiv="expires" content="0">

_includes/nav_footer_custom.html

@@ -1,3 +1,32 @@
 <footer class="site-footer">
+    <!-- Dark Mode Toggle -->
+    <button class="btn js-toggle-dark-mode" style="font-size: 1.2rem; margin-bottom: 0.5rem;"></button>
+    <br>
     This site uses a custom theme based on <a href="https://github.com/just-the-docs/just-the-docs">Just the Docs</a>.
-</footer>
+</footer>
+
+<script>
+    const toggleDarkMode = document.querySelector('.js-toggle-dark-mode');
+
+    // Set button icon based on theme
+    const updateButtonIcon = (theme) => {
+      toggleDarkMode.textContent = theme === 'dark' ? '🌙' : '☀️';
+    };
+
+    // Load and apply saved theme
+    const savedTheme = localStorage.getItem('theme');
+    if (savedTheme) {
+      jtd.setTheme(savedTheme);
+      updateButtonIcon(savedTheme);
+    }
+
+    // Toggle and save theme
+    jtd.addEvent(toggleDarkMode, 'click', function () {
+      const currentTheme = jtd.getTheme();
+      const newTheme = currentTheme === 'dark' ? 'light' : 'dark';
+
+      jtd.setTheme(newTheme);
+      localStorage.setItem('theme', newTheme);
+      updateButtonIcon(newTheme);
+    });
+  </script>

_includes/quiz.html

@@ -0,0 +1,29 @@
+<h2 id="quiz-title">🧠 Knowledge Check</h2>
+<p>Answer the questions below to test your knowledge!</p>
+
+<form class="quiz-form" data-quiz-id="{{ include.id }}">
+    {% for q in include.data.questions %}
+    <div class="quiz-question" data-question-index="{{ forloop.index0 }}">
+        <p><strong>Q{{ forloop.index }}:</strong> {{ q.prompt }}</p>
+
+        {% for option in q.options %}
+        <label>
+            <input type="radio" 
+                   name="question-{{ q.prompt | slugify }}" 
+                   value="{{ forloop.index0 }}">
+            {{ option }}
+        </label>
+        {% endfor %}
+
+        <div class="quiz-feedback" style="display:none;"></div>
+    </div>
+    {% endfor %}
+
+    <!-- <button type="button" onclick="submitQuiz('{{ include.id }}')">Submit</button> -->
+    <button type="button" onclick="submitQuiz('{{ include.id }}')" class="submit-btn">Submit</button>
+    <button type="button" onclick="resetQuiz('{{ include.id }}')" class="try-again-btn" style="display:none;">Try Again</button>
+
+</form>
+
+
+

_layouts/custom.html

@@ -19,6 +19,12 @@
                     {% include components/children_nav.html %}
                   {% endif %}
                 </main>
+                <!-- Font Size Control Section -->
+                <div id="font-size-controls" style="text-align:center; margin-top: 2rem;">
+                  <button id="btn-increase">A+</button>
+                  <button id="btn-decrease">A-</button>
+                  <button id="btn-reset">Reset</button>
+                </div>
                 {% include components/footer.html %}
               </div>
           </div>
@@ -33,5 +39,61 @@
   {% if site.mermaid %}
     {% include components/mermaid.html %}
   {% endif %}
+
+<script>
+  window.quizData = window.quizData || {};
+  {% if page.topic and page.chapter %}
+    window.quizData["{{ page.topic }}-{{ page.chapter }}"] = {{ site.data.quizzes[page.topic][page.chapter] | jsonify }};
+  {% endif %}
+  // window.quizData["topic2-chapter1"] = {{ site.data.quizzes.topic2.chapter1 | jsonify }};
+  // window.quizData["topic2-chapter2"] = {{ site.data.quizzes.topic2.chapter2 | jsonify }};
+</script>
+
+<script src="/assets/js/quiz.js"></script>
+<script src="/assets/js/quiz-reset.js"></script>
+
+  {% include footer_custom.html %}
+
+    <!-- JavaScript for Font Size Control -->
+    <script>
+      document.addEventListener("DOMContentLoaded", function () {
+  const root = document.documentElement; // Targets <html>
+  let defaultSize = parseFloat(getComputedStyle(root).fontSize); // Get initial font size (16px)
+  let currentSize = defaultSize;
+
+  // Get button elements
+  const increaseBtn = document.getElementById("btn-increase");
+  const decreaseBtn = document.getElementById("btn-decrease");
+  const resetBtn = document.getElementById("btn-reset");
+
+  if (increaseBtn && decreaseBtn && resetBtn) {
+    // Increase font size
+    increaseBtn.addEventListener("click", () => {
+      currentSize += 1; // Increase font size by 1px
+      root.style.setProperty('font-size', `${currentSize}px`, 'important'); // Apply with !important
+      console.log(`Font size increased: ${currentSize}px`);
+    });
+
+    // Decrease font size
+    decreaseBtn.addEventListener("click", () => {
+      if (currentSize > 10) {  // Prevent font size from becoming too small
+        currentSize -= 1; // Decrease font size by 1px
+        root.style.setProperty('font-size', `${currentSize}px`, 'important'); // Apply with !important
+        console.log(`Font size decreased: ${currentSize}px`);
+      }
+    });
+
+    // Reset font size
+    resetBtn.addEventListener("click", () => {
+      currentSize = defaultSize; // Reset to the initial font size
+      root.style.setProperty('font-size', `${defaultSize}px`, 'important'); // Apply with !important
+      console.log(`Font size reset: ${defaultSize}px`);
+    });
+  } else {
+    console.error("Font size buttons not found in the DOM.");
+  }
+});
+
+    </script>
 </body>
 </html>

_sass/custom/custom.scss

@@ -249,7 +249,6 @@ div.highlighter-rouge > button, div.listingblock > div.content > button, figure.
     padding-top: 64px;
     flex: 1;
     min-width: 300px;
-    background-color: #fbfbfb;
     border-left: 1px solid #eeebee;
 
     h2 {

_sass/custom/dark.scss

@@ -0,0 +1,20 @@
+/* Dark Mode Colors */
+$color-scheme: dark;
+$body-background-color: $grey-dk-300;
+$body-heading-color: $grey-lt-000;
+$body-text-color: $grey-lt-300;
+$link-color: $blue-000;
+$nav-child-link-color: $grey-dk-000;
+$sidebar-color: $grey-dk-300;
+$base-button-color: $grey-dk-250;
+$btn-primary-color: $blue-200;
+$code-background-color: #31343f; /* OneDarkJekyll default for syntax-one-dark-vivid */
+$code-linenumber-color: #dee2f7; /* OneDarkJekyll .nf for syntax-one-dark-vivid */
+$feedback-color: darken($sidebar-color, 3%);
+$table-background-color: $grey-dk-250;
+$search-background-color: $grey-dk-250;
+$search-result-preview-color: $grey-dk-000;
+$border-color: $grey-dk-200;
+
+/* Syntax highlighting for code */
+@import "./vendor/OneDarkJekyll/syntax"; /* This is the one-dark-vivid atom syntax theme */

_sass/custom/light.scss

@@ -0,0 +1,16 @@
+$color-scheme: light !default;
+$body-background-color: $white !default;
+$body-heading-color: $grey-dk-300 !default;
+$body-text-color: $grey-dk-100 !default;
+$link-color: $purple-000 !default;
+$nav-child-link-color: $grey-dk-100 !default;
+$sidebar-color: $grey-lt-000 !default;
+$base-button-color: #f7f7f7 !default;
+$btn-primary-color: $purple-100 !default;
+$code-background-color: $grey-lt-000 !default;
+$feedback-color: darken($sidebar-color, 3%) !default;
+$table-background-color: $white !default;
+$search-background-color: $white !default;
+$search-result-preview-color: $grey-dk-000 !default;
+
+@import "./vendor/OneLightJekyll/syntax";