changed related resources in navigation and content (#1715)

Co-authored-by: Piotr Gusciora <[email protected]>
mdbootstrap · Jun 22, 2023 · d809721 · d809721
1 parent 3f750c4
commit d809721
Show file tree

Hide file tree

Showing 22 changed files with 931 additions and 430 deletions.
diff --git a/site/content/docs/standard/content-styles/animations/index.html b/site/content/docs/standard/content-styles/animations/index.html
@@ -2115,3 +2115,57 @@ <h2 class="mb-5 text-lg font-bold">List group</h2>
   </section>
   <!--/Section: Examples-->
 </section>
+
+<hr class="mb-5 dark:border-neutral-600" />
+
+<!-- Section: Related resources -->
+<section id="section-related-resources">
+  <!-- Title -->
+  <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
+    Related resources
+  </h2>
+
+  <!-- Resources -->
+  <div class="justify-content-start w-100 my-5 text-start">
+    <!-- Tutorials -->
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hover-state/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hover state</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/focus-active-and-others/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >colfocus active and othersors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/ripple-effect/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >ripple effect</a
+    >
+
+    <!-- Main docs -->
+  </div>
+  <!-- Resources -->
+</section>
+<!-- Section: Related resources -->
diff --git a/site/content/docs/standard/content-styles/colors/index.html b/site/content/docs/standard/content-styles/colors/index.html
@@ -1314,3 +1314,85 @@
   </section>
 </section>
 <!-- Section: Text color -->
+
+<hr class="mb-5 dark:border-neutral-600" />
+
+<!-- Section: Related resources -->
+<section id="section-related-resources">
+  <!-- Title -->
+  <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
+    Related resources
+  </h2>
+
+  <!-- Resources -->
+  <div class="justify-content-start w-100 my-5 text-start">
+    <!-- Tutorials -->
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >colors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hover-state/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hover state</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/focus-active-and-others/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >focus active and others</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/dark-mode/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >dark mode</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/masks/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >masks</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hsla-colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hsla colors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/ripple-effect/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >ripple effect</a
+    >
+
+    <!-- Main docs -->
+  </div>
+  <!-- Resources -->
+</section>
+<!-- Section: Related resources -->
diff --git a/site/content/docs/standard/content-styles/dividers/index.html b/site/content/docs/standard/content-styles/dividers/index.html
@@ -635,42 +635,50 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- How to? -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/flexbox-use/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/grid-system/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How To Use Flexbox In Bootstrap</a
+      >grid system</a
     >
-
-    <!-- Extended docs -->
     <a
-      href="https://mdbootstrap.com/docs/standard/layout/vertical-alignment/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/responsiveness/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Vertical Align</a
+      >responsiveness</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >flexbox</a
     >
-
     <a
-      href="https://mdbootstrap.com/docs/standard/utilities/vertical-rule/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Vertical Rule</a
+      >spacing</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
     >
   </div>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/content-styles/images/"
-    >Bootstrap Images</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/content-styles/figures/index.html b/site/content/docs/standard/content-styles/figures/index.html
@@ -385,66 +385,41 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/textarea/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/fullscreen-background-image/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Textarea</a
+      >fullscreen background image</a
     >
-
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/text-center/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/text/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How To Center Text In Bootstrap</a
+      >text</a
     >
-
-    <!-- How to? -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/image-center/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How To Center Image</a
+      >spacing</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/utilities/text/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/ripple-effect/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Text Utilities</a
+      >ripple effect</a
     >
+    <!-- Extended docs -->
 
-    <!-- Main docs -->
-    <a
-      href="https://mdbootstrap.com/docs/standard/content-styles/typography/"
-      type="button"
-      data-te-ripple-init
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Typography</a
-    >
+    <!-- How to? -->
 
-    <a
-      href="https://mdbootstrap.com/docs/standard/content-styles/images/"
-      type="button"
-      data-te-ripple-init
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Images</a
-    >
+    <!-- Main docs -->
   </div>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/content-styles/images/"
-    >Bootstrap Images</a
-  >
-  from MDBootstrap.
-</p>