docs: 📝 update docs

packages/docs/src/components/widgets/CallToAction.tsx

@@ -0,0 +1,37 @@
+import { component$ } from '@builder.io/qwik'
+
+export default component$(() => {
+    return (
+        <section class="relative">
+            <div class="max-w-6xl mx-auto px-4 sm:px-6">
+                <div class="py-12 md:py-20">
+                    <div class="max-w-3xl mx-auto text-center p-6 rounded-md shadow-xl dark:shadow-none">
+                        <h2 class="text-4xl md:text-4xl font-bold leading-tighter tracking-tighter mb-4 font-heading">
+                            <span class="text-[#039de1]">Qwik</span> +{' '}
+                            <br class="block sm:hidden" />
+                            <span class="text-[#039de1] sm:whitespace-nowrap">
+                                Tailwind CSS
+                            </span>
+                        </h2>
+                        <p class="text-xl text-gray-600 dark:text-slate-400">
+                            Be very surprised by these huge fake numbers you are
+                            seeing on this page. <br class="hidden md:inline" />
+                            Don't waste more time!
+                        </p>
+
+                        <div class="mt-6">
+                            <a
+                                class="btn btn-primary mb-4 sm:mb-0 w-full sm:w-auto"
+                                href="https://github.com/onwidget/qwind"
+                                target="_blank"
+                                rel="noopener"
+                            >
+                                Get template
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+    )
+})