bump(version): 3.4.2 + changelog

fix(style): z-index of panels increased
fix: enable assessments average by default
2026-06-13 15:14:40 +00:00 · 2024-12-05 14:38:02 +11:00 · 2024-12-05 14:36:04 +11:00 · 2024-12-05 14:35:23 +11:00 · 2024-12-03 17:23:35 +11:00 · 2024-12-03 13:52:16 +10:30
23 changed files with 1542 additions and 606 deletions
@@ -1,73 +1,38 @@
-name: MVP - make, version & publish
+name: NodeJS Build

 on:
  push:
-    branches:
-      - main
-  workflow_dispatch: # This line adds manual triggering from the GitHub UI
-
-concurrency: ${{ github.workflow }}-${{ github.ref }}
+    branches: [ "main" ]
+  pull_request:
+    branches: [ "main" ]

 jobs:
-  make_version_publish:
-    name: Make, Version & Publish
+  build:
    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout Repo
-        uses: actions/checkout@v4

-      - name: Setup Node 20.x
+    strategy:
+      matrix:
+        node-version: [20.x]
+
+    steps:
+    - uses: actions/checkout@v4
+
+    - name: Use Node.js ${{ matrix.node-version }}
      uses: actions/setup-node@v4
      with:
-          node-version: 20.x
+        node-version: ${{ matrix.node-version }}

-      - name: Install bun & Deps
+    - name: Build
      run: |
-          npm install bun -g
-          bun install
+        npm install --legacy-peer-deps
+        npm run build

-      - name: 'Build - all browsers'
-        id: buildProject
-        run: MODE=chrome vite build && MODE=firefox vite build
+    - name: Zip dist folder
+      run: |
+        zip -r dist.zip dist

-      - name: '[ V E R S I O N ] : Create or Update Release Pull Request - Version Changes'
-        id: changesets
-        uses: changesets/action@v1
+    - name: Upload artifact
+      uses: actions/upload-artifact@v4
      with:
-          version: bun run version
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
-      - name: 'Get current version info from package.json'
-        if: steps.changesets.outputs.hasChangesets == 'false'
-        id: package
-        run: |
-          echo "::set-output name=PACKAGE_NAME::$(jq -r .name package.json)"
-          echo "::set-output name=PACKAGE_VERSION::$(jq -r .version package.json)"
-        working-directory: ${{ github.workspace }}
-
-      - name: 'Check if a git release already exists for current version'
-        if: steps.changesets.outputs.hasChangesets == 'false'
-        id: checkRelease
-        run: |
-          TAG_NAME=${{ steps.package.outputs.PACKAGE_NAME }}@${{ steps.package.outputs.PACKAGE_VERSION }}
-          if gh release view $TAG_NAME &>/dev/null; then
-            echo "Release $TAG_NAME already exists."
-            echo "RELEASE_EXISTS=true" >> $GITHUB_ENV
-          else
-            echo "RELEASE_EXISTS=false" >> $GITHUB_ENV
-          fi
-
-      - name: 'Create Release Archive(s) - zip 🫰 it 🫰 up 🫰 !'
-        id: zip
-        if: steps.changesets.outputs.hasChangesets == 'false'
-        run: bun run zip
-
-      - name: 'Create a git release w/ notes & release archive(s)'
-        id: gitRelease
-        if: steps.changesets.outputs.hasChangesets == 'false' && env.RELEASE_EXISTS != 'true'
-        run: bun run release
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          PACKAGE_NAME: ${{ steps.package.outputs.PACKAGE_NAME }}
-          PACKAGE_VERSION: ${{ steps.package.outputs.PACKAGE_VERSION }}
+        name: dist-zip
+        path: dist.zip
@@ -1,38 +0,0 @@
-name: NodeJS Build
-
-on:
-  push:
-    branches: [ "main" ]
-  pull_request:
-    branches: [ "main" ]
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        node-version: [20.x]
-
-    steps:
-    - uses: actions/checkout@v4
-
-    - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v4
-      with:
-        node-version: ${{ matrix.node-version }}
-
-    - name: Build
-      run: |
-        npm install
-        npm run build
-
-    - name: Zip dist folder
-      run: |
-        zip -r dist.zip dist
-
-    - name: Upload artifact
-      uses: actions/upload-artifact@v4
-      with:
-        name: dist-zip
-        path: dist.zip
@@ -43,6 +43,7 @@
  - Easier Access Notices
  - Assessments
 - Options to remove certain items from the side menu
+- Grades calculator
 - Fully customisable themes and an offical theme store
 - Notification for next lesson (sent 5 minutes before end of the lesson)
 - Browser Support
@@ -0,0 +1,244 @@
+<html class="reveal-full-page"><head>
+    <script>
+      (function() {
+        const originalConsole = window.console;
+        window.console = {
+          log: (...args) => {
+            originalConsole.log(...args);
+            window.parent.postMessage({ type: 'console', message: args.join(' ') }, '*');
+          },
+          error: (...args) => {
+            originalConsole.error(...args);
+            window.parent.postMessage({ type: 'console', message: 'Error: ' + args.join(' ') }, '*');
+          },
+          warn: (...args) => {
+            originalConsole.warn(...args);
+            window.parent.postMessage({ type: 'console', message: 'Warning: ' + args.join(' ') }, '*');
+          }
+        };
+
+        window.addEventListener('error', (event) => {
+          window.parent.postMessage({ type: 'console', message: 'Uncaught Error: ' + event.message }, '*');
+        });
+      })();
+    </script>
+  
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/4.3.1/reveal.min.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/4.3.1/theme/night.min.css">
+    <link rel="stylesheet" href="https://sethburkart123.github.io/sf-pro-fonts/fonts.css" />
+    <style>
+        * {
+            font-family: 'SF Pro Display', sans-serif !important;
+        }
+        .reveal section img {
+            border: none !important;
+            box-shadow: none !important;
+        }
+        .custom-fragment {
+            opacity: 0;
+            transition: opacity 0.8s ease;
+        }
+        .visible {
+            opacity: 1;
+        }
+        .reveal .slides section {
+            text-align: left;
+        }
+        .reveal h1, .reveal h2 {
+            color: #58a6ff;
+            font-weight: 800;
+        }
+        .reveal h3 {
+            color: #79c0ff;
+        }
+        .reveal .highlight {
+            color: #7ee787;
+        }
+        .reveal .container {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+        }
+        .reveal .box {
+            background: rgba(255,255,255,0.1);
+            padding: 20px;
+            border-radius: 10px;
+            margin: 10px;
+        }
+        .reveal code {
+            background: #1f2937;
+            padding: 3px 5px;
+            border-radius: 4px;
+        }
+    </style>
+</head>
+<body class="reveal-viewport" style="--slide-width: 960px; --slide-height: 700px;">
+    <div class="reveal slide center focused has-vertical-slides has-horizontal-slides" role="application" data-transition-speed="default" data-background-transition="fade" style="">
+        <div class="slides no-transition" style="width: 960px; height: 700px; inset: 50% auto auto 50%; transform: translate(-50%, -50%) scale(0.527);">
+            <!-- Title Slide -->
+            <section style="top: 0px; display: block;" class="present">
+                <h1>SHA-256: The Digital Fingerprint Maker</h1>
+                <h3>A Journey into Modern Cryptographic Security</h3>
+                <p>An interactive exploration of how SHA-256 keeps our digital world secure</p>
+            </section>
+
+            <!-- What is SHA-256? -->
+            <section style="top: 0px; display: block;" hidden="" aria-hidden="true" class="stack future">
+                <section style="top: 97.5px; display: block;">
+                    <h2>What is SHA-256?</h2>
+                    <p>Think of SHA-256 as a magical fingerprint machine for digital data:</p>
+                    <ul>
+                        <li class="fragment" data-fragment-index="0">Takes <em>any</em> digital input (like a message or file)</li>
+                        <li class="fragment" data-fragment-index="1">Always produces a unique 256-bit (64 character) fingerprint</li>
+                        <li class="fragment" data-fragment-index="2">Even a tiny change creates a completely different fingerprint!</li>
+                    </ul>
+                </section>
+            </section>
+
+            <!-- How it Works -->
+            <section style="top: 0px; display: block;" hidden="" aria-hidden="true" class="stack future">
+                <section style="top: 62px; display: block;">
+                    <h2>How SHA-256 Works 🔨</h2>
+                    <p>Imagine a complex assembly line that processes your data:</p>
+                    <div class="container">
+                        <div class="box fragment" data-fragment-index="0">
+                            <h3>1. Preparation</h3>
+                            <p>Data is padded like fitting puzzle pieces into fixed 512-bit blocks</p>
+                        </div>
+                        <div class="box fragment" data-fragment-index="1">
+                            <h3>2. Processing</h3>
+                            <p>64 rounds of mathematical "mixing" operations</p>
+                        </div>
+                    </div>
+                </section>
+
+                <section class="future" aria-hidden="true" style="top: 350px; display: none;">
+                    <h3>The SHA-256 Process Visualized</h3>
+                    <div style="text-align: center;">
+                        <svg viewBox="0 0 800 300" style="max-width: 800px;">
+                            <!-- Input -->
+                            <rect x="50" y="50" width="150" height="60" fill="#58a6ff" opacity="0.8"></rect>
+                            <text x="125" y="85" text-anchor="middle" fill="white">Input Data</text>
+                            
+                            <!-- Arrow 1 -->
+                            <path d="M200 80 L300 80" stroke="white" stroke-width="2" marker-end="url(#arrowhead)"></path>
+                            
+                            <!-- Processing -->
+                            <rect x="300" y="40" width="200" height="80" fill="#7ee787" opacity="0.8"></rect>
+                            <text x="400" y="85" text-anchor="middle" fill="white">SHA-256 Processing</text>
+                            
+                            <!-- Arrow 2 -->
+                            <path d="M500 80 L600 80" stroke="white" stroke-width="2" marker-end="url(#arrowhead)"></path>
+                            
+                            <!-- Output -->
+                            <rect x="600" y="50" width="150" height="60" fill="#ff7b72" opacity="0.8"></rect>
+                            <text x="675" y="85" text-anchor="middle" fill="white">256-bit Hash</text>
+                            
+                            <!-- Arrow Marker -->
+                            <defs>
+                                <marker id="arrowhead" markerWidth="10" markerHeight="7" refX="9" refY="3.5" orient="auto">
+                                    <polygon points="0 0, 10 3.5, 0 7" fill="white"></polygon>
+                                </marker>
+                            </defs>
+                        </svg>
+                    </div>
+                </section>
+            </section>
+
+            <!-- Real-world Applications -->
+            <section style="top: 350px; display: none;" hidden="" aria-hidden="true" class="stack future">
+                <section style="top: 350px; display: none;">
+                    <h2>Where is SHA-256 Used?</h2>
+                    <div class="container">
+                        <div class="box fragment" data-fragment-index="0">
+                            <h3>Password Storage</h3>
+                            <p>Websites store password fingerprints, not actual passwords</p>
+                        </div>
+                        <div class="box fragment" data-fragment-index="1">
+                            <h3>⛓️ Blockchain</h3>
+                            <p>Powers cryptocurrency mining and verification</p>
+                        </div>
+                    </div>
+                </section>
+
+                <section class="future" aria-hidden="true" style="top: 350px; display: none;">
+                    <h3>More Applications</h3>
+                    <div class="container">
+                        <div class="box fragment" data-fragment-index="0">
+                            <h3>Digital Signatures</h3>
+                            <p>Verify document authenticity</p>
+                        </div>
+                        <div class="box fragment" data-fragment-index="1">
+                            <h3>File Integrity</h3>
+                            <p>Ensure downloads aren't tampered with</p>
+                        </div>
+                    </div>
+                </section>
+            </section>
+
+            <!-- Strengths -->
+            <section style="top: 350px; display: none;" hidden="" aria-hidden="true" class="future">
+                <h2>Why SHA-256 is Strong 💪</h2>
+                <ul>
+                    <li class="fragment" data-fragment-index="0">Collision Resistance: Like finding two people with identical fingerprints</li>
+                    <li class="fragment" data-fragment-index="1">One-way Function: Can't reconstruct original data from hash</li>
+                    <li class="fragment" data-fragment-index="2">Avalanche Effect: Tiny changes cause completely different outputs</li>
+                </ul>
+            </section>
+
+            <!-- Interactive Demo -->
+            <section style="top: 350px; display: none;" hidden="" aria-hidden="true" class="future">
+                <h2>The Avalanche Effect 🌊</h2>
+                <div class="box">
+                    <p>Original message: "Hello, World!"</p>
+                    <code>a591a6d40bf420404a011733cfb7b190d62c65bf0bcda32b57b277d9ad9f146e</code>
+                </div>
+                <div class="box fragment" data-fragment-index="0">
+                    <p>Changed to: "Hello, World?"</p>
+                    <code>7d1a54127b222502f5b79b5fb0803061152a44f92b37e23c6527baf665d4da9a</code>
+                </div>
+                <p class="fragment" data-fragment-index="1">Notice how one character change creates a completely different hash!</p>
+            </section>
+
+            <!-- Limitations -->
+            <section style="top: 350px; display: none;" hidden="" aria-hidden="true" class="future">
+                <h2>Challenges &amp; Future 🔮</h2>
+                <ul>
+                    <li class="fragment" data-fragment-index="0">Requires more computing power than older algorithms</li>
+                    <li class="fragment" data-fragment-index="1">Theoretical vulnerability to quantum computers (but not yet practical)</li>
+                    <li class="fragment" data-fragment-index="2">Still considered very secure for current and near-future use</li>
+                </ul>
+            </section>
+
+            <!-- Summary -->
+            <section style="top: 350px; display: none;" hidden="" aria-hidden="true" class="future">
+                <h2>Key Takeaways 🎯</h2>
+                <ul>
+                    <li class="fragment" data-fragment-index="0">SHA-256 creates unique digital fingerprints</li>
+                    <li class="fragment" data-fragment-index="1">Powers modern security in passwords, blockchain, and more</li>
+                    <li class="fragment" data-fragment-index="2">Extremely secure against current technology</li>
+                    <li class="fragment" data-fragment-index="3">Essential part of our digital infrastructure</li>
+                </ul>
+            </section>
+
+        </div>
+    <div class="backgrounds"><div class="slide-background present" data-loaded="true" style="display: block;"><div class="slide-background-content"></div></div><div class="slide-background stack future" data-loaded="true" style="display: block;"><div class="slide-background-content"></div><div class="slide-background present" data-loaded="true" style="display: block;"><div class="slide-background-content"></div></div></div><div class="slide-background stack future" data-loaded="true" style="display: block;"><div class="slide-background-content"></div><div class="slide-background present" data-loaded="true" style="display: block;"><div class="slide-background-content"></div></div><div class="slide-background present" style="display: none;"><div class="slide-background-content"></div></div></div><div class="slide-background stack future" style="display: none;"><div class="slide-background-content"></div><div class="slide-background present" style="display: none;"><div class="slide-background-content"></div></div><div class="slide-background present" style="display: none;"><div class="slide-background-content"></div></div></div><div class="slide-background future" style="display: none;"><div class="slide-background-content"></div></div><div class="slide-background future" style="display: none;"><div class="slide-background-content"></div></div><div class="slide-background future" style="display: none;"><div class="slide-background-content"></div></div><div class="slide-background future" style="display: none;"><div class="slide-background-content"></div></div></div><div class="slide-number" style="display: block;"><a href="#/">
+					<span class="slide-number-a">1</span>
+					</a></div><aside class="controls" data-controls-layout="bottom-right" data-controls-back-arrows="faded" style="display: block;"><button class="navigate-left" aria-label="previous slide" disabled="disabled"><div class="controls-arrow"></div></button>
+			<button class="navigate-right enabled highlight" aria-label="next slide"><div class="controls-arrow"></div></button>
+			<button class="navigate-up" aria-label="above slide" disabled="disabled"><div class="controls-arrow"></div></button>
+			<button class="navigate-down" aria-label="below slide" disabled="disabled"><div class="controls-arrow"></div></button></aside><div class="progress" style="display: block;"><span style="transform: scaleX(0);"></span></div><div class="speaker-notes" data-prevent-swipe="" tabindex="0"></div><div class="pause-overlay"><button class="resume-button">Resume presentation</button></div><div class="aria-status" aria-live="polite" aria-atomic="true" style="position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px);">SHA-256: The Digital Fingerprint Maker 🔐 A Journey into Modern Cryptographic Security An interactive exploration of how SHA-256 keeps our digital world secure </div></div>
+
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/4.3.1/reveal.js"></script>
+    <script>
+        Reveal.initialize({
+            hash: true,
+            slideNumber: true,
+            transition: 'slide',
+            controls: true,
+            progress: true
+        });
+    </script>
+
+
+</body></html>
@@ -1,6 +1,6 @@
 {
  "name": "betterseqtaplus",
-  "version": "3.4.0",
+  "version": "3.4.2",
  "type": "module",
  "description": "Enhance SEQTA Learn's usability and aesthetics! A fork of BetterSEQTA to continue development, while incorporating a plethora of new and improved features!",
  "browserslist": "> 0.5%, last 2 versions, not dead",
@@ -31,6 +31,8 @@
  },
  "license": "MIT",
  "devDependencies": {
+    "@babel/plugin-transform-runtime": "^7.25.9",
+    "@babel/runtime": "^7.26.0",
    "@crxjs/vite-plugin": "2.0.0-beta.25",
    "@types/mime-types": "^2.1.4",
    "@vitejs/plugin-react-swc": "^3.7.0",
@@ -67,6 +69,7 @@
    "@uiw/codemirror-theme-github": "^4.23.3",
    "@vitejs/plugin-react": "^4.3.1",
    "autoprefixer": "^10.4.20",
+    "caniuse-lite": "^1.0.30001684",
    "classnames": "^2.5.1",
    "codemirror": "^6.0.1",
    "color": "^4.2.3",
@@ -79,7 +82,7 @@
    "localforage": "^1.10.0",
    "lodash": "^4.17.21",
    "million": "^3.1.11",
-    "motion": "^10.18.0",
+    "motion": "^11.12.0",
    "postcss": "^8.4.45",
    "publish-browser-extension": "^2.2.1",
    "react": "17",
@@ -167,6 +167,7 @@ const DefaultValues: SettingsState = {
  originalSelectedColor: '',
  DarkMode: true,
  animations: true,
+  assessmentsAverage: true,
  defaultPage: 'home',
  shortcuts: [
    {
@@ -15,7 +15,7 @@
 * along with EvenBetterSEQTA.  If not, see <https://www.gnu.org/licenses/>.
 */

-@import './injected/popup.scss';
+@use 'injected/popup.scss';

 html {
  background: #161616 !important;
@@ -1,9 +1,10 @@
+@use "sass:meta";
@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Rubik:300,400,500,600");

-@import "./injected/sidebar-animation.scss";
-@import "./injected/theme.scss";
-@import "./injected/transparency.scss";
+@include meta.load-css("injected/sidebar-animation.scss");
+@include meta.load-css("injected/theme.scss");
+@include meta.load-css("injected/transparency.scss");

 :root {
  background: var(--better-main) !important;
@@ -1110,9 +1111,9 @@ div > ol:has(.uiFileHandlerWrapper) {
  display: flex;
  flex-direction: column;
  background: var(--background-primary);
-  transition: 200ms;
  box-shadow: inset 0px 5px 20px 1px rgba(0, 0, 0, 0.3);
  padding-bottom: 25px;
+  transition: none;
  color: var(--text-primary);
 }
 .dummynotice {
@@ -1551,6 +1552,10 @@ iframe.userHTML {
 .Collapsible__Collapsible___3O8P3 > .Collapsible__header___-Afvq {
  background: none;
 }
+.Collapsible__Collapsible___3O8P3 > .Collapsible__content___2c6of.Collapsible__enterActive___3b2ow,
+.Collapsible__Collapsible___3O8P3 > .Collapsible__content___2c6of.Collapsible__exitActive___3rFL1 {
+  animation-timing-function: ease-out !important;
+}
 .AssessmentList__AssessmentList___1GdCl
  > .AssessmentList__searchFilter___3N70o
  + .AssessmentList__items___3LcmQ {
@@ -1928,6 +1933,7 @@ div.bar.flat {
  transition: background-color 0.5s ease-in-out;
  background-color: rgba(0, 0, 0, 0);
  transition-duration: 500ms !important;
+  z-index: 22 !important;
 }
 .uiSlidePane.shown > .pane {
  transform: translatey(0%) !important;
@@ -2188,44 +2194,55 @@ li.MessageList__unread___3imtO {
  overflow: hidden;
  width: 100%;
  padding: 0 !important;
-  margin: 0px auto 30px !important;
  background: var(--background-primary) !important;
  color: var(--text-primary);
  display: flex;
  flex-direction: row;
  -webkit-box-shadow: 0px 5px 16px 6px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 5px 16px 6px rgba(0, 0, 0, 0.3);
-}
-.articleimage {
-  width: 35%;
-  background-position: center;
-  background-size: cover;
-  min-height: 18em;
-  background-repeat: no-repeat;
-}
-.NewsArticle img {
-  width: 35%;
-}
-.ArticleText a {
+
+  &:hover {
+    .ArticleText a {
+      text-decoration: underline;
+    }
+  }
+  
+  .ArticleText a {
    padding: 10px 20px;
    margin: 0;
    font-weight: 800;
    font-size: 2em;
    background: none;
-}
-.NewsArticle:hover > .ArticleText a {
-  text-decoration: underline;
-}
-.ArticleText p {
+  }
+
+  .ArticleText p {
    padding: 10px 20px;
    margin: 0;
    font-size: 1.5em;
-}
-.ArticleText {
+  }
+
+  .ArticleText {
    display: flex;
    flex-direction: column;
    width: 65%;
    height: 100%;
+  }
+
+  .articleimage {
+    width: 35%;
+    background-position: center;
+    background-size: cover;
+    min-height: 18em;
+    background-repeat: no-repeat;
+  }
+}
+
+#news-container {
+  gap: 16px;
+
+  > h1 {
+    margin-bottom: 12px;
+  }
 }
 .editmenu {
  position: absolute;
@@ -2712,7 +2729,7 @@ li.MessageList__unread___3imtO {
  display: flex;
  flex-direction: column;
  color: var(--text-primary);
-  transition: 200ms;
+  transition: 200ms, background-color 0s;
  border-radius: 16px;
 }
 .dark .upcoming-items {
@@ -2989,7 +3006,6 @@ li.MessageList__unread___3imtO {
  width: 96%;
  display: flex;
  margin: 0 auto;
-  padding-bottom: 16px;
 }
 .whatsnewImg {
  margin: 8px auto;
@@ -3082,3 +3098,29 @@ li.MessageList__unread___3imtO {
  object-fit: cover;
  margin-bottom: 12px;
 }
+
+@keyframes shimmer {
+  0% {
+    background-position: -1000px 0;
+  }
+  100% {
+    background-position: 1000px 0;
+  }
+}
+
+.loading {
+  &.upcoming-items,
+  &.day-container {
+    background: linear-gradient(90deg, 
+      var(--background-primary) 0%, 
+      var(--background-secondary) 50%, 
+      var(--background-primary) 100%
+    );
+    background-size: 1000px 100%;
+    animation: shimmer 2s infinite linear;
+  }
+
+  &.upcoming-items {
+    height: 35em;
+  }
+}
@@ -2,7 +2,7 @@
  import { onMount } from 'svelte'
  import ColourPicker from './ColourPicker.tsx';
  import ReactAdapter from './utils/ReactAdapter.svelte';
-  import { animate, spring } from 'motion';
+  import { animate } from 'motion';
  import { delay } from '@/seqta/utils/delay.ts'

  const { hidePicker, standalone = false, savePresets = true, customOnChange = null, customState = null } = $props<{
@@ -23,13 +23,17 @@
    animate(
      content,
      { scale: [1, 0.4], opacity: [1, 0] },
-      { easing: spring({ stiffness: 400, damping: 30 }) }
+      {
+        type: 'spring',
+        stiffness: 400,
+        damping: 30
+      }
    );

    animate(
      background,
      { opacity: [1, 0] },
-      { easing: [0.4, 0, 0.2, 1] }
+      { ease: [0.4, 0, 0.2, 1] }
    );

    await delay(400);
@@ -43,13 +47,17 @@
    animate(
      background,
      { opacity: [0, 1] },
-      { duration: 0.3, easing: [0.4, 0, 0.2, 1] }
+      { duration: 0.3, ease: [0.4, 0, 0.2, 1] }
    );

    animate(
      content,
      { scale: [0.4, 1], opacity: [0, 1] },
-      { easing: spring({ stiffness: 400, damping: 30 }) }
+      {
+        type: 'spring',
+        stiffness: 400,
+        damping: 30
+      }
    );

    const handleEscapeKey = (e: KeyboardEvent) => {
@@ -1,6 +1,6 @@
 <script lang="ts">
-  import { onMount, onDestroy, createEventDispatcher } from 'svelte';
-  import { animate as motionAnimate, spring } from 'motion';
+  import { onMount, onDestroy } from 'svelte';
+  import { animate as motionAnimate } from 'motion';

  let { initial, animate, exit, transition, children, class: className } = $props<{ 
    initial?: any, 
@@ -12,11 +12,9 @@
  }>();

  let divElement: HTMLElement;
-  const dispatch = createEventDispatcher();

  const playAnimation = (keyframe: any) => {
    if (divElement && keyframe) {
-      let animationOptions = transition;
      let finalKeyframe = { ...keyframe };

      if (finalKeyframe.height === 'auto') {
@@ -36,16 +34,18 @@
        finalKeyframe.height = `${autoHeight}px`;
      }

-      if (!transition || transition.type === 'spring') {
-        const springConfig = transition?.config || { stiffness: 250, damping: 25 };
-        animationOptions = {
-          ...transition,
-          easing: spring(springConfig)
-        };
-      }
+      const defaultSpringConfig = { stiffness: 250, damping: 25 };

-      const animation = motionAnimate(divElement, finalKeyframe, animationOptions);
-      return animation.finished;
+      const animation = motionAnimate(
+        [divElement],
+        finalKeyframe,
+        {
+          type: 'spring',
+          stiffness: transition?.stiffness || defaultSpringConfig.stiffness,
+          damping: transition?.damping || defaultSpringConfig.damping
+        }
+      );
+      return animation;
    }
    return Promise.resolve();
  };
@@ -57,16 +57,12 @@
    } else if (animate) {
      await playAnimation(animate);
    }
-
-    dispatch('animationend');
  });
  
  $effect(() => {
    if (animate) {
      playAnimation(animate);
    }
-
-    dispatch('animationend');
  });

  onDestroy(async () => {
@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { animate, spring } from 'motion';
+  import { animate } from 'motion';
  import { standalone } from '../utils/standalone.svelte'

  let { state, onChange } = $props<{ state: boolean, onChange: (newState: boolean) => void }>();
@@ -18,7 +18,9 @@
        x: enabled ? (standalone.standalone ? 24 : 20) : 0,
      },
      {
-        easing: spring(springParams),
+        type: 'spring',
+        stiffness: springParams.stiffness,
+        damping: springParams.damping,
      }
    );
  };
@@ -1,7 +1,7 @@
 <script lang="ts">
  import type { Theme } from '@/interface/types/Theme'
  import { fade } from 'svelte/transition';
-  import { animate, spring } from 'motion';
+  import { animate } from 'motion';

  let { theme, currentThemes, setDisplayTheme, onInstall, onRemove, allThemes, displayTheme } = $props<{
    theme: Theme | null;
@@ -28,7 +28,11 @@
      animate(
        modalElement,
        { y: [500, 0], opacity: [0, 1] },
-        { easing: spring({ stiffness: 150, damping: 20 }) }
+        {
+          type: 'spring',
+          stiffness: 150,
+          damping: 20
+        }
      );
    }
  });
@@ -37,7 +41,11 @@
    animate(
      modalElement,
      { y: [10, 500], opacity: [1, 0] },
-      { easing: spring({ stiffness: 150, damping: 20 }) }
+      {
+        type: 'spring',
+        stiffness: 150,
+        damping: 20
+      }
    );
    setTimeout(() => {
      setDisplayTheme(relatedTheme ?? null);
@@ -97,6 +97,16 @@
        onChange: (isOn: boolean) => settingsState.notificationcollector = isOn
      }
    },
+    {
+      title: "Assessment Average",
+      description: "Shows your subject average for assessments.",
+      id: 8,
+      Component: Switch,
+      props: {
+        state: $settingsState.assessmentsAverage,
+        onChange: (isOn: boolean) => settingsState.assessmentsAverage = isOn
+      }
+    },
    {
      title: "Lesson Alerts",
      description: "Sends a native browser notification ~5 minutes prior to lessons.",
@@ -1,7 +1,7 @@
 {
  "manifest_version": 3,
  "name": "BetterSEQTA+",
-  "version": "3.4.0",
+  "version": "3.4.2",
  "description": "Enhance SEQTA Learn's usability and aesthetics! A fork of BetterSEQTA to continue development add add heaps more features!",
  "icons": {
    "32": "resources/icons/icon-32.png",
@@ -40,6 +40,10 @@
    {
      "resources": ["resources/icons/*"],
      "matches": ["*://*/*"]
+    },
+    {
+      "resources": ["seqta/utils/migration/migrate.html"],
+      "matches": ["*://*/*"]
    }
  ]
 }
@@ -6,17 +6,59 @@ import { settingsState } from "@/seqta/utils/listeners/SettingsState";
 import { updateAllColors } from "./colors/Manager";
 import { delay } from "@/seqta/utils/delay";

+let cachedUserInfo: any = null;
+
+async function getUserInfo() {
+  if (cachedUserInfo) return cachedUserInfo;
+  
+  try {
+    const response = await fetch(`${location.origin}/seqta/student/login`, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json; charset=utf-8',
+      },
+      body: JSON.stringify({
+        mode: 'normal',
+        query: null,
+        redirect_url: location.origin,
+      }),
+    });
+
+    const responseData = await response.json();
+    cachedUserInfo = responseData.payload;
+    return cachedUserInfo;
+  } catch (error) {
+    console.error('Error fetching user info:', error);
+    throw error;
+  }
+}
+
 export async function AddBetterSEQTAElements() {
  if (settingsState.onoff) {    
    initializeSettings();
    if (settingsState.DarkMode) {
      document.documentElement.classList.add('dark');
    }
-    createHomeButton();
-    await appendBackgroundToUI();
-    await handleUserInfo();
-    handleStudentData();
-    createNewsButton();
+    
+    const fragment = document.createDocumentFragment();
+    const menu = document.getElementById('menu')!;
+    const menuList = menu.firstChild as HTMLElement;
+    
+    createHomeButton(fragment, menuList);
+    createNewsButton(fragment, menu);
+    
+    menuList.insertBefore(fragment, menuList.firstChild);
+    
+    try {
+      await Promise.all([
+        appendBackgroundToUI(),
+        handleUserInfo(),
+        handleStudentData()
+      ]);
+    } catch (error) {
+      console.error('Error initializing UI elements:', error);
+    }
+    
    setupEventListeners();
    await addDarkLightToggle();
    customizeMenuToggle();
@@ -24,7 +66,6 @@ export async function AddBetterSEQTAElements() {

  addExtensionSettings();
  await createSettingsButton();
-
  setupSettingsButton();
 }

@@ -33,18 +74,15 @@ function initializeSettings() {
  updateBgDurations();
 }

-function createHomeButton() {
+function createHomeButton(fragment: DocumentFragment, menuList: HTMLElement) {
  const container = document.getElementById('content')!;
  const div = document.createElement('div');
  div.classList.add('titlebar');
  container.append(div);
  
  const NewButton = stringToHTML('<li class="item" data-key="home" id="homebutton" data-path="/home" data-betterseqta="true"><label><svg style="width:24px;height:24px" viewBox="0 0 24 24"><path fill="currentColor" d="M10,20V14H14V20H19V12H22L12,3L2,12H5V20H10Z" /></svg><span>Home</span></label></li>');
-  const menu = document.getElementById('menu')!;
-  const List = menu.firstChild! as HTMLElement;
-  
  if (NewButton.firstChild) {
-    List.insertBefore(NewButton.firstChild, List.firstChild);
+    fragment.appendChild(NewButton.firstChild);
  }
 }

@@ -121,30 +159,8 @@ async function handleStudentData() {
  }
 }

-async function getUserInfo() {
-  try {
-    const response = await fetch(`${location.origin}/seqta/student/login`, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json; charset=utf-8',
-      },
-      body: JSON.stringify({
-        mode: 'normal',
-        query: null,
-        redirect_url: location.origin,
-      }),
-    });
-
-    const responseData = await response.json();
-    return responseData.payload;
-  } catch (error) {
-    console.error('Error fetching user info:', error);
-    throw error; // Rethrow the error after logging it
-  }
-}
-
 async function updateStudentInfo(students: any) {
-  const info = await getUserInfo(); // You would need to implement this to fetch or pass the user info
+  const info = await getUserInfo();
  var index = students.findIndex(function (person: any) {
    return (
      person.firstname == info.userDesc.split(' ')[0] &&
@@ -167,45 +183,50 @@ async function updateStudentInfo(students: any) {
      }
    }
  } else {
+    try {
      houseelement.innerText = students[index].year;
+    } catch(err) {
+      houseelement.innerText = 'N/A';
+    }
  }
 }

-function createNewsButton() {
+function createNewsButton(fragment: DocumentFragment, menu: HTMLElement) {
  const NewsButtonStr = '<li class="item" data-key="news" id="newsbutton" data-path="/news" data-betterseqta="true"><label><svg style="width:24px;height:24px" viewBox="0 0 24 24"><path fill="currentColor" d="M20 3H4C2.89 3 2 3.89 2 5V19C2 20.11 2.89 21 4 21H20C21.11 21 22 20.11 22 19V5C22 3.89 21.11 3 20 3M5 7H10V13H5V7M19 17H5V15H19V17M19 13H12V11H19V13M19 9H12V7H19V9Z" /></svg><span>News</span></label></li>';
  const NewsButton = stringToHTML(NewsButtonStr);
-  const menu = document.getElementById('menu')!;
-  const List = menu.firstChild! as HTMLElement;
  
-  List!.appendChild(NewsButton.firstChild!);
+  if (NewsButton.firstChild) {
+    fragment.appendChild(NewsButton.firstChild);
+  }
  
-  let a = document.createElement('div');
-  a.classList.add('icon-cover');
-  a.id = 'icon-cover';
-  menu!.appendChild(a);
+  let iconCover = document.createElement('div');
+  iconCover.classList.add('icon-cover');
+  iconCover.id = 'icon-cover';
+  menu.appendChild(iconCover);
 }

 function setupEventListeners() {
  const menuCover = document.querySelector('#icon-cover');
-  menuCover!.addEventListener('click', function () {
-    location.href = '../#?page=/home';
-    loadHomePage();
-    (document!.getElementById('menu')!.firstChild! as HTMLElement).classList.remove('noscroll');
-  });
-
  const homebutton = document.getElementById('homebutton');
-  homebutton!.addEventListener('click', function () {
-    if (!homebutton?.classList.contains('draggable') && !homebutton?.classList.contains('active')) {
+  const newsbutton = document.getElementById('newsbutton');
+  
+  homebutton?.addEventListener('click', function() {
+    if (!homebutton.classList.contains('draggable') && !homebutton.classList.contains('active')) {
      loadHomePage();
    }
  });

-  const newsbutton = document.getElementById('newsbutton');
-  newsbutton!.addEventListener('click', function () {
-    if (!newsbutton?.classList.contains('draggable') && !newsbutton?.classList.contains('active')) {
+  newsbutton?.addEventListener('click', function() {
+    if (!newsbutton.classList.contains('draggable') && !newsbutton.classList.contains('active')) {
      SendNewsPage();
    }
  });
+
+  menuCover?.addEventListener('click', function() {
+    location.href = '../#?page=/home';
+    loadHomePage();
+    (document.getElementById('menu')!.firstChild! as HTMLElement).classList.remove('noscroll');
+  });
 }

 async function createSettingsButton() {
@@ -1,7 +1,14 @@
 import localforage from 'localforage';
-import type { Theme } from '@/old-interface/pages/Store';
 import base64ToBlob from '@/seqta/utils/base64ToBlob';

+type Theme = {
+  name: string;
+  description: string;
+  coverImage: string;
+  marqueeImage: string;
+  id: string;
+}
+
 type ThemeContent = {
  id: string;
  name: string;
@@ -14,6 +21,11 @@ type ThemeContent = {
  images: { id: string, variableName: string, data: string }[]; // data: base64
 };

+function stripBase64Prefix(base64String: string): string {
+  const prefixRegex = /^data:image\/\w+;base64,/;
+  return base64String.replace(prefixRegex, '');
+}
+
 export const StoreDownloadTheme = async (theme: { themeContent: Theme }) => {
  if (!theme.themeContent.id) return;

@@ -24,7 +36,8 @@ export const StoreDownloadTheme = async (theme: { themeContent: Theme }) => {
 };

 export const InstallTheme = async (themeData: ThemeContent) => {
-  const coverImageBlob = base64ToBlob(themeData.coverImage);
+  const strippedCoverImage = stripBase64Prefix(themeData.coverImage);
+  const coverImageBlob = base64ToBlob(strippedCoverImage);

  const images = themeData.images.map((image) => ({
    ...image,
@@ -46,10 +46,27 @@ class EventManager {
    }
    const unregister = () => this.unregisterById(event, id);
    this.listeners.get(event)!.push({ id, options, callback, unregister });
+    
+    this.scanExistingElements(options, callback);
+    
    this.startObserving(options.parentElement);
    return { unregister };
  }

+  private async scanExistingElements(options: EventListenerOptions, callback: (element: Element) => void): Promise<void> {
+    const root = options.parentElement || document.documentElement;
+    const elements = Array.from(root.getElementsByTagName('*'));
+    elements.unshift(root);
+    
+    for (let i = 0; i < elements.length; i += this.chunkSize) {
+      const chunk = elements.slice(i, i + this.chunkSize);
+      const filteredChunk = chunk.filter(element => this.matchesOptions(element, options));
+      for (const element of filteredChunk) {
+        callback(element);
+      }
+    }
+  }
+
  public unregister(event: string): void {
    if (this.listeners.has(event)) {
      this.listeners.delete(event);
@@ -44,7 +44,23 @@ const getSelectedBackground = (): string | null => {
 const startMigration = async () => {
  try {
    console.info('Starting background extraction...');
-    const backgrounds = await getAllBackgrounds();
+    let backgrounds: Data[];
+    try {
+      backgrounds = await getAllBackgrounds();
+      if (!backgrounds || backgrounds.length === 0) {
+        console.info('No backgrounds to migrate');
+        window.parent.postMessage({ type: 'MIGRATION_COMPLETE' }, '*');
+        return;
+      }
+    } catch (error: any) {
+      if (error.name === 'NotFoundError' && error.message.includes('object stores was not found')) {
+        console.info('No backgrounds to migrate: object store not found');
+        window.parent.postMessage({ type: 'MIGRATION_COMPLETE' }, '*');
+        return;
+      }
+      console.error('Error fetching backgrounds:', error);
+      throw new Error('Failed to fetch backgrounds');
+    }
    const selectedBackground = getSelectedBackground();
    console.info(`Found ${backgrounds.length} backgrounds`);

@@ -38,6 +38,7 @@ export interface SettingsState {
  defaultPage: string;
  devMode?: boolean;
  originalDarkMode?: boolean;
+  assessmentsAverage?: boolean;
 }

 interface ToggleItem {
@@ -1,17 +1,10 @@
-const {
-  default: flattenColorPalette,
-} = require("tailwindcss/lib/util/flattenColorPalette");
+import flattenColorPalette from "tailwindcss/lib/util/flattenColorPalette";

 /** @type {import('tailwindcss').Config} */
 export default {
  content: [
    "./src/**/*.{js,ts,jsx,tsx,html,svelte}",
  ],
-  //safelist: [
-    //{
-    //  pattern: / */,
-    //}
-  //],
  darkMode: "class",
  theme: {
    fontSize: {
@@ -0,0 +1,402 @@
+https://sethburkart123.github.io/sf-pro-https://sethburkart123.github.io/sf-pro-fonts/fonts/
+
+/* -------------------------------------------------------------------------
+ * SF Pro Display
+ * ------------------------------------------------------------------------- */
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: normal;
+    font-weight: 100;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-ultralight.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-ultralight.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-ultralight.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: normal;
+    font-weight: 200;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-thin.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-thin.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-thin.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: normal;
+    font-weight: 300;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-light.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-light.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-light.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: normal;
+    font-weight: 400;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-regular.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-regular.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-regular.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: normal;
+    font-weight: 500;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-medium.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-medium.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-medium.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: normal;
+    font-weight: 600;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-semibold.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-semibold.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-semibold.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: normal;
+    font-weight: 700;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-bold.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-bold.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-bold.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: normal;
+    font-weight: 800;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-heavy.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-heavy.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-heavy.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: normal;
+    font-weight: 900;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-black.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-black.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-black.ttf') format('truetype');
+}
+
+
+
+/* -------------------------------------------------------------------------
+ * SF Pro Display Italic
+ * ------------------------------------------------------------------------- */
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: italic;
+    font-weight: 100;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-ultralightitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-ultralightitalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-ultralightitalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: italic;
+    font-weight: 200;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-thinitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-thinitalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-thinitalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: italic;
+    font-weight: 300;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-lightitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-lightitalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-lightitalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: italic;
+    font-weight: 400;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-regularitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-regularitalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-regularitalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: italic;
+    font-weight: 500;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-mediumitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-mediumitalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-mediumitalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: italic;
+    font-weight: 600;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-semibolditalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-semibolditalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-semibolditalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: italic;
+    font-weight: 700;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-bolditalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-bolditalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-bolditalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: italic;
+    font-weight: 800;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-heavyitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-heavyitalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-heavyitalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Display';
+    font-style: italic;
+    font-weight: 900;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-blackitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-blackitalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-display-blackitalic.ttf') format('truetype');
+}
+
+
+
+/* -------------------------------------------------------------------------
+ * SF Pro Text
+ * ------------------------------------------------------------------------- */
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: regular;
+    font-weight: 300;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-light.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-light.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-light.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: regular;
+    font-weight: 400;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-regular.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-regular.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-regular.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: regular;
+    font-weight: 500;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-medium.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-medium.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-medium.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: regular;
+    font-weight: 600;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-semibold.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-semibold.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-semibold.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: regular;
+    font-weight: 700;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-bold.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-bold.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-bold.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: regular;
+    font-weight: 800;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-heavy.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-heavy.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-heavy.ttf') format('truetype');
+}
+
+
+
+/* -------------------------------------------------------------------------
+ * SF Pro Text Italic
+ * ------------------------------------------------------------------------- */
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: italic;
+    font-weight: 300;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-lightitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-lightitalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-lightitalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: italic;
+    font-weight: 400;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-regularitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-regularitalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-regularitalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: italic;
+    font-weight: 500;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-mediumitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-mediumitalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-mediumitalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: italic;
+    font-weight: 600;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-semibolditalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-semibolditalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-semibolditalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: italic;
+    font-weight: 700;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-bolditalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-bolditalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-bolditalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'SF Pro Text';
+    font-style: italic;
+    font-weight: 800;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-heavyitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-heavyitalic.woff') format('woff'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sf-pro-text-heavyitalic.ttf') format('truetype');
+}
+
+
+
+
+/* -------------------------------------------------------------------------
+ * SF Mono
+ * ------------------------------------------------------------------------- */
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: regular;
+    font-weight: 300;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-light.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-light.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: regular;
+    font-weight: 400;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-regular.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-regular.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: regular;
+    font-weight: 500;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-medium.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-medium.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: regular;
+    font-weight: 600;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-semibold.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-semibold.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: regular;
+    font-weight: 700;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-bold.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-bold.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: regular;
+    font-weight: 800;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-heavy.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-heavy.woff') format('woff');
+}
+
+
+
+/* -------------------------------------------------------------------------
+ * SF Pro Text Italic
+ * ------------------------------------------------------------------------- */
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: italic;
+    font-weight: 300;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-lightitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-lightitalic.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: italic;
+    font-weight: 400;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-regularitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-regularitalic.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: italic;
+    font-weight: 500;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-mediumitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-mediumitalic.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: italic;
+    font-weight: 600;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-semibolditalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-semibolditalic.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: italic;
+    font-weight: 700;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-bolditalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-bolditalic.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'SF Mono';
+    font-style: italic;
+    font-weight: 800;
+    src: url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-heavyitalic.woff2') format('woff2'),
+         url('https://sethburkart123.github.io/sf-pro-fonts/fonts/sfmono-heavyitalic.woff') format('woff');
+}
@@ -54,6 +54,16 @@ export default defineConfig({
      port: 5173
    }
  },
+  css: {
+    preprocessorOptions: {
+      scss: {
+        api: 'modern'
+      }
+    }
+  },
+  optimizeDeps: {
+    include: ['@babel/runtime/helpers/extends', '@babel/runtime/helpers/interopRequireDefault'],
+  },
  build: {
    outDir: resolve(__dirname, 'dist', mode),
    emptyOutDir: false,
Author	SHA1	Message	Date
SethBurkart123	13fc077686	bump(version): 3.4.2 + changelog	2024-12-05 14:38:02 +11:00
SethBurkart123	7cf765121c	fix(style): z-index of panels increased	2024-12-05 14:36:04 +11:00
SethBurkart123	4e393f14bb	fix: enable assessments average by default	2024-12-05 14:35:23 +11:00
Seth Burkart	98347e038d	Merge pull request #192 from ar-cyber/patch-16 Add mention for grades calc in readme	2024-12-03 17:23:35 +11:00
Andrew R	f2bdb22ea8	fix(doc): make the readme mention the grade calculator	2024-12-03 13:52:16 +10:30
SethBurkart123	4afab2c52a	perf: refactor AddBetterSEQTAElements for improved performance	2024-12-03 07:15:50 +11:00
SethBurkart123	4c6b43d7c7	fix(initial): make assessments average enabled by default	2024-12-03 06:59:06 +11:00
SethBurkart123	9e26d2c192	fix(changelog): versions and changelog fixed	2024-12-02 17:34:39 +11:00
SethBurkart123	7445e8be78	feat(changelog): update changelog + bump version	2024-12-02 12:30:25 +11:00
SethBurkart123	d1a876ff22	fix(home): sidebar button sometimes not selecting	2024-12-02 12:25:14 +11:00
SethBurkart123	e2176ea2fa	fix(assessments): placing subject average trice	2024-12-02 12:23:47 +11:00
SethBurkart123	a999e4384b	feat(notices): add animations to notices	2024-12-02 12:17:39 +11:00
SethBurkart123	4bf5420140	fix(eventManager): not triggering for already created elements'	2024-12-02 12:17:28 +11:00
SethBurkart123	8fb29f7f21	feat(settings): add subject average setting	2024-12-02 12:01:03 +11:00
SethBurkart123	44e3ed34d0	feat(assessments): add subject averages	2024-12-02 11:58:42 +11:00
SethBurkart123	32228ee4db	style(changelog): reduce video padding for better screen realestate	2024-12-02 11:11:49 +11:00
SethBurkart123	1692bd3e92	fix(home): notices date picker not working	2024-12-02 11:11:03 +11:00
SethBurkart123	71cf9dbca8	feat(messages): improvements to direct message animations	2024-12-02 11:01:54 +11:00
SethBurkart123	372b591b16	feat(home): async home page loading	2024-12-02 10:58:24 +11:00
SethBurkart123	7578ecee74	chore(logging): improve logging	2024-12-02 09:27:33 +11:00
SethBurkart123	a2b4f81b86	feat(home): add skeleton loaders to homepage	2024-12-02 09:26:49 +11:00
SethBurkart123	fcd95f6823	perf(homePage): add fragmentation and refactor code	2024-11-30 21:55:10 +11:00
SethBurkart123	f2ea7c8104	fix: builds failing	2024-11-29 17:53:47 +11:00
SethBurkart123	379a3ebda0	chore: code cleanup	2024-11-29 17:34:16 +11:00
SethBurkart123	d1850e8ddb	chore: fix CI/CD pipeline	2024-11-29 17:24:02 +11:00
SethBurkart123	88a87692cd	fix(icon): discord icon scaled incorrectly	2024-11-29 17:18:42 +11:00
Seth Burkart	4e6e4870b0	Merge pull request #189 from MEGA-Dawg68/main Added Discord icon	2024-11-29 17:15:53 +11:00
SethBurkart123	18f215fa5f	chore: code cleanup	2024-11-29 17:14:32 +11:00
SethBurkart123	2ea8ada439	fix(popups): backdrop filter failing to appear during animation	2024-11-29 17:13:59 +11:00
SethBurkart123	34b2501617	chore(changelog): update changelog	2024-11-29 14:57:41 +11:00
SethBurkart123	88d4d3aa11	feat(news): add animations to news page	2024-11-29 14:57:17 +11:00
SethBurkart123	5ed3a05f6a	perf(news): improved news page performance	2024-11-29 14:52:26 +11:00
SethBurkart123	430f158957	style(news): improved news styles	2024-11-29 14:38:41 +11:00
SethBurkart123	547caabc45	bump(version): 3.4.1 + changelog	2024-11-29 14:25:58 +11:00
SethBurkart123	f6e549c5da	feat(animations): refine home page animations	2024-11-29 11:40:37 +11:00
SethBurkart123	dc1ae9c0a1	feat(animations): migrate to motion-one@11	2024-11-29 11:32:43 +11:00
SethBurkart123	34306e77cf	fix(studentInfo): some cases year may be undefined	2024-11-29 10:29:35 +11:00
SethBurkart123	00c9f03827	bump: version to 3.4.0.4	2024-11-27 09:23:40 +11:00
SethBurkart123	6c93477998	fix: background migration not working properly	2024-11-27 09:22:34 +11:00
MEGA_Dawg68	9784b6162f	Added Discord icon	2024-11-25 19:57:45 +08:00
SethBurkart123	96cf8e3eac	feat: clean up CI/CD piplelines	2024-11-15 17:24:26 +11:00
SethBurkart123	0e23ea0cc3	fix: build running twice in CI/CD	2024-11-15 17:23:34 +11:00
SethBurkart123	7dfe347562	chore: move install to build section	2024-11-15 17:14:15 +11:00
SethBurkart123	21a8472c94	fix: themes failing to install from coverImage decoding error	2024-11-15 16:35:28 +11:00