Skip to content

Commit 8177aa5

Browse files
shairezshairez
committed
docs: update cta images
1 parent 00cd57a commit 8177aa5

File tree

7 files changed

+35
-24
lines changed

7 files changed

+35
-24
lines changed

‎apps/website/public/images/qwik-ui-fluffy-creature.webp

55.1 KB
Binary file not shown.

‎apps/website/public/images/qwik-ui-headless-cta.webp

75 KB
Binary file not shown.

‎apps/website/src/routes/docs/fluffy/(components)/carousel/index.mdx

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
---
2+
title: Qwik UI | Fluffy Carousel Component
3+
---
4+
5+
import {StatusBanner, statusByComponent} from '../exports';
6+
7+
# Carousel
8+
9+
The Fluffy carousel places the reins of visual storytelling in your hands. Spin through images with a masterful swipe, each slide an open canvas for your narrative. You're not just a spectator; you're the maestro of this digital carousel
10+
<br/>
11+
<StatusBanner status={statusByComponent.fluffy.Checkbox}/>
12+

‎apps/website/src/routes/docs/fluffy/(components)/checkbox/index.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
---
2-
title: Qwik UI | Fluffy Breadcrumb Component
2+
title: Qwik UI | Fluffy Checkbox Component
33
---
44

55
import {StatusBanner, statusByComponent} from '../exports';
66

7-
# Breadcrumb
7+
# Checkbox
88

99
The Fluffy checkbox is your digital nod of approval, a small square awaiting a tick to turn possibilities into choices.. so choose wisely! or else... (kidding, you can always uncheck, don't worry!)
1010
<br/>

‎apps/website/src/routes/docs/fluffy/(components)/navigation-bar/index.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
---
2-
title: Qwik UI | Fluffy Breadcrumb Component
2+
title: Qwik UI | Fluffy Navigation Bar Component
33
---
44

55
import {StatusBanner, statusByComponent} from '../exports';
66

7-
# Breadcrumb
7+
# Navigation Bar
88

99
Much like a digital Hansel and Gretel, the Fluffy breadcrumb leaves a trail of modern markers, making navigation a breeze through the enchanting forest of pages
1010
<br/>

‎apps/website/src/routes/docs/fluffy/(components)/spinner/index.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
---
2-
title: Qwik UI | Fluffy Breadcrumb Component
2+
title: Qwik UI | Fluffy Spinner Component
33
---
44

55
import {StatusBanner, statusByComponent} from '../exports';
66

7-
# Breadcrumb
7+
# Spinner
88

99
Much like a digital Hansel and Gretel, the Fluffy breadcrumb leaves a trail of modern markers, making navigation a breeze through the enchanting forest of pages
1010
<br/>

‎apps/website/src/routes/[email protected]

Lines changed: 17 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -26,67 +26,66 @@ export default component$(() => {
2626
Choose a kit and start building the future{' '}
2727
<span class="hue-rotate-[150deg]">⚡</span>
2828
</p>
29-
<div class="flex flex-wrap justify-center justify-items-center gap-8">
29+
<div class="mt-4 flex flex-wrap justify-center justify-items-center gap-14">
3030
<a
3131
href={`/docs/headless/introduction`}
32-
class="ease-step shadow-light-medium dark:shadow-dark-high relative block rounded-b-xl rounded-t-md border-2 border-slate-700 outline-[1px] duration-150 hover:scale-[1.025] focus:scale-[1.025] dark:border-slate-400"
32+
class="ease-step shadow-light-medium dark:shadow-dark-high relative block rounded-b-xl rounded-t-md border-2 border-slate-300 outline-[1px] duration-150 hover:scale-[1.025] focus:scale-[1.025] dark:border-slate-400"
3333
>
3434
<Card class="max-w-[450px]">
3535
<CardImage
36-
src={`/images/qwikui-hero.webp`}
36+
src={`/images/qwik-ui-headless-cta.webp`}
3737
width="611"
3838
height="408"
3939
alt={`fluffy kit`}
4040
class="h-64 w-full
4141
rounded-t-[.125rem] bg-gradient-to-r from-[var(--qwik-light-blue)] to-[var(--qwik-light-purple)] object-cover"
4242
/>
4343
<CardBody
44-
class={`border-t-[2px] border-slate-700 px-8 py-6 dark:border-slate-400`}
44+
class={`border-t-[2px] border-slate-400 px-8 py-6 dark:border-slate-400`}
4545
>
46-
<CardTitle class="flex items-center justify-between text-xl font-bold">
47-
<span>Qwik UI Headless</span>
46+
<CardTitle class="flex justify-between text-xl font-bold">
47+
<span>Headless Qwik Components</span>
4848
</CardTitle>
4949
<p class="mt-2 leading-normal">
50-
Qwik primitives that are{' '}
50+
Qwik components which are{' '}
5151
<strong>unstyled, accessible, and open-source</strong>, designed for
5252
creating high-quality web applications and design systems.
5353
</p>
5454
</CardBody>
5555
</Card>
56-
<span class="border-qwikui-purple-600 bg-qwikui-purple-500 shadow-dark-medium text-outline-purple-title absolute left-[5px] top-[5px] rounded-md border-[1px] px-2 py-1 text-[12px] font-bold tracking-wide text-white">
56+
{/* <span class="border-qwikui-purple-600 bg-qwikui-purple-500 shadow-dark-medium text-outline-purple-title absolute left-[5px] top-[5px] rounded-md border-[1px] px-2 py-1 text-[12px] font-bold tracking-wide text-white">
5757
Core Package
58-
</span>
58+
</span> */}
5959
</a>
6060
{featureFlags?.showFluffy && (
6161
<a
6262
href={`/docs/fluffy/introduction`}
63-
class=" ease-step shadow-light-medium dark:shadow-dark-high relative block
64-
rounded-b-xl
65-
rounded-t-md border-2 border-2 border-slate-700 duration-150 hover:scale-[1.025] focus:scale-[1.025] dark:border-slate-400"
63+
class="ease-step shadow-light-medium dark:shadow-dark-high relative block
64+
rounded-b-xl rounded-t-md border-2 border-slate-300 duration-150 hover:scale-[1.025] focus:scale-[1.025] dark:border-slate-400"
6665
>
6766
<Card class="max-w-[450px] overflow-hidden">
6867
<CardImage
69-
src={`/images/fluffy-hero.webp`}
68+
src={`/images/qwik-ui-fluffy-creature.webp`}
7069
width="611"
7170
height="408"
7271
alt={`fluffy kit`}
7372
class="h-64 rounded-t-[.125rem] object-cover"
7473
/>
7574
<CardBody
76-
class={`border-t-[2px] border-slate-700 bg-transparent px-8 py-6 dark:border-slate-400`}
75+
class={`border-t-[2px] border-slate-300 bg-transparent px-8 py-6 dark:border-slate-400`}
7776
>
7877
<CardTitle class="flex items-center justify-between text-xl font-bold">
79-
<span>Fluffy</span>
78+
<span>Fluffy (Styled) Qwik Components</span>
8079
</CardTitle>
8180
<p class="mt-2 leading-normal">
82-
A collection of beautifully crafted, <strong>copy paste</strong>{' '}
81+
A collection of beautifully crafted, <strong>copy paste</strong> Qwik
8382
components that can be integrated into your applications with ease.
8483
</p>
8584
</CardBody>
8685
</Card>
87-
<span class="border-qwikui-blue-600 bg-qwikui-blue-500 shadow-dark-medium text-outline-blue-title absolute left-[5px] top-[5px] rounded-md border-[1px] px-2 py-1 text-[12px] font-bold tracking-wide text-white">
86+
{/* <span class="border-qwikui-blue-600 bg-qwikui-blue-500 shadow-dark-medium text-outline-blue-title absolute left-[5px] top-[5px] rounded-md border-[1px] px-2 py-1 text-[12px] font-bold tracking-wide text-white">
8887
Experimental
89-
</span>
88+
</span> */}
9089
</a>
9190
)}
9291
</div>

0 commit comments

Comments
 (0)