Skip to content

Separate index.html into HTML, CSS, and JavaScript files#1

Draft
Copilot wants to merge 2 commits intomainfrom
copilot/separate-html-css-js-files
Draft

Separate index.html into HTML, CSS, and JavaScript files#1
Copilot wants to merge 2 commits intomainfrom
copilot/separate-html-css-js-files

Conversation

Copy link

Copilot AI commented Mar 13, 2026

The entire site lived in a single index.html with inline <style> and <script> blocks. This extracts them into dedicated files without changing any behavior.

New files

  • style.css — all custom CSS (view-transition rules, .chart-container, #eceCanvas GPU layering, .hide-scrollbar, .hero-bg gradient animation)
  • script.js — all JavaScript in one file, structured for correct execution order:
    1. tailwind.config at top-level (sync, in <head>) so Tailwind picks up custom tokens (primary-*, darkbase, darkcard) before first render
    2. Global functions (toggleDarkMode, applyTheme, openLightbox, closeLightbox) at module scope — required for HTML onclick access
    3. All DOM-dependent logic (canvas engine, mobile menu, Chart.js, lightbox wiring) inside DOMContentLoaded

index.html changes

<!-- Before: two inline <script> blocks + one <style> block -->

<!-- After -->
<script src="https://cdn.tailwindcss.com"></script>
<script src="script.js"></script>          <!-- tailwind.config runs here, before body renders -->
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<link rel="stylesheet" href="style.css">

Also fixes a pre-existing typo: "FINAL SELETED MEMBERS""FINAL SELECTED MEMBERS".


💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

Co-authored-by: CodingMango <170359605+CodingMango@users.noreply.github.com>
Copilot AI changed the title [WIP] Refactor project structure into separate HTML, CSS, and JavaScript files Separate index.html into HTML, CSS, and JavaScript files Mar 13, 2026
Copilot AI requested a review from CodingMango March 13, 2026 15:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants