Skip to content

Commit a012b11

Browse files
ParleSecParleSec
committed
UPLOAD glossary
1 parent 883a718 commit a012b11

5 files changed

Lines changed: 919 additions & 5 deletions

File tree

‎static/css/style.css‎

Lines changed: 37 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -98,13 +98,15 @@
9898
Navigation
9999
===================== */
100100
#mainNav {
101-
transition: background-color 0.3s ease;
102-
background-color: rgba(0, 0, 0, 0.8);
101+
background-color: transparent;
103102
box-shadow: var(--shadow-md);
103+
transition: background-color 0.3s ease;
104+
padding-top: 0 !important;
105+
padding-bottom: 0 !important;
104106
}
105107

106108
#mainNav.scrolled {
107-
background-color: var(--dark);
109+
background-color: var(--dark) !important;
108110
}
109111

110112
#mainNav .navbar-brand {
@@ -115,9 +117,13 @@
115117
#mainNav .navbar-brand i {
116118
font-size: 1.5rem;
117119
}
120+
121+
#mainNav .nav-item {
122+
margin: 0 0.25rem;
123+
}
118124

119125
#mainNav .nav-link {
120-
padding: 0.5rem 1rem;
126+
padding: 0.5rem 0.25rem 0.5rem 0.25rem;
121127
position: relative;
122128
}
123129

@@ -276,7 +282,7 @@
276282
Hero Section
277283
===================== */
278284
.hero-container {
279-
height: 100vh;
285+
height: 150vh;
280286
min-height: 500px;
281287
background: linear-gradient(135deg, #0f172a 0%, #1e1b4b 100%);
282288
position: relative;
@@ -529,6 +535,7 @@
529535
@media (max-width: 991.98px) {
530536
#mainNav .navbar-nav {
531537
padding: 1rem 0;
538+
margin-bottom: 0 !important;
532539
}
533540

534541
#mainNav .nav-link::after {
@@ -618,4 +625,29 @@
618625
display: flex;
619626
align-items: center;
620627
justify-content: center;
628+
}
629+
630+
.loading-glossary::before {
631+
content: "Loading glossary...";
632+
position: fixed;
633+
top: 0;
634+
left: 0;
635+
width: 100%;
636+
height: 100%;
637+
background: rgba(255,255,255,0.8);
638+
display: flex;
639+
align-items: center;
640+
justify-content: center;
641+
z-index: 9999;
642+
font-size: 1.5rem;
643+
}
644+
645+
.highlight-term {
646+
animation: highlight-pulse 2s ease-in-out;
647+
}
648+
649+
@keyframes highlight-pulse {
650+
0% { background-color: transparent; }
651+
30% { background-color: rgba(124, 58, 237, 0.2); }
652+
100% { background-color: transparent; }
621653
}

‎static/data/glossary_terms.json‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
[
2+
{
3+
"term": "Qubit",
4+
"definition": "The fundamental unit of quantum information. Unlike classical bits, qubits can exist in a superposition of states, allowing them to be both 0 and 1 simultaneously."
5+
},
6+
{
7+
"term": "Superposition",
8+
"definition": "A quantum mechanical property that allows particles to exist in multiple states simultaneously until measured."
9+
},
10+
{
11+
"term": "Entanglement",
12+
"definition": "A quantum phenomenon where pairs or groups of particles become correlated such that the quantum state of each particle cannot be described independently."
13+
}
14+
]

‎static/js/glossary.js‎

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
document.addEventListener('DOMContentLoaded', function() {
2+
// Smooth scrolling for glossary navigation
3+
document.querySelectorAll('.glossary-nav a').forEach(anchor => {
4+
anchor.addEventListener('click', function(e) {
5+
e.preventDefault();
6+
const targetId = this.getAttribute('href');
7+
const targetElement = document.querySelector(targetId);
8+
9+
if (targetElement) {
10+
const headerOffset = 120; // Adjust for fixed header and nav
11+
const elementPosition = targetElement.getBoundingClientRect().top;
12+
const offsetPosition = elementPosition + window.pageYOffset - headerOffset;
13+
14+
window.scrollTo({
15+
top: offsetPosition,
16+
behavior: 'smooth'
17+
});
18+
}
19+
});
20+
});
21+
22+
// Check if URL has a hash
23+
if (window.location.hash) {
24+
const targetId = window.location.hash;
25+
const targetElement = document.querySelector(targetId);
26+
27+
if (targetElement) {
28+
setTimeout(function() {
29+
const headerOffset = 120;
30+
const elementPosition = targetElement.getBoundingClientRect().top;
31+
const offsetPosition = elementPosition + window.pageYOffset - headerOffset;
32+
33+
window.scrollTo({
34+
top: offsetPosition,
35+
behavior: 'smooth'
36+
});
37+
38+
// Highlight the term briefly
39+
targetElement.classList.add('highlight-term');
40+
setTimeout(function() {
41+
targetElement.classList.remove('highlight-term');
42+
}, 2000);
43+
}, 300); // Small delay to ensure page is loaded
44+
}
45+
}
46+
47+
const searchInput = document.getElementById('glossary-search');
48+
if (!searchInput) return;
49+
50+
searchInput.addEventListener('input', function() {
51+
const searchTerm = this.value.toLowerCase().trim();
52+
const allTerms = document.querySelectorAll('dt[id^="term-"]');
53+
54+
allTerms.forEach(term => {
55+
const termText = term.textContent.toLowerCase();
56+
const definition = term.nextElementSibling;
57+
const definitionText = definition.textContent.toLowerCase();
58+
59+
if (termText.includes(searchTerm) || definitionText.includes(searchTerm)) {
60+
term.style.display = '';
61+
definition.style.display = '';
62+
// Show parent section
63+
const section = term.closest('section');
64+
if (section) {
65+
section.style.display = '';
66+
}
67+
} else {
68+
term.style.display = 'none';
69+
definition.style.display = 'none';
70+
71+
// Hide section if all terms are hidden
72+
const section = term.closest('section');
73+
if (section) {
74+
const visibleTermsInSection = section.querySelectorAll('dt[style=""]').length;
75+
if (visibleTermsInSection === 0) {
76+
section.style.display = 'none';
77+
}
78+
}
79+
}
80+
});
81+
82+
// Show "no results" message if needed
83+
const visibleTerms = document.querySelectorAll('dt[id^="term-"]:not([style="display: none;"])');
84+
const noResultsMsg = document.getElementById('no-results-message');
85+
86+
if (visibleTerms.length === 0 && searchTerm !== '') {
87+
if (!noResultsMsg) {
88+
const msg = document.createElement('div');
89+
msg.id = 'no-results-message';
90+
msg.className = 'alert alert-info mt-4';
91+
msg.innerHTML = `No terms found matching "<strong>${searchTerm}</strong>". Try a different search term.`;
92+
document.querySelector('.col-lg-8').appendChild(msg);
93+
} else {
94+
noResultsMsg.innerHTML = `No terms found matching "<strong>${searchTerm}</strong>". Try a different search term.`;
95+
noResultsMsg.style.display = '';
96+
}
97+
} else if (noResultsMsg) {
98+
noResultsMsg.style.display = 'none';
99+
}
100+
});
101+
102+
// Copy citation functionality
103+
document.querySelectorAll('.copy-btn').forEach(button => {
104+
button.addEventListener('click', function() {
105+
const citationText = this.previousElementSibling.textContent.trim();
106+
107+
navigator.clipboard.writeText(citationText).then(() => {
108+
// Change button text temporarily
109+
const originalText = this.innerHTML;
110+
this.innerHTML = '<i class="fas fa-check"></i> Copied!';
111+
112+
setTimeout(() => {
113+
this.innerHTML = originalText;
114+
}, 2000);
115+
}).catch(err => {
116+
console.error('Could not copy text: ', err);
117+
});
118+
});
119+
});
120+
});

‎static/js/scripts.js‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -246,6 +246,13 @@ document.addEventListener('DOMContentLoaded', function() {
246246
});
247247
}
248248

249+
if (window.location.pathname.includes('/glossary')) {
250+
document.body.classList.add('loading-glossary');
251+
window.addEventListener('load', function() {
252+
document.body.classList.remove('loading-glossary');
253+
});
254+
}
255+
249256
// Form input interactivity for range and number input synchronization
250257
const syncRangeInputs = () => {
251258
document.querySelectorAll('input[type="range"]').forEach(range => {
@@ -273,6 +280,7 @@ document.addEventListener('DOMContentLoaded', function() {
273280

274281
syncRangeInputs();
275282

283+
276284
// Handle form reset to properly update range inputs
277285
document.querySelectorAll('form').forEach(form => {
278286
form.addEventListener('reset', () => {

0 commit comments

Comments
 (0)