Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(docs): Update README Components links to new URL pattern #84

Merged
merged 2 commits into from
May 5, 2022
Merged

fix(docs): Update README Components links to new URL pattern #84

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
04f3b01
fix(docs): Update `README` Components links to new URL pattern
tulup-conner May 5, 2022
3fcfab0
chore(docs): Remove `Sidebar` under-construction status in `README`
tulup-conner May 5, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
78 changes: 39 additions & 39 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<div align="center">
<h1>:construction: flowbite-react (unreleased) :construction:</h1>
<p>
<a href="https://flowbite.com">
<a href="https://flowbite-react.com">
<img alt="Flowbite - Tailwind CSS components" width="350" src="https://flowbite.s3.amazonaws.com/github/logo-github.png">
</a>
</p>
Expand All @@ -18,7 +18,7 @@
<a href="https://badge.fury.io/js/flowbite-react">
<img alt="Latest release" src="https://badge.fury.io/js/flowbite-react.svg">
</a>
<a href="https://flowbite.com/docs/getting-started/license/">
<a href="https://flowbite.com/getting-started/license/">
<img src="https://img.shields.io/badge/license-MIT-blue" alt="Licenese">
</a>
</p>
Expand Down Expand Up @@ -50,7 +50,7 @@ Documentation for `flowbite-react` is not yet finished.

If you want to browse the components, visit [flowbite-react.com](https://flowbite-react.com/).

If you want to learn more about Flowbite, visit [Flowbite docs](https://flowbite.comhttps://flowbite.com/docs/getting-started/introduction/).
If you want to learn more about Flowbite, visit [Flowbite docs](https://flowbite.com/getting-started/introduction/).

## Getting started

Expand Down Expand Up @@ -86,17 +86,17 @@ module.exports = {
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/alerts/">
<a href="https://flowbite-react.com/alerts/">
<img alt="Tailwind CSS Alerts" src="https://flowbite.s3.amazonaws.com/github/alerts.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/badges/">
<a href="https://flowbite-react.com/badges/">
<img alt="Tailwind CSS Badge" src="https://flowbite.s3.amazonaws.com/github/badge.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/breadcrumb/">
<a href="https://flowbite-react.com/breadcrumb/">
<img alt="Tailwind CSS Breadcrumbs" src="https://flowbite.s3.amazonaws.com/github/breadcrumbs.jpg">
</a>
</td>
Expand All @@ -108,17 +108,17 @@ module.exports = {
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/buttons/">
<a href="https://flowbite-react.com/buttons/">
<img alt="Tailwind CSS Buttons" src="https://flowbite.s3.amazonaws.com/github/buttons.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/button-group/">
<a href="https://flowbite-react.com/button-group/">
<img alt="Tailwind CSS Button Group" src="https://flowbite.s3.amazonaws.com/github/button-group.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/card/">
<a href="https://flowbite-react.com/card/">
<img alt="Tailwind CSS Cards" src="https://flowbite.s3.amazonaws.com/github/cards.jpg">
</a>
</td>
Expand All @@ -130,17 +130,17 @@ module.exports = {
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/dropdown/">
<a href="https://flowbite-react.com/dropdown/">
<img alt="Tailwind CSS Dropdown" src="https://flowbite.s3.amazonaws.com/github/dropdown.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/forms/">
<a href="https://flowbite-react.com/forms/">
<img alt="Tailwind CSS Forms" src="https://flowbite.s3.amazonaws.com/github/forms.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/list-group/">
<a href="https://flowbite-react.com/list-group/">
<img alt="Tailwind CSS List group" src="https://flowbite.s3.amazonaws.com/github/list-group.jpg">
</a>
</td>
Expand All @@ -152,17 +152,17 @@ module.exports = {
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/typography/">
<a href="https://flowbite.com/typography/">
<img alt="Tailwind CSS Typography" src="https://flowbite.s3.amazonaws.com/github/typography.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/modal/">
<a href="https://flowbite-react.com/modal/">
<img alt="Tailwind CSS Modal" src="https://flowbite.s3.amazonaws.com/github/modal.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/tabs/">
<a href="https://flowbite-react.com/tabs/">
<img alt="Tailwind CSS Tabs" src="https://flowbite.s3.amazonaws.com/github/tabs.jpg">
</a>
</td>
Expand All @@ -174,17 +174,17 @@ module.exports = {
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/navbars/">
<a href="https://flowbite-react.com/navbars/">
<img alt="Tailwind CSS Navbar" src="https://flowbite.s3.amazonaws.com/github/navbar.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/pagination/">
<a href="https://flowbite-react.com/pagination/">
<img alt="Tailwind CSS Pagination" src="https://flowbite.s3.amazonaws.com/github/pagination.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/timeline/">
<a href="https://flowbite.com/timeline/">
<img alt="Tailwind CSS Timeline" src="https://flowbite.s3.amazonaws.com/github/timeline.jpg">
</a>
</td>
Expand All @@ -196,17 +196,17 @@ module.exports = {
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/progress/">
<a href="https://flowbite-react.com/progress/">
<img alt="Tailwind CSS Progress Bar" src="https://flowbite.s3.amazonaws.com/github/progress.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/tables/">
<a href="https://flowbite-react.com/tables/">
<img alt="Tailwind CSS Tables" src="https://flowbite.s3.amazonaws.com/github/tables.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/toast/">
<a href="https://flowbite-react.com/toast/">
<img alt="Tailwind CSS Toast" src="https://flowbite.s3.amazonaws.com/github/toast.jpg">
</a>
</td>
Expand All @@ -218,39 +218,39 @@ module.exports = {
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/tooltips/">
<a href="https://flowbite-react.com/tooltips/">
<img alt="Tailwind CSS Tooltips" src="https://flowbite.s3.amazonaws.com/github/tooltips.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite.com/docs/plugins/datepicker/">
<a href="https://flowbite.com/plugins/datepicker/">
<img alt="Tailwind CSS Datepicker" src="https://flowbite.s3.amazonaws.com/github/datepicker.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/spinner/">
<a href="https://flowbite-react.com/spinners/">
<img alt="Tailwind CSS Spinner" src="https://flowbite.s3.amazonaws.com/github/spinner.jpg">
</a>
</td>
</tr>
<tr>
<td width="33.3333%">:construction: Footer</td>
<td width="33.3333%">Accordion</td>
<td width="33.3333%">:construction: Sidebar</td>
<td width="33.3333%">Sidebar</td>
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/footer/">
<a href="https://flowbite.com/footer/">
<img alt="Tailwind CSS Footer" src="https://flowbite.s3.amazonaws.com/github/footer.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/accordion/">
<a href="https://flowbite-react.com/accordion/">
<img alt="Tailwind CSS Accordion" src="https://flowbite.s3.amazonaws.com/github/accordion.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/sidebar/">
<a href="https://flowbite-react.com/sidebar/">
<img alt="Tailwind CSS Sidebar" src="https://flowbite.s3.amazonaws.com/github/sidebar.jpg">
</a>
</td>
Expand All @@ -262,17 +262,17 @@ module.exports = {
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/carousel/">
<a href="https://flowbite-react.com/carousel/">
<img alt="Tailwind CSS Carousel" src="https://flowbite.s3.amazonaws.com/github/carousel.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/avatar/">
<a href="https://flowbite-react.com/avatar/">
<img alt="Tailwind CSS Avatar" src="https://flowbite.s3.amazonaws.com/github/avatar.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite-react.com/#/rating/">
<a href="https://flowbite-react.com/rating/">
<img alt="Tailwind CSS Rating" src="https://flowbite.s3.amazonaws.com/github/rating.jpg">
</a>
</td>
Expand All @@ -284,12 +284,12 @@ module.exports = {
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite.com/docs/forms/input-field/">
<a href="https://flowbite-react.com/forms">
<img alt="Tailwind CSS Input Field" src="https://flowbite.s3.amazonaws.com/github/input-field.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite.com/docs/forms/file-input/">
<a href="https://flowbite-react.com/forms#fileUpload">
<img alt="Tailwind CSS File Input" src="https://flowbite.s3.amazonaws.com/github/file-input.jpg">
</a>
</td>
Expand All @@ -306,17 +306,17 @@ module.exports = {
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite.com/docs/forms/select/">
<a href="https://flowbite-react.com/forms#select">
<img alt="Tailwind CSS Select" src="https://flowbite.s3.amazonaws.com/github/select.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite.com/docs/forms/textarea/">
<a href="https://flowbite-react.com/forms#textarea">
<img alt="Tailwind CSS Textarea" src="https://flowbite.s3.amazonaws.com/github/textarea.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite.com/docs/forms/checkbox/">
<a href="https://flowbite-react.com/forms#checkbox">
<img alt="Tailwind CSS Checkbox" src="https://flowbite.s3.amazonaws.com/github/checkbox.jpg">
</a>
</td>
Expand All @@ -328,12 +328,12 @@ module.exports = {
</tr>
<tr>
<td width="33.3333%">
<a href="https://flowbite.com/docs/forms/radio/">
<a href="https://flowbite-react.com/forms#radio">
<img alt="Tailwind CSS Radio" src="https://flowbite.s3.amazonaws.com/github/radio.jpg">
</a>
</td>
<td width="33.3333%">
<a href="https://flowbite.com/docs/forms/toggle/">
<a href="https://flowbite-react.com/forms#toggle">
<img alt="Tailwind CSS Toggle" src="https://flowbite.s3.amazonaws.com/github/toggle.jpg">
</a>
</td>
Expand Down Expand Up @@ -379,4 +379,4 @@ If you need the Figma files for the components you can check out our website for

The Flowbite name and logos are trademarks of Crafty Dwarf Inc.

📝 [Read about the licensing terms](https://flowbite.com/docs/getting-started/license/)
📝 [Read about the licensing terms](https://flowbite.com/getting-started/license/)
12 changes: 6 additions & 6 deletions src/docs/pages/FormsPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -188,7 +188,7 @@ const FormsPage: FC = () => {
{
title: 'Textarea',
code: (
<div>
<div id="textarea">
<Label className="mb-2 block" htmlFor="comment">
Your message
</Label>
Expand All @@ -199,7 +199,7 @@ const FormsPage: FC = () => {
{
title: 'Select input',
code: (
<div>
<div id="select">
<Label className="mb-2 block" htmlFor="countries">
Select your country
</Label>
Expand All @@ -215,7 +215,7 @@ const FormsPage: FC = () => {
{
title: 'Checkbox',
code: (
<div className="flex flex-col gap-4">
<div className="flex flex-col gap-4" id="checkbox">
<div className="flex items-center gap-2">
<Checkbox id="accept" defaultChecked />
<Label htmlFor="accept">
Expand Down Expand Up @@ -259,7 +259,7 @@ const FormsPage: FC = () => {
{
title: 'Radio',
code: (
<fieldset className="flex flex-col gap-4">
<fieldset className="flex flex-col gap-4" id="radio">
<div className="flex items-center gap-2">
<Radio id="united-state" name="countries" value="USA" defaultChecked />
<Label htmlFor="united-state">United States</Label>
Expand Down Expand Up @@ -288,7 +288,7 @@ const FormsPage: FC = () => {
{
title: 'File upload',
code: (
<div>
<div id="fileUpload">
<Label className="mb-2 block" htmlFor="file">
Upload file
</Label>
Expand All @@ -299,7 +299,7 @@ const FormsPage: FC = () => {
{
title: 'Toggle Switch',
code: (
<div className="flex flex-col gap-4">
<div className="flex flex-col gap-4" id="toggle">
<ToggleSwitch label="Toggle me" />
<ToggleSwitch label="Toggle me (checked)" defaultChecked />
<ToggleSwitch label="Toggle me (disabled)" disabled />
Expand Down