updating docs

tallstackui · Jan 12, 2024 · ebceeb2 · ebceeb2
1 parent 87f2558
commit ebceeb2
Show file tree

Hide file tree

Showing 6 changed files with 45 additions and 24 deletions.
diff --git a/resources/views/components/layout/banner.blade.php b/resources/views/components/layout/banner.blade.php
@@ -4,7 +4,9 @@
             <div class="w-72 sm:w-1/4">
                 <x-svg.tallstackui-light />
             </div>
-            <p class="text-md leading-8 text-white">
+        </div>
+        <div class="flex justify-center">
+            <p class="text-sm leading-8 text-white md:text-md">
                 Powerful suite of Blade components for TALL Stack apps.
             </p>
         </div>

diff --git a/resources/views/components/on-this-page.blade.php b/resources/views/components/on-this-page.blade.php
@@ -31,10 +31,17 @@
                 @endif
             </ol>
         </nav>
-        <div class="hidden mt-4 items-center justify-center rounded-full border border-pink-600 bg-pink-700 text-sm font-medium text-pink-50 p md:block md:flex">
-            <x-link href="https://github.com/sponsors/devajmeireles" icon="arrow-up-right" position="right" blank color="white">
-                Sponsor the TallStackUI
-            </x-link>
+        <div class="mt-4 hidden space-y-2 md:flex md:flex-col">
+            <div class="flex items-center justify-center rounded-full border border-pink-600 bg-pink-700 text-sm font-medium text-pink-50 p">
+                <x-link href="https://github.com/sponsors/devajmeireles" icon="arrow-up-right" position="right" blank color="white">
+                    Sponsor the TallStackUI
+                </x-link>
+            </div>
+            <div class="flex items-center justify-center rounded-full border border-purple-600 bg-purple-700 text-sm font-medium text-purple-50 p">
+                <x-link href="https://discord.gg/sfr66WXh4A" icon="arrow-up-right" position="right" blank color="white">
+                    Join TallStackUI on Discord
+                </x-link>
+            </div>
         </div>
     </div>
 @endif
diff --git a/resources/views/documentation/form/tag.blade.php b/resources/views/documentation/form/tag.blade.php
@@ -50,10 +50,10 @@
     </x-section>
     <x-slot:navigation>
         <x-slot:back>
-            <x-layout.footer-navigation :href="route('documentation.form.range')" text="Form Range" back />
+            <x-layout.footer-navigation :href="route('documentation.form.radio')" text="Form Radio" back />
         </x-slot:back>
         <x-slot:next>
-            <x-layout.footer-navigation :href="route('documentation.ui.alert')" text="Alert" />
+            <x-layout.footer-navigation :href="route('documentation.form.toggle')" text="Form Toggle" />
         </x-slot:next>
     </x-slot:navigation>
 </x-layout>
diff --git a/resources/views/documentation/installation.blade.php b/resources/views/documentation/installation.blade.php
@@ -5,7 +5,7 @@
     <x-section title="Requirements" disable-copy>
         <p>TallStackUI was created with a <b class="font-semibold text-pink-500 underline">focus on Livewire 3</b> so the usage requirements are:</p>
         <ul class="mt-4 ml-4 list-inside list-decimal space-y-2">
-            <li>PHP 8.x</li>
+            <li>PHP 8.1 or above</li>
             <li>Laravel 10</li>
             <li>Livewire 3</li>
             <li>TailwindCSS 3</li>
@@ -60,8 +60,13 @@
     </x-section>
     <x-section title="Livewire SPA Mode" disable-copy>
         <p>
-            If you are using the new Livewire SPA mode you must load the TallStackUI to the first page rendered
-            in your application and persist in all other pages that want to use TallStackUI.
+            If you are using the new Livewire SPA mode you must load the TallStackUI in the first page rendered
+            in your application and persist in all other pages that want to use TallStackUI. For example, if your
+            applications has a <x-block>welcome.blade.php</x-block> which is the first page rendered, so it must
+            contain the script of the TallStackUI <i>(step 3 of the installation, at this same page)</i> and
+            also the next ones, when navigating using <x-block>wire:navigate</x-block>. This is necessary
+            because using Livewire's SPA mode, Livewire only evaluates what is a script and the TallStackUI
+            script loader is not actually a script, but rather a route to a script.
         </p>
     </x-section>
     <x-slot:navigation>

diff --git a/resources/views/documentation/troubleshooting.blade.php b/resources/views/documentation/troubleshooting.blade.php
@@ -23,4 +23,15 @@
             community member fixed the issue in <a href="https://github.com/laravel/framework/pull/49216" class="underline" target="_blank">a pull request.</a>
         </p>
     </x-section>
+    <x-section title="Errors When Using Livewire in SPA Mode" disable-copy>
+        <p>
+            If you are using the new Livewire SPA mode you must load the TallStackUI in the first page rendered
+            in your application and persist in all other pages that want to use TallStackUI. For example, if your
+            applications has a <x-block>welcome.blade.php</x-block> which is the first page rendered, so it must
+            contain the script of the TallStackUI <i>(step 3 of the installation page, at this same page)</i> and
+            also the next ones, when navigating using <x-block>wire:navigate</x-block>. This is necessary
+            because using Livewire's SPA mode, Livewire only evaluates what is a script and the TallStackUI
+            script loader is not actually a script, but rather a route to a script.
+        </p>
+    </x-section>
 </x-layout>
diff --git a/resources/views/get-started.blade.php b/resources/views/get-started.blade.php
@@ -4,29 +4,25 @@
     </x-slot:title>
     <x-section disable-copy>
         <p>
-            This is the TallStackUI, a library of ready-to-use components for TALL Stack applications.
+            This is the TallStackUI, a <b class="text-pink-600">powerful suite of 30+ ready-to-use components for TALL Stack applications.</b>
             TallStackUI is unlike anything you've ever seen, from its conception to construction and general
             availability. Beforehand we want to tell you a little about our motivation.
         </p>
     </x-section>
-    <x-section class="space-y-4" title="Motivations" disable-copy>
+    <x-section class="space-y-4" title="History & Motivation" disable-copy>
         <p>
-            Hey! I'm <a href="https://github.com/devajmeireles" class="underline" target="_blank">AJ</a>,
-            creator of TallStackUI and FullStack PHP developer since 10 years ago. I'm passionate about TALL
-            Stack and addicted to the Laravel ecosystem, especially <a href="https://pestphp.com" class="underline" target="_blank">Pest</a>,
-            the best PHP testing framework that I help maintain.
+            TallStackUI was created by <a href="https://github.com/devajmeireles" class="underline" target="_blank">AJ</a>,
+            a <i>FullStack</i> PHP developer for 10 years, passionate about the Laravel and Livewire ecosystem, especially the TALL Stack,
+            a universe of possibilities with little time and effort. <a href="https://github.com/devajmeireles" class="underline" target="_blank">AJ</a> is an active developer in the community,
+            contributing to Laravel, Livewire, PestPHP and other open-source solutions.
         </p>
         <p>
-            As the owner of a few TALL Stack SaaS, I often came across situations where the component
-            library I was using left me without new features, updates, or even worse bugs affecting my
-            applications. I decided to stop using component libraries and create my components manually
-            – who has never done this? The main problem I found with this was that I needed to recreate
-            the components in new projects even if I copied them, which would cost me time and money.
+            Because <a href="https://github.com/devajmeireles" class="underline" target="_blank">AJ</a> has several SaaS applications, the motivation for creating TallStackUI was to avoid dependencies
+            on libraries that over time became outdated, without improvements or new features, generating
+            possible impacts on large projects that depend on everything working well.
         </p>
         <p>
-            TallStackUI is a solution to solve a personal problem while serving the community. <u>The main
-                guarantee you will have is the fact that I, the author, and all contributors are the main
-                users of the library</u>, guaranteeing useful components and frequent updates.
+            Feel invited to <a href="https://discord.gg/sfr66WXh4A" class="underline" target="_blank">join our Discord</a> server to interact with the community and get early access to news.
         </p>
     </x-section>
     <x-slot:navigation>