diff --git a/ai-essentials/activity-hallucinations-rag.html b/ai-essentials/activity-hallucinations-rag.html index b6a15ae..12256a1 100644 --- a/ai-essentials/activity-hallucinations-rag.html +++ b/ai-essentials/activity-hallucinations-rag.html @@ -28,9 +28,6 @@

Core Concepts

20 min Core Concepts - ChatGPT - Perplexity - NotebookLM
diff --git a/ai-essentials/activity-prompts-temperature.html b/ai-essentials/activity-prompts-temperature.html index bfa2c5b..770cb66 100644 --- a/ai-essentials/activity-prompts-temperature.html +++ b/ai-essentials/activity-prompts-temperature.html @@ -28,8 +28,6 @@

Core Concepts

15 min Core Concepts - ChatGPT - Copilot
diff --git a/ai-essentials/activity-tokens-context.html b/ai-essentials/activity-tokens-context.html index e065258..9cb4bee 100644 --- a/ai-essentials/activity-tokens-context.html +++ b/ai-essentials/activity-tokens-context.html @@ -28,8 +28,6 @@

Core Concepts

18 min Core Concepts - Claude - ChatGPT
diff --git a/ai-essentials/shared.js b/ai-essentials/shared.js index ec78a1d..78435e9 100644 --- a/ai-essentials/shared.js +++ b/ai-essentials/shared.js @@ -5,36 +5,32 @@ const pages = [ id: 'overview', title: 'Overview', href: 'index.html', - trackProgress: false, }, { id: 'terms', title: 'AI Terminology', href: 'terminology.html', - trackProgress: false, }, +]; + +const coreConcepts = [ { id: 'prompts-temperature', title: 'Prompts & Temperature', href: 'activity-prompts-temperature.html', - trackProgress: true, }, { id: 'hallucinations-rag', title: 'Hallucinations & RAG', href: 'activity-hallucinations-rag.html', - trackProgress: true, }, { id: 'tokens-context', title: 'Tokens & Context Windows', href: 'activity-tokens-context.html', - trackProgress: true, }, ]; -const activityLookup = pages.filter((page) => page.trackProgress); - const getProgress = () => { const saved = localStorage.getItem(STORAGE_KEY); return saved ? JSON.parse(saved) : {}; @@ -125,9 +121,6 @@ const initNavigation = () => { const link = document.createElement('a'); link.href = page.href; link.textContent = page.title; - if (page.trackProgress) { - link.dataset.activityLink = page.id; - } if (currentPage === page.id) { link.classList.add('active'); @@ -136,6 +129,37 @@ const initNavigation = () => { navContainer.appendChild(link); }); + const dropdownGroup = document.createElement('div'); + dropdownGroup.className = 'nav-group'; + + const dropdownToggle = document.createElement('a'); + dropdownToggle.href = '#'; + dropdownToggle.className = 'nav-dropdown-toggle'; + dropdownToggle.textContent = 'Core Concepts'; + dropdownToggle.setAttribute('aria-haspopup', 'true'); + dropdownToggle.setAttribute('aria-expanded', 'false'); + dropdownToggle.addEventListener('click', (event) => { + event.preventDefault(); + }); + + const dropdownMenu = document.createElement('div'); + dropdownMenu.className = 'nav-dropdown'; + + coreConcepts.forEach((page) => { + const link = document.createElement('a'); + link.href = page.href; + link.textContent = page.title; + link.dataset.activityLink = page.id; + if (currentPage === page.id) { + link.classList.add('active'); + } + dropdownMenu.appendChild(link); + }); + + dropdownGroup.appendChild(dropdownToggle); + dropdownGroup.appendChild(dropdownMenu); + navContainer.appendChild(dropdownGroup); + applyCompletionIndicators(); }; diff --git a/ai-essentials/styles.css b/ai-essentials/styles.css index 58148e5..267cd1d 100644 --- a/ai-essentials/styles.css +++ b/ai-essentials/styles.css @@ -67,6 +67,46 @@ body.terms-page { gap: 6px; } +.nav-group { + position: relative; + display: inline-flex; + align-items: center; + gap: 6px; +} + +.nav-dropdown-toggle::after { + content: '▾'; + font-size: 0.9em; +} + +.nav-dropdown { + position: absolute; + top: calc(100% + 8px); + left: 0; + background: white; + border: 1px solid #e5e5e5; + border-radius: 12px; + min-width: 220px; + padding: 8px; + box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12); + display: none; + flex-direction: column; + gap: 4px; + z-index: 10; +} + +.nav-dropdown a { + border-radius: 10px; + border: 1px solid transparent; + padding: 8px 10px; + justify-content: space-between; +} + +.nav-group:hover .nav-dropdown, +.nav-group:focus-within .nav-dropdown { + display: flex; +} + .site-nav a:hover, .site-nav a.active { border-color: var(--illini-orange); @@ -179,8 +219,7 @@ body.terms-page { } .duration-badge, -.category-badge, -.tool-mini-badge { +.category-badge { padding: 4px 12px; border-radius: 12px; font-size: 0.85em; @@ -197,10 +236,6 @@ body.terms-page { color: white; } -.tool-mini-badge { - background: #e8f5e9; - color: #2e7d32; -} .prompt-box { background: #fff; diff --git a/index.html b/index.html index b79ce42..ab79355 100644 --- a/index.html +++ b/index.html @@ -7,3 +7,5 @@
GenAI Model Taxonomy Playground (UIUC Edition) +
+AI Essentials Workshop