-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
104 lines (96 loc) · 6.76 KB
/
Copy pathindex.html
File metadata and controls
104 lines (96 loc) · 6.76 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="theme-color" content="#1b2a4a" />
<meta name="description" content="Virsa is an accuracy-first guide to Sikh history, traditional accounts, Gurbani, Sikh teachings, and daily Nitnem practice for kids and adults." />
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' https://unpkg.com https://cdn.jsdelivr.net; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://unpkg.com; font-src 'self' https://fonts.gstatic.com; img-src 'self' data: https://unpkg.com https://*.tile.openstreetmap.org; media-src 'self' https://archive.org https://*.archive.org; connect-src 'self' https://cdn.jsdelivr.net; object-src 'none'; base-uri 'none'; form-action 'none';" />
<title>Virsa — Sikh Heritage & Stories</title>
<!-- Gurmukhi + UI fonts (graceful fallback to system fonts if offline) -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,600;9..144,700&family=Inter:wght@400;500;600;700&family=Noto+Sans+Gurmukhi:wght@400;500;600;700&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="assets/css/styles.css" />
<!-- PWA: installable + offline -->
<link rel="manifest" href="manifest.webmanifest" />
<link rel="icon" href="assets/img/icon.svg" type="image/svg+xml" />
<link rel="apple-touch-icon" href="assets/img/icon.svg" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-title" content="Virsa" />
</head>
<body>
<a class="skip-link" href="#main">Skip to content</a>
<!-- ============================== HEADER ============================== -->
<header class="appbar" role="banner">
<a class="brand" href="#/home" aria-label="Virsa home">
<span class="brand-mark" aria-hidden="true">ੴ</span>
<span class="brand-text">
<span class="brand-name">Virsa</span>
<span class="brand-sub">Sikh Heritage & Stories</span>
</span>
</a>
<div class="appbar-actions">
<a id="searchLink" class="icon-btn" href="#/search" aria-label="Search" title="Search">
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true"><circle cx="11" cy="11" r="7" fill="none" stroke="currentColor" stroke-width="1.8"/><path d="m21 21-4.3-4.3" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>
</a>
<a id="savedLink" class="icon-btn" href="#/saved" aria-label="Saved items" title="Saved">
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true"><path d="M6 3h12a1 1 0 0 1 1 1v17l-7-4-7 4V4a1 1 0 0 1 1-1z" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linejoin="round"/></svg>
</a>
<button id="kidsToggle" class="chip-toggle" type="button" aria-pressed="false" title="Switch between a simple version for children and the full version">
<span class="chip-dot" aria-hidden="true"></span>
<span class="chip-label">Kids mode</span>
</button>
<button id="themeToggle" class="icon-btn" type="button" aria-label="Switch color mode" title="Switch color mode">
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true"><path class="ico-sun" d="M12 4V2m0 20v-2m8-8h2M2 12h2m13.66 5.66 1.41 1.41M4.93 4.93l1.41 1.41m0 11.32-1.41 1.41M19.07 4.93l-1.41 1.41M12 7a5 5 0 1 0 0 10 5 5 0 0 0 0-10z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/></svg>
</button>
</div>
</header>
<!-- =============================== MAIN =============================== -->
<main id="main" tabindex="-1">
<div id="app" class="view" aria-live="polite"></div>
</main>
<!-- ============================ BOTTOM NAV ============================ -->
<nav class="tabbar" role="navigation" aria-label="Primary">
<a class="tab" href="#/home" data-tab="home">
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M3 11.5 12 4l9 7.5M5 10v9a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-9" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"/></svg>
<span>Home</span>
</a>
<a class="tab" href="#/figures" data-tab="figures">
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3 4 7v5c0 4.4 3.4 7.4 8 9 4.6-1.6 8-4.6 8-9V7l-8-4z" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linejoin="round"/></svg>
<span>Gurus</span>
</a>
<a class="tab" href="#/stories" data-tab="stories">
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M4 5.5A2.5 2.5 0 0 1 6.5 3H20v15H6.5A2.5 2.5 0 0 0 4 20.5V5.5zM4 20.5A2.5 2.5 0 0 1 6.5 18H20" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"/></svg>
<span>Stories</span>
</a>
<a class="tab" href="#/gurbani" data-tab="gurbani">
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 21s-7-4.3-9.2-8.2C1.3 9.9 2.6 6 6 6c2 0 3.2 1.2 4 2.4C10.8 7.2 12 6 14 6c3.4 0 4.7 3.9 3.2 6.8C19 16.7 12 21 12 21z" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linejoin="round"/></svg>
<span>Wisdom</span>
</a>
<a class="tab" href="#/nitnem" data-tab="nitnem">
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M9 18V5l11-2v13M9 13l11-2M7 16a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0zm13-2a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0z" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"/></svg>
<span>Nitnem</span>
</a>
<a class="tab" href="#/more" data-tab="more">
<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M4 5h6v6H4V5zm10 0h6v6h-6V5zM4 15h6v4H4v-4zm10 0h6v4h-6v-4z" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linejoin="round"/></svg>
<span>More</span>
</a>
</nav>
<!-- ============================== DATA =============================== -->
<script src="assets/js/data-figures.js"></script>
<script src="assets/js/data-stories.js"></script>
<script src="assets/js/data-gurbani.js"></script>
<script src="assets/js/data-paaths.js"></script>
<script src="assets/js/data-fives.js"></script>
<script src="assets/js/data-festivals.js"></script>
<script src="assets/js/data-glossary.js"></script>
<script src="assets/js/data-gurdwaras.js"></script>
<script src="assets/js/data-timeline.js"></script>
<script src="assets/js/data-ceremonies.js"></script>
<script src="assets/js/data-1984.js"></script>
<script src="assets/js/data-beliefs.js"></script>
<!-- ============================== LOGIC ============================== -->
<script src="assets/js/app.js"></script>
</body>
</html>