-
Notifications
You must be signed in to change notification settings - Fork 2.5k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
8 changed files
with
2,245 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#api-section-import">Import</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#api-section-properties">Properties</a> | ||
| <ul class="nav flex-column pl-3"> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#subsection-button">MDBBtn</a> | ||
| </li> | ||
| </ul> | ||
| </li> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,190 @@ | ||
| <!--Section: API content--> | ||
| <section> | ||
| <!--Section: Introduction--> | ||
| <section id="section-introduction"> | ||
| <!-- Main title --> | ||
| <h2 class="h1 font-weight-bold"> | ||
| <?= $data_var['main_title']; ?> | ||
| - API | ||
| </h2> | ||
| </section> | ||
| <!--Section: Introduction--> | ||
|
|
||
| <hr class="my-5" /> | ||
|
|
||
| <!--Section: Import--> | ||
| <section id="api-section-import"> | ||
| <!-- Section title --> | ||
| <h2 class="mb-4">Import</h2> | ||
|
|
||
| <!-- prettier-ignore --> | ||
| <mdbsnippet> | ||
| <code data-lang="js" data-name="JavaScript"> | ||
| import { MDBBtn } from 'mdb-react-ui-kit'; | ||
| </code> | ||
| </mdbsnippet> | ||
| </section> | ||
| <!--Section: Import--> | ||
|
|
||
| <hr class="my-5" /> | ||
|
|
||
| <!--Section: Properties--> | ||
| <section id="api-section-properties"> | ||
| <!-- Section title --> | ||
| <h2 class="mb-4">Properties</h2> | ||
|
|
||
| <!-- Subsection MDBBtn --> | ||
| <section id="subsection-button" class="mb-4"> | ||
| <h2 class="h4 mb-4">MDBBtn</h2> | ||
| <div class="table-responsive"> | ||
| <table class="table table-striped table-bordered"> | ||
| <thead> | ||
| <tr> | ||
| <th class="th-sm">Name</th> | ||
| <th class="th-sm">Type</th> | ||
| <th class="th-sm">Default</th> | ||
| <th class="th-sm">Description</th> | ||
| <th class="th-sm">Example</th> | ||
| </tr> | ||
| </thead> | ||
| <tbody> | ||
| <tr> | ||
| <td class="text-nowrap"> | ||
| <code class="highlighter-rouge">tag</code> | ||
| </td> | ||
| <td><i>String</i></td> | ||
| <td><code>'nav'</code></td> | ||
| <td>Defines tag of the <code>MDBBtn</code> element</td> | ||
| <td> | ||
| <code class="language-markup text-nowrap" | ||
| ><MDBBtn tag="section" /></code | ||
| > | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td class="text-nowrap"> | ||
| <code class="highlighter-rouge">color</code> | ||
| </td> | ||
| <td><i>String</i></td> | ||
| <td><code>'primary'</code></td> | ||
| <td> | ||
| Defines the color of the MDBBtn element. You can set it to "none" if you want a | ||
| transparent button | ||
| </td> | ||
| <td> | ||
| <code class="language-markup text-nowrap" | ||
| ><MDBBreadcrumb color="secondary" /></code | ||
| > | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td class="text-nowrap"> | ||
| <code class="highlighter-rouge">className</code> | ||
| </td> | ||
| <td><i>String</i></td> | ||
| <td><code>''</code></td> | ||
| <td>Add custom class to MDBBtn</td> | ||
| <td> | ||
| <code class="language-markup text-nowrap"><MDBBtn className="class" /></code> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td class="text-nowrap"> | ||
| <code class="highlighter-rouge">outline</code> | ||
| </td> | ||
| <td><i>Boolean</i></td> | ||
| <td><code>false</code></td> | ||
| <td>Removes a background color or images from MDBBtn element</td> | ||
| <td> | ||
| <code class="language-markup text-nowrap"><MDBBtn outline /></code> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td class="text-nowrap"> | ||
| <code class="highlighter-rouge">rounded</code> | ||
| </td> | ||
| <td><i>Boolean</i></td> | ||
| <td><code>false</code></td> | ||
| <td>Makes a rounded MDBBtn element</td> | ||
| <td> | ||
| <code class="language-markup text-nowrap"><MDBBtn rounded /></code> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td class="text-nowrap"> | ||
| <code class="highlighter-rouge">disabled</code> | ||
| </td> | ||
| <td><i>Boolean</i></td> | ||
| <td><code>false</code></td> | ||
| <td> | ||
| Adds <code>disabled</code> attribute or a <code>.disabled</code> className to the | ||
| MDBBtn element | ||
| </td> | ||
| <td> | ||
| <code class="language-markup text-nowrap"><MDBBtn disabled /></code> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td class="text-nowrap"> | ||
| <code class="highlighter-rouge">floating</code> | ||
| </td> | ||
| <td><i>Boolean</i></td> | ||
| <td><code>false</code></td> | ||
| <td>Makes a circle button</td> | ||
| <td> | ||
| <code class="language-markup text-nowrap"><MDBBtn floating /></code> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td class="text-nowrap"> | ||
| <code class="highlighter-rouge">size</code> | ||
| </td> | ||
| <td><i>String</i></td> | ||
| <td><code>''</code></td> | ||
| <td>Sets the size of the button</td> | ||
| <td> | ||
| <code class="language-markup text-nowrap"><MDBBtn size="lg" /></code> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td class="text-nowrap"> | ||
| <code class="highlighter-rouge">block</code> | ||
| </td> | ||
| <td><i>Boolean</i></td> | ||
| <td><code>false</code></td> | ||
| <td>Makes a button with a <code>display: block;</code> style</td> | ||
| <td> | ||
| <code class="language-markup text-nowrap"><MDBBtn block /></code> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td class="text-nowrap"> | ||
| <code class="highlighter-rouge">active</code> | ||
| </td> | ||
| <td><i>Boolean</i></td> | ||
| <td><code>false</code></td> | ||
| <td>Makes a button active</td> | ||
| <td> | ||
| <code class="language-markup text-nowrap"><MDBBtn active /></code> | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td class="text-nowrap"> | ||
| <code class="highlighter-rouge">toggle</code> | ||
| </td> | ||
| <td><i>Boolean</i></td> | ||
| <td><code>false</code></td> | ||
| <td>Enables changing button state by click</td> | ||
| <td> | ||
| <code class="language-markup text-nowrap"><MDBBtn toggle /></code> | ||
| </td> | ||
| </tr> | ||
| </tbody> | ||
| </table> | ||
| </div> | ||
| </section> | ||
| <!-- Subsection MDBBtn --> | ||
| </section> | ||
| <!--Section: Properties--> | ||
| </section> | ||
| <!--Section: API content--> |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| <?php | ||
| global $data_var; | ||
| $data_var = array( | ||
| 'main_title' => 'Buttons', | ||
| 'seo_title' => 'React Buttons - Bootstrap 5 & Material Design 2.0 component', | ||
| 'description' => 'Buttons built with the latest Bootstrap 5 & Material Design 2.0. Multiple examples, a user-friendly guide, extensive API, and customization tools', | ||
| 'url' => 'https://mdbootstrap.com/docs/b5/react/components/buttons/', | ||
| 'image' => 'https://mdbootstrap.com/wp-content/themes/mdbootstrap4/content-gh/en/_mdb5/react/web/docs/components/buttons/buttons.jpg', | ||
| 'video' => 'https://www.youtube.com/watch?v=c9B4TPnak1A', | ||
| ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| <script></script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,59 @@ | ||
| <li class="nav-item"> | ||
| <a class="nav-link active" href="#section-introduction">Introduction</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-basic-example">Basic example</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-colors">Colors</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-outline">Outline</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-rounded">Rounded</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-rounded-outline">Rounded outline</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-floating">Floating</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-social">Social</a> | ||
| <ul class="nav flex-column ps-3"> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#subsection-sample-brands">Sample brands</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#subsection-floating-social">Floating social</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#subsection-text">Text</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#subsection-only-icon">Only icon</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#subsection-notifications">Notifications</a> | ||
| </li> | ||
| </ul> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-tags">Tags</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-sizes">Sizes</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-active-state">Active state</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-disabled-state">Disabled state</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-block-buttons">Block buttons</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link" href="#section-toggle-states">Toggle states</a> | ||
| </li> |
Oops, something went wrong.