Skip to content

Commit 3d2d321

Browse files
committed
Update to adhere to new vector branding colors
1 parent d10e8e2 commit 3d2d321

File tree

5 files changed

+80
-66
lines changed

5 files changed

+80
-66
lines changed

catalog/app/analytics/page.tsx

Lines changed: 30 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -146,35 +146,37 @@ export default function AnalyticsPage() {
146146
}, [allRepoMetrics]);
147147

148148
return (
149-
<div className="min-h-screen bg-gradient-to-br from-gray-50 via-white to-cyan-50 dark:from-gray-900 dark:via-gray-900 dark:to-gray-800">
149+
<div className="min-h-screen bg-gradient-to-br from-gray-50 via-white to-gray-100 dark:from-gray-900 dark:via-gray-900 dark:to-gray-800">
150150
{/* Header */}
151-
<div className="bg-gradient-to-r from-vector-teal to-cyan-500 text-white">
151+
<div className="bg-gradient-to-r from-vector-magenta to-vector-cobalt text-white">
152152
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
153153
<motion.div
154154
initial={{ opacity: 0, y: 20 }}
155155
animate={{ opacity: 1, y: 0 }}
156156
transition={{ duration: 0.6 }}
157157
className="flex items-center justify-between"
158158
>
159-
<div>
160-
<div className="flex items-center gap-3 mb-4">
159+
<div className="flex items-center gap-4">
160+
<div className="bg-white/95 rounded-md px-2 py-1.5 shadow-sm flex-shrink-0">
161161
<Image
162-
src={getAssetPath("vector-logo.svg")}
162+
src={getAssetPath("vector-logo.webp")}
163163
alt="Vector Institute"
164-
width={120}
165-
height={40}
166-
className="h-10 w-auto brightness-0 invert"
164+
width={70}
165+
height={15}
166+
priority
167167
/>
168168
</div>
169-
<h1 className="text-4xl md:text-5xl font-bold mb-2">
170-
Repository Analytics
171-
</h1>
172-
<p className="text-cyan-100 text-lg">
173-
Implementation Catalog Performance Dashboard
174-
</p>
169+
<div>
170+
<h1 className="text-4xl md:text-5xl font-bold mb-2">
171+
Repository Analytics
172+
</h1>
173+
<p className="text-white/90 text-lg">
174+
GitHub Engagement & Community Impact Metrics
175+
</p>
176+
</div>
175177
</div>
176178
{historicalData?.last_updated && (
177-
<div className="hidden md:flex items-center gap-2 text-cyan-100">
179+
<div className="hidden md:flex items-center gap-2 text-white/90">
178180
<Calendar className="w-5 h-5" />
179181
<div className="text-right">
180182
<div className="text-xs uppercase tracking-wide opacity-80">
@@ -224,34 +226,34 @@ export default function AnalyticsPage() {
224226
{/* Key Metrics */}
225227
<section className="mb-12">
226228
<h2 className="text-2xl font-bold text-gray-900 dark:text-white mb-6 flex items-center gap-2">
227-
<BarChart3 className="w-6 h-6 text-vector-teal" />
229+
<BarChart3 className="w-6 h-6 text-vector-magenta" />
228230
Key Metrics
229231
</h2>
230232
<div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-4">
231233
<MetricCard
232-
icon={<Star className="w-5 h-5 text-yellow-500" />}
234+
icon={<Star className="w-5 h-5 text-vector-magenta" />}
233235
label="Total Stars"
234236
value={aggregateMetrics.totalStars.toLocaleString()}
235237
/>
236238
<MetricCard
237-
icon={<GitFork className="w-5 h-5 text-blue-500" />}
239+
icon={<GitFork className="w-5 h-5 text-vector-magenta" />}
238240
label="Total Forks"
239241
value={aggregateMetrics.totalForks.toLocaleString()}
240242
/>
241243
<MetricCard
242-
icon={<Eye className="w-5 h-5 text-purple-500" />}
244+
icon={<Eye className="w-5 h-5 text-vector-magenta" />}
243245
label="Unique Visitors"
244246
value={aggregateMetrics.totalVisitors.toLocaleString()}
245247
sublabel="14-day period"
246248
/>
247249
<MetricCard
248-
icon={<Download className="w-5 h-5 text-cyan-500" />}
250+
icon={<Download className="w-5 h-5 text-vector-magenta" />}
249251
label="Unique Cloners"
250252
value={aggregateMetrics.totalCloners.toLocaleString()}
251253
sublabel="14-day period"
252254
/>
253255
<MetricCard
254-
icon={<Award className="w-5 h-5 text-orange-500" />}
256+
icon={<Award className="w-5 h-5 text-vector-magenta" />}
255257
label="Tracked Repos"
256258
value={aggregateMetrics.totalRepos.toLocaleString()}
257259
/>
@@ -261,14 +263,14 @@ export default function AnalyticsPage() {
261263
{/* Top Performers */}
262264
<section className="mb-12">
263265
<h2 className="text-2xl font-bold text-gray-900 dark:text-white mb-6 flex items-center gap-2">
264-
<Award className="w-6 h-6 text-vector-teal" />
266+
<Award className="w-6 h-6 text-vector-magenta" />
265267
Top Performers
266268
</h2>
267269
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
268270
{/* Most Cloned */}
269271
<TopPerformerCard
270272
title="Most Cloned (14d)"
271-
icon={<Download className="w-5 h-5 text-cyan-500" />}
273+
icon={<Download className="w-5 h-5 text-vector-magenta" />}
272274
repos={topPerformers.byCloners}
273275
valueKey="unique_cloners"
274276
valueLabel="cloners"
@@ -277,7 +279,7 @@ export default function AnalyticsPage() {
277279
{/* Most Visited */}
278280
<TopPerformerCard
279281
title="Most Visited (14d)"
280-
icon={<Eye className="w-5 h-5 text-purple-500" />}
282+
icon={<Eye className="w-5 h-5 text-vector-magenta" />}
281283
repos={topPerformers.byVisitors}
282284
valueKey="unique_visitors"
283285
valueLabel="visitors"
@@ -286,7 +288,7 @@ export default function AnalyticsPage() {
286288
{/* Most Starred */}
287289
<TopPerformerCard
288290
title="Most Starred"
289-
icon={<Star className="w-5 h-5 text-yellow-500" />}
291+
icon={<Star className="w-5 h-5 text-vector-magenta" />}
290292
repos={topPerformers.byStars}
291293
valueKey="stars"
292294
valueLabel="stars"
@@ -352,7 +354,7 @@ export default function AnalyticsPage() {
352354
href={`https://github.com/${repo.repo_id}`}
353355
target="_blank"
354356
rel="noopener noreferrer"
355-
className="flex items-center gap-2 text-sm font-medium text-vector-teal hover:text-cyan-600 dark:text-cyan-400 dark:hover:text-cyan-300"
357+
className="flex items-center gap-2 text-sm font-medium text-vector-magenta hover:text-vector-cobalt dark:text-vector-magenta dark:hover:text-vector-cobalt"
356358
>
357359
{repo.name}
358360
<ExternalLink className="w-3 h-3" />
@@ -482,14 +484,14 @@ function TopPerformerCard({
482484
className="flex items-center justify-between py-2 border-b border-gray-100 dark:border-gray-700 last:border-0"
483485
>
484486
<div className="flex items-center gap-3 flex-1 min-w-0">
485-
<div className="flex-shrink-0 w-6 h-6 rounded-full bg-gradient-to-br from-vector-teal to-cyan-400 flex items-center justify-center text-white text-xs font-bold">
487+
<div className="flex-shrink-0 w-6 h-6 rounded-full bg-gradient-to-br from-vector-magenta to-vector-cobalt flex items-center justify-center text-white text-xs font-bold">
486488
{index + 1}
487489
</div>
488490
<a
489491
href={`https://github.com/${repo.repo_id}`}
490492
target="_blank"
491493
rel="noopener noreferrer"
492-
className="text-sm font-medium text-gray-900 dark:text-white hover:text-vector-teal dark:hover:text-cyan-400 truncate"
494+
className="text-sm font-medium text-gray-900 dark:text-white hover:text-vector-magenta dark:hover:text-vector-magenta truncate"
493495
title={repo.name}
494496
>
495497
{repo.name}

catalog/app/globals.css

Lines changed: 32 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,30 @@
22

33
:root {
44
--background: #ffffff;
5-
--foreground: #171717;
6-
--vector-teal: #48c0d9;
7-
--vector-dark: #002145;
8-
--vector-purple: #6a5acd;
5+
--foreground: #000000;
6+
/* Vector Institute Brand Colors - Primary Palette */
7+
--vector-magenta: #EB088A;
8+
--vector-black: #000000;
9+
--vector-grey: #E9E8E8;
10+
/* Vector Institute Brand Colors - Secondary Palette */
11+
--vector-cobalt: #313CFF;
12+
--vector-violet: #8A25C9;
13+
--vector-turquoise: #48C0D9;
14+
--vector-tangerine: #FF9E00;
15+
--vector-lime: #CFF933;
916
}
1017

1118
@theme inline {
1219
--color-background: var(--background);
1320
--color-foreground: var(--foreground);
14-
--color-vector-teal: var(--vector-teal);
15-
--color-vector-dark: var(--vector-dark);
16-
--color-vector-purple: var(--vector-purple);
21+
--color-vector-magenta: var(--vector-magenta);
22+
--color-vector-black: var(--vector-black);
23+
--color-vector-grey: var(--vector-grey);
24+
--color-vector-cobalt: var(--vector-cobalt);
25+
--color-vector-violet: var(--vector-violet);
26+
--color-vector-turquoise: var(--vector-turquoise);
27+
--color-vector-tangerine: var(--vector-tangerine);
28+
--color-vector-lime: var(--vector-lime);
1729
--font-sans: ui-sans-serif, system-ui, sans-serif;
1830
--breakpoint-sm: 640px;
1931
--breakpoint-md: 768px;
@@ -65,20 +77,20 @@ body {
6577
}
6678

6779
#hero-search .pagefind-ui__search-input:hover {
68-
border-color: #48c0d9 !important;
69-
box-shadow: 0 20px 25px -5px rgba(72, 192, 217, 0.1), 0 8px 10px -6px rgba(72, 192, 217, 0.1) !important;
80+
border-color: #EB088A !important;
81+
box-shadow: 0 20px 25px -5px rgba(235, 8, 138, 0.1), 0 8px 10px -6px rgba(235, 8, 138, 0.1) !important;
7082
}
7183

7284
#hero-search .pagefind-ui__search-input:focus {
7385
outline: none !important;
74-
border-color: #48c0d9 !important;
75-
box-shadow: 0 20px 25px -5px rgba(72, 192, 217, 0.1), 0 8px 10px -6px rgba(72, 192, 217, 0.1), 0 0 0 4px rgba(72, 192, 217, 0.1) !important;
86+
border-color: #EB088A !important;
87+
box-shadow: 0 20px 25px -5px rgba(235, 8, 138, 0.1), 0 8px 10px -6px rgba(235, 8, 138, 0.1), 0 0 0 4px rgba(235, 8, 138, 0.1) !important;
7688
transform: translateY(-2px) !important;
7789
}
7890

7991
/* Search icon */
8092
#hero-search .pagefind-ui__search-input::before {
81-
color: #48c0d9 !important;
93+
color: #EB088A !important;
8294
}
8395

8496
/* Clear button */
@@ -189,14 +201,14 @@ body {
189201

190202
#hero-search .pagefind-ui__filter-value:hover {
191203
background: #f3f4f6 !important;
192-
border-color: #48c0d9 !important;
204+
border-color: #EB088A !important;
193205
color: #111827 !important;
194206
}
195207

196208
#hero-search .pagefind-ui__filter-value--selected {
197-
background: #e0f2fe !important;
198-
border-color: #48c0d9 !important;
199-
color: #0c4a6e !important;
209+
background: #fce7f3 !important;
210+
border-color: #EB088A !important;
211+
color: #831843 !important;
200212
font-weight: 500 !important;
201213
}
202214

@@ -233,7 +245,7 @@ body {
233245

234246
#hero-search .pagefind-ui__result:hover {
235247
background: #f9fafb !important;
236-
border-color: #48c0d9 !important;
248+
border-color: #EB088A !important;
237249
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1) !important;
238250
transform: translateY(-2px) !important;
239251
}
@@ -245,7 +257,7 @@ body {
245257
top: 0 !important;
246258
bottom: 0 !important;
247259
width: 4px !important;
248-
background: linear-gradient(to bottom, #48c0d9, #22d3ee) !important;
260+
background: linear-gradient(to bottom, #EB088A, #313CFF) !important;
249261
border-radius: 1rem 0 0 1rem !important;
250262
}
251263

@@ -267,7 +279,7 @@ body {
267279
}
268280

269281
#hero-search .pagefind-ui__result:hover .pagefind-ui__result-title {
270-
color: #48c0d9 !important;
282+
color: #EB088A !important;
271283
}
272284

273285
/* Result excerpt */
@@ -334,7 +346,7 @@ body {
334346
#hero-search .pagefind-ui__loading {
335347
padding: 2rem !important;
336348
text-align: center !important;
337-
color: #48c0d9 !important;
349+
color: #EB088A !important;
338350
}
339351

340352
/* Scrollbar styling for results */

catalog/app/page.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -54,10 +54,10 @@ export default function Home() {
5454
{/* Browse Section */}
5555
<section id="browse" className="scroll-mt-20">
5656
<div className="text-center mb-12">
57-
<h2 className="text-4xl md:text-5xl font-bold mb-4 bg-gradient-to-r from-gray-900 via-gray-800 to-vector-teal dark:from-white dark:via-gray-100 dark:to-vector-teal bg-clip-text text-transparent">
58-
Browse Implementations
57+
<h2 className="text-4xl md:text-5xl font-bold mb-4 text-gray-900 dark:text-white">
58+
Browse <span className="bg-gradient-to-r from-vector-magenta to-vector-cobalt bg-clip-text text-transparent">Implementations</span>
5959
</h2>
60-
<p className="text-gray-600 dark:text-gray-400 text-lg max-w-2xl mx-auto">
60+
<p className="text-gray-700 dark:text-gray-300 text-lg max-w-2xl mx-auto font-medium">
6161
Discover AI implementations across various domains and techniques
6262
</p>
6363
</div>

catalog/components/hero.tsx

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,13 @@ interface HeroProps {
1212

1313
export default function Hero({ totalImplementations, yearsOfResearch }: HeroProps) {
1414
return (
15-
<div className="relative min-h-screen flex items-center justify-center overflow-hidden bg-gradient-to-br from-white via-gray-100 to-cyan-50">
15+
<div className="relative min-h-screen flex items-center justify-center overflow-hidden bg-gradient-to-br from-white via-gray-50 to-gray-100">
1616
{/* Sophisticated gradient background with layered blobs */}
1717
{/* Large ambient blob - top left */}
1818
<motion.div
1919
className="absolute -top-48 -left-48 w-[900px] h-[900px]"
2020
style={{
21-
background: 'radial-gradient(circle at 50% 50%, rgba(236, 72, 153, 0.15) 0%, rgba(219, 39, 119, 0.10) 35%, rgba(236, 72, 153, 0.05) 60%, transparent 80%)',
21+
background: 'radial-gradient(circle at 50% 50%, rgba(235, 8, 138, 0.12) 0%, rgba(235, 8, 138, 0.08) 35%, rgba(235, 8, 138, 0.04) 60%, transparent 80%)',
2222
filter: 'blur(60px)',
2323
borderRadius: '63% 37% 54% 46% / 55% 48% 52% 45%',
2424
}}
@@ -44,7 +44,7 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
4444
<motion.div
4545
className="absolute -bottom-32 -right-32 w-[800px] h-[800px]"
4646
style={{
47-
background: 'radial-gradient(circle at 50% 50%, rgba(236, 72, 153, 0.12) 0%, rgba(236, 72, 153, 0.08) 35%, rgba(219, 39, 119, 0.04) 60%, transparent 80%)',
47+
background: 'radial-gradient(circle at 50% 50%, rgba(49, 60, 255, 0.10) 0%, rgba(49, 60, 255, 0.06) 35%, rgba(49, 60, 255, 0.03) 60%, transparent 80%)',
4848
filter: 'blur(65px)',
4949
borderRadius: '45% 55% 52% 48% / 48% 55% 45% 52%',
5050
}}
@@ -71,7 +71,7 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
7171
<motion.div
7272
className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[750px] h-[750px]"
7373
style={{
74-
background: 'radial-gradient(circle at 50% 50%, rgba(236, 72, 153, 0.10) 0%, rgba(236, 72, 153, 0.06) 40%, rgba(219, 39, 119, 0.03) 60%, transparent 80%)',
74+
background: 'radial-gradient(circle at 50% 50%, rgba(235, 8, 138, 0.08) 0%, rgba(49, 60, 255, 0.06) 40%, rgba(235, 8, 138, 0.03) 60%, transparent 80%)',
7575
filter: 'blur(70px)',
7676
borderRadius: '52% 48% 45% 55% / 55% 45% 55% 45%',
7777
}}
@@ -96,7 +96,7 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
9696
<motion.div
9797
className="absolute top-1/4 right-1/4 w-[500px] h-[500px]"
9898
style={{
99-
background: 'radial-gradient(circle at 50% 50%, rgba(236, 72, 153, 0.08) 0%, rgba(236, 72, 153, 0.04) 50%, transparent 75%)',
99+
background: 'radial-gradient(circle at 50% 50%, rgba(49, 60, 255, 0.08) 0%, rgba(49, 60, 255, 0.04) 50%, transparent 75%)',
100100
filter: 'blur(50px)',
101101
borderRadius: '58% 42% 48% 52% / 52% 55% 45% 48%',
102102
}}
@@ -141,17 +141,17 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
141141
initial={{ opacity: 0, y: 20 }}
142142
animate={{ opacity: 1, y: 0 }}
143143
transition={{ duration: 0.6, delay: 0.2 }}
144-
className="text-5xl md:text-7xl font-bold mb-6 bg-gradient-to-r from-gray-900 via-vector-dark to-vector-teal bg-clip-text text-transparent leading-tight"
144+
className="text-5xl md:text-7xl font-bold mb-6 text-gray-900 leading-tight"
145145
>
146-
Implementation Catalog
146+
Implementation <span className="bg-gradient-to-r from-vector-magenta to-vector-cobalt bg-clip-text text-transparent">Catalog</span>
147147
</motion.h1>
148148

149149
{/* Subtitle */}
150150
<motion.p
151151
initial={{ opacity: 0, y: 20 }}
152152
animate={{ opacity: 1, y: 0 }}
153153
transition={{ duration: 0.6, delay: 0.4 }}
154-
className="text-lg md:text-xl mb-12 text-gray-700 max-w-3xl mx-auto leading-relaxed"
154+
className="text-lg md:text-xl mb-12 text-gray-800 max-w-3xl mx-auto leading-relaxed font-medium"
155155
>
156156
Explore cutting-edge AI implementations from Vector Institute researchers and engineers
157157
</motion.p>
@@ -164,21 +164,21 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
164164
className="flex flex-wrap justify-center gap-8 md:gap-16 mb-12"
165165
>
166166
<div className="flex items-center gap-3">
167-
<div className="p-3 bg-vector-teal/10 rounded-xl border border-vector-teal/30">
168-
<Layers className="w-6 h-6 text-vector-teal" />
167+
<div className="p-3 bg-vector-magenta/10 rounded-xl border border-vector-magenta/30">
168+
<Layers className="w-6 h-6 text-vector-magenta" />
169169
</div>
170170
<div className="text-left">
171171
<div className="text-3xl md:text-4xl font-bold text-gray-900">{totalImplementations}</div>
172-
<div className="text-sm text-gray-600 uppercase tracking-wide">Implementations</div>
172+
<div className="text-sm text-gray-700 uppercase tracking-wide font-semibold">Implementations</div>
173173
</div>
174174
</div>
175175
<div className="flex items-center gap-3">
176-
<div className="p-3 bg-purple-500/10 rounded-xl border border-purple-500/30">
177-
<TrendingUp className="w-6 h-6 text-purple-600" />
176+
<div className="p-3 bg-vector-cobalt/10 rounded-xl border border-vector-cobalt/30">
177+
<TrendingUp className="w-6 h-6 text-vector-cobalt" />
178178
</div>
179179
<div className="text-left">
180180
<div className="text-3xl md:text-4xl font-bold text-gray-900">{yearsOfResearch}</div>
181-
<div className="text-sm text-gray-600 uppercase tracking-wide">Years of Research</div>
181+
<div className="text-sm text-gray-700 uppercase tracking-wide font-semibold">Years of Research</div>
182182
</div>
183183
</div>
184184
</motion.div>
@@ -191,7 +191,7 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
191191
transition={{ duration: 0.6, delay: 0.8 }}
192192
whileHover={{ scale: 1.05 }}
193193
whileTap={{ scale: 0.95 }}
194-
className="inline-flex items-center gap-2 bg-gradient-to-r from-vector-teal to-cyan-400 hover:from-vector-teal/90 hover:to-cyan-400/90 text-white px-10 py-4 rounded-full font-semibold text-lg shadow-lg shadow-vector-teal/25 transition-all mb-8"
194+
className="inline-flex items-center gap-2 bg-gradient-to-r from-vector-magenta to-vector-cobalt hover:from-vector-magenta/90 hover:to-vector-cobalt/90 text-white px-10 py-4 rounded-full font-semibold text-lg shadow-lg shadow-vector-magenta/25 transition-all mb-8"
195195
>
196196
Browse Implementations
197197
<ArrowDown className="w-5 h-5 animate-bounce" />

catalog/public/vector-logo.webp

8.76 KB
Loading

0 commit comments

Comments
 (0)