Skip to content

Commit 302ec47

Browse files
author
JianZcar
committed
cards are now with frosty cold look, better styling consistency, more modular.
1 parent 978a58d commit 302ec47

6 files changed

Lines changed: 177 additions & 178 deletions

File tree

‎app/components/CardLarge.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<div class="w-full bg-base-200/80 rounded-2xl shadow-2xl mb-12 p-8 md:p-12">
2+
<div class="w-full bg-linear-to-r from-primary/20 to-secondary/20 rounded-2xl shadow-2xl mb-12 p-8 md:p-12 border-t border-l border-primary/20">
33
<div class="flex flex-col w-full">
44
<slot></slot>
55
</div>

‎app/components/home/Download.vue‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
<template>
2-
<div id="download"
3-
class="p-8 md:p-12 bg-linear-to-r from-primary/20 to-secondary/20 rounded-2xl mb-12 border border-primary/20 shadow-2xl">
2+
<CardLarge>
43
<div class="text-center">
54
<h2 class="text-4xl font-bold mb-4">
65
<Icon name="lucide:download" class="mr-2 align-middle" />
@@ -14,17 +13,20 @@
1413
</p>
1514

1615
<div class="flex flex-col md:flex-row justify-center items-center gap-6 mb-12">
17-
<a href="https://gofile.io/d/NOybCa" class="btn btn-primary btn-lg btn-wide gap-3 shadow-lg hover:scale-105 transition-transform">
16+
<a href="https://gofile.io/d/NOybCa"
17+
class="btn btn-primary btn-lg btn-wide gap-3 shadow-lg hover:scale-105 transition-transform">
1818
<Icon name="lucide:download" />
1919
GoFile
2020
</a>
21-
<a href="https://send.now/a/1CSI" class="btn btn-secondary btn-lg btn-wide gap-3 shadow-lg hover:scale-105 transition-transform">
21+
<a href="https://send.now/a/1CSI"
22+
class="btn btn-secondary btn-lg btn-wide gap-3 shadow-lg hover:scale-105 transition-transform">
2223
<Icon name="lucide:download" />
2324
Send.now
2425
</a>
2526
</div>
2627

27-
<div class="rounded-2xl grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 shadow-xl bg-base-100 max-w-4xl mx-auto p-2">
28+
<div
29+
class="rounded-2xl grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 shadow-xl bg-base-100 max-w-4xl mx-auto p-2">
2830
<div class="stat place-items-center border-r-0 sm:border-r">
2931
<div class="stat-figure text-primary">
3032
<Icon name="lucide:box" class="text-3xl" />
@@ -53,5 +55,5 @@
5355
</div>
5456
</div>
5557
</div>
56-
</div>
58+
</CardLarge>
5759
</template>

‎app/components/home/Features.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,8 +49,8 @@
4949
</Card>
5050
</div>
5151

52-
<div class="mt-12 overflow-x-auto">
53-
<table class="table table-zebra w-full">
52+
<div class="mt-12 overflow-x-auto rounded-2xl bg-base-100 shadow-inner border-b border-r border-primary/20">
53+
<table class="table w-full">
5454
<thead>
5555
<tr class="text-lg">
5656
<th class="bg-base-300">

‎app/components/home/Gaming.vue‎

Lines changed: 79 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -1,92 +1,90 @@
11
<template>
2-
<div id="gaming"
3-
class="w-full bg-linear-to-r from-purple-900/20 to-pink-900/20 rounded-2xl shadow-2xl mb-12 p-8 md:p-12 border border-purple-500/20">
4-
<div class="flex flex-col">
5-
<h2 class="text-4xl font-bold mb-6">
6-
<Icon name="lucide:gamepad-2" class="text-purple-400 mr-3 align-middle" />
7-
Gaming? Just Opt‑In.
8-
</h2>
2+
<CardLarge class="from-error/20! to-secondary/20! border-secondary/50">
3+
<h2 class="text-4xl font-bold mb-6">
4+
<Icon name="lucide:gamepad-2" class="text-secondary mr-3 align-middle" />
5+
Gaming? Just Opt‑In.
6+
</h2>
97

10-
<div class="grid lg:grid-cols-2 gap-12 items-center">
11-
<div>
12-
<p class="text-xl mb-6 leading-relaxed">
13-
Love games? Run one command and we'll set up everything you need:
14-
</p>
8+
<div class="grid lg:grid-cols-2 gap-12 items-center">
9+
<div>
10+
<p class="text-xl mb-6 leading-relaxed">
11+
Love games? Run one command and we'll set up everything you need:
12+
</p>
1513

16-
<div class="mockup-code bg-base-300 mb-8 w-fit shadow-lg border border-white/5">
17-
<pre data-prefix="$" class="text-info"><code>gaming install</code></pre>
18-
</div>
14+
<div class="mockup-code bg-base-300 mb-8 w-fit shadow-lg border border-white/5">
15+
<pre data-prefix="$" class="text-info"><code>gaming install</code></pre>
16+
</div>
1917

20-
<p class="text-lg mb-6">
21-
We'll set up a dedicated <strong class="text-primary">Gaming Distrobox based on CachyOS v3</strong> with Steam,
22-
Heroic, Lutris, ProtonUp‑Qt, and everything else you need.
23-
</p>
18+
<p class="text-lg mb-6">
19+
We'll set up a dedicated <strong class="text-primary">Gaming Distrobox based on CachyOS v3</strong> with
20+
Steam,
21+
Heroic, Lutris, ProtonUp‑Qt, and everything else you need.
22+
</p>
2423

25-
<p class="text-base-content/80 leading-relaxed">
26-
The gaming environment runs in a CachyOS v3 Distrobox, giving you the latest gaming libraries and tools. All
27-
launchers appear right in your app menu — no fuss, all performance. Your games benefit from both host-level
28-
kernel optimizations and a containerized, up-to-date gaming environment.
29-
</p>
30-
</div>
24+
<p class="text-base-content/80 leading-relaxed">
25+
The gaming environment runs in a CachyOS v3 Distrobox, giving you the latest gaming libraries and tools. All
26+
launchers appear right in your app menu — no fuss, all performance. Your games benefit from both host-level
27+
kernel optimizations and a containerized, up-to-date gaming environment.
28+
</p>
29+
</div>
3130

32-
<div class="space-y-6">
33-
<div class="p-6 bg-purple-900/20 rounded-2xl border-l-4 border-purple-500 shadow-inner">
34-
<h3 class="font-bold text-2xl mb-4 text-purple-300 flex items-center gap-2">
35-
<Icon name="lucide:cpu" />
36-
Performance at Every Level
37-
</h3>
38-
<p class="mb-4 text-purple-100/80">
39-
Zena gives you gaming optimizations <strong class="text-primary">from the host to the container</strong>:
40-
</p>
41-
<ul class="space-y-3">
42-
<li class="flex items-start gap-3">
43-
<Icon name="lucide:circle-check" class="text-purple-400 mt-1 shrink-0" />
44-
<span class="text-base-content/90"><strong>CachyOS Kernel</strong> on the host — LTO-optimized for
45-
maximum performance</span>
46-
</li>
47-
<li class="flex items-start gap-3">
48-
<Icon name="lucide:circle-check" class="text-purple-400 mt-1 shrink-0" />
49-
<span class="text-base-content/90"><strong>Extended Scheduler (sched_ext)</strong> at the host level —
50-
better CPU allocation</span>
51-
</li>
52-
<li class="flex items-start gap-3">
53-
<Icon name="lucide:circle-check" class="text-purple-400 mt-1 shrink-0" />
54-
<span class="text-base-content/90"><strong>CachyOS v3 Gaming Distrobox</strong> — optimized container
55-
environment</span>
56-
</li>
57-
<li class="flex items-start gap-3">
58-
<Icon name="lucide:circle-check" class="text-purple-400 mt-1 shrink-0" />
59-
<span class="text-base-content/90"><strong>Latest gaming libraries</strong> — updated graphics drivers
60-
and compatibility layers</span>
61-
</li>
62-
<li class="flex items-start gap-3">
63-
<Icon name="lucide:circle-check" class="text-purple-400 mt-1 shrink-0" />
64-
<span class="text-base-content/90"><strong>Complete isolation</strong> — gaming setup separated from
65-
your main system</span>
66-
</li>
67-
</ul>
68-
<p class="mt-4 text-sm text-purple-200/70 italic">
69-
Unlike setups where only the host or only the container is optimized, Zena delivers performance at every
70-
level.
71-
</p>
72-
</div>
31+
<div class="space-y-6">
32+
<div class="p-6 bg-base-100 rounded-2xl border-b border-r border-secondary/50 shadow-inner">
33+
<h3 class="font-bold text-2xl mb-4 text-secondary flex items-center gap-2">
34+
<Icon name="lucide:cpu" />
35+
Performance at Every Level
36+
</h3>
37+
<p class="mb-4 text-seconndary">
38+
Zena gives you gaming optimizations <strong class="text-primary">from the host to the container</strong>:
39+
</p>
40+
<ul class="space-y-3">
41+
<li class="flex items-start gap-3">
42+
<Icon name="lucide:circle-check" class="text-secondary mt-1 shrink-0" />
43+
<span class="text-base-content/90"><strong>CachyOS Kernel</strong> on the host — LTO-optimized for
44+
maximum performance</span>
45+
</li>
46+
<li class="flex items-start gap-3">
47+
<Icon name="lucide:circle-check" class="text-secondary mt-1 shrink-0" />
48+
<span class="text-base-content/90"><strong>Extended Scheduler (sched_ext)</strong> at the host level —
49+
better CPU allocation</span>
50+
</li>
51+
<li class="flex items-start gap-3">
52+
<Icon name="lucide:circle-check" class="text-secondary mt-1 shrink-0" />
53+
<span class="text-base-content/90"><strong>CachyOS v3 Gaming Distrobox</strong> — optimized container
54+
environment</span>
55+
</li>
56+
<li class="flex items-start gap-3">
57+
<Icon name="lucide:circle-check" class="text-secondary mt-1 shrink-0" />
58+
<span class="text-base-content/90"><strong>Latest gaming libraries</strong> — updated graphics drivers
59+
and compatibility layers</span>
60+
</li>
61+
<li class="flex items-start gap-3">
62+
<Icon name="lucide:circle-check" class="text-secondary mt-1 shrink-0" />
63+
<span class="text-base-content/90"><strong>Complete isolation</strong> — gaming setup separated from
64+
your main system</span>
65+
</li>
66+
</ul>
67+
<p class="mt-4 text-sm text-purple-200/70 italic">
68+
Unlike setups where only the host or only the container is optimized, Zena delivers performance at every
69+
level.
70+
</p>
7371
</div>
7472
</div>
73+
</div>
7574

76-
<div class="mt-12 flex flex-wrap justify-center gap-4">
77-
<BadgeLarge class="badge-primary">
78-
<Icon name="lucide:zap" class="mr-2" />
79-
Host-Level Optimizations
80-
</BadgeLarge>
81-
<BadgeLarge class="badge-secondary">
82-
<Icon name="lucide:cpu" class="mr-2" />
83-
CachyOS Kernel
84-
</BadgeLarge>
85-
<BadgeLarge class="badge-accent">
86-
<Icon name="lucide:package" class="mr-2" />
87-
CachyOS v3 Container
88-
</BadgeLarge>
89-
</div>
75+
<div class="mt-12 flex flex-wrap justify-center gap-4">
76+
<BadgeLarge class="badge-primary">
77+
<Icon name="lucide:zap" class="mr-2" />
78+
Host-Level Optimizations
79+
</BadgeLarge>
80+
<BadgeLarge class="badge-secondary">
81+
<Icon name="lucide:cpu" class="mr-2" />
82+
CachyOS Kernel
83+
</BadgeLarge>
84+
<BadgeLarge class="badge-accent">
85+
<Icon name="lucide:package" class="mr-2" />
86+
CachyOS v3 Container
87+
</BadgeLarge>
9088
</div>
91-
</div>
89+
</CardLarge>
9290
</template>

0 commit comments

Comments
 (0)