-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
127 lines (117 loc) · 6.95 KB
/
Copy pathindex.html
File metadata and controls
127 lines (117 loc) · 6.95 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
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Anamek — Modern Amazigh Solutions</title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
</head>
<body>
<div class="glow-mesh">
<div class="glow-circle" style="top: -10%; left: -10%;"></div>
<div class="glow-circle" style="bottom: -10%; right: -10%; background: radial-gradient(circle, rgba(254, 123, 22, 0.1) 0%, transparent 70%);"></div>
</div>
<nav id="navbar">
<div class="container nav-inner">
<a href="#" class="logo" style="font-weight: 800; font-size: 1.5rem; letter-spacing: -1px;">
ⴰⵏⴰⵎⴽ <span style="color: var(--clr-primary);">Anamek</span>
</a>
<div class="nav-links">
<a href="#about">About</a>
<a href="#projects">Projects</a>
<a href="#contribute">Join us</a>
</div>
<a href="https://github.com/AnamekOrganisation" class="btn-modern btn-primary" style="padding: 10px 24px; font-size: 0.9rem;">
GitHub <i class="fab fa-github"></i>
</a>
</div>
</nav>
<main>
<header class="hero">
<div class="container">
<span class="card-tag" style="color: var(--clr-primary); font-weight: 600;">The Digital Meaning</span>
<h1 class="hero-title text-gradient">Building the Future<br>of Amazigh Tech</h1>
<p class="hero-sub">Empowering the Amazigh language through open-source tools, linguistic datasets, and modern development standards.</p>
<div class="hero-actions">
<a href="#projects" class="btn-modern btn-primary">Our Ecosystem</a>
</div>
<div class="bento-grid">
<!-- Project 1: Tall Card -->
<div class="bento-card tall reveal">
<div>
<div class="card-icon"><i class="fas fa-book-atlas"></i></div>
<span class="card-tag">Living Language</span>
<h3 class="card-title">Anamek Dictionary</h3>
<p class="card-desc">A collaborative Amazigh–French dictionary. Built by the community, for the community, to ensure linguistic survival.</p>
</div>
<a href="https://github.com/AnamekOrganisation/Anamek-Dictionary" class="btn-modern" style="border: 1px solid var(--clr-border); font-size: 0.85rem; padding: 10px 20px;">Explore <i class="fas fa-arrow-right"></i></a>
</div>
<!-- Project 2: Wide Card -->
<div class="bento-card wide reveal">
<div>
<div class="card-icon"><i class="fas fa-brain"></i></div>
<span class="card-tag">Intelligence</span>
<h3 class="card-title">Amazigh AI Datasets</h3>
<p class="card-desc">Training the next generation of models. We collect and curate high-quality text and audio corpora for NLP research.</p>
</div>
<div style="display: flex; gap: 10px; margin-top: 20px;">
<span class="glass" style="padding: 5px 15px; border-radius: 100px; font-size: 0.8rem;">NLP</span>
<span class="glass" style="padding: 5px 15px; border-radius: 100px; font-size: 0.8rem;">Datasets</span>
<span class="glass" style="padding: 5px 15px; border-radius: 100px; font-size: 0.8rem;">Open Source</span>
</div>
</div>
<!-- Project 3: Normal Card -->
<div class="bento-card reveal">
<div>
<div class="card-icon"><i class="fas fa-font"></i></div>
<span class="card-tag">Design</span>
<h3 class="card-title">Modern Fonts</h3>
<p class="card-desc">Specialized Tifinagh typography designed for the web.</p>
</div>
</div>
<!-- Project 4: Normal Card -->
<div class="bento-card reveal">
<div>
<div class="card-icon"><i class="fas fa-code-merge"></i></div>
<span class="card-tag">Contribute</span>
<h3 class="card-title">Join Anamek</h3>
<p class="card-desc">We are always looking for developers and linguists.</p>
</div>
</div>
<!-- Project 5: Wide Card Bottom -->
<div class="bento-card wide reveal" style="background: linear-gradient(135deg, #111 0%, #000 100%); border-color: var(--clr-primary-glow);">
<div style="display: flex; align-items: center; gap: 30px;">
<img src="assets/hero.png" style="width: 120px; filter: grayscale(0.5);" alt="Mascot">
<div>
<h3 class="card-title">Anamek Organization</h3>
<p class="card-desc">Merging ancient heritage with the latest tech stack to build something that lasts.</p>
</div>
</div>
</div>
</div>
</div>
</header>
<section id="contribute" class="container reveal">
<div class="bento-card" style="text-align: center; justify-content: center; padding: 100px 40px; border-color: var(--clr-primary);">
<h2 style="font-size: 3rem; margin-bottom: 20px;">Ready to build?</h2>
<p style="color: var(--clr-text-sub); margin-bottom: 40px;">No matter your skill level, if you care about Amazigh tech, you have a place at Anamek.</p>
<div style="display: flex; justify-content: center; gap: 20px;">
<a href="https://github.com/AnamekOrganisation" class="btn-modern btn-primary">Start Contributing</a>
</div>
</div>
</section>
</main>
<footer style="padding: 80px 0; border-top: 1px solid var(--clr-border);">
<div class="container" style="display: flex; justify-content: space-between; color: var(--clr-text-muted); font-size: 0.9rem;">
<div>ⴰⵏⴰⵎⴽ | Anamek © 2026. All rights preserved.</div>
<div style="display: flex; gap: 30px;">
<a href="#">X (Twitter)</a>
<a href="#">LinkedIn</a>
<a href="#">GitHub</a>
</div>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>