Docs update (#1502)

* Front page seo data update * Front page - remove old commented section * Add tw-starter.zip * SEO data updates * Remove tw-starter * Add parameter to js script to force reload * Getting started guide update * Add docs install & docs start scripts * Update contact form mail data * Animation docs: added examples to tailwind config (#1391) * Changelog - add milestone progress section * Changelog design update * Changelog - add condition if date is not set for milestone * Changelog - fix issue with multiple milestones filtering * Changelog - add placeholders to milestone progress * Add community link to navbar * Add meta data for Bing * Fix button background overwrite issue in te-starter * Newsletter page (#1385) * Footer: added newsletter redirect * Template: added conditional for remove margin * Added newsletter page * Newsletter: added reponsive * Newsletter: changed host for images * Newsletter: fixes after CR * Footer: standardized * Add newsletter to converkit * Add missing class * Remove class for form * Newsletter: visal improvements on mobile --------- Co-authored-by: unknown <a.jakubowski@mdbootstrap.com> * Remove starter creation from main build * CDN guide config update * Restore plugin creation on build temporarily * Getting started - update js file import * Prism - remove on mobiles (#1403) * Prism - dark mode design update (#1409) * Fix dark mode on license page (#1417) * Code snippets - add option to show on mobile * update sharing alert on accordion page (#1425) * add sharing alert to accordion page * Add accordion to nav / add tooltip init to footer --------- Co-authored-by: Bartosz Cylwik <bartosz.cylwik94@gmail.com> * Add new main page image * Prism - sync design with MDB (#1416) * Prism - sync design with MDB * Making corrections #1 * Update meta tags in documentation pages (#1447) * Update main image (#1465) * add meta tags updates * Remove doctype declaration from svg example (#1411) * Add subheadings to docs pages (#1467) * Smooth scroll: added to docs (#1402) * Scrollspy: added smooth scroll * Added actual smooth scroll * Scrollspy: fixed naming after CR * Getting started scrollspy: fixed typo * Smooth scrollspy: fixed offset * Forms dark theme (#1404) * Fix forms for dark mode * remove unnecessary file * Add fixed forms to the documentation * Fix changelog release deadline month number * Prism - add terminal integration with $ sign (#1442) * Tooltips / Popover - add js init code to snippets (#1451) * Fix overlapping stepper content (#1452) * Alert: update show/hide methods (#1456) * Datepicker - fix cell colors in darkmode (#1460) * Update tutorials layout (#1462) * Docs learn section - remove shadow from prev btn * First changes in extanded docs (#1476) Co-authored-by: Piotr Gusciora <pgusciora@mdbootstrap.com> * Upgrade share alert (#1477) * Update main image * upgrade share alert * Contributing guide (#1483) * Added contributing guide * Added CONTRIBUTE.md file * Update components image (#1481) * Update main image * update components image * Add ARV waiting list pages (#1482) * Add Tailwind Elements with ARV waiting lists pages * Add fixes to icons * Add changes to frontPage * fix links --------- Co-authored-by: unknown <a.jakubowski@mdbootstrap.com> * ARV waiting lists update * Add new share option to tutorials pages (#1485) * Add new share option to tuorials pages * Change placement * Add fixes after cr --------- Co-authored-by: unknown <a.jakubowski@mdbootstrap.com> * Coming soon section update * Add design blocks subpages to sidenav * Design blocks - front matter update * Fix placement on smaller screens * Fix image format (#1487) * Update main image * fix image format * delete image Signed-off-by: Mateusz <m.leciejewski@mdbootstrap.com> * add image Signed-off-by: Mateusz <m.leciejewski@mdbootstrap.com> --------- Signed-off-by: Mateusz <m.leciejewski@mdbootstrap.com> Co-authored-by: Mikolaj Smolenski <smolenski.mikolaj@gmail.com> * First changes in extanded docs (#1498) Co-authored-by: Piotr Gusciora <pgusciora@mdbootstrap.com> * Search - focus first item after typing (#1499) * Search - focus first item after typing * Search: fix selecting next element in dropdown * First extended docs (#1500) * First changes in extanded docs * ADD first 9 extended docs --------- Co-authored-by: Piotr Gusciora <pgusciora@mdbootstrap.com> * License: fixed footer (#1492) * Update contribute guide (#1488) * update contribute guide * add changes to contribute page * fix menu link * add contribute file contents --------- Signed-off-by: Mateusz <m.leciejewski@mdbootstrap.com> Co-authored-by: Marta Szymanska <m.szymanska@mdbootstrap.com> Co-authored-by: Mateusz <43219043+Trochonovitz@users.noreply.github.com> Co-authored-by: unknown <a.jakubowski@mdbootstrap.com> Co-authored-by: iprzybysz <108793661+iprzybysz@users.noreply.github.com> Co-authored-by: filipkappa <f.kapusta@mdbootstrap.com> Co-authored-by: Bartosz Cylwik <bartosz.cylwik94@gmail.com> Co-authored-by: Mateusz <m.leciejewski@mdbootstrap.com> Co-authored-by: Paul J. Martinez <paul@flickerbox.com> Co-authored-by: Bartosz Cylwik <52455076+juujisai@users.noreply.github.com> Co-authored-by: Piotr Guściora <110597064+PiotrGusciora@users.noreply.github.com> Co-authored-by: Piotr Gusciora <pgusciora@mdbootstrap.com> Co-authored-by: Adam Jakubowski <adamjakubowski.erazmus@gmail.com>
mdbootstrap · Mar 21, 2023 · 381feb9 · 381feb9
1 parent 7617694
commit 381feb9
Show file tree

Hide file tree

Showing 189 changed files with 24,523 additions and 2,513 deletions.
diff --git a/CONTRIBUTE.md b/CONTRIBUTE.md
@@ -0,0 +1,141 @@
+# Contribute
+
+Tailwind Elements is a community-driven, open source project. We welcome your support & contributions.
+
+---
+
+- [Start here](#start-here)
+  - [Start with sharing your feedback](#start-with-sharing-your-feedback)
+  - [Vote on the roadmap](#vote-on-the-roadmap)
+  - [Spread the word](#spread-the-word)
+- [Help us improve](#help-us-improve)
+  - [Propose new features](#propose-new-features)
+  - [Report bugs](#report-bugs)
+  - [Ask questions](#ask-questions)
+  - [Help others](#help-others)
+- [Open a Pull Request](#open-a-pull-request)
+  - [Package contributions](#package-contributions)
+  - [Documentation contributions](#documentation-contributions)
+
+---
+
+## Start here
+
+There is a few very basic ways you can support the project, even if you don't have the time to contribute code.
+
+### Start with sharing your feedback
+
+The easiest way to contribute is to simply share your thoughts on the project :)
+
+**[GIVE FEEDBACK ❤️](https://github.com/mdbootstrap/Tailwind-Elements/discussions/categories/kind-words-general-feedback)**
+
+### Vote on the roadmap
+
+Help the core team make **crucial decisions** regarding Tailwind Elements development.
+
+You can have a real impact on the future of this project!
+
+**[VOTE NOW 🗳](https://github.com/mdbootstrap/Tailwind-Elements/discussions/categories/vote-in-polls)**
+
+### Spread the word
+
+Another great way to support the project is to **share it with your friends** & work colleagues. Every share counts, thank you!
+
+- [Share via Dev.to](<https://dev.to/new?prefill=---%0Atitle%3A%20500+%20open-source%20components%20for%20TailwindCSS%20%0Apublished%3A%20true%0Atags%3Atailwindcss%0A---%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20[![Tailwind%20components](https://tailwind-elements.com/img/components-big.jpg)](https://tailwind-elements.com/)%20%20%20%20%20%20%20%20\n%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20I%27d%20like%20to%20share%20my%20latest%20discovery%20with%20you.%20\n%20%20%20%20%20%20%20%20[Tailwind%20Elements](https://tailwind-elements.com/)%20is%20currently,%20the%20most%20popular%203rd%20party%20UI%20kit%20for%20TailwindCSS%20with%20over%2010k%20Github%20stars.%20%20%20%20%20%20%20%20[![GitHub%20Repo%20stars](https://img.shields.io/github/stars/mdbootstrap/tailwind-elements?style=social)](https://github.com/mdbootstrap/Tailwind-Elements/)%20%20%20%20%20%20%20%20It%27s%20a%20**huge%20collection%20of%20stunning%20components**%20made%20with%20attention%20to%20the%20smallest%20detail.%20%20%20%20%20%20%20%20%20Forms,%20cards,%20buttons,%20and%20hundreds%20of%20others.%20%20%20%20%20%20%20%20%20All%20components%20have%20**dark%20mode**%20and%20very%20intuitive%20**theming%20options**.%20%20%20%20%20%20%20%20The%20project%20is%20supported%20by%20an%20[engaged%20community%20on%20GitHub](https://github.com/mdbootstrap/Tailwind-Elements/discussions),%20I%20recommend%20you%20check%20it%20out%20and%20join%20one%20of%20the%20many%20discussions.%20%20%20%20%20%20%20%20\n%20%20%20%20%20%20%20%20You%20will%20find%20installation%20instructions%20[here](https://tailwind-elements.com/docs/getting-started/installation),%20and%20you%20can%20track%20the%20progress%20of%20the%20project%20live%20%20%20%20%20%20%20%20%20[here](https://tailwind-elements.com/docs/standard/getting-started/changelog/).%20%20%20%20%20%20%20%20\n%20%20%20%20%20%20%20%20The%20project%20was%20kickstarted%20by%20@MDBootstrap,%20a%20group%20of%20open-source%20developers%20behind%20[MDB%20UI%20Kit](https://github.com/mdbootstrap/mdb-ui-kit)%20-%20a%20high-quality%20UI%20kit%20for%20Bootstrap,%20and%20also%20behind%20[MDB%20GO](https://mdbgo.com/)%20-%20hosting%20and%20deployment%20platform.%20%20%20%20%20%20%20%20\n%20%20%20%20%20%20%20%20I%20highly%20recommend%20you%20to%20check%20it%20out!%20%20%20%20%20%20%20%20\n%20%20%20%20%20%20%20%20%7B%25%20link%20mdbootstrap/tailwind-elements-breakthrough-version-is-here-59hh%20%25%7D%20%20%20%20%20%20%20%20\n>)
+- [Share via Twitter](https://twitter.com/intent/tweet?text=500%2B%20open-source%20components%20for%20%23TailwindCSS%20%F0%9F%A4%A9%0Ahttps%3A//tailwind-elements.com/%0A%0ACongrats%20%40MDBootstrap%20%40ascensus_mdb%20%40dawidadach%20for%20this%20awesome%20design%20collection!%0A%0AI%20will%20keep%20using%20it%20in%20my%20projects%20for%20sure!%0A%0A%23uiux%20%23webdevelopment%20%23HTML%20%23CSS%20%23design%20%23Webdesign%20%23programming%20)
+- [Share via Facebook](https://www.facebook.com/sharer/sharer.php?u=https%3A//tailwind-elements.com)
+- [Share via LinkedIn](http://www.linkedin.com/shareArticle?url=https%3A%2F%2Ftailwind-elements.com%2F&title=500%2B%20open-source%20components%20for%20TailwindCSS)
+- [Share via Pinterest](https://www.pinterest.com/pin/create/button?url=https://tailwind-elements.com/&media=https://tailwind-elements.com/img/components-big.jpg&description=TailwindElements)
+- [Share via Reddit](https://reddit.com/submit?url=https://tailwind-elements.com/&title=500+%20open-source%20components%20for%20TailwindCSS)
+- [Share via StumbleUpon](https://www.stumbleupon.com/submit?url=https://tailwind-elements.com/&title=500+%20open-source%20components%20for%20TailwindCSS)
+- [Share via Vkontakte](https://vk.com/share.php?url=https://tailwind-elements.com/)
+- [Share via Weibo](https://service.weibo.com/share/share.php?url=https://tailwind-elements.com/&title=500+%20open-source%20components%20for%20TailwindCSS)
+- [Share via Hackernews](https://news.ycombinator.com/submitlink?u=https://tailwind-elements.com/&t=500+%20open-source%20components%20for%20TailwindCSS)
+- [Share via Gmail](https://mail.google.com/mail/?view=cm&to=%7Bemail_address%7D&su=Check%20out%20this%20project&body=Hello,%0AI%27m%20reaching%20out%20to%20recommend%20my%20latest%20discovery.%0A%0AIt%27s%20over%20500+%20open-source%20components%20for%20TailwindCSS%20with%20excellent%20support%20and%20an%20awesome%20community:%0Ahttps://tailwind-elements.com/%0A%0AI%20hope%20you%20will%20find%20it%20useful.%0ABest%20regards,&bcc=%7Bemail_address%7D&cc=%7Bemail_address%7D)
+- [Share via email](mailto:?subject=Check%20out%20this%20project&body=Hello%2C%0AI'm%20reaching%20out%20to%20recommend%20my%20latest%20discovery.%0A%0AIt's%20over%20500%20%20open-source%20components%20for%20Tailwind%20CSS%20with%20excellent%20support%20and%20an%20awesome%20community%3A%0Ahttps%3A%2F%2Ftailwind-elements.com%2F%0A%0AI%20hope%20you%20will%20find%20it%20useful.%0ABest%20regards%2C)
+
+---
+
+## Help us improve
+
+Here is a few ways you could help us make the project better.
+
+### Propose new features
+
+To propose a new feature or some other cool idea, post it on our feature request board.
+
+It allows users to upvote the best ideas & helps the core team prioritize the requests.
+
+**[REQUEST A FEATURE 💡](https://github.com/mdbootstrap/Tailwind-Elements/discussions/categories/share-ideas-request-features)**
+
+### Report bugs
+
+If you found a bug & don't know how to fix it, let us know!
+
+The best way to do this is by creating an issue in our repository and describing wrong behavior of component (or whatever buggy you saw).
+
+**[CREATE ISSUE 🐛](https://github.com/mdbootstrap/Tailwind-Elements/issues)**
+
+### Ask questions
+
+Not sure how to achieve something specific? Or maybe you need someone to explain something in more detail?
+
+If you just can't figure something out, but it's not exactly a bug, make sure to ask for help from our community.
+
+**[ASK COMMUNITY 🙋](https://github.com/mdbootstrap/Tailwind-Elements/discussions/categories/support-from-community)**
+
+### Help others
+
+One of the best ways to support the project is to **find an issue or a question that you are able to help with**.
+
+Important: if someone is assigned to an issue, it means that they are already working on it, find another one ;)
+
+**[SEE SUPPORT QUESTIONS 🙋](https://github.com/mdbootstrap/Tailwind-Elements/discussions/categories/support-from-community)**
+
+**[SEE ISSUES 🐛](https://github.com/mdbootstrap/Tailwind-Elements/issues)**
+
+---
+
+## Open a Pull Request
+
+**Ask first** before starting work on any significant new features. It's never a fun experience to have your pull request declined after investing a lot of time and effort. To avoid this from happening, we ask you to **create an issue or a feature request first**, to discuss any significant new features.
+
+**Keep your pull requests small** to give a PR the best chance of getting accepted. Don't bundle more than one feature or bug fix per pull request. It's always best to create two smaller PRs than one big one.
+
+### Package contributions
+
+- Fork our repository
+- The latest dev version of the package is always published on the active branch, named after the version, i.e. `v1.0.0-beta2`.
+- In most cases you should start by switching to the active branch, and creating your own branch from it.
+- Open the forked repo and run `npm install` in the root of the project
+- Run `npm start` in the root of the project to start a demo for testing
+- Prepare your changes. You should add them in one of the following directories:
+  - `./src/js/` - source JavaScript
+  - `./src/scss/` - source SCSS
+  - `./src/js/plugin.js` - plugin customization options
+  - `./demo/` - demo HTML pages
+- After making changes, issue a Pull Request to the active branch.
+- We work on feature branches, so it's **1 branch per feature** / per fix, which also means **1 PR per feature** / per fix.
+- The name of the branch should be a descriptive name of the feature that it introduces, in **kebab case**. For example: `fix-input-dark-mode`.
+- Name of the Pull Request consistent with the name of the branch. For example: `Fix input dark mode`.
+
+**[SUMBIT A PULL REQUEST 💪](https://github.com/mdbootstrap/Tailwind-Elements/pulls)**
+
+### Documentation contributions
+
+- Fork our repository
+- The latest docs version is always published on the docs branch, simply named `docs`.
+- In most cases you should start by switching to the docs branch, and creating your own branch from it.
+- Open the forked repo and run `npm run docs:install` in the root of the project
+- Run `npm run docs:start` in the root of the project to start a demo for testing
+- Prepare your changes. You should add them in one of the following directories:
+  - `./site/content/docs/standard/` - documentation pages
+  - `./site/layouts/docs/` - documentation templates
+- After making changes, create a Pull Request to the `docs` branch.
+- We work on feature branches, so it's **1 branch per feature\* / per fix, which also means **1 PR per feature\*\* / per fix.
+- The name of the branch should be a descriptive name of the feature that it introduces, in kebab case. For example: `fix-typo-in-datepicker`.
+- Name of the Pull Request consistent with the name of the branch. For example: `Fix typo in Datepicker documentation`.
+
+**[SUMBIT A PULL REQUEST 💪](https://github.com/mdbootstrap/Tailwind-Elements/pulls)**
+
+In case you have any questions about contributions you can ask at tailwind@mdbootstrap.com
diff --git a/README.md b/README.md
@@ -685,7 +685,7 @@ module.exports = {
 Alternatively, you can import it in the following way (bundler version):
 
 ```
-import 'tw-elements';
+import * as te from 'tw-elements';
 ```
 
 ##### MDB GO / CLI
@@ -740,14 +740,18 @@ Add the stylesheet files below in the _head_ section:
 <script src="https://cdn.tailwindcss.com"></script>
 <script>
   tailwind.config = {
+    darkMode: "class",
     theme: {
-      extend: {
-        fontFamily: {
-          sans: ['Roboto', 'sans-serif'],
-        },
-      }
-    }
-  }
+      fontFamily: {
+        sans: ["Roboto", "sans-serif"],
+        body: ["Roboto", "sans-serif"],
+        mono: ["ui-monospace", "monospace"],
+      },
+    },
+    corePlugins: {
+      preflight: false,
+    },
+  };
 </script>
 ```
 

diff --git a/demo/sites/components/stepper.html b/demo/sites/components/stepper.html
@@ -40,7 +40,7 @@
           class="w-[4.5rem] flex-auto">
           <div
             data-te-stepper-head-ref
-            class="after:w-100 flex cursor-pointer items-center pl-2 leading-[1.3rem] no-underline after:ml-2 after:h-px after:flex-1 after:bg-[#0000001a] after:content-[''] hover:bg-[#dbdbdb] focus:outline-none dark:hover:bg-neutral-600">
+            class="flex cursor-pointer items-center pl-2 leading-[1.3rem] no-underline after:ml-2 after:h-px after:w-full after:flex-1 after:bg-[#0000001a] after:content-[''] hover:bg-[#dbdbdb] focus:outline-none dark:hover:bg-neutral-600">
             <span
               data-te-stepper-head-icon-ref
               class="my-6 mx-2 flex h-6 w-6 items-center justify-center rounded-full bg-neutral-500 text-sm text-white">
@@ -54,15 +54,15 @@
           </div>
           <div
             data-te-stepper-content-ref
-            class="w-100 absolute p-4 transition-all duration-500 ease-in-out">
+            class="absolute w-full p-4 transition-all duration-500 ease-in-out">
             Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
             eiusmod tempor incididunt ut labore et dolore magna aliqua.
           </div>
         </li>
         <li data-te-stepper-step-ref class="w-[4.5rem] flex-auto">
           <div
             data-te-stepper-head-ref
-            class="before:w-100 after:w-100 flex cursor-pointer items-center leading-[1.3rem] no-underline before:mr-2 before:h-px before:flex-1 before:bg-[#0000001a] before:content-[''] after:ml-2 after:h-px after:flex-1 after:bg-[#0000001a] after:content-[''] hover:bg-[#dbdbdb] focus:outline-none dark:hover:bg-neutral-600">
+            class="flex cursor-pointer items-center leading-[1.3rem] no-underline before:mr-2 before:h-px before:w-full before:flex-1 before:bg-[#0000001a] before:content-[''] after:ml-2 after:h-px after:w-full after:flex-1 after:bg-[#0000001a] after:content-[''] hover:bg-[#dbdbdb] focus:outline-none dark:hover:bg-neutral-600">
             <span
               data-te-stepper-head-icon-ref
               class="my-6 mx-2 flex h-6 w-6 items-center justify-center rounded-full bg-neutral-500 text-sm text-white">
@@ -76,15 +76,15 @@
           </div>
           <div
             data-te-stepper-content-ref
-            class="w-100 absolute left-0 translate-x-[150%] p-4 transition-all duration-500 ease-in-out">
+            class="absolute left-0 w-full translate-x-[150%] p-4 transition-all duration-500 ease-in-out">
             Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
             nisi ut aliquip ex ea commodo consequat.
           </div>
         </li>
         <li data-te-stepper-step-ref class="w-[4.5rem] flex-auto">
           <div
             data-te-stepper-head-ref
-            class="before:w-100 flex cursor-pointer items-center pr-2 leading-[1.3rem] no-underline before:mr-2 before:h-px before:flex-1 before:bg-[#0000001a] before:content-[''] hover:bg-[#dbdbdb] focus:outline-none dark:hover:bg-neutral-600">
+            class="flex cursor-pointer items-center pr-2 leading-[1.3rem] no-underline before:mr-2 before:h-px before:w-full before:flex-1 before:bg-[#0000001a] before:content-[''] hover:bg-[#dbdbdb] focus:outline-none dark:hover:bg-neutral-600">
             <span
               data-te-stepper-head-icon-ref
               class="my-6 mx-2 flex h-6 w-6 items-center justify-center rounded-full bg-neutral-500 text-sm text-white">
@@ -98,7 +98,7 @@
           </div>
           <div
             data-te-stepper-content-ref
-            class="w-100 absolute left-0 translate-x-[150%] p-4 transition-all duration-500 ease-in-out">
+            class="absolute left-0 w-full translate-x-[150%] p-4 transition-all duration-500 ease-in-out">
             Duis aute irure dolor in reprehenderit in voluptate velit esse
             cillum dolore eu fugiat nulla pariatur.
           </div>