Repository: mmgalushka/bootwrap

Issue:
Make spacing more efficient
**Bootstrap** includes a wide range of shorthand responsive margin and padding utility classes to modify an element’s appearance which is presented [here](https://getbootstrap.com/docs/4.0/utilities/spacing/).

In the current implementation margin and padding utility classes can be introduced via method `add classes(...)` if a web component inherits the class `ClassMixin`. Such implementation often leads to the very "wordy"  code. For example:

```Python
button = Button("Hello World!").add_classes("ml-3")
```

A much nicer solution would be to replace **Bootstrap** spacing classes with dedicated methods. For example:

```Python
button = Button("Hello World!").ml(3)
```

These methods should be mimic the **Bootstrap** convention:

```Python
{property}{sides}({size})
```

The following methods should be added to the class `ClassMixin` for margin:
| Method    | Description        |
|:-------------|:----------------------|
| m(size)   | for classes that set margin for four sides *-left, *-right, *-top and *-bottom |
| mt(size)   | for classes that set margin-top |
| mb(size)   | for classes that set margin-bottom |
| ml(size)   | for classes that set margin-left |
| mr(size)   | for classes that set margin-right |
| mx(size)   | for classes that set margin both *-left and *-right |
| my(size)   | for classes that set margin both *-top and *-bottom |

The following methods should be added to the class `ClassMixin` for padding:
| Method    | Description        |
|:-------------|:----------------------|
| p(size)   | for classes that set padding for four sides *-left, *-right, *-top and *-bottom |
| pt(size)   | for classes that set padding-top |
| pb(size)   | for classes that set padding-bottom |
| pl(size)   | for classes that set padding-left |
| pr(size)   | for classes that set padding-right |
| px(size)   | for classes that set padding both *-left and *-right |
| py(size)   | for classes that set padding both *-top and *-bottom |

size - ranges from 0 to 5, the None value equivalent to `auto`


Discussion:

Patch:
diff --git a/bootwrap/components/base.py b/bootwrap/components/base.py
index c56c3f6..693fc6a 100644
--- a/bootwrap/components/base.py
+++ b/bootwrap/components/base.py
@@ -107,6 +107,243 @@ class ClassMixin:
             return ' '.join(self.__classes)
         return None
 
+    def m(self, size):
+        """Sets margin for all four sides to the specified size.
+
+        Args:
+            size (int): Size of the margin to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").m(3)
+        """
+        return self.add_classes(f"m-{size}")
+
+    def mt(self, size):
+        """Sets margin for the top side to the specified size.
+
+        Args:
+            size (int): Size of the margin to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").mt(3)
+        """
+        return self.add_classes(f"mt-{size}")
+
+    def mb(self, size):
+        """Sets margin for the bottom side the specified size.
+
+        Args:
+            size (int): Size of the margin to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").mb(3)
+        """
+        return self.add_classes(f"mb-{size}")
+
+    def ml(self, size):
+        """Sets margin for the left side to the specified size.
+
+        Args:
+            size (int): Size of the margin to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").ml(3)
+        """
+        return self.add_classes(f"ml-{size}")
+
+    def mr(self, size):
+        """Sets margin for the right side to the specified size.
+
+        Args:
+            size (int): Size of the margin to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").mr(3)
+        """
+        return self.add_classes(f"mr-{size}")
+
+    def mx(self, size):
+        """Sets margin for left and right sides to the specified size.
+
+        Args:
+            size (int): Size of the margin to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").mx(3)
+        """
+        return self.add_classes(f"mx-{size}")
+
+    def my(self, size):
+        """Sets margin for top and bottom sides to the specified size.
+
+        Args:
+            size (int): Size of the margin to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").my(3)
+        """
+        return self.add_classes(f"my-{size}")
+
+    def p(self, size):
+        """Sets padding for all four sides to the specified size.
+
+        Args:
+            size (int): Size of the padding to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").p(3)
+        """
+        return self.add_classes(f"p-{size}")
+
+    def pt(self, size):
+        """Sets padding for the top side to the specified size.
+
+        Args:
+            size (int): Size of the padding to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").pt(3)
+        """
+        return self.add_classes(f"pt-{size}")
+
+    def pb(self, size):
+        """Sets padding for the bottom side the specified size.
+
+        Args:
+            size (int): Size of the padding to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").pb(3)
+        """
+        return self.add_classes(f"pb-{size}")
+
+    def pl(self, size):
+        """Sets padding for the left side to the specified size.
+
+        Args:
+            size (int): Size of the padding to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").pl(3)
+        """
+        return self.add_classes(f"pl-{size}")
+
+    def pr(self, size):
+        """Sets padding for the right side to the specified size.
+
+        Args:
+            size (int): Size of the padding to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").pr(3)
+        """
+        return self.add_classes(f"pr-{size}")
+
+    def px(self, size):
+        """Sets padding for left and right sides to the specified size.
+
+        Args:
+            size (int): Size of the padding to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").px(3)
+        """
+        return self.add_classes(f"px-{size}")
+
+    def py(self, size):
+        """Sets padding for top and bottom sides to the specified size.
+
+        Args:
+            size (int): Size of the padding to set.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Button
+
+            # Note, that Button inherits ClassMixin.
+            button = Button("Hello").py(3)
+        """
+        return self.add_classes(f"py-{size}")
 
 class ActionMixin:
     """Mixin for a web component which able to perform an action."""
diff --git a/docs/base.html b/docs/base.html
index 8c62bf3..1cf847b 100644
--- a/docs/base.html
+++ b/docs/base.html
@@ -21,8 +21,8 @@
  </head>
  <body>
   <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
-   <img alt="Bootwrap Logo" id="089d0b41-bdf2-43b4-b8c4-977f56eabf72" src="logo.png" width="32"/>
-   <span class="text-light" id="810910f2-42d4-47a7-b529-24ce225ee895">
+   <img alt="Bootwrap Logo" id="0c63b702-1ba6-4f13-a906-0adf810ccc42" src="logo.png" width="32"/>
+   <span class="text-light" id="f5d11a2c-82b4-4b02-b53b-39c0d8f4ca9a">
     <strong>
      Bootwrap
     </strong>
@@ -34,92 +34,92 @@
    <div class="collapse navbar-collapse" id="menu">
     <ul class="navbar-nav mr-auto">
      <li class="nav-item">
-      <a class="nav-link ml-2" href="index.html" id="fa2c58f3-b4fa-4971-8275-34e242e6e74f">
+      <a class="nav-link ml-2" href="index.html" id="8b7c3661-b6c2-49d2-b41a-0d08bcf60a48">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="layout.html" id="9216b2bb-f9c3-4fcf-bcca-4140902ed341">
+      <a class="nav-link ml-2" href="layout.html" id="572b8c52-21df-40c3-b6c7-e968c0a04007">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="base.html" id="8a1e6fd9-5eb1-4526-8674-2a53111fd0ce">
+      <a class="nav-link ml-2" href="base.html" id="d3d978a1-348a-4447-8bd8-4258de89048e">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="components.html" id="db453868-9f65-474f-b102-2b9644e8b8cb">
+      <a class="nav-link ml-2" href="components.html" id="4fa83be9-d764-4659-9567-673bf9a37042">
        Components
       </a>
      </li>
     </ul>
-    <a class="ml-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="7910b093-7e18-4474-adfd-2e41f50011ef" role="button">
+    <a class="ml-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="9259ef7f-372b-4a0f-bd53-f47eed644f79" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container" style="margin-top: 90px;">
-   <ul class="nav nav-pills" id="8eee2ad2-8643-401b-b2f6-f6212803a68b" role="tablist">
+   <ul class="nav nav-pills" id="a97a1108-f7b5-4d96-be0b-4cff301c409d" role="tablist">
     <li class="nav-item">
-     <a class="nav-link active" data-target="#4bed4a25-ebb2-4d80-99b8-57e0fcb6b3b2" data-toggle="tab" href="#4bed4a25-ebb2-4d80-99b8-57e0fcb6b3b2" id="9bf5d670-b4f2-427b-8cb2-579e61b765e9">
+     <a class="nav-link active" data-target="#f769c1d8-9330-456b-9ccf-5cf98461e382" data-toggle="tab" href="#f769c1d8-9330-456b-9ccf-5cf98461e382" id="6d35c91e-475a-42c1-bf79-46ff14a361a1">
       WebComponent
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#2d656bcd-beca-4bd3-b4bc-3db8b3171ae8" data-toggle="tab" href="#2d656bcd-beca-4bd3-b4bc-3db8b3171ae8" id="b12e81cc-93c8-4799-9679-920545fb7a34">
+     <a class="nav-link" data-target="#f7ebe73e-b996-4d9b-9149-a32978d0f8c8" data-toggle="tab" href="#f7ebe73e-b996-4d9b-9149-a32978d0f8c8" id="8e5d9b99-4523-40a5-8fe3-6c5c324fba92">
       ClassMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#91212427-1203-470b-9a42-1baba4c24bc1" data-toggle="tab" href="#91212427-1203-470b-9a42-1baba4c24bc1" id="02d7c330-87ac-4c6d-b2b9-d8136cd543cc">
+     <a class="nav-link" data-target="#e61875d1-36ba-4a2c-910e-4c067780f23b" data-toggle="tab" href="#e61875d1-36ba-4a2c-910e-4c067780f23b" id="99426f14-7340-4ce5-953c-2641bd772a72">
       ActionMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#7f719c30-5fa1-407b-96a6-2e64fe0f434b" data-toggle="tab" href="#7f719c30-5fa1-407b-96a6-2e64fe0f434b" id="5b8632c9-9e6d-4533-975b-2f15e7d87ef3">
+     <a class="nav-link" data-target="#a9424607-849f-41d5-a259-40c0f9e84ede" data-toggle="tab" href="#a9424607-849f-41d5-a259-40c0f9e84ede" id="a3e5ef28-4653-4e64-b3f8-e00b9f9c648b">
       AppearanceMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#db9215a9-a88f-4e47-a898-64e256cb23be" data-toggle="tab" href="#db9215a9-a88f-4e47-a898-64e256cb23be" id="15b2588b-ebc3-4266-afd1-7fd746cb1771">
+     <a class="nav-link" data-target="#f627481f-1b99-4224-a9f2-fe89d4087681" data-toggle="tab" href="#f627481f-1b99-4224-a9f2-fe89d4087681" id="8597f51f-fdb9-4465-ac7d-647fb4180cc3">
       OutlineMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#1827ccf3-39f1-4190-a234-de0af4477899" data-toggle="tab" href="#1827ccf3-39f1-4190-a234-de0af4477899" id="4f508ae2-524b-4567-9061-4802dab2c5bc">
+     <a class="nav-link" data-target="#9ce59773-a9fe-48b6-a096-e7f285cf4e2b" data-toggle="tab" href="#9ce59773-a9fe-48b6-a096-e7f285cf4e2b" id="99d3b54d-4e24-40ec-beb6-99e072463088">
       AvailabilityMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#1a1c328b-5c93-48b1-a274-55d92a2c13a6" data-toggle="tab" href="#1a1c328b-5c93-48b1-a274-55d92a2c13a6" id="ddf7bfc5-d6ea-4f09-974a-97ebfa656d4c">
+     <a class="nav-link" data-target="#33074b55-ae94-46ab-bc37-2549577d762f" data-toggle="tab" href="#33074b55-ae94-46ab-bc37-2549577d762f" id="147c4683-881e-4227-94f8-3f8749fece14">
       Constants
      </a>
     </li>
    </ul>
    <div class="tab-content">
-    <div class="tab-pane fade active show" id="4bed4a25-ebb2-4d80-99b8-57e0fcb6b3b2">
-     <div class="mt-5" id="dac2b3a8-4934-46f0-a7cf-57bbba4e15f1">
-      <div class="d-flex justify-content-between" id="9a90632e-efc3-4de6-b5b6-1264bfad14c4">
-       <h1 id="77759ffc-f1c5-495f-8783-c83ab5b8eaa8">
+    <div class="tab-pane fade active show" id="f769c1d8-9330-456b-9ccf-5cf98461e382">
+     <div class="mt-5" id="957eb5b8-26d5-441b-a326-2c1ac9a4c958">
+      <div class="d-flex justify-content-between" id="1d95b6fb-f4e3-4956-b3af-7468674b0fdb">
+       <h1 id="4cb56c50-7deb-48a8-a3e7-1fcdeb68e2a0">
         Class
-        <span class="text-primary" id="c59f794c-5509-45dc-bce5-abbb09dc11e0">
-         <span id="f546a2ed-a4aa-4289-b46c-f791ca9b4a0c">
+        <span class="text-primary" id="2949b553-d72e-4e37-8c56-3e6146f3f239">
+         <span id="03efd6b3-271c-4886-80d5-6e109cd55478">
           WebComponent
          </span>
         </span>
        </h1>
-       <div id="d1e06bdc-b68c-4bbc-bab0-20c2d46e8509">
+       <div id="bfdbb2a9-ba74-4b5e-a1d4-9320640b1f2b">
        </div>
       </div>
-      <span class="text-muted" id="e0e7ef8a-bbe3-4fe9-a9c9-33ecae2f2964">
+      <span class="text-muted" id="4d3acaf0-8ffc-49b9-9740-79e56ac41088">
        A web component base class.
       </span>
-      <pre id="e1447f7b-4540-43b0-b375-5ff7476dccbd"><code a="" c="" l="" s=" p y t h o n ">WebComponent()</code></pre>
-      <p id="a405ff83-3801-4abe-bb01-5f4544f6f93d">
+      <pre id="fc0dc710-431d-4473-8e39-093edb07a0e8"><code a="" c="" l="" s=" p y t h o n ">WebComponent()</code></pre>
+      <p id="a0dd8294-cf34-4fc0-978b-253cc5eff163">
        This class must be inherited by all web components.
       </p>
-      <p id="bb1cc572-4f8d-44c5-ad78-191ef1934571">
+      <p id="929f1e5b-a887-4be0-9326-81097180535b">
        In many operations where one web component encapsulates another one has
     implemented a type check. If the received element is not
        <code>
@@ -136,13 +136,13 @@
        </code>
        class.
       </p>
-      <div class="ml-3" id="edabac0e-cd04-4f11-9f74-c24ad0842715">
-       <h6 id="573af392-5925-4846-91d5-ad65580fb2f2">
+      <div class="ml-3" id="43718159-85b1-4fac-9e27-4aee54df909f">
+       <h6 id="397258d9-9bd9-4d27-a003-c5d892acab7a">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="3a00dbdf-431a-4e89-b26e-d81429cfec08"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import WebComponent
+       <pre id="1c0eb9de-f1cf-47e6-8d24-bea83b3081d8"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import WebComponent
 
 class CustomHeader(WebComponent):
     def __init__(self, title):
@@ -155,17 +155,17 @@ class CustomHeader(WebComponent):
             &lt;/h1&gt;
         '''</code></pre>
       </div>
-      <div class="mt-5" id="50357c28-15ed-4a8e-9577-ed744e5ff019">
-       <h4 id="69071358-9f3d-4517-826d-57c0d6bc34b9">
+      <div class="mt-5" id="3d897c8d-f03a-4a67-a15a-61007e933973">
+       <h4 id="7978bcdc-c563-412e-bd2b-50ec3751df3b">
         Property
-        <span class="text-primary" id="35edb35a-5919-4155-9a7a-67b8c0c4daab">
+        <span class="text-primary" id="e94a76bc-9da3-4001-9f12-76cb83eaef96">
          identifier
         </span>
        </h4>
-       <span class="text-muted" id="791c4328-cce1-41c0-a1dd-bbf1a0da5b3e">
+       <span class="text-muted" id="aa7b5168-727b-4a3b-84bf-27cae0303d51">
         A unique web component identifier.
        </span>
-       <p id="5e01af66-1a35-4d5c-851b-9735ce4f11b8">
+       <p id="b442127f-15d3-40f0-bbc3-b09fd70aadbb">
         Every
         <code>
          WebComponent
@@ -178,7 +178,7 @@ class CustomHeader(WebComponent):
         </code>
         .
        </p>
-       <p id="4ac982d3-ddc3-453e-b117-5cd2e9b8628f">
+       <p id="9ed588ea-4f2f-48c9-9584-32a39ccf3609">
         When you create a custom
         <code>
          WebComponent
@@ -194,13 +194,13 @@ class CustomHeader(WebComponent):
         </code>
         .
        </p>
-       <div class="ml-3" id="06a945e1-c502-4df9-a4c4-5f150ea3d4aa">
-        <h6 id="28ff1da6-273a-451c-bed6-dca16e1ab80a">
+       <div class="ml-3" id="a887429a-3459-4a18-8afe-382856eb4493">
+        <h6 id="ea634fef-bb4d-46f8-9aa1-6d64cf3fdb77">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="9660567c-a632-4a05-935d-8a67377ba35a"><code a="" c="" l="" s=" p y t h o n ">header = CustomHeader('Hello World")
+        <pre id="daf91e8a-9315-4360-bf07-273495df1472"><code a="" c="" l="" s=" p y t h o n ">header = CustomHeader('Hello World")
 print(header.classes)
 
 # Result: cfe040e6-df5f-4a3a-b96e-b0cefc31bbd9</code></pre>
@@ -208,45 +208,45 @@ print(header.classes)
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="2d656bcd-beca-4bd3-b4bc-3db8b3171ae8">
-     <div class="mt-5" id="df3fb850-8e77-4f91-a990-84b9dffc1f16">
-      <div class="d-flex justify-content-between" id="4dee692c-fade-42a3-836a-36b23d219b02">
-       <h1 id="3ae12c84-57a5-4033-8ec9-4c1f437b464c">
+    <div class="tab-pane fade" id="f7ebe73e-b996-4d9b-9149-a32978d0f8c8">
+     <div class="mt-5" id="447f9985-43b5-4f50-8715-192b9aa66445">
+      <div class="d-flex justify-content-between" id="f294682e-4056-498f-aac1-cb8feb3ed32c">
+       <h1 id="0a2b11cc-e22b-46a8-94c2-59ba82292df2">
         Class
-        <span class="text-primary" id="d998572c-bc82-4d49-b044-5c530e0d2598">
-         <span id="3c1dd8df-8131-4f40-9002-0a4d5a2909c9">
+        <span class="text-primary" id="b143c581-91fb-4bea-ae7c-47bf9f69a26f">
+         <span id="7b82db91-f6a9-4efe-bef2-0b50f0525d66">
           ClassMixin
          </span>
         </span>
        </h1>
-       <div id="9841c7af-114f-44dc-bb18-7e1712cc3c22">
+       <div id="af5043af-41ae-459a-a26f-4fb49faa52c3">
        </div>
       </div>
-      <span class="text-muted" id="98973e89-cf8f-4309-9f15-2cb1a09e1b49">
+      <span class="text-muted" id="53cdf539-909b-417d-a16c-88805885c7c4">
        Mixin for a web component which class can be amended.
       </span>
-      <pre id="7c5268b4-0167-4d79-9c0c-614817ee8e22"><code a="" c="" l="" s=" p y t h o n ">ClassMixin()</code></pre>
-      <p id="30666d5e-e367-47fa-afe3-8df93201c89e">
+      <pre id="1f922fe6-d851-4b96-a966-eece04d3be50"><code a="" c="" l="" s=" p y t h o n ">ClassMixin()</code></pre>
+      <p id="b0b371ed-6189-4f09-b96d-ef9d01894818">
        The vast majority of web components in Bootwrap inherit this class.
     It allows a user to adjust web components look and feel.
       </p>
-      <div class="mt-5" id="b292064d-a8e2-4b8c-8d9e-62478754ca6d">
-       <h4 id="dc7c9afb-13a6-444c-b6c2-388338f7d144">
+      <div class="mt-5" id="433c47fe-7ee8-477b-9b73-b21c5758d2ec">
+       <h4 id="7a2c4141-4af0-4c29-9f64-769ea9b81413">
         Property
-        <span class="text-primary" id="994bac6f-ff07-405e-944d-f2784ada7537">
+        <span class="text-primary" id="dd37cd34-28b3-4bf0-93cf-e6d95b3c0ad9">
          classes
         </span>
        </h4>
-       <span class="text-muted" id="10afcc2d-4b9b-4d37-a2cc-84157d1e4c63">
+       <span class="text-muted" id="0e9f4743-b7b4-4095-91b5-3b06674cd5fc">
         The web component classes.
        </span>
-       <div class="ml-3" id="75a420d2-ea39-4127-83ff-6c41e6f5a007">
-        <h6 id="9bf7b8d1-fd89-4c43-a765-96437733c471">
+       <div class="ml-3" id="f5f3782d-5659-47ca-9867-56b9db550d75">
+        <h6 id="4cb98ddc-a06f-44aa-ac06-6787edc95def">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="5b3fb7bb-a1e8-4388-86db-fcd8442c41cb"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="33cf8c6c-8459-479a-8625-4920150e8ff3"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").add_classes("ml-1 mr-1")
@@ -255,34 +255,34 @@ print(button.classes)
 # Result: ml-1 mr-1</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="1d070e54-a1fa-4df8-ba22-bbfdd9982d18">
-       <div class="d-flex justify-content-between" id="fe532e4a-8178-40a9-8da6-f60c7ffc469e">
-        <h4 id="a7688d50-c80b-4319-a3b9-e8d57f2b7836">
+      <div class="mt-5" id="3d544efa-95d1-4996-b903-ce1043e6abe9">
+       <div class="d-flex justify-content-between" id="c183d7df-2b81-488b-9dfa-ec27570132a6">
+        <h4 id="631092ec-5074-4c76-ba7c-41418d41b2c9">
          Method
-         <span class="text-primary" id="f05edc10-4856-47e7-86ee-17475bcdcfab">
+         <span class="text-primary" id="951bfab3-0aa2-46cb-bf79-95381a7719e1">
           add_classes
          </span>
         </h4>
-        <div id="f1e0db60-0c53-4729-83a0-8cdf638b4207">
-         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#9c90725f-939b-47e8-971c-859ec084dfa8" data-toggle="collapse" id="e254d10c-52b7-4fe6-b9de-21c3c12d1ed4" onclick="return false;" type="button">
+        <div id="8ef7a9fa-8315-48c6-b8f4-f8fbdc42663c">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#18524692-7214-4161-940d-532552aaefe1" data-toggle="collapse" id="7f26f42a-132b-4969-979a-a6834e31b57f" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-target="#3b5a0d77-3f4d-44f4-a1f4-016986ee7d64" data-toggle="collapse" id="5ee36398-38a8-4168-a4ab-6981ac50c827" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-target="#37db01fa-f200-4c14-8171-7cb8d7738fa7" data-toggle="collapse" id="cf7e4e26-9c81-4dcf-873b-39ecbb939afe" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="bc5d8fff-54c5-41d5-9721-4ad729bd2697">
+       <span class="text-muted" id="ad2fece4-a1c0-4766-86a9-1f51a9a12a65">
         Adds other classes.
        </span>
-       <pre id="fefac584-9286-4838-865b-26c2342a728c"><code a="" c="" l="" s=" p y t h o n ">add_classes(classes)</code></pre>
-       <div class="ml-3 collapse" id="9c90725f-939b-47e8-971c-859ec084dfa8">
-        <h6 id="1cb41f8e-47fb-4152-8d60-7165e0d07d25">
+       <pre id="8bb5d4cc-4c38-4c7e-8d73-02714619681c"><code a="" c="" l="" s=" p y t h o n ">add_classes(classes)</code></pre>
+       <div class="ml-3 collapse" id="18524692-7214-4161-940d-532552aaefe1">
+        <h6 id="2f13b90b-2e09-462e-bad7-1203be3eab1a">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="fdde586f-3949-4f53-a411-0ad6f3c247e4">
+        <table class="table table-sm bg-light" id="33f38d01-dca3-4962-a6a9-4deedea02031">
          <thead>
           <tr>
            <th scope="col">
@@ -316,13 +316,13 @@ print(button.classes)
          </tbody>
         </table>
        </div>
-       <div class="ml-3 collapse" id="3b5a0d77-3f4d-44f4-a1f4-016986ee7d64">
-        <h6 id="806562de-14b9-4552-a5f2-c88fbb304c49">
+       <div class="ml-3 collapse" id="37db01fa-f200-4c14-8171-7cb8d7738fa7">
+        <h6 id="0a9f415e-e70c-4f96-b325-22fb575d211c">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="50ed0cf1-5595-485e-972c-089ff68e8c06">
+        <table class="table table-sm bg-light" id="fd90f8af-d1f4-4e70-9741-14d2c66a801f">
          <thead>
           <tr>
            <th scope="col">
@@ -355,70 +355,1624 @@ print(button.classes)
          </tbody>
         </table>
        </div>
-       <p id="68b3bf84-ee26-403a-9917-f4e24312af59">
-        Note, the order of specified classes will be preserved during the 
+       <p id="53c1bd1d-91b8-446a-a5f6-419b95dd4232">
+        Note, the order of specified classes will be preserved during the
         component rendering.
        </p>
-       <div class="ml-3" id="165c4987-e3bd-4c9c-857f-a63f0558f154">
-        <h6 id="53f80158-2bbe-408c-b5d9-20b2f91f45ef">
+       <div class="ml-3" id="3bc3bb6a-5500-418c-bb87-17f9f1294705">
+        <h6 id="7fbac8a1-2ad3-40cf-8673-d85cfd71742a">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="90611f6a-956a-4335-881b-7ded3fa63f72"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="2a23cb1d-2e97-4bcb-a8a8-f25e21f96e07"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").add_classes("ml-1 mr-1")</code></pre>
        </div>
       </div>
+      <div class="mt-5" id="91ae4fa0-e863-4b7f-b603-53e548eb9c6b">
+       <div class="d-flex justify-content-between" id="88cc21e0-de6d-429f-92d6-1ea416916b3b">
+        <h4 id="11024c8b-069f-4045-b584-1745b570ecd9">
+         Method
+         <span class="text-primary" id="5d38719c-e7b7-4774-9959-53998cdd5973">
+          m
+         </span>
+        </h4>
+        <div id="e83bcac9-673f-4d77-8d99-f5e8f8b125ef">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#094e08d9-a27c-44ef-baa7-4c1105c85d52" data-toggle="collapse" id="7d482e86-298e-44a3-96fb-908ca40d0318" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#9ea09e1e-7598-426e-a926-e8e049501563" data-toggle="collapse" id="a43bf574-11d8-4bd5-97bd-ead072f21cd1" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="3e96a9d0-7fc3-46be-b68d-dfc496a21ce4">
+        Sets margin for all four sides to the specified size.
+       </span>
+       <pre id="22502286-2f71-40eb-9579-6c03929101ed"><code a="" c="" l="" s=" p y t h o n ">m(size)</code></pre>
+       <div class="ml-3 collapse" id="094e08d9-a27c-44ef-baa7-4c1105c85d52">
+        <h6 id="894f25de-e7ce-4cca-9f91-8e2e9bf9978d">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="b69c1578-9a25-4e56-9d85-cf395572f360">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the margin to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="9ea09e1e-7598-426e-a926-e8e049501563">
+        <h6 id="5a193d58-2f44-444e-8843-6493929e3616">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="76e329b1-47b4-4df7-8578-d53e0ff5cffb">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="508371f9-f302-4bfa-b47d-170cdf049314">
+        <h6 id="00c3b50a-2abf-46cb-a96c-545c24fb515f">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="ef8eb7d0-1b58-4ad9-991e-32ff291a3ae0"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").m(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="c555fec0-9856-4e3a-8d0c-67266557221e">
+       <div class="d-flex justify-content-between" id="3c9b04dd-8eb4-4986-ae4d-c916c02903b0">
+        <h4 id="c9d8040a-d4b1-4dda-8dc2-eb9768f6b270">
+         Method
+         <span class="text-primary" id="98c1b714-33fa-46ae-9640-3917b6fac8da">
+          mb
+         </span>
+        </h4>
+        <div id="ca032f06-f7b9-4471-a755-a9814d94c6ce">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#289adfb2-d1cd-4f61-aa8e-d3381f2df8ec" data-toggle="collapse" id="6ebcfbed-4aef-42e1-9a26-b7ff4473641f" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#ac92bbaf-979b-431b-9241-98bc15b9f306" data-toggle="collapse" id="3edbdf96-32e2-4a32-891f-1bbe07bb93ad" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="2c727734-c329-4aa3-9160-f8a37870a36a">
+        Sets margin for the bottom side the specified size.
+       </span>
+       <pre id="0a5e1266-0d35-46ee-84ee-e8ff76ae94d6"><code a="" c="" l="" s=" p y t h o n ">mb(size)</code></pre>
+       <div class="ml-3 collapse" id="289adfb2-d1cd-4f61-aa8e-d3381f2df8ec">
+        <h6 id="6ab645bf-4a89-4885-9cf5-7fe219bd13b1">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="8b22d99e-8845-441d-a45c-ea1b4131f474">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the margin to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="ac92bbaf-979b-431b-9241-98bc15b9f306">
+        <h6 id="0c92d981-6fd0-490d-9eee-55c08f862b70">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="06567cd8-e522-4b59-99ce-f31bdb262429">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="c534d782-8efe-40d6-b93d-de4635a992d6">
+        <h6 id="1f253291-93a5-4f6a-9f53-bae0daa32402">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="2542a198-3143-48eb-af72-5ec40d1d4e06"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").mb(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="37a8d0ab-2831-4390-84ff-5f8f778e070b">
+       <div class="d-flex justify-content-between" id="40a5fbfb-005c-4f1a-b75a-7337a712d335">
+        <h4 id="d52c7afc-fd40-487b-a1c8-be61438526a5">
+         Method
+         <span class="text-primary" id="a5372b54-0300-4070-be6e-4ded1810ed2c">
+          ml
+         </span>
+        </h4>
+        <div id="c0086178-1be8-47c2-8678-6eb24e7a9440">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#293f77f8-c647-49ca-9c5e-9f6323712d86" data-toggle="collapse" id="6449d450-903e-4836-b117-89c5f1263bde" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#490e485e-bac0-4d78-817a-6064abf2d35d" data-toggle="collapse" id="9f1f06c7-1864-4476-a367-ac689cbe253f" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="bb7ad54a-c1e9-4f0f-817f-001933a6f382">
+        Sets margin for the left side to the specified size.
+       </span>
+       <pre id="1ae67be3-6270-44c9-a4ca-b0773cd7418e"><code a="" c="" l="" s=" p y t h o n ">ml(size)</code></pre>
+       <div class="ml-3 collapse" id="293f77f8-c647-49ca-9c5e-9f6323712d86">
+        <h6 id="9506fc7d-850c-4947-820e-eb734b90a194">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="d046295c-4c74-47a3-bf49-980832e7e7fc">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the margin to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="490e485e-bac0-4d78-817a-6064abf2d35d">
+        <h6 id="69e91dd9-df46-41c2-a51b-41d9cc9b316d">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="612a5b7f-74b3-4c9a-9d3c-198c811d3c38">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="ab1c738e-19f4-45a2-8376-f12c187da4a8">
+        <h6 id="44044d4a-dfe1-49b9-bccc-5e8f56574cde">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="1d340c06-acfb-4bc6-b5f2-a2231c3f747f"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").ml(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="842c7dbc-b36f-4ba0-bc86-af20ede9cfb7">
+       <div class="d-flex justify-content-between" id="27dcded3-7eaf-4a0c-b22f-ed0341b2a96e">
+        <h4 id="fa09ebc3-a8c6-4a9a-999f-5088731a173f">
+         Method
+         <span class="text-primary" id="f64afcb5-b5fd-4b4f-96e4-631679bf3b76">
+          mr
+         </span>
+        </h4>
+        <div id="eaf131f1-e965-46ec-94e4-31c914560fdc">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#f0daec9f-9a3c-4bf1-8732-6e228fa62dd4" data-toggle="collapse" id="47a9be9d-b285-4188-9ac0-af1ed5a4afa0" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#4a673770-0a6b-4390-a6ec-1522f97bb89a" data-toggle="collapse" id="91608a22-3dc9-466f-bc85-28b2c90da88f" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="338e3e4b-7e08-43c1-aecb-33a589a29b4d">
+        Sets margin for the right side to the specified size.
+       </span>
+       <pre id="9192a8de-b134-4f26-acee-cd4817079398"><code a="" c="" l="" s=" p y t h o n ">mr(size)</code></pre>
+       <div class="ml-3 collapse" id="f0daec9f-9a3c-4bf1-8732-6e228fa62dd4">
+        <h6 id="94f21bef-8c41-4932-9f3b-79f1d56f3726">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="be376b58-a635-4512-b13a-7d43066acef4">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the margin to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="4a673770-0a6b-4390-a6ec-1522f97bb89a">
+        <h6 id="ac16b21f-c137-4011-a6ab-18dae1208689">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="b5deef7c-3365-4aa6-9103-954a8bebb31e">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="18faa148-18eb-49c3-ae24-3f3cfaed4190">
+        <h6 id="d33f22a2-d457-4b26-bd8b-f74b7e749eaa">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="b24925d1-703e-4dd8-8b99-fc974df5fafa"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").mr(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="84157877-1131-4515-9ad8-0cf33cddfd21">
+       <div class="d-flex justify-content-between" id="9c434721-2c29-428a-802f-ece6d4b39a8c">
+        <h4 id="2550b8da-98ea-4922-82ac-208959fd84e4">
+         Method
+         <span class="text-primary" id="791a7669-f0da-4ae4-b716-a12babda1d52">
+          mt
+         </span>
+        </h4>
+        <div id="04fbc51f-bcaa-48a0-8707-c220e045f4a3">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#4e4684ed-8c8b-46fb-81cc-8d05995178c8" data-toggle="collapse" id="7b4e8b4c-090d-494b-8834-216192e26c78" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#228319ea-4a71-4356-981d-9a58868880df" data-toggle="collapse" id="09e421d7-9790-49f4-839a-f0a5f0c394cf" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="3b354188-d01a-450a-9fdf-717cf3c5c6a3">
+        Sets margin for the top side to the specified size.
+       </span>
+       <pre id="3a67e3dd-3bba-470f-989b-78679e039ee0"><code a="" c="" l="" s=" p y t h o n ">mt(size)</code></pre>
+       <div class="ml-3 collapse" id="4e4684ed-8c8b-46fb-81cc-8d05995178c8">
+        <h6 id="4c9e45b6-fd18-41f2-80af-5a81492fdd21">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="88ad1272-f353-42cd-9836-25ff52937edc">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the margin to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="228319ea-4a71-4356-981d-9a58868880df">
+        <h6 id="d34b0e46-0cd3-4a72-afd6-bdd1dacfeb10">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="751b1115-d3a8-47e3-946b-22148061acd5">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="3fc6c74a-e4be-4afb-ae95-f2f10617814c">
+        <h6 id="91d8b2e8-b8de-46d1-9094-0addfa871adc">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="a82e2092-3d61-44df-b559-503ab3276277"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").mt(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="bc1d4c0a-a7f9-4790-a741-bdcbc5b2ae4e">
+       <div class="d-flex justify-content-between" id="b5e5764d-2b8a-4b43-9dd2-fe72bf7cf28a">
+        <h4 id="8429c348-23f2-475e-985a-7e6cfa725ee2">
+         Method
+         <span class="text-primary" id="f5d3a21d-4c10-46f6-acb3-e06d297fd7dd">
+          mx
+         </span>
+        </h4>
+        <div id="0e3af597-25fa-439b-8589-b0d15a9a154a">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#b2193cca-abb3-42bc-a688-37485a4e7bb8" data-toggle="collapse" id="9fea5e4f-500e-4909-8623-3f19e486ca76" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#c1cdac4f-fdf6-4078-9d9e-e83a50073e0b" data-toggle="collapse" id="1f8c63df-9a4e-46c4-b85a-0be999d68242" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="0609645d-7d5e-4790-9a5c-e82b12f27534">
+        Sets margin for left and right sides to the specified size.
+       </span>
+       <pre id="c20dbaa6-cb38-4962-9622-b9c5bf7385cb"><code a="" c="" l="" s=" p y t h o n ">mx(size)</code></pre>
+       <div class="ml-3 collapse" id="b2193cca-abb3-42bc-a688-37485a4e7bb8">
+        <h6 id="76e8dbb3-c9d2-4014-aea4-a317d4f7b46e">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="cbc3c02e-fda0-43d2-bc1f-1dff8f8e6ed7">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the margin to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="c1cdac4f-fdf6-4078-9d9e-e83a50073e0b">
+        <h6 id="b2b82b99-d823-4a84-b0f1-7d4f0854088e">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="60b0df73-efe9-44e6-a35c-8f64e8f2befc">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="27e8f569-af83-45ff-8c22-1a3959c9336f">
+        <h6 id="72bedfc5-0add-4fd2-9db0-f421407fae04">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="a3d27c6a-bcd9-4e2a-9d15-8241a1185b11"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").mx(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="2bd11a0f-ad42-48db-8fdd-2a270c41c5c9">
+       <div class="d-flex justify-content-between" id="25489389-8372-402d-995d-5431eb7cc052">
+        <h4 id="80b0a2a2-c11f-4464-9cfc-3ce4dc87fb27">
+         Method
+         <span class="text-primary" id="4fe87f08-4f73-45f9-b11f-0d892c1b37f5">
+          my
+         </span>
+        </h4>
+        <div id="e79675fb-2a0e-4825-809f-9a1c6d3d64d2">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#99f3cd1d-81c5-4dd9-8ae1-5b3321c3c14e" data-toggle="collapse" id="8aa87fba-75f6-4740-9a8f-4313007199c2" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#b904fc11-07d7-4210-bc2d-32c8a91b106b" data-toggle="collapse" id="5fba72c8-93c9-4790-9ae7-f3a37c47244a" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="1698acaf-5eec-4d3b-8e9f-58ffdbfb51a2">
+        Sets margin for top and bottom sides to the specified size.
+       </span>
+       <pre id="aa6ff21d-ea49-4714-a31d-11f68bcff44c"><code a="" c="" l="" s=" p y t h o n ">my(size)</code></pre>
+       <div class="ml-3 collapse" id="99f3cd1d-81c5-4dd9-8ae1-5b3321c3c14e">
+        <h6 id="981c00b4-1f71-40e4-9067-55a440ed873d">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="4029381e-1827-404f-be80-164d921e7f4a">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the margin to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="b904fc11-07d7-4210-bc2d-32c8a91b106b">
+        <h6 id="4e7eec94-a61e-4bb5-8a63-c0caedfc7ab4">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="f0331474-a08c-4f86-bc2a-c9cf9a743c29">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="dad8b973-a5cf-4447-a414-8878c2bbadf6">
+        <h6 id="1464c1b1-c6d8-43f6-94c3-be744aa84256">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="3f836676-78c5-44d8-8d79-22016b718f50"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").my(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="c3dd1f05-b3ad-42d6-97d5-a8c18d2ac2dd">
+       <div class="d-flex justify-content-between" id="f3650a53-8b88-45cf-bc4a-8c77ff136fd6">
+        <h4 id="ace8bb82-36a1-4573-b55e-675c41af022e">
+         Method
+         <span class="text-primary" id="3243dc1a-2013-4208-b4d3-3aaa2eff7927">
+          p
+         </span>
+        </h4>
+        <div id="882c5804-2b73-40be-b4ff-e0ab9cb46ef9">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#fcd6065a-c50d-4b42-ba78-01288b307034" data-toggle="collapse" id="7c279998-5188-499d-8db8-c26aa949b960" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#9e3f7e49-1a41-480a-a826-d241d0ea0681" data-toggle="collapse" id="267a0d4c-4670-465c-ae0e-e81109c859ce" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="9dd5b1e3-55a5-4c87-a6b1-339ca5984c83">
+        Sets padding for all four sides to the specified size.
+       </span>
+       <pre id="7dc2ad94-d360-40e3-96ec-372a43dc0eae"><code a="" c="" l="" s=" p y t h o n ">p(size)</code></pre>
+       <div class="ml-3 collapse" id="fcd6065a-c50d-4b42-ba78-01288b307034">
+        <h6 id="b4616d46-528c-4fcc-b362-39065843b72c">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="41b5b005-892a-42b5-8b79-bb33ff245912">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the padding to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="9e3f7e49-1a41-480a-a826-d241d0ea0681">
+        <h6 id="5bfbbb53-577c-44f9-88d3-7995eb05a2e2">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="57c07141-fc94-43fd-8cdd-457948e2dbda">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="e77cbc6b-d1b6-40d0-99e5-1c364affa1cb">
+        <h6 id="a45538b6-0d0e-42d8-8d5c-715988e77539">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="75814c5d-df48-44b8-a4d1-2427defff445"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").p(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="541c928b-8187-46f5-ae3c-049790525629">
+       <div class="d-flex justify-content-between" id="c0ae0b4d-7a91-4ac6-b6f1-b7317009b267">
+        <h4 id="17b03b44-1e40-46fe-aa9c-a5d146865daf">
+         Method
+         <span class="text-primary" id="a36323fd-dd1f-49f5-b7e5-8aaf4ba68ce1">
+          pb
+         </span>
+        </h4>
+        <div id="4f0e197b-5b96-415c-9fdb-e3946d10778b">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#b3a2d1d9-5774-42be-99f8-b890659b7233" data-toggle="collapse" id="f1a3b3bd-103c-4e5a-a223-0a0b4504df51" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#bd13d333-0026-456f-8843-eef336fae003" data-toggle="collapse" id="58535017-f46c-4e43-93d5-19f327f10d20" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="95abbecf-ac81-46f7-b285-a4422c6e4bbe">
+        Sets padding for the bottom side the specified size.
+       </span>
+       <pre id="dae8dab9-db3f-4eeb-b0e2-6cc7dd212b4d"><code a="" c="" l="" s=" p y t h o n ">pb(size)</code></pre>
+       <div class="ml-3 collapse" id="b3a2d1d9-5774-42be-99f8-b890659b7233">
+        <h6 id="3926805d-2040-41d3-8dae-5ba3ccb7ab71">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="d44966ac-6374-481c-8f00-b630305a0533">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the padding to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="bd13d333-0026-456f-8843-eef336fae003">
+        <h6 id="c7e6de96-8ed8-44c3-8481-8ca075195f64">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="dcfba5cc-25c7-493a-8103-b81376835f0a">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="f5e4a313-1f68-4ad5-ae8c-d9d8c951602c">
+        <h6 id="410dd6de-e759-4efb-95d9-15ef4dd430e9">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="56bbdff1-c959-4502-b965-29c9be000a7e"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").pb(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="20d75522-abb2-4b59-81d1-1910ee7123eb">
+       <div class="d-flex justify-content-between" id="b1e3ca07-ce63-4f1b-9df2-6a949ad760e7">
+        <h4 id="ef0992fb-59d3-4dbc-8d80-9eb28e2e4804">
+         Method
+         <span class="text-primary" id="25af2783-72c7-4dee-8c1c-5815df28d8a1">
+          pl
+         </span>
+        </h4>
+        <div id="ac51ed56-e8f1-4289-99ae-4b1664e33057">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#36db9220-f2f9-4104-abf2-cb4f4c310c57" data-toggle="collapse" id="16b966cd-8242-4ddf-bdc2-50d71ee13c82" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#6b010bd0-e53b-49fd-82c8-83cc08fc62a8" data-toggle="collapse" id="636bdaa5-e2fc-43c3-9c7f-87a4e9964242" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="e352cb35-0f09-44cb-a48a-b91287f1d006">
+        Sets padding for the left side to the specified size.
+       </span>
+       <pre id="c1fe0d90-b906-401c-add1-bb558f03f34b"><code a="" c="" l="" s=" p y t h o n ">pl(size)</code></pre>
+       <div class="ml-3 collapse" id="36db9220-f2f9-4104-abf2-cb4f4c310c57">
+        <h6 id="9eca87a9-70ff-45e5-9a23-bb37921af46c">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="90171cfc-2614-4429-8e2e-344a9a13a87d">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the padding to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="6b010bd0-e53b-49fd-82c8-83cc08fc62a8">
+        <h6 id="f55c1d50-cb30-4357-bb26-22b9164865db">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="65ebe48d-a69b-4d9e-ac96-5b60d06bbe1e">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="369793d0-6f6e-422e-86be-1b52325c0213">
+        <h6 id="33a34095-edf5-454b-8684-18c600dc9b7c">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="15054ee2-02b9-4f95-ac21-3acac799677d"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").pl(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="f07fe06f-dfc1-4d40-91e4-885105b12284">
+       <div class="d-flex justify-content-between" id="2accf65f-5cea-415f-be15-e4ab4c5f1b2c">
+        <h4 id="f51e729d-0485-428a-b6b3-805015e4fa79">
+         Method
+         <span class="text-primary" id="1ce828c8-98c4-4874-92ea-91c3ca723c44">
+          pr
+         </span>
+        </h4>
+        <div id="16c51904-9891-4aae-8e96-baa72275d1ed">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#c3f54037-8766-4152-a71b-1302d5d49355" data-toggle="collapse" id="37d06072-fc54-4fab-a574-f8d34bd14614" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#193b917c-cb07-4146-a896-b9adeed52a43" data-toggle="collapse" id="58ad9ac2-aa4d-4d0a-8d0a-3cd3d16cc623" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="82115754-6e96-48ec-85c7-8c218a38a43f">
+        Sets padding for the right side to the specified size.
+       </span>
+       <pre id="7c268856-ff2a-49d9-be9a-920fa502b57f"><code a="" c="" l="" s=" p y t h o n ">pr(size)</code></pre>
+       <div class="ml-3 collapse" id="c3f54037-8766-4152-a71b-1302d5d49355">
+        <h6 id="908b4953-65af-4f5f-886b-41fb84799d4e">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="48a9cdba-9517-466a-a74c-d17882ce4aa6">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the padding to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="193b917c-cb07-4146-a896-b9adeed52a43">
+        <h6 id="1b4a0de0-d024-4e11-9a1f-b45a6eef0684">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="0970c43c-a705-4d48-8a54-37bdfb87215e">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="1b95e2f6-0af5-48a7-9ad3-7c1064be432b">
+        <h6 id="cffdd036-fdff-43f7-86bd-80053a8b17d0">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="61981893-afdd-472a-86b2-6c39ff5c8cdc"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").pr(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="7e652e1f-1685-4778-ba1b-1e5f9c5bcf12">
+       <div class="d-flex justify-content-between" id="6f07232b-e866-4b32-a79e-b47d110453af">
+        <h4 id="e498f7ff-7ed4-4e52-a632-68a3045bd5b1">
+         Method
+         <span class="text-primary" id="a2806199-3175-4f29-a311-2f0c9941a985">
+          pt
+         </span>
+        </h4>
+        <div id="d1c5901c-55d6-41b9-b974-4118ec9f93df">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#8a6bb589-6140-4c5f-90c2-aade3e8ea4f7" data-toggle="collapse" id="7d2a3b82-844a-45e1-9401-6a35b05e6032" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#8b6e0831-c0be-4adf-a5a6-529de73d0102" data-toggle="collapse" id="78270cae-c655-4d79-8896-ff1853aa92c8" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="19bbe459-edda-414c-9a57-0bf7bb5ba72d">
+        Sets padding for the top side to the specified size.
+       </span>
+       <pre id="648e7357-b5da-433f-83b0-de30cb420a48"><code a="" c="" l="" s=" p y t h o n ">pt(size)</code></pre>
+       <div class="ml-3 collapse" id="8a6bb589-6140-4c5f-90c2-aade3e8ea4f7">
+        <h6 id="c1016f47-0241-4d14-813a-2ea27204e382">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="7c3675ec-a9af-4739-ad39-eee5a457bcce">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the padding to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="8b6e0831-c0be-4adf-a5a6-529de73d0102">
+        <h6 id="7bdde373-9ee2-4b0b-a206-052ea68ef73c">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="b48a3ba2-a85e-4267-8e5d-1f33f9b646df">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="06029947-8d96-46e0-8b73-cbad373c7757">
+        <h6 id="59ee895d-fc8f-45fb-97ba-e33e69636a3b">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="6d9dcd79-5f6c-4ab9-9152-cdfe3f0f7d04"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").pt(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="b853868f-470d-46d9-9e0f-60e1fdc34572">
+       <div class="d-flex justify-content-between" id="56c84b15-ca8a-4d1f-b60c-0c3c203354a7">
+        <h4 id="e697a922-5e76-4ca3-b3de-c10afc7f898c">
+         Method
+         <span class="text-primary" id="a140cbe9-5a81-4e72-8952-c892b3ae7930">
+          px
+         </span>
+        </h4>
+        <div id="10f92f71-2392-4ae7-b11b-b3b6932925eb">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#95cf4ef0-d86d-4b02-9763-f914ed579827" data-toggle="collapse" id="0b550c12-f11b-4667-b755-12a1961966e3" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#3d26b9bf-6da1-4063-a527-ca9db0dc9ecb" data-toggle="collapse" id="d94438c7-992c-4a56-979d-c098ccce5da6" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="c2080a38-714b-4f26-9190-06f1521ea4c9">
+        Sets padding for left and right sides to the specified size.
+       </span>
+       <pre id="7472e950-3fee-414d-8de3-13f385ac041f"><code a="" c="" l="" s=" p y t h o n ">px(size)</code></pre>
+       <div class="ml-3 collapse" id="95cf4ef0-d86d-4b02-9763-f914ed579827">
+        <h6 id="8874c587-fa67-46fb-bfe1-0c2f4c4f2d8f">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="5042ccfb-bd3b-4823-8b62-c58eb31d5a3f">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the padding to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="3d26b9bf-6da1-4063-a527-ca9db0dc9ecb">
+        <h6 id="2af6f08a-7325-4d63-b097-f75f1cd1e13e">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="5115d818-803a-4de9-8344-1d00fb249aee">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="19ba6f98-7c4a-4cca-9759-4bafb5609af4">
+        <h6 id="0842e213-abcc-4230-ae3a-c92eb8932136">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="a89f5cd2-bde8-4eb9-b237-8f992e9ffc06"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").px(3)</code></pre>
+       </div>
+      </div>
+      <div class="mt-5" id="5ea78a0d-628c-4e8d-bc87-902d4f27d704">
+       <div class="d-flex justify-content-between" id="83ea1339-8a58-44e6-a859-62b6968c5ccd">
+        <h4 id="4e61fddd-a078-48ce-852b-e6014215f3f8">
+         Method
+         <span class="text-primary" id="8ab2de6b-702a-49a3-945f-e4ceb333f2b6">
+          py
+         </span>
+        </h4>
+        <div id="a487751b-4bba-42bc-b85b-238f9f512436">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#52af8e84-31c7-45e4-ac6f-dd89b039e8c6" data-toggle="collapse" id="0843ed07-9d30-46fd-be26-55829c6b33ce" onclick="return false;" type="button">
+          Argument
+         </button>
+         <button class="btn-sm btn btn-outline-primary" data-target="#c13cedaa-7f37-4dce-a293-a68f3a9d7330" data-toggle="collapse" id="2260b5eb-d94d-4e78-9ad1-8cf3d96c17c5" onclick="return false;" type="button">
+          Returns
+         </button>
+        </div>
+       </div>
+       <span class="text-muted" id="9db37ac3-c0e4-4d58-995e-63ee9fc75340">
+        Sets padding for top and bottom sides to the specified size.
+       </span>
+       <pre id="fd857fef-89d6-4d98-bc73-7722a801b5d8"><code a="" c="" l="" s=" p y t h o n ">py(size)</code></pre>
+       <div class="ml-3 collapse" id="52af8e84-31c7-45e4-ac6f-dd89b039e8c6">
+        <h6 id="ced6558b-0927-4e7c-8b37-02fa60c1d46a">
+         <strong>
+          Arguments
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="ac1526cb-9172-4549-b7f5-231a1a538f3b">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             size
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             int
+            </code>
+           </td>
+           <td>
+            Size of the padding to set.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3 collapse" id="c13cedaa-7f37-4dce-a293-a68f3a9d7330">
+        <h6 id="9d9cee22-ada4-43a7-8e91-5c1abfc80bda">
+         <strong>
+          Returns
+         </strong>
+        </h6>
+        <table class="table table-sm bg-light" id="12354299-6045-4249-aaa9-6f44871d3f44">
+         <thead>
+          <tr>
+           <th scope="col">
+            Name
+           </th>
+           <th scope="col">
+            Type
+           </th>
+           <th scope="col">
+            Description
+           </th>
+          </tr>
+         </thead>
+         <tbody>
+          <tr>
+           <td scope="row">
+            <i style="white-space: nowrap">
+             obj
+            </i>
+           </td>
+           <td>
+            <code style="white-space: nowrap">
+             self
+            </code>
+           </td>
+           <td>
+            The instance of this class.
+           </td>
+          </tr>
+         </tbody>
+        </table>
+       </div>
+       <div class="ml-3" id="ab6a06fe-36ef-4a93-8a7f-f1fb84a86b2d">
+        <h6 id="9ed910c1-eeb7-43f8-8e46-973d1aca3d7f">
+         <strong>
+          Example
+         </strong>
+        </h6>
+        <pre id="60e87c96-01b2-421c-80f9-ba001267be38"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+
+# Note, that Button inherits ClassMixin.
+button = Button("Hello").py(3)</code></pre>
+       </div>
+      </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="91212427-1203-470b-9a42-1baba4c24bc1">
-     <div class="mt-5" id="68de7a3d-0daf-4ea9-a68b-58a824cef2d9">
-      <div class="d-flex justify-content-between" id="e28d5c8a-d37b-4c53-a1ce-e6dd061b07bf">
-       <h1 id="5030188d-264d-4d40-9803-2ec0c7afb2d7">
+    <div class="tab-pane fade" id="e61875d1-36ba-4a2c-910e-4c067780f23b">
+     <div class="mt-5" id="1674090f-adb8-4a51-89c0-0149fa5509d1">
+      <div class="d-flex justify-content-between" id="51d82bdf-c4e9-4969-b108-b4a21d8b9622">
+       <h1 id="d2f566e5-5b3a-4487-bdb8-0cdb30807d09">
         Class
-        <span class="text-primary" id="5d52688a-c260-4b0d-838d-04a598f28c25">
-         <span id="c42b4b1e-081f-43ea-8b77-885fdb97e3dc">
+        <span class="text-primary" id="99477472-9a63-4124-acf4-5e4ccf24b8be">
+         <span id="668000f7-62d4-4d2f-b254-03bb27d527f4">
           ActionMixin
          </span>
         </span>
        </h1>
-       <div id="347aabc3-aeec-4283-82a2-0f604b67fb13">
+       <div id="c8c7516d-1d85-408a-a8b4-55f5bb657fa2">
        </div>
       </div>
-      <span class="text-muted" id="30dc2acd-08b4-4ea4-a1f1-abe55abda35a">
+      <span class="text-muted" id="d4b1cffb-677f-40d0-93bc-14e0baaa725a">
        Mixin for a web component which able to perform an action.
       </span>
-      <pre id="8d42c33f-3aa1-4188-b0dd-36a327adb1f8"><code a="" c="" l="" s=" p y t h o n ">ActionMixin()</code></pre>
-      <div class="mt-5" id="e3e06648-e084-4fe3-a5a6-d4c7e1cd343b">
-       <div class="d-flex justify-content-between" id="e379d755-d80f-4225-aff6-29fa72fc4b14">
-        <h4 id="19f54191-e278-44b9-ad55-ba24dcf8472c">
+      <pre id="b0114a52-5727-4eaa-bd87-a9a87f06d55a"><code a="" c="" l="" s=" p y t h o n ">ActionMixin()</code></pre>
+      <div class="mt-5" id="400280ed-ddff-45ef-ab31-d7c0ae126da8">
+       <div class="d-flex justify-content-between" id="9045dbe0-8c3c-480c-b1e3-ac832b1c7a47">
+        <h4 id="48722980-28ca-4573-bc38-8b84a3842112">
          Method
-         <span class="text-primary" id="f83d2cd7-b068-4cd4-adb8-cc5aad37d63e">
+         <span class="text-primary" id="c67bb96f-1c73-4bdb-904c-b3108d53b61b">
           add_menu
          </span>
         </h4>
-        <div id="1a97e8cb-b721-4be9-a2b1-65eec147fdfc">
-         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#02626aa5-fdb5-4719-bbd2-3b6b5e281b0f" data-toggle="collapse" id="aeee3fea-9349-4cc7-a64d-268aebded1ec" onclick="return false;" type="button">
+        <div id="d4974f77-cbaa-4b4c-9b7c-1f2cb2b716d0">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#6872b803-bc34-4f2b-beaf-98007190a160" data-toggle="collapse" id="b8281337-c59a-4922-8467-7eddbd8139fd" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-target="#45b82d7e-2209-4e73-b90f-a577e2e03f85" data-toggle="collapse" id="27214cdc-155f-4b0c-8dd9-cd2dc07fbcdf" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-target="#b437c9a4-91fa-434a-8f61-8851c3fb09a2" data-toggle="collapse" id="e58c68e4-af81-4774-81ec-df42a1c9f46a" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="858b97c1-4db0-496c-b015-f3fc7b5cbf90">
+       <span class="text-muted" id="43b007d5-7653-4337-9461-b0cb145d7c01">
         Adds dropdown menu.
        </span>
-       <pre id="1c170b32-a8be-4fbb-a9af-ac52de8d0c0e"><code a="" c="" l="" s=" p y t h o n ">add_menu(*menu)</code></pre>
-       <div class="ml-3 collapse" id="02626aa5-fdb5-4719-bbd2-3b6b5e281b0f">
-        <h6 id="f2237707-b4c4-4042-97f4-73a4489d4b0f">
+       <pre id="76a14b7c-1148-470e-8e1a-5fac44fd78be"><code a="" c="" l="" s=" p y t h o n ">add_menu(*menu)</code></pre>
+       <div class="ml-3 collapse" id="6872b803-bc34-4f2b-beaf-98007190a160">
+        <h6 id="60e83727-e593-43ed-a9c3-e258d5cbd9f4">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="2b984222-8c8f-496c-a5de-6e4f27d11183">
+        <table class="table table-sm bg-light" id="10d071e7-f145-4cee-a0ff-bcad882eee3d">
          <thead>
           <tr>
            <th scope="col">
@@ -460,13 +2014,13 @@ button = Button("Hello").add_classes("ml-1 mr-1")</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3 collapse" id="45b82d7e-2209-4e73-b90f-a577e2e03f85">
-        <h6 id="bf85b929-d86f-4afb-aa52-8d6124670085">
+       <div class="ml-3 collapse" id="b437c9a4-91fa-434a-8f61-8851c3fb09a2">
+        <h6 id="8eafa599-5eca-4724-99f2-0e01a373d822">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="d2e1eb31-8f33-41c0-91ba-bbecec40922b">
+        <table class="table table-sm bg-light" id="5a60203e-ac8a-4100-9121-5b55429f091b">
          <thead>
           <tr>
            <th scope="col">
@@ -499,13 +2053,13 @@ button = Button("Hello").add_classes("ml-1 mr-1")</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="db415b2a-6096-4c53-9025-f36b5ea1889c">
-        <h6 id="d89a96be-e371-4e7e-8dea-79cb168501b0">
+       <div class="ml-3" id="709c42d2-bb48-4a8d-984f-ff6fc85e3754">
+        <h6 id="b6e3b3dd-cdb0-4c22-9c79-b1ec7bba8695">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="2cdb7299-9bee-4b47-8896-d83a588b5d96"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="50af1421-a61b-4350-82a2-7f54a48675d9"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits ActionMixin.
 button = Button('Portfolio').add_menu(
@@ -515,31 +2069,31 @@ button = Button('Portfolio').add_menu(
 )</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="6a4e1c82-4fab-41f6-bae2-c4ac4bc5a566">
-       <div class="d-flex justify-content-between" id="30a37c95-7367-4401-a11b-5235bdeea81d">
-        <h4 id="8514001d-0d23-4a35-846e-a87945cca404">
+      <div class="mt-5" id="f1e52709-fe53-4226-86d4-fbcec29e0f6f">
+       <div class="d-flex justify-content-between" id="76f1c042-d24d-4634-a017-f707c4df2a44">
+        <h4 id="784004f9-e582-4a29-84ec-10491c50204b">
          Method
-         <span class="text-primary" id="7b7ce9a5-d92e-47d7-9ef2-208c51431439">
+         <span class="text-primary" id="8ca9b2f3-6d85-4e1a-8ae0-77792cb1dd9d">
           dismiss
          </span>
         </h4>
-        <div id="fdb9abce-469f-4441-8148-512d4eb62833">
-         <button class="btn-sm btn btn-outline-primary" data-target="#f4148660-89f5-40c2-bec0-9417e0299904" data-toggle="collapse" id="c271e7d8-0494-4339-8b5a-2731c11f8957" onclick="return false;" type="button">
+        <div id="c033182e-8c82-4f11-a055-7fc703f74afb">
+         <button class="btn-sm btn btn-outline-primary" data-target="#4fd897a9-b4b3-4b0e-ab3a-534423d07ecd" data-toggle="collapse" id="789a3bab-9368-4945-9361-3202574e096a" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="7933b4fc-bcf6-46cc-81a1-ce881fa930c4">
+       <span class="text-muted" id="484a4ce3-fcc8-4078-ba67-975f855d205d">
         Performes a dismiss action.
        </span>
-       <pre id="ad68138f-431b-4bf8-948a-242ba2c00241"><code a="" c="" l="" s=" p y t h o n ">dismiss()</code></pre>
-       <div class="ml-3 collapse" id="f4148660-89f5-40c2-bec0-9417e0299904">
-        <h6 id="516ff8ae-5d11-4806-b679-597cc0177e0d">
+       <pre id="8b10159d-60bc-4094-9941-70248ef0a309"><code a="" c="" l="" s=" p y t h o n ">dismiss()</code></pre>
+       <div class="ml-3 collapse" id="4fd897a9-b4b3-4b0e-ab3a-534423d07ecd">
+        <h6 id="0bc77e0d-86c2-4eb4-b30f-d0c93744028c">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="b4e3e4e1-a4a1-4e05-ace1-1357a1e8dfee">
+        <table class="table table-sm bg-light" id="e0aab109-5b41-41de-b47b-59ce814ce4bc">
          <thead>
           <tr>
            <th scope="col">
@@ -572,13 +2126,13 @@ button = Button('Portfolio').add_menu(
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="c2c8b09b-c93e-4838-a039-4b15182fe693">
-        <h6 id="ee781f8a-c65f-4409-aecb-ac8c9f9fde48">
+       <div class="ml-3" id="b13fc4c5-62e6-4395-8ac8-2256c292624d">
+        <h6 id="4b92084a-2f90-4662-bfeb-37499d501b26">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="17fef541-577e-4db7-9754-4212f68bd59c"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Dialog, Button
+        <pre id="f55b8836-eed9-4caa-b54c-8caec7365264"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Dialog, Button
 
 # Note, that Button inherits ActionMixin.
 dialog = Dialog(
@@ -587,34 +2141,34 @@ dialog = Dialog(
 )</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="e695f25f-8ed8-4eaa-87c2-73597b248b32">
-       <div class="d-flex justify-content-between" id="8d928710-1940-4017-bd7b-fe55ac4facb0">
-        <h4 id="6afc6056-9088-4fed-a292-fc1deb52a97b">
+      <div class="mt-5" id="be839ec0-9972-446a-8e3b-e7ffbd8159b6">
+       <div class="d-flex justify-content-between" id="281a0a33-917a-43fc-afd3-c5ba4b8906af">
+        <h4 id="7be0c764-2c99-40fc-96cc-e429f4f19bbb">
          Method
-         <span class="text-primary" id="a0440cce-fd03-4dc8-befe-aa9e93d94301">
+         <span class="text-primary" id="85e38ce6-a73b-4d7b-97d7-43b363aa3aff">
           link
          </span>
         </h4>
-        <div id="b7e7a480-a061-4e78-acfb-2ba1afb263d6">
-         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#289effc6-9bad-4f34-9924-ea815e0fb315" data-toggle="collapse" id="0a2b33bd-cd75-40ec-bebc-8c064ce5a029" onclick="return false;" type="button">
+        <div id="aed5d3ca-f859-4647-bd8b-d8d7b220be03">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#cd304120-3846-4eed-9bbd-470ee040313c" data-toggle="collapse" id="c1442c91-4dde-4f95-a120-a9d047570cd5" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-target="#5fe7990b-076c-4afa-b98e-d440d50a10fb" data-toggle="collapse" id="21794496-8218-41f4-be2f-8644736ca370" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-target="#66cbabdc-5685-4612-8508-a21a18b80075" data-toggle="collapse" id="814ef0ea-53bf-40c9-8d41-083de5c3b710" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="ade92f3e-c3ee-4b9f-a0bd-30e11f494bba">
+       <span class="text-muted" id="49220ee4-7e9a-47b4-8903-2cead3954cab">
         Links to the web-resource.
        </span>
-       <pre id="d8e5097d-7266-48e2-9844-7bb6c7c69531"><code a="" c="" l="" s=" p y t h o n ">link(target)</code></pre>
-       <div class="ml-3 collapse" id="289effc6-9bad-4f34-9924-ea815e0fb315">
-        <h6 id="87aefbf4-1c15-4469-9774-aa1363bd1450">
+       <pre id="f21c306e-c5bf-478c-941b-515e30cc81d9"><code a="" c="" l="" s=" p y t h o n ">link(target)</code></pre>
+       <div class="ml-3 collapse" id="cd304120-3846-4eed-9bbd-470ee040313c">
+        <h6 id="49463d62-e90d-4380-96c8-2d13ce7fd6c8">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="093a9b92-ba46-4e1d-a8c9-ace1a3d530be">
+        <table class="table table-sm bg-light" id="b7a86874-1616-4220-89b1-550e0f19d85a">
          <thead>
           <tr>
            <th scope="col">
@@ -652,13 +2206,13 @@ dialog = Dialog(
          </tbody>
         </table>
        </div>
-       <div class="ml-3 collapse" id="5fe7990b-076c-4afa-b98e-d440d50a10fb">
-        <h6 id="24825718-981a-4fa8-81c0-43426db2cf1d">
+       <div class="ml-3 collapse" id="66cbabdc-5685-4612-8508-a21a18b80075">
+        <h6 id="5696e25d-85ae-4d87-af9e-916c22a5bf0c">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="1aaad1f0-5208-4e51-bca8-fd817781aa7c">
+        <table class="table table-sm bg-light" id="6c247cc5-3f94-4686-a911-a5bc8bc3957c">
          <thead>
           <tr>
            <th scope="col">
@@ -691,43 +2245,43 @@ dialog = Dialog(
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="8a91bbd1-01e6-4c63-b624-8077ca83b661">
-        <h6 id="aed72980-2e54-49a9-92bb-12f6ef108a43">
+       <div class="ml-3" id="3fab5f4a-ca6b-4677-8043-4b09e6f04b3d">
+        <h6 id="0192d0bc-144f-4d07-a98b-b6a5134eb49c">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="02d986d6-dd51-4983-80a2-20e5f750a2d5"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="25941a56-df14-49a0-9afa-3e36900e96ee"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits ActionMixin.
 button = Button("Search").link("https://www.google.com")</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="5437126a-71e9-444d-8175-f2e1c49def00">
-       <div class="d-flex justify-content-between" id="a5d265ba-41ec-4bc2-852c-fed02d88f8cb">
-        <h4 id="b7a1a1d9-4f2e-4441-9b08-b5f9c3dd65b1">
+      <div class="mt-5" id="17f8db4d-f76c-4017-8db7-326a9f1304c7">
+       <div class="d-flex justify-content-between" id="81903a85-197d-4d82-a652-c3eb3d4fdf9d">
+        <h4 id="8a2150ed-5cc1-4289-89f8-77b6007905ed">
          Method
-         <span class="text-primary" id="b8adebdc-775f-4438-be11-7c05e0401670">
+         <span class="text-primary" id="b6d20284-54e3-4644-b2bc-e80f1f2107a5">
           submit
          </span>
         </h4>
-        <div id="c2e190db-fc02-45b3-81b6-854dbcc76fdc">
-         <button class="btn-sm btn btn-outline-primary" data-target="#e8227f44-110b-4b2e-b4d8-137e56f1d35d" data-toggle="collapse" id="69904188-dd92-4e33-8ff3-4d55ff2977a4" onclick="return false;" type="button">
+        <div id="c7b4a790-6c45-4411-b33b-e3215778e181">
+         <button class="btn-sm btn btn-outline-primary" data-target="#913986b1-8a2a-42af-93bb-8b69f29803b4" data-toggle="collapse" id="e4fe116e-db2f-4411-af23-e1aba2d7f697" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="efbc4bc9-0e7f-4bfd-87ea-6cd56c22b42f">
+       <span class="text-muted" id="0a4a8c8f-c4ec-4770-b569-de55b43173f6">
         Performes a submit action.
        </span>
-       <pre id="a9fffa1f-f0a1-4803-8dc1-73c0cdcc1bce"><code a="" c="" l="" s=" p y t h o n ">submit()</code></pre>
-       <div class="ml-3 collapse" id="e8227f44-110b-4b2e-b4d8-137e56f1d35d">
-        <h6 id="d069c9f5-940c-403a-a683-21df34e9900d">
+       <pre id="4aad80e3-769b-47bc-a932-1a0dd26a1732"><code a="" c="" l="" s=" p y t h o n ">submit()</code></pre>
+       <div class="ml-3 collapse" id="913986b1-8a2a-42af-93bb-8b69f29803b4">
+        <h6 id="aee97d8f-93c9-419c-8b9f-e2092194fda2">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="9c63fb5a-7db5-48fd-b022-d9878ed2f9f6">
+        <table class="table table-sm bg-light" id="01574d73-0c77-4a6e-9e74-41e774a4cedb">
          <thead>
           <tr>
            <th scope="col">
@@ -760,13 +2314,13 @@ button = Button("Search").link("https://www.google.com")</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="cca444b2-38d9-4e4f-8ac1-287fb590720f">
-        <h6 id="fc70c1c5-9639-421c-9899-368269e478c8">
+       <div class="ml-3" id="ccb385bb-5318-4a30-b139-e878e210a6d5">
+        <h6 id="30bca0a4-2db7-47ac-b2c2-34784338fa56">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="77939057-b74a-4001-80b8-6a7512c8ef79"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, Button
+        <pre id="595b54fe-8296-488b-9cd1-3f1523c41f4f"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, Button
 
 # Note, that Button inherits ActionMixin.
 form = Form(
@@ -775,34 +2329,34 @@ form = Form(
 )</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="5c6e2a3d-7593-45ca-9841-2015a6e4c2ad">
-       <div class="d-flex justify-content-between" id="38b690de-5d45-4857-ab0e-1e79ecd242c7">
-        <h4 id="9dad54d0-335d-4888-96ad-35a168653c3a">
+      <div class="mt-5" id="840c5859-5dd1-432c-9929-7b06db6d17ae">
+       <div class="d-flex justify-content-between" id="a1dc6111-03ee-4c4c-8f4d-b43118074054">
+        <h4 id="4cae5093-05f3-4cb6-aaf9-4f3221f95672">
          Method
-         <span class="text-primary" id="3ae1f7b8-a800-422d-a882-0c6982a18d39">
+         <span class="text-primary" id="c70010cd-c7ab-4569-9bc0-bccbb7cb2526">
           toggle
          </span>
         </h4>
-        <div id="bc1acf23-991e-4fbd-82d2-b6ecab671703">
-         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#7a116b4f-338f-4cbb-bcc6-6e99920ceebe" data-toggle="collapse" id="762ab8a1-74a0-486e-8be4-c185c2cd1e85" onclick="return false;" type="button">
+        <div id="e4724529-2662-4cdc-b57c-333b569a85b7">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#86e6ebf0-3b3c-4409-b7ed-0b8c9fe42e71" data-toggle="collapse" id="be08dbdf-68bb-4646-ac46-933b1af63e45" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-target="#b5a47059-ce71-4076-b8d8-d60337b73ef8" data-toggle="collapse" id="749493e9-f445-47bf-9dea-b95cce9db984" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-target="#c11dde9c-fab3-47fd-a20f-60f123381411" data-toggle="collapse" id="33f5ba37-f99d-43e6-8ab9-4918a22cfc83" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="2de402bb-81ae-49ff-a7e6-fa9aec02b2d2">
+       <span class="text-muted" id="59134884-aa00-441d-be67-972930455cf0">
         Toggles an other web component.
        </span>
-       <pre id="ec602402-0c92-45fd-9bdf-df1e2e8dedfa"><code a="" c="" l="" s=" p y t h o n ">toggle(target)</code></pre>
-       <div class="ml-3 collapse" id="7a116b4f-338f-4cbb-bcc6-6e99920ceebe">
-        <h6 id="4fd8571d-cab1-4d75-884d-a439b4ee6679">
+       <pre id="12daf1c1-8e3d-440e-8a18-87fd1900971c"><code a="" c="" l="" s=" p y t h o n ">toggle(target)</code></pre>
+       <div class="ml-3 collapse" id="86e6ebf0-3b3c-4409-b7ed-0b8c9fe42e71">
+        <h6 id="24918642-04b1-4a57-9866-06bb76f2706d">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="892dc4d2-a94e-4660-9968-d9f895ca1259">
+        <table class="table table-sm bg-light" id="da9d56d5-9914-48fc-a0de-1f0219a08feb">
          <thead>
           <tr>
            <th scope="col">
@@ -835,13 +2389,13 @@ form = Form(
          </tbody>
         </table>
        </div>
-       <div class="ml-3 collapse" id="b5a47059-ce71-4076-b8d8-d60337b73ef8">
-        <h6 id="f3762865-4533-46a7-98ab-473b3f70e709">
+       <div class="ml-3 collapse" id="c11dde9c-fab3-47fd-a20f-60f123381411">
+        <h6 id="a18738b9-9f3f-4f7a-8aef-f328d41bd3e1">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="e82b5402-2b0e-4d3f-be5e-3b92c952863a">
+        <table class="table table-sm bg-light" id="97b4bf8c-25e4-4143-a1ef-0c8a98bd6f15">
          <thead>
           <tr>
            <th scope="col">
@@ -874,13 +2428,13 @@ form = Form(
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="6677437f-557e-4a7d-af49-f2b12007181a">
-        <h6 id="a1addeb3-9ac0-4f68-bf39-e48ec8880822">
+       <div class="ml-3" id="1428dfe0-2a40-440d-8ee2-7b5cebffec39">
+        <h6 id="cece25f0-b739-4a3a-bd30-2900944fdfd4">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="a5cc6a30-6c45-4e62-aff7-694eefb452a6"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, Dialog
+        <pre id="4a5a7515-f952-43e4-b77e-c4def5ebf3e5"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, Dialog
 
 # Note, that Button inherits ActionMixin.
 dialog = Dialog(...)
@@ -889,50 +2443,50 @@ button = Button("Open").toggle(dialog)</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="7f719c30-5fa1-407b-96a6-2e64fe0f434b">
-     <div class="mt-5" id="07477fcc-3454-4f91-b68b-1539b7c53c59">
-      <div class="d-flex justify-content-between" id="24f235fb-4000-42d8-bd9d-bcfc710052f8">
-       <h1 id="e314e1da-d193-494d-9d08-36f561429cc2">
+    <div class="tab-pane fade" id="a9424607-849f-41d5-a259-40c0f9e84ede">
+     <div class="mt-5" id="051f0df3-4094-4e37-b69a-802e2cbed85d">
+      <div class="d-flex justify-content-between" id="df1462cd-4cc2-484f-8b6f-26feb6f72fdd">
+       <h1 id="b6341fa5-635d-4804-8245-5aab34dcd6fb">
         Class
-        <span class="text-primary" id="aeb12954-f5d3-4d73-b2e5-42da1fa3957c">
-         <span id="78aacc7c-1b95-4b1f-9a71-4ab3829e8ca6">
+        <span class="text-primary" id="3c9c9b26-f575-4afa-b433-30072688bb5d">
+         <span id="f3b98d93-923f-4184-81b6-a192ec9927f4">
           AppearanceMixin
          </span>
         </span>
        </h1>
-       <div id="b5f94391-9431-4095-a386-da431c2705ee">
+       <div id="01a89aca-c5cc-4775-b209-670c20e92402">
        </div>
       </div>
-      <span class="text-muted" id="3d9bb79f-5726-4126-a768-e7560ee49b7a">
+      <span class="text-muted" id="4528ad4c-9a01-4a49-ac83-a1443f3c3fd6">
        Mixin for a web component which appearance can be associated
     with predefined categories.
       </span>
-      <pre id="e4bfcaab-e0bc-4f5f-aeef-859a5ab8f35e"><code a="" c="" l="" s=" p y t h o n ">AppearanceMixin()</code></pre>
-      <div class="mt-5" id="d20a00de-33a9-4051-936f-f4900b2ab15d">
-       <div class="d-flex justify-content-between" id="f7f571a2-0dad-4ef0-91f7-6f62e924640a">
-        <h4 id="f35861b7-36bd-4101-8db8-7b2314856c56">
+      <pre id="590d0061-4da4-4869-95b1-57dc3e93bbf7"><code a="" c="" l="" s=" p y t h o n ">AppearanceMixin()</code></pre>
+      <div class="mt-5" id="5b6911e2-dee2-4fee-b3cc-5ea62019cbc5">
+       <div class="d-flex justify-content-between" id="289a7380-65ac-4007-8b37-379c2b438c08">
+        <h4 id="c9f82a3f-435a-4109-a98c-ae9a133345c1">
          Method
-         <span class="text-primary" id="9b81a7ab-1e93-4a90-ad63-1cb63879e206">
+         <span class="text-primary" id="f74964d3-6c42-4605-9d83-4a20733e566d">
           as_danger
          </span>
         </h4>
-        <div id="8fc1f93c-d1f6-485b-be05-2aea45480bc4">
-         <button class="btn-sm btn btn-outline-primary" data-target="#f98e95c6-bafd-4a5f-8a1a-f48cdfbafc49" data-toggle="collapse" id="5be7e471-cdd0-47eb-bc3e-a9103224dd1f" onclick="return false;" type="button">
+        <div id="1871ee14-c066-4287-bb2a-b61d905212da">
+         <button class="btn-sm btn btn-outline-primary" data-target="#93669b0b-ab96-4c47-b0b3-92dfaf4eef5b" data-toggle="collapse" id="b693c378-42f7-469e-90d5-ec2a42bed882" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="61d2f604-b66c-42ee-bb05-85eff964244f">
+       <span class="text-muted" id="81c7511b-5702-49cd-b684-536f3c86060d">
         Makes the 'danger' look to a web components.
        </span>
-       <pre id="a09c2e2f-fddc-4418-a77a-50f1e9b1e61c"><code a="" c="" l="" s=" p y t h o n ">as_danger()</code></pre>
-       <div class="ml-3 collapse" id="f98e95c6-bafd-4a5f-8a1a-f48cdfbafc49">
-        <h6 id="cfbc971b-34af-4221-9e46-a560023d2edb">
+       <pre id="4aaef571-55f0-42cc-9bcf-17afe449e49d"><code a="" c="" l="" s=" p y t h o n ">as_danger()</code></pre>
+       <div class="ml-3 collapse" id="93669b0b-ab96-4c47-b0b3-92dfaf4eef5b">
+        <h6 id="42314645-f966-4fe7-b66b-4990efbe6d34">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="4a288889-805a-4c23-ade5-8b0d84dd9739">
+        <table class="table table-sm bg-light" id="6ddeeec4-938b-4a40-8d6e-a8f309fa4898">
          <thead>
           <tr>
            <th scope="col">
@@ -965,43 +2519,43 @@ button = Button("Open").toggle(dialog)</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="5f6a76c5-7fef-4d42-9366-bbcee7bdab7b">
-        <h6 id="8fc6b8cf-5402-469d-a22f-2cd62e8ac1a3">
+       <div class="ml-3" id="963303d2-ce60-4c3b-8d9a-79003ab5c77b">
+        <h6 id="811e3ed3-5d60-471d-a6d1-344fe8eb474e">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="de577db5-b3d0-4987-ae77-ce2bb49a5d4e"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="c0164341-1f8e-46b5-a609-51020b880d68"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Danger").as_danger()</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="f4564a61-0e5d-4027-81be-d29f6811c14a">
-       <div class="d-flex justify-content-between" id="3ef805f9-a2b7-428e-bd66-531af8df65dd">
-        <h4 id="d8b2ddce-d9fb-4372-a58f-b7738cc2d6db">
+      <div class="mt-5" id="18d15afd-4857-4a2e-b8bb-921bcf18c28a">
+       <div class="d-flex justify-content-between" id="5f578a25-2b53-447b-9b07-f9d434c39526">
+        <h4 id="ee1b9fcd-916f-4720-bd84-0370b91659ed">
          Method
-         <span class="text-primary" id="270c086b-18a2-4166-a94a-de10bd29b15c">
+         <span class="text-primary" id="2089c1b8-546c-4289-9ab5-c91047c642e9">
           as_dark
          </span>
         </h4>
-        <div id="7990c095-5ad0-4164-b568-4689429c4fa5">
-         <button class="btn-sm btn btn-outline-primary" data-target="#c0787a89-0dc8-42fe-8c6a-f0dfad0e2bde" data-toggle="collapse" id="55dc0bde-0421-457c-9da5-53cad70a08ea" onclick="return false;" type="button">
+        <div id="d100f005-a652-4c57-a09e-2736e140a48e">
+         <button class="btn-sm btn btn-outline-primary" data-target="#e604e8ea-7d99-4ac4-bcee-c7ebd9eebf1c" data-toggle="collapse" id="80c6fba3-9920-4bed-b777-27829aa5b4d8" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="528c1f2b-3b77-488b-8f4e-0f08da229894">
+       <span class="text-muted" id="e662b127-958d-44ae-af77-19f784d23e35">
         Makes the 'dark' look to a web components.
        </span>
-       <pre id="ca35167e-157d-42ab-97a7-c3fa163aa01f"><code a="" c="" l="" s=" p y t h o n ">as_dark()</code></pre>
-       <div class="ml-3 collapse" id="c0787a89-0dc8-42fe-8c6a-f0dfad0e2bde">
-        <h6 id="f11c913c-d09a-49b1-90af-a4ca4fd162da">
+       <pre id="47a9fe1b-8f5f-4045-a3d6-7bb246fc44ba"><code a="" c="" l="" s=" p y t h o n ">as_dark()</code></pre>
+       <div class="ml-3 collapse" id="e604e8ea-7d99-4ac4-bcee-c7ebd9eebf1c">
+        <h6 id="865bcba7-b3e4-4948-80f3-ee8d59d7f7fd">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="d7ff443b-79c2-4e8a-bd9e-f67e9af973e1">
+        <table class="table table-sm bg-light" id="9997ba1d-b49f-4df0-8d2a-234c491ce43d">
          <thead>
           <tr>
            <th scope="col">
@@ -1034,43 +2588,43 @@ button = ("Danger").as_danger()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="e9ecac36-7666-4f4e-9e44-68fea87d3f94">
-        <h6 id="18899c63-13f5-4d31-b2a6-ead0c4bf5bbb">
+       <div class="ml-3" id="d96fd7d0-8f3b-40f8-958b-6d7a1d928580">
+        <h6 id="71cae6d4-d27c-45e7-8d2d-337e1a5b2a55">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="6a99cdb5-917a-487c-acfe-591001699cc9"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="08e3c17d-bf6b-47b8-a757-ccd526b36e9d"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Dark").as_dark()</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="49b08268-ad9b-49d8-8285-8ebd89e7c9f3">
-       <div class="d-flex justify-content-between" id="832611b1-ae35-4d57-84f2-4be18377a59a">
-        <h4 id="6140032c-878b-4686-8e75-29dbb23b5f39">
+      <div class="mt-5" id="7887df2c-85ec-4399-9a09-fc1d576b3b23">
+       <div class="d-flex justify-content-between" id="e61de6f0-5325-4c53-bf01-21e453c8b5ed">
+        <h4 id="1ab8428b-baf9-4eea-89f0-bd68aa1db69c">
          Method
-         <span class="text-primary" id="26fdad2b-5534-41b5-b5f5-42506182b82b">
+         <span class="text-primary" id="a8f79419-86ee-495a-8495-53c058e4088f">
           as_info
          </span>
         </h4>
-        <div id="a449a7d4-d0c2-4911-a637-10a9074c77d5">
-         <button class="btn-sm btn btn-outline-primary" data-target="#9594bd33-6fc8-4ff0-8dc0-13f0b4cfa7d4" data-toggle="collapse" id="24d31731-8b0f-4659-8c34-d6684a40e5df" onclick="return false;" type="button">
+        <div id="86d35f71-95e2-425c-871e-524d714c345b">
+         <button class="btn-sm btn btn-outline-primary" data-target="#f669a3b4-e088-43df-8b96-1247a934772a" data-toggle="collapse" id="e1fe05bf-eab7-450c-aae8-0f81a0d63314" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="15f5de52-8b69-4097-85d4-d05e8b35b323">
+       <span class="text-muted" id="f0b710e0-0e05-4633-9d9c-e25353486899">
         Makes the 'info' look to a web components.
        </span>
-       <pre id="35f839b0-759d-4f7f-802f-9d0034939015"><code a="" c="" l="" s=" p y t h o n ">as_info()</code></pre>
-       <div class="ml-3 collapse" id="9594bd33-6fc8-4ff0-8dc0-13f0b4cfa7d4">
-        <h6 id="4c9fc76d-03de-49da-b2d4-2014d5e6e410">
+       <pre id="dd14e658-db93-4358-a972-b06cbb1efe28"><code a="" c="" l="" s=" p y t h o n ">as_info()</code></pre>
+       <div class="ml-3 collapse" id="f669a3b4-e088-43df-8b96-1247a934772a">
+        <h6 id="4a437a1a-94c2-4e66-943f-71387e76c47d">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="94a60a91-bb46-4e94-aa2c-3b5ea0da0514">
+        <table class="table table-sm bg-light" id="d3249981-09c6-4a0c-bee5-7b69a14ead26">
          <thead>
           <tr>
            <th scope="col">
@@ -1103,43 +2657,43 @@ button = ("Dark").as_dark()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="75711c4e-c9db-416e-9513-a4fc40f61999">
-        <h6 id="dda71c09-7fcc-4ac4-bf0e-d47c3000bf58">
+       <div class="ml-3" id="7906ec19-bfd1-4386-bf82-2fc9bc24f911">
+        <h6 id="4f6e207f-510a-4a0e-b5d6-e6d106e098e0">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="fe329dff-7b61-4b22-bb90-97cfea9ae325"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="d2dbaf65-f8f6-42e3-82ca-ec2caec64734"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Info").as_info()</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="30d6939f-160c-499f-bc5a-8e69f1d9c568">
-       <div class="d-flex justify-content-between" id="6d607dfc-1775-4c2b-9cb4-894b9e4165d7">
-        <h4 id="4888c9da-6f49-41aa-b179-c7e16169d0f7">
+      <div class="mt-5" id="d91fba26-3bd9-4eee-8b02-f56f81211240">
+       <div class="d-flex justify-content-between" id="4c11b6b7-efa3-4e8b-8a27-0d73bde84dab">
+        <h4 id="842e9fd6-2149-4fb0-9a45-a7c654e61a46">
          Method
-         <span class="text-primary" id="da908cc0-a608-4214-9285-f96074eacbec">
+         <span class="text-primary" id="d49b758c-f23d-4af2-8e27-f8301d0f1010">
           as_light
          </span>
         </h4>
-        <div id="8bb05a72-7f68-49a5-b470-8a4adcd5e1e6">
-         <button class="btn-sm btn btn-outline-primary" data-target="#256d68ce-b2e2-4a65-bd01-ddbfdcc81c5c" data-toggle="collapse" id="bc8cae9a-7276-4a90-a0f1-b3c98e0f2e36" onclick="return false;" type="button">
+        <div id="85aa7a1b-86e9-46fa-ad8b-1beb045a2fcc">
+         <button class="btn-sm btn btn-outline-primary" data-target="#d0c20fd2-c133-4c5c-9a5c-afdbff50d698" data-toggle="collapse" id="3db28c6a-e59e-44d0-8daa-5c3ca99ba9f6" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="28a6fef8-d965-43aa-9e5d-ab2fdc4fc6f7">
+       <span class="text-muted" id="391f30b0-2e43-4ecd-91e0-20495ef2d1da">
         Makes the 'light' look to a web components.
        </span>
-       <pre id="5ab3ab14-78f4-4b25-a6f6-935c80a2f726"><code a="" c="" l="" s=" p y t h o n ">as_light()</code></pre>
-       <div class="ml-3 collapse" id="256d68ce-b2e2-4a65-bd01-ddbfdcc81c5c">
-        <h6 id="c332c062-88e5-4479-bbd1-c9d04e56ee12">
+       <pre id="8f3332b3-2901-4eda-97d3-9be51fd32891"><code a="" c="" l="" s=" p y t h o n ">as_light()</code></pre>
+       <div class="ml-3 collapse" id="d0c20fd2-c133-4c5c-9a5c-afdbff50d698">
+        <h6 id="33e3cc86-7acb-470f-b600-33f4b93f175a">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="312db136-bf13-4801-bddb-f4cdb4ec3d9d">
+        <table class="table table-sm bg-light" id="3936ef3a-c427-4da8-9a69-3aaaa5e94a0c">
          <thead>
           <tr>
            <th scope="col">
@@ -1172,43 +2726,43 @@ button = ("Info").as_info()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="0cce8fcd-299d-457a-88aa-378ad7d0ec1a">
-        <h6 id="0b7f984d-abf7-4556-954f-698975e7caf7">
+       <div class="ml-3" id="85e1549a-dd06-494b-ab57-440da7adba1d">
+        <h6 id="8a724194-ed63-4cf4-8501-237188430698">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="0a9c79f4-1445-44cd-a6b9-17e4b64893d9"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="c9da7b4c-5a34-4d57-9185-27e4f62c3fa2"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Light").as_light()</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="aab3942a-f482-4e48-9a15-4eb1ed84a4cf">
-       <div class="d-flex justify-content-between" id="0d86ce50-99b6-4385-9d46-4a627ccc6a0f">
-        <h4 id="13104c73-0e75-4e00-a1f2-10c732e18608">
+      <div class="mt-5" id="a5aadc31-e5ac-4428-8f7b-03a978220841">
+       <div class="d-flex justify-content-between" id="71c46a40-31ef-4cde-a506-1fbdba839807">
+        <h4 id="0483f62e-b724-48e5-8511-78cd2ad63155">
          Method
-         <span class="text-primary" id="45b9dfb2-2c10-43da-ba1f-aff2d6ceef86">
+         <span class="text-primary" id="13a9ab52-9335-47a3-9054-6087e1ab9016">
           as_primary
          </span>
         </h4>
-        <div id="2865a93b-2231-4b5d-9748-1151b1529d24">
-         <button class="btn-sm btn btn-outline-primary" data-target="#f3dd505d-4c98-4351-ab76-903da6a9397c" data-toggle="collapse" id="e36ad974-9b9b-4d1b-93b1-8be48d93da89" onclick="return false;" type="button">
+        <div id="3d958d40-5ccc-47b5-8990-9192a1455aa8">
+         <button class="btn-sm btn btn-outline-primary" data-target="#cd28247f-85f6-49a6-8720-951eada84f3e" data-toggle="collapse" id="4a43bdf7-41b6-400c-b2bf-8f9f404a3944" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="6edb1f07-5167-454d-9457-58caeba09774">
+       <span class="text-muted" id="b18874a0-b653-4cbb-9e99-0dcfa7a8ea3a">
         Makes the 'primary' look to a web components.
        </span>
-       <pre id="2259ad7b-b71c-4976-bfa8-e1bbb7ede229"><code a="" c="" l="" s=" p y t h o n ">as_primary()</code></pre>
-       <div class="ml-3 collapse" id="f3dd505d-4c98-4351-ab76-903da6a9397c">
-        <h6 id="96b0ae3b-2079-49c8-aaff-30892cf33d6c">
+       <pre id="b4273af0-e592-4535-bff1-34b1bacab23a"><code a="" c="" l="" s=" p y t h o n ">as_primary()</code></pre>
+       <div class="ml-3 collapse" id="cd28247f-85f6-49a6-8720-951eada84f3e">
+        <h6 id="684b889b-ae01-4bc5-82ac-1e7ecd865d1a">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="91cbb002-2b2d-484d-bfc0-e25b27911230">
+        <table class="table table-sm bg-light" id="6037b8d7-1398-4526-a0ae-557cf9370f4e">
          <thead>
           <tr>
            <th scope="col">
@@ -1241,43 +2795,43 @@ button = ("Light").as_light()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="5b2b862c-e0b3-4c01-85b5-cd330aabc93c">
-        <h6 id="bac17cfb-e33e-4748-ad66-9f9f72b9959f">
+       <div class="ml-3" id="6825ef39-df8c-4c95-b81d-91ed2f622ed4">
+        <h6 id="900a6336-9430-497b-b072-5f361b86cc11">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="db28c369-708c-4690-afd9-49833c532302"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="3eb985a4-1283-41f9-acd4-90e257f9cc0f"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Primary").as_primary()</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="97dd7ff9-9b0b-4564-98a1-accb4d82b565">
-       <div class="d-flex justify-content-between" id="6bdf9994-2a2f-4169-ba13-451b88dbf1cd">
-        <h4 id="f4a18c9e-3f26-42d4-a53d-8e23f2a28cdb">
+      <div class="mt-5" id="af9fe8ba-1c0b-42b0-88e1-e8477f69442a">
+       <div class="d-flex justify-content-between" id="83e9d86c-7536-4a8c-a89c-e22d4ce3a541">
+        <h4 id="3c5929d4-b47b-4786-93fc-11d9d867c656">
          Method
-         <span class="text-primary" id="00faa11e-498f-4415-b51e-b62e7879bb3d">
+         <span class="text-primary" id="1df414fd-c96b-4448-a581-27966d7260e9">
           as_secondary
          </span>
         </h4>
-        <div id="1af3949c-db90-42d8-a2d3-22c55c2f8665">
-         <button class="btn-sm btn btn-outline-primary" data-target="#66373d10-8930-4dae-8331-0a4e79fea9aa" data-toggle="collapse" id="2bae7cf0-e9cb-455b-9389-3b7a3a947d18" onclick="return false;" type="button">
+        <div id="25b67b80-27f9-4145-be3b-a43f41a9d5e4">
+         <button class="btn-sm btn btn-outline-primary" data-target="#7539c894-c58d-4a5f-aecc-2d4a15bf0400" data-toggle="collapse" id="8c82b253-8792-4d89-9c96-ff24620df3ed" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="2c6485fb-b6bf-48c2-86cd-7ed1cae23427">
+       <span class="text-muted" id="badd20bd-6d9b-43e6-ba70-307a0f88cd87">
         Makes the 'secondary' look to a web components.
        </span>
-       <pre id="a5d1bceb-f8a8-4c3c-b095-7d395510ac84"><code a="" c="" l="" s=" p y t h o n ">as_secondary()</code></pre>
-       <div class="ml-3 collapse" id="66373d10-8930-4dae-8331-0a4e79fea9aa">
-        <h6 id="abce5a8e-0802-4eec-b8de-74f8c1b0456e">
+       <pre id="adee9e51-1834-49e0-93f2-6211b972ca52"><code a="" c="" l="" s=" p y t h o n ">as_secondary()</code></pre>
+       <div class="ml-3 collapse" id="7539c894-c58d-4a5f-aecc-2d4a15bf0400">
+        <h6 id="b381923a-426c-4403-881e-61577dc9c1c1">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="79abef85-f525-40a4-b6f1-2714e0fed3b8">
+        <table class="table table-sm bg-light" id="e7e8c3f1-2c75-4e78-82ef-9380fb0d6b4a">
          <thead>
           <tr>
            <th scope="col">
@@ -1310,43 +2864,43 @@ button = ("Primary").as_primary()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="ba9ed12e-5ae7-4cea-ac23-06437440837e">
-        <h6 id="555a8828-bf4f-4455-b790-b587be12d571">
+       <div class="ml-3" id="aee34908-5a66-4902-b0eb-40589cfe5554">
+        <h6 id="1563c6b2-716c-4490-8fb7-bc3c47e2f3a0">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="53512ab6-637f-49b0-9a5f-73fcc84de14b"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="55e2a848-d202-4b81-961a-3c9a4b98c584"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Secondary").as_secondary()</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="d4dcc7ad-1c57-4894-83cd-e5f873d82ead">
-       <div class="d-flex justify-content-between" id="d6d40cb8-7d09-4d09-b189-2cf17bf9daf7">
-        <h4 id="4efe988f-404d-4466-91d9-1fa5c8a8b519">
+      <div class="mt-5" id="dfeab083-5789-4c0d-b117-9121ab5479fd">
+       <div class="d-flex justify-content-between" id="230be3e4-d78f-43b1-9920-757f1f64f1bb">
+        <h4 id="23876d89-69a4-4665-b1b3-de89bd81c5f1">
          Method
-         <span class="text-primary" id="0ca88409-209c-4381-bd3e-b375ff2faa48">
+         <span class="text-primary" id="9f3d9e34-4f60-4970-8d57-542cda0a1399">
           as_success
          </span>
         </h4>
-        <div id="6a969ba1-099b-43b0-a40a-101d0cc6f5d6">
-         <button class="btn-sm btn btn-outline-primary" data-target="#d72ef06f-79ff-48db-8a50-4d8cd6d1a7af" data-toggle="collapse" id="fa93900d-919f-49b2-b9d5-1eaba52554b8" onclick="return false;" type="button">
+        <div id="89b6a388-dca8-41cd-a123-c59a9820deff">
+         <button class="btn-sm btn btn-outline-primary" data-target="#82a62b21-21ac-4817-bb26-73f4d5b171f2" data-toggle="collapse" id="88127b01-b575-404d-96be-975d67af641a" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="efc5c76c-6c50-4cfe-913f-46403bf2e311">
+       <span class="text-muted" id="eff11339-92e2-49d2-a6ad-dabc9a8eacd5">
         Makes the 'success' look to a web components.
        </span>
-       <pre id="f33039c6-ab05-421c-8711-38a21231da3e"><code a="" c="" l="" s=" p y t h o n ">as_success()</code></pre>
-       <div class="ml-3 collapse" id="d72ef06f-79ff-48db-8a50-4d8cd6d1a7af">
-        <h6 id="a927c73b-b489-4f5e-9b74-8391f0845878">
+       <pre id="86c14b26-ff85-4961-b143-188a61f5c01b"><code a="" c="" l="" s=" p y t h o n ">as_success()</code></pre>
+       <div class="ml-3 collapse" id="82a62b21-21ac-4817-bb26-73f4d5b171f2">
+        <h6 id="54ab38ca-f82f-4533-b37c-272069fffa3d">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="2a09a990-180b-4cbe-94c0-1d0e5358f342">
+        <table class="table table-sm bg-light" id="9e09bf7d-4f39-4f60-b4b9-6c07367052d0">
          <thead>
           <tr>
            <th scope="col">
@@ -1379,43 +2933,43 @@ button = ("Secondary").as_secondary()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="2a31eb32-48e0-4a69-85cf-39e8b1027d9a">
-        <h6 id="c0ea86a2-a84c-4115-a4a5-ce4ac989d6a1">
+       <div class="ml-3" id="a59f056c-132a-4fac-bfff-670196fe7087">
+        <h6 id="07975088-bebd-4a9f-befa-cbb42aec5546">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="afe4e0ee-2663-4002-bcca-ab3f052d1869"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="53c70bd0-eb4f-453d-b4a5-724577cbc389"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Success").as_success()</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="65694a27-67fe-4c6b-9036-a3a3d08c9684">
-       <div class="d-flex justify-content-between" id="3973bacd-6627-43a0-95af-a37a860760fb">
-        <h4 id="f88f8167-5dbd-46d2-8e06-0c29fa6449cd">
+      <div class="mt-5" id="bbaa785f-033f-49c0-84e0-5b03adba77ed">
+       <div class="d-flex justify-content-between" id="abbb967b-7d34-47cb-9ec4-5d1208121cdf">
+        <h4 id="b09b00ad-e729-4c54-a8cc-8ccc92dcd71b">
          Method
-         <span class="text-primary" id="0ed6cc0d-3724-4e23-9e40-1c47bac2d68b">
+         <span class="text-primary" id="0c2d555b-12d8-413c-8f6f-2f8d781004df">
           as_warning
          </span>
         </h4>
-        <div id="f5b093ea-68d6-42ee-8c7d-d3a2179de102">
-         <button class="btn-sm btn btn-outline-primary" data-target="#c4b3a728-f22e-4921-a706-81edd50ffee3" data-toggle="collapse" id="8f903a7f-6ce9-4cb1-b1c3-24ee6b8769e0" onclick="return false;" type="button">
+        <div id="77b56113-7511-456f-8ef7-36939571c5db">
+         <button class="btn-sm btn btn-outline-primary" data-target="#ad20c1e7-b64a-4121-880b-a2a56899431a" data-toggle="collapse" id="7bc12d05-a00e-4b38-80b5-aad2e99fea49" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="8661b55e-ec26-4331-b74c-6d174dd27d58">
+       <span class="text-muted" id="6c45f13f-e147-4b0d-9c9d-3994ed029c12">
         Makes the 'warning' look to a web components.
        </span>
-       <pre id="c9eeb964-4a5e-4f75-93f8-2c5fd5601da0"><code a="" c="" l="" s=" p y t h o n ">as_warning()</code></pre>
-       <div class="ml-3 collapse" id="c4b3a728-f22e-4921-a706-81edd50ffee3">
-        <h6 id="3bc527f9-459c-4f85-b172-2c81154b6fc9">
+       <pre id="c958e208-a10b-4421-8a3e-f48330ad17ef"><code a="" c="" l="" s=" p y t h o n ">as_warning()</code></pre>
+       <div class="ml-3 collapse" id="ad20c1e7-b64a-4121-880b-a2a56899431a">
+        <h6 id="a7eada81-ab2f-46a4-a61d-daa38510393c">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="63628e16-7fa8-4a9d-a4ad-5f8895b86d9a">
+        <table class="table table-sm bg-light" id="f2679377-94d7-4d5a-abd5-5f720b6f7f19">
          <thead>
           <tr>
            <th scope="col">
@@ -1448,13 +3002,13 @@ button = ("Success").as_success()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="d5cbcf9b-6c48-4a12-bfbb-761ec1bf7dca">
-        <h6 id="509ff95f-762a-45ee-90aa-3fa5e6e98efb">
+       <div class="ml-3" id="009189c3-9612-4859-b63b-7eb498efcc29">
+        <h6 id="12052659-f294-4426-a379-9571f1fcf435">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="bc9fb6c3-2447-4411-8d8c-950b528e7f7c"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="b5b4d6a1-67f2-4810-8b29-5e057c38e17a"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Warning").as_warning()</code></pre>
@@ -1462,24 +3016,26 @@ button = ("Warning").as_warning()</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="db9215a9-a88f-4e47-a898-64e256cb23be">
-     <div class="mt-5" id="3bdde09e-10a4-4fe7-ae44-697db9a31d7d">
-      <div class="d-flex justify-content-between" id="eb143caf-927a-4f66-9c34-fa12be7f9e91">
-       <h1 id="185d5500-2778-471d-9f49-6ce371fb6f9e">
+    <div class="tab-pane fade" id="f627481f-1b99-4224-a9f2-fe89d4087681">
+     <div class="mt-5" id="5fb667a9-d8c9-47d2-85ea-fc2c07013dd9">
+      <div class="d-flex justify-content-between" id="6e9bc8fe-73ae-4f53-b590-feaff22fba83">
+       <h1 id="8c9b6f85-8094-4e17-93ae-c7835e75583b">
         Class
-        <span class="text-primary" id="23c4805a-2f16-4717-ad90-60399f69e999">
-         <span id="7a12a177-90b5-4771-9db3-6a89ee9d48da">
+        <span class="text-primary" id="2f87ba68-e867-487b-b1cc-9a9420aa5829">
+         <span id="61f4282d-04b4-4710-b6bb-dd2b1b6e3bce">
           OutlineMixin
          </span>
         </span>
        </h1>
-       <div id="e405d041-c8d4-4aa8-a4f5-70f29dac6e6e">
+       <div id="63b6efda-d1fd-4ca8-82e8-d0320a790a79">
        </div>
       </div>
-      <span class="text-muted" id="4a3a1405-29d9-4584-8cf7-1fcfbba8d446">
+      <span class="text-muted" id="770e3766-5fd4-4bd4-94e1-80da971e6fc9">
        Mixin for a web component that can be surrounded by a border.
-    
-    Usually
+      </span>
+      <pre id="c52bb9cf-001c-4998-9b65-dca4e764ed83"><code a="" c="" l="" s=" p y t h o n ">OutlineMixin()</code></pre>
+      <p id="b853f730-723f-419b-8bd4-cb664d892118">
+       Usually
        <code>
         OutlineMixin
        </code>
@@ -1489,33 +3045,32 @@ button = ("Warning").as_warning()</code></pre>
        </code>
        to
     specify the border appearance.
-      </span>
-      <pre id="a278a986-dc49-4fa5-82e9-edd6e2a8bd0f"><code a="" c="" l="" s=" p y t h o n ">OutlineMixin()</code></pre>
-      <div class="mt-5" id="e734adf4-616a-4a15-ac30-d667089d0b3d">
-       <div class="d-flex justify-content-between" id="8a607742-d444-4370-879f-84ee7abf258e">
-        <h4 id="d3e4dcdb-1841-4b52-bab7-9bf00c0c154b">
+      </p>
+      <div class="mt-5" id="775ecf03-70b3-44f9-bc0c-7f4cf96b2f04">
+       <div class="d-flex justify-content-between" id="d09deb0d-f5a0-4d8f-905f-89aea62207e6">
+        <h4 id="6f2d59ae-f73e-4884-b7a2-b4e9c33c9332">
          Method
-         <span class="text-primary" id="010245bb-05b1-492d-908e-8c4e00bb65f4">
+         <span class="text-primary" id="52036bc9-e836-4bc3-867f-9a16d5b7bc1d">
           as_outline
          </span>
         </h4>
-        <div id="fa935c23-ca4c-4144-9989-046c515c7f4c">
-         <button class="btn-sm btn btn-outline-primary" data-target="#d97d1402-b830-4bab-9fc5-dfafb93894e6" data-toggle="collapse" id="85d39f27-8c10-4447-b761-50e9539796ec" onclick="return false;" type="button">
+        <div id="ce00ccb2-eb60-4def-ab13-728951fee6b6">
+         <button class="btn-sm btn btn-outline-primary" data-target="#68b81b2f-0933-4653-99a4-b04c5dfb43a7" data-toggle="collapse" id="4ac48afb-ae09-40f1-b58b-7e24cce0cd07" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="125696d1-0a3f-495d-9943-adf5dc359883">
+       <span class="text-muted" id="2125eb70-a401-4fc7-bbab-001e1e8d8c26">
         Makes the web component surrounded by a border.
        </span>
-       <pre id="af171dfe-a06b-4939-9d0c-d8b8e346c1a3"><code a="" c="" l="" s=" p y t h o n ">as_outline()</code></pre>
-       <div class="ml-3 collapse" id="d97d1402-b830-4bab-9fc5-dfafb93894e6">
-        <h6 id="cb463150-a85b-4186-ae93-48830199d156">
+       <pre id="8e74d459-3ea8-49c0-bc51-ee095e77f6d9"><code a="" c="" l="" s=" p y t h o n ">as_outline()</code></pre>
+       <div class="ml-3 collapse" id="68b81b2f-0933-4653-99a4-b04c5dfb43a7">
+        <h6 id="dfffa919-63ef-4254-9c96-07b642e50304">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="bcadb2ea-2ed2-4cb5-9d0a-4fdae5160c47">
+        <table class="table table-sm bg-light" id="a1e28a1d-8c4d-4662-851f-ea104f0723f8">
          <thead>
           <tr>
            <th scope="col">
@@ -1548,13 +3103,13 @@ button = ("Warning").as_warning()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="5cc42a45-0836-4ff9-9dc1-261393c043f5">
-        <h6 id="8127acd1-60e6-4ad1-a104-d0a0db81e485">
+       <div class="ml-3" id="68c088f6-9e98-4e77-bdc1-0b3456d5fbcf">
+        <h6 id="73d901d7-f9d7-4f92-97e0-75e0314a0e74">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="673cb2de-c1c5-445f-9f46-02f13025b720"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="3773e657-be8a-42ec-9000-24cda7e0a02f"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Primary").as_primary().as_outline()</code></pre>
@@ -1562,53 +3117,53 @@ button = ("Primary").as_primary().as_outline()</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="1827ccf3-39f1-4190-a234-de0af4477899">
-     <div class="mt-5" id="6639638e-9e5c-4eef-90df-997d80362fef">
-      <div class="d-flex justify-content-between" id="8e5acd26-8ba2-4a45-8a62-7e15bb2ef735">
-       <h1 id="68f36da3-5e80-495f-803a-e4a4a8d73699">
+    <div class="tab-pane fade" id="9ce59773-a9fe-48b6-a096-e7f285cf4e2b">
+     <div class="mt-5" id="0f61457b-3e5d-4f28-af06-5de9ac2f9ed3">
+      <div class="d-flex justify-content-between" id="c5bb8c71-4edb-461b-b165-771790d4db3d">
+       <h1 id="41754178-bc51-47d2-af91-2a43f0f87fc8">
         Class
-        <span class="text-primary" id="a21f3599-5979-4e0f-9d10-58d3986bd301">
-         <span id="3fb1472c-e0e5-42c4-9453-83e4d7e009c4">
+        <span class="text-primary" id="747a5174-beab-4444-9f47-d992d3e4cc62">
+         <span id="e616b64b-6a26-48bb-86e4-4fa4aab44a6b">
           AvailabilityMixin
          </span>
         </span>
        </h1>
-       <div id="4bcff0f7-5086-46af-b55a-93ddb7917436">
+       <div id="f441ea21-ca3a-4c87-b8c1-775e5966d094">
        </div>
       </div>
-      <span class="text-muted" id="d79c7aa5-b6b9-498c-b2e5-60274f6f288f">
+      <span class="text-muted" id="6ef6e1bf-5be0-4b3b-b6fe-244b1189caed">
        Mixin for a web component which can be enabled or disabled.
       </span>
-      <pre id="18fb7df6-a92a-42c1-9003-7a51c1d6b44c"><code a="" c="" l="" s=" p y t h o n ">AvailabilityMixin()</code></pre>
-      <p id="b373c475-be5c-4404-b6f1-ef24254da8ad">
+      <pre id="7010d508-8dcf-4fc7-9ddf-598b4a9b4b3c"><code a="" c="" l="" s=" p y t h o n ">AvailabilityMixin()</code></pre>
+      <p id="d4f4a3bf-0778-4b1b-bf0c-0cafbcd50c6b">
        By default, every web component is enabled. The web components inheriting
     this class can be forced to be disabled.
       </p>
-      <div class="mt-5" id="64289397-a7c6-4355-a723-9f1e82aabb3f">
-       <div class="d-flex justify-content-between" id="aa5bdb99-789c-42df-bcc5-ba8ffcf985ab">
-        <h4 id="605d65bc-3a13-4626-999a-ddf9039ee141">
+      <div class="mt-5" id="96f6c9e6-42bc-40ea-83fa-45aca48e2025">
+       <div class="d-flex justify-content-between" id="5d450f24-c88d-4851-89bf-26432f9bef92">
+        <h4 id="42e7f00f-bc50-4170-9d42-b19501b470dc">
          Method
-         <span class="text-primary" id="447c7778-8d43-4d8c-ad43-f8445bf6cd72">
+         <span class="text-primary" id="54c08362-909b-4bb9-8a9e-5240d0539b36">
           as_disabled
          </span>
         </h4>
-        <div id="4ce4d12c-31ea-45a8-9f8c-821bc9f8f6f7">
-         <button class="btn-sm btn btn-outline-primary" data-target="#25739d46-1e45-4fd8-b8af-d34a875a2ef5" data-toggle="collapse" id="695f1995-fd70-4006-b76a-7369095e9183" onclick="return false;" type="button">
+        <div id="58fec381-b702-4cdb-8226-af68a39fbeb3">
+         <button class="btn-sm btn btn-outline-primary" data-target="#ec4dd694-d91b-4f72-ae2f-c903269e68b5" data-toggle="collapse" id="c5c7fa50-6733-4492-a6f8-f39963062f1d" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="cbe93bb0-80ee-4f34-a23d-000ec3200c4d">
+       <span class="text-muted" id="0d9fed33-2149-465f-9fb8-8987535a6435">
         Disables a web component.
        </span>
-       <pre id="10047028-c1bf-4506-852f-a10c006fcf5b"><code a="" c="" l="" s=" p y t h o n ">as_disabled()</code></pre>
-       <div class="ml-3 collapse" id="25739d46-1e45-4fd8-b8af-d34a875a2ef5">
-        <h6 id="d45c8e27-823e-4e61-9d13-3a13d8237007">
+       <pre id="418e8d2c-3dc6-4ed0-b4b9-84e236cabcbf"><code a="" c="" l="" s=" p y t h o n ">as_disabled()</code></pre>
+       <div class="ml-3 collapse" id="ec4dd694-d91b-4f72-ae2f-c903269e68b5">
+        <h6 id="9a3becdc-46dd-438e-b0f0-fb8be6b67f07">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="81e92cae-a559-4483-872a-503437aecab0">
+        <table class="table table-sm bg-light" id="9215f875-03a2-4117-8dac-ecebeda33976">
          <thead>
           <tr>
            <th scope="col">
@@ -1641,13 +3196,13 @@ button = ("Primary").as_primary().as_outline()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="97290fa3-4afc-458b-ab1a-24f2d5dbda34">
-        <h6 id="8ec6acc4-75b0-4aec-8cad-387da667ea74">
+       <div class="ml-3" id="d717fbcc-7c23-4e17-a862-3b15bdddccb4">
+        <h6 id="e62cb21b-d458-4ee5-b2ff-beb36acca15f">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="4519f907-0e01-42ea-ab93-e86ab746e0b6"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
+        <pre id="52e123aa-f105-4b73-8f72-0bb888ddc907"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Primary").as_disabled()</code></pre>
@@ -1655,23 +3210,23 @@ button = ("Primary").as_disabled()</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="1a1c328b-5c93-48b1-a274-55d92a2c13a6">
-     <div id="4416a470-96f5-490a-8d7a-0025e22404d4">
+    <div class="tab-pane fade" id="33074b55-ae94-46ab-bc37-2549577d762f">
+     <div id="8a51c679-8060-48a9-bc88-1c151de42d91">
       <hr/>
-      <ul class="nav" id="8a18da9d-edbf-4a86-b8a8-3fb27c885611" role="tablist">
+      <ul class="nav" id="420eb3a9-4f14-4147-b663-5ce7ea4fc0eb" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-target="#9f4daba6-4b0f-4234-9f42-d1789152d15d" data-toggle="tab" href="#9f4daba6-4b0f-4234-9f42-d1789152d15d" id="4d1e19e7-32c9-49d2-9a84-cdbb417bb246">
-         <span class="text-secondary" id="47c333c5-1973-413b-a16e-cc61605077ed">
-          <span id="24cac557-09ce-4025-bfdf-18555a48ea49">
+        <a class="nav-link active" data-target="#2d34dba5-73b8-43e9-b101-f61273e2fdea" data-toggle="tab" href="#2d34dba5-73b8-43e9-b101-f61273e2fdea" id="0be0f955-4d19-4c62-ba1c-1fe248c5d5bf">
+         <span class="text-secondary" id="8cb1b20d-ffb8-46f8-ae4a-1319ff3c147a">
+          <span id="9abfb0bf-ad62-4fc7-93c9-dc60f3f483de">
            Breakpoint
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#7f7fdd5e-bc4f-47fc-bc02-1a2608971e37" data-toggle="tab" href="#7f7fdd5e-bc4f-47fc-bc02-1a2608971e37" id="2643c5fd-424f-4037-934f-c740870b369e">
-         <span class="text-secondary" id="1b3ff470-ef2b-43a3-bf44-aa30df4477a7">
-          <span id="bb03275a-50db-416e-b0cb-41207a0f018a">
+        <a class="nav-link" data-target="#a06cc655-1490-442b-9bbf-50bb45e5ce68" data-toggle="tab" href="#a06cc655-1490-442b-9bbf-50bb45e5ce68" id="10d7e220-e70b-4590-84fe-6675db6e4087">
+         <span class="text-secondary" id="cea6699e-d1b5-48c6-9054-c5761f72b031">
+          <span id="88033440-4a49-4846-ad59-3b02805be36f">
            Action
           </span>
          </span>
@@ -1679,39 +3234,39 @@ button = ("Primary").as_disabled()</code></pre>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="9f4daba6-4b0f-4234-9f42-d1789152d15d">
-        <div class="mt-5" id="0df0df0c-345f-4853-ba42-81182ec3f343">
-         <div class="d-flex justify-content-between" id="987a8c61-e851-4cbd-90ac-50dda816e4e7">
-          <h1 id="6fbe49a1-15e4-496c-978b-ffcd55bcfe5c">
+       <div class="tab-pane fade active show" id="2d34dba5-73b8-43e9-b101-f61273e2fdea">
+        <div class="mt-5" id="d0f7eb52-b014-4141-a863-4aa9705b8259">
+         <div class="d-flex justify-content-between" id="4cf27478-dd0c-4a32-9c2c-978885e12638">
+          <h1 id="061fb242-d754-4463-aac3-3c84af2a6672">
            Class
-           <span class="text-primary" id="c23133b0-4cce-4a5b-b0de-3c50de4faf96">
-            <span id="24cac557-09ce-4025-bfdf-18555a48ea49">
+           <span class="text-primary" id="206cd2f3-bf48-4db2-be52-28d1a8d1a051">
+            <span id="9abfb0bf-ad62-4fc7-93c9-dc60f3f483de">
              Breakpoint
             </span>
            </span>
           </h1>
-          <div id="42043718-214c-44bd-af0a-c06604974123">
+          <div id="447ac798-e6e5-4489-9448-2f6fed876d03">
           </div>
          </div>
-         <span class="text-muted" id="c9b3ebfe-be7d-464e-8f1f-5a139b0c9f3a">
+         <span class="text-muted" id="7c2b4f68-9c38-44aa-9c7f-6965eb44e8e8">
           The breakpoint constants.
          </span>
-         <p id="bff4a397-5c73-4dfa-8b79-58f635ed6d7e">
+         <p id="ce56ebe2-03f7-4b2e-977f-38dce8d628d0">
           Breakpoints are defined by Bootstrap and mostly based on minimum
     viewport widths and allow us to scale up elements as the viewport
     changes.
          </p>
-         <p id="f1b182b6-7b70-4ce1-90ef-0889fc77d896">
+         <p id="ee6d5c1b-003e-482a-9b50-7572e7fe0cea">
           See
           <a href="https://getbootstrap.com/docs/4.0/layout/overview/#responsive-breakpoints">
            Bootstrap documentation
           </a>
           for more information.
          </p>
-         <div id="cca11d4b-3709-42a1-8fb5-d7bb1d4bba00">
+         <div id="a56ca08b-f15e-4926-a6cd-25908f4a3cfe">
           <div class="row">
            <div class="col-md">
-            <div class="border p-1 m-1 text-center" id="e32dd7ea-68b1-4f38-acde-c275d4897528">
+            <div class="border p-1 m-1 text-center" id="e734cfb4-8dd5-4d0e-b060-d8f646a9fb19">
              Breakpoint.
              <strong class="text-primary">
               LG
@@ -1719,7 +3274,7 @@ button = ("Primary").as_disabled()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div class="border p-1 m-1 text-center" id="469a234f-25c0-4b20-878b-1b76f0980fc9">
+            <div class="border p-1 m-1 text-center" id="525f9da0-945b-41a0-98cd-9c1673416acd">
              Breakpoint.
              <strong class="text-primary">
               MD
@@ -1727,7 +3282,7 @@ button = ("Primary").as_disabled()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div class="border p-1 m-1 text-center" id="75508bdc-62ea-4ade-87a7-890fcb1f3466">
+            <div class="border p-1 m-1 text-center" id="c23d6e5d-e4c4-4a68-a29d-f0f9f89e6029">
              Breakpoint.
              <strong class="text-primary">
               SM
@@ -1735,7 +3290,7 @@ button = ("Primary").as_disabled()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div class="border p-1 m-1 text-center" id="b6a95f78-9433-40f0-8787-ad6e1a2595b3">
+            <div class="border p-1 m-1 text-center" id="40ec951a-8624-448c-97a7-cf755eccb752">
              Breakpoint.
              <strong class="text-primary">
               XL
@@ -1743,7 +3298,7 @@ button = ("Primary").as_disabled()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div class="border p-1 m-1 text-center" id="efd01be3-ee26-4dc3-8f87-9451ddd605e9">
+            <div class="border p-1 m-1 text-center" id="e5bafb39-cdc2-48c6-8da1-eb4372a0e0cd">
              Breakpoint.
              <strong class="text-primary">
               XS
@@ -1754,27 +3309,27 @@ button = ("Primary").as_disabled()</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="7f7fdd5e-bc4f-47fc-bc02-1a2608971e37">
-        <div class="mt-5" id="deecc118-a54e-4b9e-9189-9dd5e38b8952">
-         <div class="d-flex justify-content-between" id="2f247277-37d2-49a4-aae3-9d63d7fe491e">
-          <h1 id="7a5099f9-9352-47fb-af0b-3eb3407f3b5f">
+       <div class="tab-pane fade" id="a06cc655-1490-442b-9bbf-50bb45e5ce68">
+        <div class="mt-5" id="0402bdc3-6ec2-489c-b0be-fb0af0b79a68">
+         <div class="d-flex justify-content-between" id="4b0a4892-7a20-4cd0-863a-189d14a1d977">
+          <h1 id="88c3dd09-06a6-4804-b57a-1b7a15665681">
            Class
-           <span class="text-primary" id="4f5a226d-43f4-4a1d-91c2-20052e98a931">
-            <span id="bb03275a-50db-416e-b0cb-41207a0f018a">
+           <span class="text-primary" id="c5d96f6b-8d63-4ab9-a768-cfae15995dd1">
+            <span id="88033440-4a49-4846-ad59-3b02805be36f">
              Action
             </span>
            </span>
           </h1>
-          <div id="8757f981-da5a-4849-a549-1ef7300cbf3f">
+          <div id="af843f42-e3d9-4f03-afc6-dad1d50f0fcd">
           </div>
          </div>
-         <span class="text-muted" id="0bb56d49-673a-4deb-8fb9-8ab0e133e5bb">
+         <span class="text-muted" id="1951d732-3eeb-4187-92d3-462c272a3076">
           The action constants.
          </span>
-         <div id="e87369af-39e1-4440-a115-db3ddc1e31cc">
+         <div id="a1810ac9-b08e-47a4-aa3c-49a81c2e00a1">
           <div class="row">
            <div class="col-md">
-            <div class="border p-1 m-1 text-center" id="2c435969-ba38-4ada-8cf6-be57066b8255">
+            <div class="border p-1 m-1 text-center" id="346da325-b881-462a-957c-5261823b5fbe">
              Action.
              <strong class="text-primary">
               DISMISS
@@ -1782,7 +3337,7 @@ button = ("Primary").as_disabled()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div class="border p-1 m-1 text-center" id="025d61d5-9ecb-4cd6-8068-dfe5d08cce3d">
+            <div class="border p-1 m-1 text-center" id="212b3cc4-8ae4-4267-a814-66b3c5fd9fe7">
              Action.
              <strong class="text-primary">
               LINK
@@ -1790,7 +3345,7 @@ button = ("Primary").as_disabled()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div class="border p-1 m-1 text-center" id="1af71b31-85aa-4ffa-bf77-5a257faad807">
+            <div class="border p-1 m-1 text-center" id="90575347-5355-43bc-bf41-58475e46ab20">
              Action.
              <strong class="text-primary">
               SUBMIT
@@ -1798,7 +3353,7 @@ button = ("Primary").as_disabled()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div class="border p-1 m-1 text-center" id="cdfa89bd-be37-4706-a77c-5a955a00a1ba">
+            <div class="border p-1 m-1 text-center" id="2a64647c-72cd-4c95-8b52-b30ee5c70a53">
              Action.
              <strong class="text-primary">
               TOGGLE
diff --git a/docs/components.html b/docs/components.html
index 1790b18..35b5e92 100644
--- a/docs/components.html
+++ b/docs/components.html
@@ -21,8 +21,8 @@
  </head>
  <body>
   <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
-   <img alt="Bootwrap Logo" id="74d18bc1-d406-4361-b87a-5bc8da4c37a2" src="logo.png" width="32"/>
-   <span class="text-light" id="055a783e-af88-443c-b05a-4c9ccb04072e">
+   <img alt="Bootwrap Logo" id="d3cfb914-63ef-4194-83b3-b33b2f146f86" src="logo.png" width="32"/>
+   <span class="text-light" id="8985d152-b5fb-4ca1-83d3-95dbce50d3f9">
     <strong>
      Bootwrap
     </strong>
@@ -34,188 +34,188 @@
    <div class="collapse navbar-collapse" id="menu">
     <ul class="navbar-nav mr-auto">
      <li class="nav-item">
-      <a class="nav-link ml-2" href="index.html" id="e5b14eaf-ca57-4826-a985-0249279f9085">
+      <a class="nav-link ml-2" href="index.html" id="7b5b0e90-7a11-43c0-a6c2-80288a2c1b5c">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="layout.html" id="cdde311c-4f83-4c8f-b009-87f1a1bd67aa">
+      <a class="nav-link ml-2" href="layout.html" id="6d5700aa-e645-40f1-88a6-edf02f46b325">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="base.html" id="96eb2317-37f0-486f-aad8-c46ef0005880">
+      <a class="nav-link ml-2" href="base.html" id="74905996-c988-4e6e-aec2-4247df7e21f5">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="components.html" id="cb1f7034-9392-4d13-be08-80fa05c1d5b6">
+      <a class="nav-link ml-2" href="components.html" id="079088ec-7cab-43a5-b72a-04dddec58f93">
        Components
       </a>
      </li>
     </ul>
-    <a class="ml-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="0d94f83c-b46b-4e98-ad4c-25dfdc3e0d4d" role="button">
+    <a class="ml-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="4461acf6-9cd6-4521-93a9-319be06a4ecd" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container" style="margin-top: 90px;">
-   <ul class="nav nav-pills" id="b10ae186-c075-4271-82a0-cdda22bbf6d4" role="tablist">
+   <ul class="nav nav-pills" id="395b0725-770d-4d7e-904a-e151307a7d7b" role="tablist">
     <li class="nav-item">
-     <a class="nav-link active" data-target="#e52bfab3-498a-4b53-932e-d4d7797710f0" data-toggle="tab" href="#e52bfab3-498a-4b53-932e-d4d7797710f0" id="f16b12bc-108b-48bb-af2c-47c209d5f8d6">
+     <a class="nav-link active" data-target="#ab5a705c-6fb0-437b-9745-b2f0bc5f4a9b" data-toggle="tab" href="#ab5a705c-6fb0-437b-9745-b2f0bc5f4a9b" id="ac6aae4c-776f-43a1-9e2a-5f999a711ef6">
       Anchor
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#5d898af7-e57f-41cf-a25d-58c5b803af35" data-toggle="tab" href="#5d898af7-e57f-41cf-a25d-58c5b803af35" id="1354d659-6779-4c41-996a-62d3125be96e">
+     <a class="nav-link" data-target="#92c93386-e972-4d5a-aec4-f07f7047c5f2" data-toggle="tab" href="#92c93386-e972-4d5a-aec4-f07f7047c5f2" id="3155b70b-b017-4b3c-b2eb-4140372eb515">
       Badge
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#cb6b869e-fba2-41bf-be92-d74dbd07a8aa" data-toggle="tab" href="#cb6b869e-fba2-41bf-be92-d74dbd07a8aa" id="48e209b9-f7dd-40d8-930d-760d50d475d7">
+     <a class="nav-link" data-target="#475201ed-94b1-434b-8321-b02e9daf2f20" data-toggle="tab" href="#475201ed-94b1-434b-8321-b02e9daf2f20" id="f536d4c4-2994-4c0a-ba0b-463ad7221d48">
       Button
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#70f16d06-abfe-4c23-8bbf-972997227f6f" data-toggle="tab" href="#70f16d06-abfe-4c23-8bbf-972997227f6f" id="2ee8b3d0-2378-4887-8799-34e12dd9b7b2">
+     <a class="nav-link" data-target="#801469d3-85a3-4199-89de-eb4cd34fc5b6" data-toggle="tab" href="#801469d3-85a3-4199-89de-eb4cd34fc5b6" id="909c588c-544e-460d-ab14-03fdd8db6b0f">
       Collection
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#23f209dd-e10b-4160-993c-a7447792f714" data-toggle="tab" href="#23f209dd-e10b-4160-993c-a7447792f714" id="df1c2587-b814-4ad3-a1fe-a1947abdcf58">
+     <a class="nav-link" data-target="#c5ed8f32-8aeb-4f20-86b2-7b68b85c7a79" data-toggle="tab" href="#c5ed8f32-8aeb-4f20-86b2-7b68b85c7a79" id="ca4bd03b-2b95-4943-a57f-14f14047a166">
       Dialog
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#05813e22-2740-40f1-a3d6-ca70513aaf9b" data-toggle="tab" href="#05813e22-2740-40f1-a3d6-ca70513aaf9b" id="cda63d49-ac5b-44ff-824d-982bcc310aff">
+     <a class="nav-link" data-target="#49c818e6-f3fd-4d3e-85ce-9a22e6f82a64" data-toggle="tab" href="#49c818e6-f3fd-4d3e-85ce-9a22e6f82a64" id="02357d32-01b1-43b4-aeab-0cebad95d0af">
       Form
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#0b618d84-e60e-4d16-ad29-ed66144295c9" data-toggle="tab" href="#0b618d84-e60e-4d16-ad29-ed66144295c9" id="fb93e17a-6447-4eba-8382-cbb58789e309">
+     <a class="nav-link" data-target="#a536556e-c460-4ba4-8447-6c1d3a9a32f6" data-toggle="tab" href="#a536556e-c460-4ba4-8447-6c1d3a9a32f6" id="c804f31f-b644-413b-be81-b0d4322b32f0">
       Icon
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#7ce619f3-b689-49d7-8897-f6000ec039a7" data-toggle="tab" href="#7ce619f3-b689-49d7-8897-f6000ec039a7" id="9c4d0483-f7be-4ef7-adab-085d2145fce6">
+     <a class="nav-link" data-target="#2a899b6c-25ef-46fe-a43b-fe17e89bf130" data-toggle="tab" href="#2a899b6c-25ef-46fe-a43b-fe17e89bf130" id="0e2137db-6bbc-4cd3-bbc3-e1a99ed31661">
       Image
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#5529eee2-0162-46db-839a-70d895e31fa6" data-toggle="tab" href="#5529eee2-0162-46db-839a-70d895e31fa6" id="ddff783e-e7ae-4575-976a-8ce14f0eaa91">
+     <a class="nav-link" data-target="#d4676427-9a33-4626-98f0-ddb9cc21356f" data-toggle="tab" href="#d4676427-9a33-4626-98f0-ddb9cc21356f" id="cca2d679-29f7-4d6b-b8de-9ed23be50430">
       Javascript
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#eae4bd11-0862-48c8-87b7-2020db885395" data-toggle="tab" href="#eae4bd11-0862-48c8-87b7-2020db885395" id="2f0ee399-55c3-4032-a8a7-38338b326e01">
+     <a class="nav-link" data-target="#9526c010-0ec6-4f50-b47f-6b1ecf04e926" data-toggle="tab" href="#9526c010-0ec6-4f50-b47f-6b1ecf04e926" id="8ff4de63-4c1c-47d8-a251-09ce77c08fe2">
       Link
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#2f69716b-6e13-424e-add4-d7ab65656a80" data-toggle="tab" href="#2f69716b-6e13-424e-add4-d7ab65656a80" id="dc18f681-7604-406d-8ce0-dd3d4c2a96c8">
+     <a class="nav-link" data-target="#f1170b57-8079-4b86-99d0-5c0a57d14b63" data-toggle="tab" href="#f1170b57-8079-4b86-99d0-5c0a57d14b63" id="252f5951-84cd-4fbd-9fb4-cc0d5e435a64">
       Navigation
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#6bc9d09c-e03b-4b21-854c-3de3aeef7491" data-toggle="tab" href="#6bc9d09c-e03b-4b21-854c-3de3aeef7491" id="23a58ed8-855d-4915-8ac2-a5dcc1aee473">
+     <a class="nav-link" data-target="#b5e604eb-e381-4bed-a332-3082aef48481" data-toggle="tab" href="#b5e604eb-e381-4bed-a332-3082aef48481" id="16f97b47-04bc-42ea-b8ae-c71be517c7e6">
       Panel
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#1e68b373-0b60-4d00-be9a-18aded4cdc15" data-toggle="tab" href="#1e68b373-0b60-4d00-be9a-18aded4cdc15" id="d5cf33b2-0f0d-4121-a678-e02f24e76e30">
+     <a class="nav-link" data-target="#4c59ffd5-47d6-4d50-a931-c0f29a2de26e" data-toggle="tab" href="#4c59ffd5-47d6-4d50-a931-c0f29a2de26e" id="44f2e564-9630-41f0-ad08-960ed1d1b024">
       Separator
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#a1a2e1b4-cec7-4218-b4e4-c75ac5f6aad0" data-toggle="tab" href="#a1a2e1b4-cec7-4218-b4e4-c75ac5f6aad0" id="d3c7846d-4f99-474f-9a42-6552c8a192fb">
+     <a class="nav-link" data-target="#dc89c8ac-0d68-466b-b79a-95499060fccf" data-toggle="tab" href="#dc89c8ac-0d68-466b-b79a-95499060fccf" id="1e7e3d1f-3783-44a4-9ec9-7679c2ae1e16">
       Table
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-target="#1e8a28bc-e53f-488f-8c70-6348c869cb06" data-toggle="tab" href="#1e8a28bc-e53f-488f-8c70-6348c869cb06" id="32416fe4-5b70-4203-983d-97f8ef4794c6">
+     <a class="nav-link" data-target="#498c37cf-78e8-4f92-bb6e-31636bd255dc" data-toggle="tab" href="#498c37cf-78e8-4f92-bb6e-31636bd255dc" id="1c19fec8-cc70-43b0-aca4-174d69ecdf89">
       Text
      </a>
     </li>
    </ul>
    <div class="tab-content">
-    <div class="tab-pane fade active show" id="e52bfab3-498a-4b53-932e-d4d7797710f0">
-     <div id="e42edc44-7d3d-4051-a301-6477bd9d3f8b">
+    <div class="tab-pane fade active show" id="ab5a705c-6fb0-437b-9745-b2f0bc5f4a9b">
+     <div id="13aaaeee-c750-4689-b3cd-14004d7a5f8e">
       <hr/>
-      <ul class="nav" id="895edf21-7f53-4b54-ae20-c99d4f6956b0" role="tablist">
+      <ul class="nav" id="09eabccf-0d5c-4958-b368-c8557aeb3f32" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-target="#09d4874a-e434-4002-93f8-ba41b12de07d" data-toggle="tab" href="#09d4874a-e434-4002-93f8-ba41b12de07d" id="20051034-54a8-4e73-8c55-1f49f24b03d4">
-         <span class="text-secondary" id="5865d322-3b27-4b9a-be43-777c0dccf191">
-          <span id="c63bfb74-d6a7-4d36-a0a8-dd89da6f7ade">
+        <a class="nav-link active" data-target="#fec3ee90-b729-4e0f-8db6-6b00e8c46218" data-toggle="tab" href="#fec3ee90-b729-4e0f-8db6-6b00e8c46218" id="659661c3-1029-43e2-92d0-528110416570">
+         <span class="text-secondary" id="83feb002-4260-4447-995f-9567bb42a737">
+          <span id="e974a548-428b-4962-a116-c642e13d4cad">
            Anchor
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#1c7b2efb-c43b-4a16-91e9-1c499f34e86a" data-toggle="tab" href="#1c7b2efb-c43b-4a16-91e9-1c499f34e86a" id="ed3528a3-2be1-49b2-b62d-6eef8fc9f768">
-         <span class="text-secondary" id="e3ca264c-0628-40a3-8b8f-4589a4b30dc9">
+        <a class="nav-link" data-target="#5240feca-4ac9-4c9b-8461-07b3fce3e591" data-toggle="tab" href="#5240feca-4ac9-4c9b-8461-07b3fce3e591" id="7202d32c-c64f-459c-a72e-e156ae77374c">
+         <span class="text-secondary" id="44ded31f-e52d-4f67-82e1-e7604ff8e8d4">
           Appearance
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#842f257b-d244-42bc-8f49-79943004b153" data-toggle="tab" href="#842f257b-d244-42bc-8f49-79943004b153" id="a9773a7c-3e3f-44e1-9fc1-d7463ffcf059">
-         <span class="text-secondary" id="546668ab-3aa5-4a2b-8fbe-bdfdc05e7b5b">
+        <a class="nav-link" data-target="#ddea9808-6f2e-4749-b923-6aad11aea616" data-toggle="tab" href="#ddea9808-6f2e-4749-b923-6aad11aea616" id="8a6ade77-ab14-4260-8925-c8ec56605314">
+         <span class="text-secondary" id="04c072d4-6149-4a0f-b1df-93e464ec5d76">
           Link Resource
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#67399238-55ef-40a5-b165-c3f1bce7d452" data-toggle="tab" href="#67399238-55ef-40a5-b165-c3f1bce7d452" id="8cf1042a-00cd-41d0-8792-02a923bf7fec">
-         <span class="text-secondary" id="f413da48-77e1-449c-be69-9ede2b6e5a43">
+        <a class="nav-link" data-target="#4846679c-428a-4074-a394-66036a6c9c0c" data-toggle="tab" href="#4846679c-428a-4074-a394-66036a6c9c0c" id="7732c426-933f-4459-bb7a-522267b07934">
+         <span class="text-secondary" id="63bac0bf-04a2-4e01-8388-9a62efdd9a17">
           Open Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#c216e100-8b5d-42bf-9452-a9d2b2e0dfb8" data-toggle="tab" href="#c216e100-8b5d-42bf-9452-a9d2b2e0dfb8" id="980a965a-aaaf-422e-ae7e-bfb64f596595">
-         <span class="text-secondary" id="9b640a11-f12c-4ba4-94fb-4a8cdaac181b">
+        <a class="nav-link" data-target="#38c3f99e-ac45-4074-8ae0-2c5da6b1c9a8" data-toggle="tab" href="#38c3f99e-ac45-4074-8ae0-2c5da6b1c9a8" id="14c730c4-6675-4eeb-b372-b38829ccea47">
+         <span class="text-secondary" id="7983e65f-52fc-43bd-9ed4-5c6923a042b1">
           Close Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#e4375903-ec9d-4e0b-a4a8-e9a835e97345" data-toggle="tab" href="#e4375903-ec9d-4e0b-a4a8-e9a835e97345" id="4b7c312d-0603-41c0-a14f-dd833c23a284">
-         <span class="text-secondary" id="2a4f952c-ea89-4fd1-98cb-791b94ba59a6">
+        <a class="nav-link" data-target="#c8be231c-4b09-440f-af33-dff12f3c7cdc" data-toggle="tab" href="#c8be231c-4b09-440f-af33-dff12f3c7cdc" id="38b1fa1a-a62d-4fa9-87c0-33f6760920e2">
+         <span class="text-secondary" id="e1491d3b-b2b0-4846-b842-d3f50d1571d3">
           Expand/Collapse Panel
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="09d4874a-e434-4002-93f8-ba41b12de07d">
-        <div class="mt-5" id="084f04ed-e5eb-49eb-a84e-9ba07fff8adb">
-         <div class="d-flex justify-content-between" id="3a404052-408d-47c2-9bec-17464e1873f8">
-          <h1 id="4a110098-069c-4379-bbb1-d94b6158b883">
+       <div class="tab-pane fade active show" id="fec3ee90-b729-4e0f-8db6-6b00e8c46218">
+        <div class="mt-5" id="a720ea42-4096-4c2c-afdd-678ad157d2d3">
+         <div class="d-flex justify-content-between" id="1083730a-b73f-461b-9fac-f8ba36c20268">
+          <h1 id="c6befa03-6210-41cb-b09a-81ba9fbae107">
            Class
-           <span class="text-primary" id="db1da4e1-5a63-4f27-91bb-650556d2e652">
-            <span id="c63bfb74-d6a7-4d36-a0a8-dd89da6f7ade">
+           <span class="text-primary" id="8ac04657-2316-4d46-ba2f-0694d5717b21">
+            <span id="e974a548-428b-4962-a116-c642e13d4cad">
              Anchor
             </span>
            </span>
           </h1>
-          <div id="2e0c75f4-ed48-4008-83e5-612e13eb3ea8">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#908ca864-4fbe-4a39-91ee-7f0cf8f10ea7" data-toggle="collapse" id="4122604a-89bc-425e-ac80-9c4572e30607" onclick="return false;" type="button">
+          <div id="de4f5550-c4d5-44ba-b5bf-c9901a771452">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#2fb4412f-ec84-430a-b50c-4396cdcd3c4e" data-toggle="collapse" id="0baa1a6f-59d8-4aad-890d-3278d7d71adf" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="c077fde0-d7b9-44a3-a547-e35e1ebb44ba">
+         <span class="text-muted" id="6fe8bbd4-70f8-4a9f-8340-a4d6e1865492">
           A web component for an anchor.
          </span>
-         <pre id="947a8773-7789-45e7-ab86-3cda7250ffee"><code a="" c="" l="" s=" p y t h o n ">Anchor(inner=None)</code></pre>
-         <div class="ml-3 collapse" id="908ca864-4fbe-4a39-91ee-7f0cf8f10ea7">
-          <h6 id="84c892d6-c5cf-46b6-9c0d-84f1ce742cbd">
+         <pre id="428fa7ad-7364-48f7-9d82-55ec6963cbed"><code a="" c="" l="" s=" p y t h o n ">Anchor(inner=None)</code></pre>
+         <div class="ml-3 collapse" id="2fb4412f-ec84-430a-b50c-4396cdcd3c4e">
+          <h6 id="128f85b1-3eaa-4282-b190-9daf9720ba22">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="a71cca31-42a2-42fd-ad84-baf29c20db4a">
+          <table class="table table-sm bg-light" id="de8810dc-a48d-4e23-89f8-31226ff11109">
            <thead>
             <tr>
              <th scope="col">
@@ -248,7 +248,7 @@
            </tbody>
           </table>
          </div>
-         <p id="114bb538-b32f-41d6-8c91-a9bcf9d8b234">
+         <p id="06bf81df-5e60-4e2d-b658-0137105db28e">
           The
           <code>
            Anchor
@@ -267,43 +267,43 @@
     conjunction with other components, for example, in creating a navigation
     menu.
          </p>
-         <div class="ml-3" id="357fad7e-d2f4-42f3-ba01-6bcef9ae8bd5">
-          <h6 id="51e480fb-f835-4292-970d-4546b6c86e3f">
+         <div class="ml-3" id="d7769fc2-1162-4412-a8f2-cd8297e707af">
+          <h6 id="71949e62-0864-426f-9190-41d8f850da70">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="78d3518e-929a-4e43-96cc-24a56d7ded16"><code a="" c="" l="" s=" p y t h o n ">Anchor('Google Search').link('https://www.google.com/')</code></pre>
+          <pre id="299b566d-93c5-41cf-a944-012c55f2137c"><code a="" c="" l="" s=" p y t h o n ">Anchor('Google Search').link('https://www.google.com/')</code></pre>
          </div>
-         <div class="ml-3" id="764ae226-6f69-4ace-a028-e302902723b3">
-          <a href="https://www.google.com/" id="0fcc1166-337e-4c2d-911c-1221c857e8cf">
+         <div class="ml-3" id="83cd57a7-ac17-4749-a055-99618cc51652">
+          <a href="https://www.google.com/" id="1fea199b-7dae-4838-aa4c-c8728738c41e">
            Google Search
           </a>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="1c7b2efb-c43b-4a16-91e9-1c499f34e86a">
-        <div class="mt-3" id="8170ad31-6557-4c87-a8e6-7c0f28821a31">
-         <div id="c1f07baa-3c0f-4604-87e6-f0fc84b2b9fd">
+       <div class="tab-pane fade" id="5240feca-4ac9-4c9b-8461-07b3fce3e591">
+        <div class="mt-3" id="f69f542d-f239-4424-8bcd-b62d5a0f938b">
+         <div id="f6d1b0c0-283d-435e-8ab5-9aa49d988ebd">
           <div class="row">
            <div class="col-md">
-            <div id="9e936118-8118-42e4-9637-e66b1509bfb8">
-             <h1 id="5011d8c4-9fc5-4aae-9b48-ce8e8da5af3a">
+            <div id="fa824179-777d-4fb0-a6da-6318030c2498">
+             <h1 id="e6d42ea7-db4a-49b9-a30f-1e828d77adb2">
               Appearance
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="612c5060-d820-496e-8398-9cc3aa702fa6">
+            <div id="96d7fba2-e746-4a3d-bbd3-b0720f86dbb1">
             </div>
            </div>
           </div>
          </div>
-         <div id="8498c20b-5942-4f1b-9709-9313f2ed2a50">
+         <div id="c9be1391-475b-4f99-887f-a89bf757bd7b">
           <div class="row">
            <div class="col-md">
-            <div id="f75da108-80a1-4c24-8886-d42d55f932ec">
-             <p id="891710ad-644b-4922-8742-13504e9d3525">
+            <div id="39acdad4-fd39-4255-b0d4-adbadb0a1897">
+             <p id="6bc153f0-6c17-4a74-b802-d49e1dc8868e">
               Change
               <code>
                Anchor
@@ -345,8 +345,8 @@
             </div>
            </div>
            <div class="col-md">
-            <div id="11e70621-0e8d-4b84-bdb7-794a661b4565">
-             <pre id="bba57cfa-9dbe-40fe-8889-f965c27a1b2a"><code a="" c="" l="" s=" p y t h o n ">Anchor("Primary").as_primary()
+            <div id="46faab0f-95d0-4ae6-947d-62ab59dfc0e0">
+             <pre id="83c22b08-0807-472b-9146-9e4a5302ad6e"><code a="" c="" l="" s=" p y t h o n ">Anchor("Primary").as_primary()
 Anchor("Secondary").as_secondary()
 Anchor("Success").as_success()
 Anchor("Warning").as_warning()
@@ -354,29 +354,29 @@ Anchor("Danger").as_danger()
 Anchor("Info").as_info()
 Anchor("Light").as_light()
 Anchor("Dark").as_dark()</code></pre>
-             <div id="0364320e-72e9-4a7c-9504-d9197f95e630">
-              <a class="mb-1 text-primary" href="#" id="04876fee-ef87-498a-b0a9-a3adae2bf0d3">
+             <div id="9573d223-8684-47c4-8df1-ce14d7b51fd2">
+              <a class="mb-1 text-primary" href="#" id="47f20021-5d3d-424d-bafc-bf5d6af70713">
                Primary
               </a>
-              <a class="mb-1 text-secondary" href="#" id="3ce8b80a-5e34-4a94-b4cd-44ed7413f251">
+              <a class="mb-1 text-secondary" href="#" id="9f837266-628a-4ac9-929b-b17a6215e789">
                Secondary
               </a>
-              <a class="mb-1 text-success" href="#" id="383f6b09-0b92-4c0b-8808-eb9a0cf959ed">
+              <a class="mb-1 text-success" href="#" id="dd8ef639-fd3d-4a10-bfd6-37c103fa2df6">
                Success
               </a>
-              <a class="mb-1 text-warning" href="#" id="2e2a4ec6-3b07-4e5f-a596-4fbffc78f17c">
+              <a class="mb-1 text-warning" href="#" id="26e6ce26-bc3b-4d81-a881-b6ab3b84c1ee">
                Warning
               </a>
-              <a class="mb-1 text-danger" href="#" id="989a8892-f367-4354-8812-c5b6f85b0ac2">
+              <a class="mb-1 text-danger" href="#" id="2e6eeda7-48d0-4fe4-a606-3dd9e12651a9">
                Danger
               </a>
-              <a class="mb-1 text-info" href="#" id="948b1fbb-ecff-4e82-b093-ec380ef0b4b0">
+              <a class="mb-1 text-info" href="#" id="caacc645-78f5-46db-9965-9653f24fa257">
                Info
               </a>
-              <a class="mb-1 text-light" href="#" id="6903fa70-e535-4a35-9824-bcf305e8f3fa">
+              <a class="mb-1 text-light" href="#" id="ec8fcdd9-ce4c-4934-80c6-3442ab4f170d">
                Light
               </a>
-              <a class="mb-1 text-dark" href="#" id="23942507-6a80-493d-b5b4-7c4c9fe60e85">
+              <a class="mb-1 text-dark" href="#" id="a49235cf-97c4-43ce-b6c7-217962741ba6">
                Dark
               </a>
              </div>
@@ -386,28 +386,28 @@ Anchor("Dark").as_dark()</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="842f257b-d244-42bc-8f49-79943004b153">
-        <div class="mt-3" id="02ad9a77-db02-4f0d-b9c2-5bdc82c306ae">
-         <div id="ceae8175-254b-443e-bead-c30dc8ccfa40">
+       <div class="tab-pane fade" id="ddea9808-6f2e-4749-b923-6aad11aea616">
+        <div class="mt-3" id="d5f37133-2e51-40e9-845d-aa800b345756">
+         <div id="a6980215-8049-4436-9fb8-786261995dbc">
           <div class="row">
            <div class="col-md">
-            <div id="caa088e6-8240-40d0-a7cc-8d0b29827717">
-             <h1 id="2088578e-7fa3-407d-96d5-33fdd158573b">
+            <div id="5e57eb1f-54fd-4695-8dfd-feb587584b5a">
+             <h1 id="24bd6bee-d9a6-4532-a7b6-919e69b1f0cb">
               Link Resource
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="85ba9d27-8eb4-462f-9973-009170b17f23">
+            <div id="935c8a39-6ef7-46e2-9ab7-efb21c0c0e9e">
             </div>
            </div>
           </div>
          </div>
-         <div id="635f7c12-636c-408b-896b-54191627587e">
+         <div id="467a1604-4de9-43e0-bb43-738ba3567a56">
           <div class="row">
            <div class="col-md">
-            <div id="dd5419f0-01d6-4e31-8761-54749038f151">
-             <p id="5ec471b2-5d02-43a7-a1ee-d1e83bb5b4d5">
+            <div id="1d3b4da8-a813-4194-b202-0a06d4c898ce">
+             <p id="f256bb2f-aa04-42b1-a339-5bbf69fb3396">
               Associate
               <code>
                Anchor
@@ -421,10 +421,10 @@ Anchor("Dark").as_dark()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="056a488e-e20b-4936-9ca7-095c7ff4f412">
-             <pre id="ff7fa10c-bae7-4cef-8ab7-33a2cf3cdf61"><code a="" c="" l="" s=" p y t h o n ">Anchor("Google Search").link("https://www.google.com/")</code></pre>
-             <div id="d4e8f47e-5af6-495f-aa5f-ee61b480d558">
-              <a href="https://www.google.com/" id="9c9a0636-fd99-4cc9-8e4b-1b0701197311">
+            <div id="152f6307-baf9-4eb6-b059-f4351a9e2223">
+             <pre id="4d82e8f9-42e3-4b96-bfad-79004b28b61f"><code a="" c="" l="" s=" p y t h o n ">Anchor("Google Search").link("https://www.google.com/")</code></pre>
+             <div id="0dcae502-6995-4097-90e2-45d4c11f3234">
+              <a href="https://www.google.com/" id="862e5f49-414a-4fa9-a73c-32fbfb2cd90e">
                Google Search
               </a>
              </div>
@@ -434,28 +434,28 @@ Anchor("Dark").as_dark()</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="67399238-55ef-40a5-b165-c3f1bce7d452">
-        <div class="mt-3" id="2ba076e9-29dc-43d6-a54e-95638e42b603">
-         <div id="fee270f7-fd51-44c4-a51b-ae000e6afd20">
+       <div class="tab-pane fade" id="4846679c-428a-4074-a394-66036a6c9c0c">
+        <div class="mt-3" id="ed9c4fbd-69e6-4cbb-adcd-f7360cf6a7ea">
+         <div id="93b62249-78ee-4923-8697-80baa39bb0d6">
           <div class="row">
            <div class="col-md">
-            <div id="7ed9d27c-a939-4636-9dd4-53720e62167c">
-             <h1 id="92f8cd18-17d6-421a-baa8-25f064dc143d">
+            <div id="744da43d-f104-4f48-a50d-2b2a80f54534">
+             <h1 id="a4438c55-00d8-4010-b701-c792c79edd6b">
               Open Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="356423e6-b66c-41e4-aeed-7ed69231607d">
+            <div id="d126544f-d345-4e37-a10b-0dd9994135d0">
             </div>
            </div>
           </div>
          </div>
-         <div id="0ddd790d-c1dd-429e-b537-ea42eb17f09f">
+         <div id="d08556d9-6989-450e-822a-bc3a6878f62f">
           <div class="row">
            <div class="col-md">
-            <div id="cd0e5b9d-662d-4556-872d-630ad9b622bf">
-             <p id="4b959d2c-0f2f-4b60-b080-a5c11c472fb8">
+            <div id="cec021cb-9783-439c-8bce-3941f09da7bc">
+             <p id="c8760f6e-c7a7-40fc-b92c-07a5a01f4823">
               Use
               <code>
                Anchor
@@ -469,14 +469,14 @@ Anchor("Dark").as_dark()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="fe274eef-047e-4e58-a489-2382d1074be1">
-             <pre id="88b9482e-2616-4af6-9d9a-26a26d5f499a"><code a="" c="" l="" s=" p y t h o n ">dialog = Dialog(
+            <div id="772e1ecc-baec-4226-8533-0fdb6c56b233">
+             <pre id="bbeeffae-86d5-48b3-b81e-9a0672d01220"><code a="" c="" l="" s=" p y t h o n ">dialog = Dialog(
   "Greeting",
   "Hello World!"
 )
 anchor = Anchor("Say Hello").toggle(dialog)</code></pre>
-             <div id="0881320b-ab1d-4093-8c08-e81946260cac">
-              <div class="modal" id="13bdcb51-67fe-4749-8152-b31af5d6b647">
+             <div id="2a459cbb-bafd-4719-8c0c-2f04a611b03f">
+              <div class="modal" id="ef03a90a-c85b-4aef-b8aa-776378d2d151">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -495,7 +495,7 @@ anchor = Anchor("Say Hello").toggle(dialog)</code></pre>
                 </div>
                </div>
               </div>
-              <a data-toggle="modal" href="#13bdcb51-67fe-4749-8152-b31af5d6b647" id="4bd68def-61ca-4c32-b41c-181a8f4c90cf" role="modal">
+              <a data-toggle="modal" href="#ef03a90a-c85b-4aef-b8aa-776378d2d151" id="2461e58c-6888-4b64-b66c-12dfbd80d7b4" role="modal">
                Say Hello
               </a>
              </div>
@@ -505,28 +505,28 @@ anchor = Anchor("Say Hello").toggle(dialog)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="c216e100-8b5d-42bf-9452-a9d2b2e0dfb8">
-        <div class="mt-3" id="50e1affc-6213-40dd-8c61-e59e0598c5ec">
-         <div id="f146df7a-4e2e-4509-be75-ddf32d075d21">
+       <div class="tab-pane fade" id="38c3f99e-ac45-4074-8ae0-2c5da6b1c9a8">
+        <div class="mt-3" id="4f2c0323-9c79-4813-9a27-0ec4e4181cb7">
+         <div id="b3b0d5de-0cb1-45dc-bb7d-f707a6d07c65">
           <div class="row">
            <div class="col-md">
-            <div id="88d113f1-22ca-4184-9652-fb5eee9e08f3">
-             <h1 id="d4fe52fa-fb99-4dff-a94a-092dcf551ce2">
+            <div id="187978b2-eb15-4052-b81d-a6328fd7791f">
+             <h1 id="00147bad-c06c-421f-8c38-e67d0cbd97a3">
               Close Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="092c3b72-520c-4c29-ab09-44c37402aaf4">
+            <div id="c483f781-1da8-4d5c-9340-aa859631cfb1">
             </div>
            </div>
           </div>
          </div>
-         <div id="b7ecbe4f-f443-4e95-a503-2aeee4b176e1">
+         <div id="9b51b5ad-7a30-462f-a84f-457b40af711c">
           <div class="row">
            <div class="col-md">
-            <div id="72f2cd67-d51f-4fd4-a809-4d17a16b9992">
-             <p id="fefc6f82-f6ff-46cc-ab2f-8853b2230e2c">
+            <div id="501d7b79-576d-406a-8abd-2b0fee43c76b">
+             <p id="eb815453-fc79-40d2-8277-06e203462a17">
               Use
               <code>
                Anchor
@@ -540,15 +540,15 @@ anchor = Anchor("Say Hello").toggle(dialog)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="4340cb57-9cb1-472a-8600-58c9bb8cbbbc">
-             <pre id="25af9ea8-19df-4db2-89e4-c664dc9d8676"><code a="" c="" l="" s=" p y t h o n ">dialog = Dialog(
+            <div id="fe17c359-b083-4581-8977-aaf0cf79657b">
+             <pre id="bd750313-9ade-4511-bda9-53d3f581df0a"><code a="" c="" l="" s=" p y t h o n ">dialog = Dialog(
   "Greeting",
   "Hello World!",
   Anchor("Bye").dismiss()
 )
 anchor = Anchor("Say Hello").toggle(dialog)</code></pre>
-             <div id="0634dbd6-f60d-477f-a502-09bd1b65ad50">
-              <div class="modal" id="616db378-ac0c-42d2-9244-632eaa4e2c29">
+             <div id="3623173d-624e-41cb-8044-607b78173ca4">
+              <div class="modal" id="9bf508f8-9449-4d76-8ce4-57dce5d1a869">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -565,14 +565,14 @@ anchor = Anchor("Say Hello").toggle(dialog)</code></pre>
                   Hello World!
                  </div>
                  <div class="modal-footer">
-                  <a data-dismiss="modal" href="#" id="52798ee2-db87-45d3-a900-bf0411bd9cb4">
+                  <a data-dismiss="modal" href="#" id="4784d544-ec2e-45ab-baec-00131255f46b">
                    Bye
                   </a>
                  </div>
                 </div>
                </div>
               </div>
-              <a data-toggle="modal" href="#616db378-ac0c-42d2-9244-632eaa4e2c29" id="97488387-6b09-402d-bb24-fa67217c7979" role="modal">
+              <a data-toggle="modal" href="#9bf508f8-9449-4d76-8ce4-57dce5d1a869" id="6c0e4166-f380-4c2c-8749-80371022bd34" role="modal">
                Say Hello
               </a>
              </div>
@@ -582,28 +582,28 @@ anchor = Anchor("Say Hello").toggle(dialog)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="e4375903-ec9d-4e0b-a4a8-e9a835e97345">
-        <div class="mt-3" id="e7899194-02ea-4c67-b3f7-91a8a99e152c">
-         <div id="a5e46f7c-3551-4ee7-96ac-4ff6cb98219c">
+       <div class="tab-pane fade" id="c8be231c-4b09-440f-af33-dff12f3c7cdc">
+        <div class="mt-3" id="e1314fb9-57c4-4ec7-befd-2f5f34c5bbb7">
+         <div id="8873063e-2639-4978-bec9-32d063103fab">
           <div class="row">
            <div class="col-md">
-            <div id="002494ad-e1b1-4d9c-96e2-d04e633e641f">
-             <h1 id="42e42c66-99fb-420d-8521-6034eae92c96">
+            <div id="b6465645-932c-4114-bf26-2e4034754904">
+             <h1 id="5028c314-27df-474e-b361-75e8bd31ef52">
               Expand/Collapse Panel
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="fc315d1e-f4de-4e0c-8a70-6e692afe7538">
+            <div id="e695b717-9dc3-4c2b-a43f-f0012c6ea296">
             </div>
            </div>
           </div>
          </div>
-         <div id="d028b479-1d70-45f7-b79d-ca1626a8cb0a">
+         <div id="dbe2488f-95a8-49e7-a405-38b2e610c3a5">
           <div class="row">
            <div class="col-md">
-            <div id="ce145f32-d278-4c0c-a081-9e6d39da7990">
-             <p id="b108cb9e-60d1-410b-8cbe-42c8761a3021">
+            <div id="2789554d-0d06-461a-bb5f-b067ed27a632">
+             <p id="faa31118-a065-423e-856b-495fa556ac9e">
               Use
               <code>
                Anchor
@@ -617,17 +617,17 @@ anchor = Anchor("Say Hello").toggle(dialog)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="f8e6199d-19f5-4f63-9e97-ed1af4a82383">
-             <pre id="1da12b44-5f9d-4573-9022-6ca1510762b4"><code a="" c="" l="" s=" p y t h o n ">quote = Panel(
+            <div id="71092b4d-ce60-44fa-b8ed-16437e88f44d">
+             <pre id="a06f4d25-3b39-46de-a8ca-b9ab3ae63d9a"><code a="" c="" l="" s=" p y t h o n ">quote = Panel(
   "Sometimes life is going to hit you in " +
   "the head with a brick. Don’t lose faith."
 ).as_collapse()
 Anchor("Steve Jobs Quote").toggle(quote)</code></pre>
-             <div id="efe99c99-18b1-44c0-891c-14a5d08d896f">
-              <a data-target="#6f10453c-d0d1-4fe9-8409-a5ac0f3e651d" data-toggle="collapse" href="#6f10453c-d0d1-4fe9-8409-a5ac0f3e651d" id="234bcaea-7f48-48f4-8db4-5f3866b21b1d">
+             <div id="23e4dbf6-0d38-4809-bd4c-2025655fca02">
+              <a data-target="#3bc345fb-11e7-4114-8c9a-ba062eea9f82" data-toggle="collapse" href="#3bc345fb-11e7-4114-8c9a-ba062eea9f82" id="f11384ff-785f-440b-b907-fbfb68d80f09">
                Steve Jobs Quote
               </a>
-              <div class="collapse" id="6f10453c-d0d1-4fe9-8409-a5ac0f3e651d">
+              <div class="collapse" id="3bc345fb-11e7-4114-8c9a-ba062eea9f82">
                Sometimes life is going to hit you in the head with a brick. Don’t lose faith.
               </div>
              </div>
@@ -640,56 +640,56 @@ Anchor("Steve Jobs Quote").toggle(quote)</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="5d898af7-e57f-41cf-a25d-58c5b803af35">
-     <div id="29548eea-1224-4d73-ac8b-8159d56a1ed7">
+    <div class="tab-pane fade" id="92c93386-e972-4d5a-aec4-f07f7047c5f2">
+     <div id="920bfc21-370a-4162-a81c-c824c57b5d7e">
       <hr/>
-      <ul class="nav" id="e4642cae-539b-4ce6-863f-12a4d7500d7b" role="tablist">
+      <ul class="nav" id="1d8abad0-c7a7-4bd5-bcaf-276bbe4863c6" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-target="#8b3f52c6-a03c-4e62-baee-8b87ff449289" data-toggle="tab" href="#8b3f52c6-a03c-4e62-baee-8b87ff449289" id="75569d37-4622-46f5-8893-d7b35acb76c8">
-         <span class="text-secondary" id="42332c01-d1ed-48a4-94df-1f3624bbecb3">
-          <span id="f56fdffe-19f9-4022-ab83-268756222a28">
+        <a class="nav-link active" data-target="#d30e0b57-5d5b-4db5-a466-4f58501d8abc" data-toggle="tab" href="#d30e0b57-5d5b-4db5-a466-4f58501d8abc" id="22a15ea5-32d5-40ce-b2a7-08401358c606">
+         <span class="text-secondary" id="1d044320-4e1f-4d1b-9438-3f36c20d4fec">
+          <span id="e1608f00-c68a-438b-8ff4-c0d23464d096">
            Badge
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#9a699cad-ae05-4c29-a345-787bdca1524b" data-toggle="tab" href="#9a699cad-ae05-4c29-a345-787bdca1524b" id="b9efd8c9-29f9-48af-b7a5-ac2a35fe09de">
-         <span class="text-secondary" id="1b813bb3-4c1c-457f-be8c-ee41241489ca">
+        <a class="nav-link" data-target="#45872ed8-a0e3-4e85-bac8-2cf5a3c81990" data-toggle="tab" href="#45872ed8-a0e3-4e85-bac8-2cf5a3c81990" id="db7e84c8-b5b6-4746-8e0c-0ab5b897eebd">
+         <span class="text-secondary" id="5094c9a2-8ade-49f7-9524-097ee047a584">
           Appearance
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="8b3f52c6-a03c-4e62-baee-8b87ff449289">
-        <div class="mt-5" id="98ee7e90-81d1-4b5f-9430-0a525681583e">
-         <div class="d-flex justify-content-between" id="e184f76f-f3a3-434f-bb69-9556f28ca728">
-          <h1 id="aae87632-51d9-4bd3-8863-109fe0d2307e">
+       <div class="tab-pane fade active show" id="d30e0b57-5d5b-4db5-a466-4f58501d8abc">
+        <div class="mt-5" id="581966cc-5dc3-4bed-82eb-0153138af74d">
+         <div class="d-flex justify-content-between" id="0545269b-714f-415c-828f-11910c876c55">
+          <h1 id="050b09b7-b1c3-481a-a661-28ea660db089">
            Class
-           <span class="text-primary" id="879916d8-d2e3-4c26-8134-2f18480f0b26">
-            <span id="f56fdffe-19f9-4022-ab83-268756222a28">
+           <span class="text-primary" id="ad58f084-7bdf-42ef-83d3-12c188a60bc3">
+            <span id="e1608f00-c68a-438b-8ff4-c0d23464d096">
              Badge
             </span>
            </span>
           </h1>
-          <div id="542663f3-91be-46f1-9aaf-edca166886c2">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#5b36eb4c-eb56-4fd9-aa1e-a1beb3bb5003" data-toggle="collapse" id="f39c9848-2ef4-4343-b9bc-eb4e8533d92d" onclick="return false;" type="button">
+          <div id="8a8f4c4e-bdc9-4045-9ee3-2f5a9559707e">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#14af8058-e95b-4f7a-9ff4-d1985fab6dc4" data-toggle="collapse" id="4044723e-80c3-497e-8080-a361119c0a06" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="a2f6a245-f06c-4036-a5b2-626d02892af4">
+         <span class="text-muted" id="98aaf171-0dba-42b3-9f90-2724d2ba9925">
           A web component for a badge.
          </span>
-         <pre id="cf58e4b5-2acd-4941-a1ec-390da6ca7e62"><code a="" c="" l="" s=" p y t h o n ">Badge(label)</code></pre>
-         <div class="ml-3 collapse" id="5b36eb4c-eb56-4fd9-aa1e-a1beb3bb5003">
-          <h6 id="dfbecc7b-f694-45ba-a807-90baac111ce4">
+         <pre id="566fbb72-75cc-43df-8d65-8630fd62af9e"><code a="" c="" l="" s=" p y t h o n ">Badge(label)</code></pre>
+         <div class="ml-3 collapse" id="14af8058-e95b-4f7a-9ff4-d1985fab6dc4">
+          <h6 id="7ed1dd37-de11-44b8-bc7c-04780d8de8be">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="e5640145-05d8-40d5-9b1d-86b991b283d7">
+          <table class="table table-sm bg-light" id="aa54ea4c-6456-4fbf-b9bb-2abf644eba84">
            <thead>
             <tr>
              <th scope="col">
@@ -722,43 +722,43 @@ Anchor("Steve Jobs Quote").toggle(quote)</code></pre>
            </tbody>
           </table>
          </div>
-         <div class="ml-3" id="7a4a2e3f-d5eb-45cf-bde3-7c296340ce0b">
-          <h6 id="faec7974-a54c-4d62-bc9e-524717f12b0c">
+         <div class="ml-3" id="ada5be22-4f06-4e7d-86ee-65b7385bb9ec">
+          <h6 id="bdf43d49-e09c-47dd-977d-c75322b26124">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="805ebb8b-def4-419b-9cdc-b304218af610"><code a="" c="" l="" s=" p y t h o n ">Badge('Some Badge')</code></pre>
+          <pre id="8d27c555-d8e2-4112-a267-818e11d54b79"><code a="" c="" l="" s=" p y t h o n ">Badge('Some Badge')</code></pre>
          </div>
-         <div class="ml-3" id="e60509df-1ace-427d-b99a-2641134fccef">
-          <span class="badge" id="c94b10e1-085f-4f09-aa3b-c2f4c4182c5f">
+         <div class="ml-3" id="9b3d113c-25ca-4b92-a290-7dd45029a7a4">
+          <span class="badge" id="553a0b4e-caab-4854-b9e9-ac48a3af1d2c">
            Some Badge
           </span>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="9a699cad-ae05-4c29-a345-787bdca1524b">
-        <div class="mt-3" id="18c4533f-29c8-46a7-8637-bd75ed0dfbf3">
-         <div id="60430ed4-6d7f-4987-9575-0ebcaa7bffc4">
+       <div class="tab-pane fade" id="45872ed8-a0e3-4e85-bac8-2cf5a3c81990">
+        <div class="mt-3" id="fa57b5d2-5cbb-4f45-adca-2d5c361dd8fa">
+         <div id="aaeaf099-8a3a-45a6-9e45-6537848e96b2">
           <div class="row">
            <div class="col-md">
-            <div id="547c90c9-761c-4b9e-b2ab-78e60d9b9c1f">
-             <h1 id="559584b7-30dd-411f-a65c-46539e51cd20">
+            <div id="e5f8b254-5d20-41b5-8d6f-d47f8c5187e0">
+             <h1 id="57481e84-d624-4ad8-9ed2-17836696888e">
               Appearance
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="8e69bb4f-604f-467c-8605-2001adac25c6">
+            <div id="4c5fe115-67d2-4771-897a-8e1591cd5323">
             </div>
            </div>
           </div>
          </div>
-         <div id="50e9a9f8-d1b7-44ef-9133-9e09c8fd8b5f">
+         <div id="db2aa64c-38b5-4bfa-a30c-6bd392fb3b81">
           <div class="row">
            <div class="col-md">
-            <div id="d639304d-5524-4677-b600-9000536a7bf3">
-             <p id="273b4b4c-c321-47ae-b5f2-197b17683c2e">
+            <div id="172d55cc-f50e-410d-b12f-844d7ba6182d">
+             <p id="2926cf66-3a5c-45d2-89f1-6053c0829a53">
               Change
               <code>
                Badge
@@ -800,8 +800,8 @@ Anchor("Steve Jobs Quote").toggle(quote)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="cff724cc-d166-4a19-b406-60452bc27d6a">
-             <pre id="02675b53-4151-472f-af4c-bbaf45f30ca3"><code a="" c="" l="" s=" p y t h o n ">Badge("Primary").as_primary()
+            <div id="315fa2cb-0d85-44f1-bb57-437c12f0c3c1">
+             <pre id="da982147-c4c5-4bb8-babf-88c61b860256"><code a="" c="" l="" s=" p y t h o n ">Badge("Primary").as_primary()
 Badge("Secondary").as_secondary()
 Badge("Success").as_success()
 Badge("Warning").as_warning()
@@ -809,29 +809,29 @@ Badge("Danger").as_danger()
 Badge("Info").as_info()
 Badge("Light").as_light()
 Badge("Dark").as_dark()</code></pre>
-             <div id="7d6ff2b0-0189-4059-95f3-3521feeb199f">
-              <span class="badge badge-primary mb-1" id="df46d4f6-e827-487b-9fac-66dab5936d6b">
+             <div id="df50a994-55c6-4f2a-9349-6fcd6736de91">
+              <span class="badge badge-primary mb-1" id="4b2b2ffe-76d4-45be-921d-cadbd6df5b03">
                Primary
               </span>
-              <span class="badge badge-secondary mb-1" id="8df81a88-25d7-4d1a-a87a-4392d5c61ba7">
+              <span class="badge badge-secondary mb-1" id="2be6cffb-9294-44b1-acba-3699318c43ac">
                Secondary
               </span>
-              <span class="badge badge-success mb-1" id="a9180349-e27d-470b-909e-1b10351f81b9">
+              <span class="badge badge-success mb-1" id="6e124b7f-82d7-45cb-bac7-d99d00ced364">
                Success
               </span>
-              <span class="badge badge-warning mb-1" id="d7871f63-7111-45dc-a536-5d3e2f37fed8">
+              <span class="badge badge-warning mb-1" id="5c7b27c0-ef3e-4b11-931e-2f506971e60e">
                Warning
               </span>
-              <span class="badge badge-danger mb-1" id="a357b7d0-b488-4209-bbd7-4b2a876f0d9e">
+              <span class="badge badge-danger mb-1" id="0248dc22-fe61-4b63-818f-fecc12691263">
                Danger
               </span>
-              <span class="badge badge-info mb-1" id="9dcd9fef-a758-48ca-8217-3f8c14968422">
+              <span class="badge badge-info mb-1" id="acde6dff-331d-4907-9438-6ad524899162">
                Info
               </span>
-              <span class="badge badge-light mb-1" id="1cbe249e-bc87-4de8-814e-71b8a5ce7e23">
+              <span class="badge badge-light mb-1" id="3957c6db-a707-4b0a-bc32-2e7609807893">
                Light
               </span>
-              <span class="badge badge-dark mb-1" id="bc7474d8-08ac-411b-85aa-414a2082e06e">
+              <span class="badge badge-dark mb-1" id="ebb0a75b-3d16-4175-859c-3dbb4f331202">
                Dark
               </span>
              </div>
@@ -844,105 +844,105 @@ Badge("Dark").as_dark()</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="cb6b869e-fba2-41bf-be92-d74dbd07a8aa">
-     <div id="367f729e-25ea-49ed-8ca4-d62303abb1a7">
+    <div class="tab-pane fade" id="475201ed-94b1-434b-8321-b02e9daf2f20">
+     <div id="ad5c0e16-9d2d-46c6-a065-788b95cf17e6">
       <hr/>
-      <ul class="nav" id="4b7b6c65-6c82-43d3-9717-0c22baa2fa1b" role="tablist">
+      <ul class="nav" id="13bec7bb-694e-4849-a6be-0ba8c510e3ac" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-target="#883e2fa4-a9e8-424f-a936-07a1ed49fc1a" data-toggle="tab" href="#883e2fa4-a9e8-424f-a936-07a1ed49fc1a" id="954fecfa-ed1f-4c92-96c2-db158aab782c">
-         <span class="text-secondary" id="dfcf2d65-4f1d-4917-b142-a6ee972d775e">
-          <span id="15b4fe03-cc5d-484c-b543-b5864c0bd664">
+        <a class="nav-link active" data-target="#1ff9dca8-ae29-4df4-9595-31ed13071651" data-toggle="tab" href="#1ff9dca8-ae29-4df4-9595-31ed13071651" id="5967c25e-0e17-4879-a594-4f1ba915bb39">
+         <span class="text-secondary" id="235cd569-2f1f-4e35-b25c-9c589ae14ece">
+          <span id="562ae49a-4e78-4133-888c-5f63d6319a4e">
            Button
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#4e8f426d-4bce-43ee-ba24-ac7f21ceb6f3" data-toggle="tab" href="#4e8f426d-4bce-43ee-ba24-ac7f21ceb6f3" id="7c43b635-640c-47b1-b091-68928a274e99">
-         <span class="text-secondary" id="78fdc1ac-6729-4519-99fe-93fa638fad0f">
+        <a class="nav-link" data-target="#aee59a1d-6b33-4002-b1c4-8001cef4fd1c" data-toggle="tab" href="#aee59a1d-6b33-4002-b1c4-8001cef4fd1c" id="26c430cb-ba35-4ab6-beeb-ff1b34a75903">
+         <span class="text-secondary" id="7fbe79e4-4c6f-439d-b0c7-74238a9d1692">
           Appearance
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#5db8fa98-bac6-45b3-b09d-50c87edf1e0c" data-toggle="tab" href="#5db8fa98-bac6-45b3-b09d-50c87edf1e0c" id="881cc5da-7b4b-48b9-a326-40ee3a9a4253">
-         <span class="text-secondary" id="f57e8169-8b29-4062-a44d-5a0d575fc8bb">
+        <a class="nav-link" data-target="#fd21f4cd-8dfd-465e-8f56-811151f58f6f" data-toggle="tab" href="#fd21f4cd-8dfd-465e-8f56-811151f58f6f" id="a5189abc-63da-49c2-8105-87abaebccde0">
+         <span class="text-secondary" id="3bb7d4ef-f692-40f5-bab4-a75e66f10981">
           Outline
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#2376a06f-8ba5-40a5-8452-d07bb9b90c86" data-toggle="tab" href="#2376a06f-8ba5-40a5-8452-d07bb9b90c86" id="d0f91160-a0c4-4f88-884e-9d65fa12a6ac">
-         <span class="text-secondary" id="11bddd74-a47d-4f74-ac98-2a595f1ba611">
+        <a class="nav-link" data-target="#72ff8849-2db3-424c-8d9a-8b5d42ad9740" data-toggle="tab" href="#72ff8849-2db3-424c-8d9a-8b5d42ad9740" id="511fe066-90f2-4c72-996f-7774c3d651e6">
+         <span class="text-secondary" id="81505f80-33d1-4265-896a-188c93661155">
           Disable
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#5671534d-5818-46d7-8b9e-8c6f45664869" data-toggle="tab" href="#5671534d-5818-46d7-8b9e-8c6f45664869" id="6cbc67b9-5638-4e99-a111-8355acccf0d2">
-         <span class="text-secondary" id="91c2dc03-af03-463e-b3d9-38e31a1d8575">
+        <a class="nav-link" data-target="#99b27211-3354-4a7d-973b-2479c7e1dc43" data-toggle="tab" href="#99b27211-3354-4a7d-973b-2479c7e1dc43" id="d5c70f60-5676-407d-9ce3-9a3541384cec">
+         <span class="text-secondary" id="ee63bfad-cdc9-4e3b-8b80-238deb7fd932">
           Link Resource
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#b42e1872-74a2-41cd-a3da-cebcd5481f5b" data-toggle="tab" href="#b42e1872-74a2-41cd-a3da-cebcd5481f5b" id="7241e31f-75b7-4dbe-89af-26fc25239831">
-         <span class="text-secondary" id="28f185f1-8a30-451d-903b-9ddf8f964b16">
+        <a class="nav-link" data-target="#63f94af5-00fe-4e62-8f5e-cb4b29802f1a" data-toggle="tab" href="#63f94af5-00fe-4e62-8f5e-cb4b29802f1a" id="fb0fa81d-7115-4e98-8bb7-5385abcc00e5">
+         <span class="text-secondary" id="c2c76013-829e-4f62-9e3d-dfac7b5e8c65">
           Open Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#aeeaaf5e-b5a1-4e29-9e37-f61792bc51ab" data-toggle="tab" href="#aeeaaf5e-b5a1-4e29-9e37-f61792bc51ab" id="c579dda1-a34f-437e-ae69-7d0161868415">
-         <span class="text-secondary" id="0a97e8d4-a0bc-4999-92fe-603803338509">
+        <a class="nav-link" data-target="#72859040-76ae-40cf-9b40-5ac469a991ed" data-toggle="tab" href="#72859040-76ae-40cf-9b40-5ac469a991ed" id="b748b4fd-bad6-441d-bd16-162be6b3b37f">
+         <span class="text-secondary" id="e617aec1-2996-4340-bd89-e172b0aacea2">
           Close Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#143614a0-7c65-4917-b58c-753aaba84141" data-toggle="tab" href="#143614a0-7c65-4917-b58c-753aaba84141" id="e808fcf9-dfc2-40b7-a32f-026adf4489bb">
-         <span class="text-secondary" id="39bc996c-67d2-4c79-901d-d272f4cd016d">
+        <a class="nav-link" data-target="#46a875ef-9896-4a39-bb77-b3b19a1d3c6d" data-toggle="tab" href="#46a875ef-9896-4a39-bb77-b3b19a1d3c6d" id="fad4b920-906a-47d7-a179-478a43b8b235">
+         <span class="text-secondary" id="8f4a245c-cb0a-4fce-ba96-0cc35d6da599">
           Expand/Collapse Panel
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#bc78d598-be01-4c33-b182-43569e4977f9" data-toggle="tab" href="#bc78d598-be01-4c33-b182-43569e4977f9" id="991c1465-04a1-4090-a4e3-f2216b90b9eb">
-         <span class="text-secondary" id="e355ab8f-6a1c-4f45-9877-65623fb4a0f8">
+        <a class="nav-link" data-target="#758e9547-c273-41a2-a057-381da69a3348" data-toggle="tab" href="#758e9547-c273-41a2-a057-381da69a3348" id="c11f7369-37d3-47d0-8e00-68b03efef249">
+         <span class="text-secondary" id="b62c6b29-2433-49fc-9705-cfd5a17479b1">
           Submit Action
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="883e2fa4-a9e8-424f-a936-07a1ed49fc1a">
-        <div class="mt-5" id="65c165df-9185-4e31-8d82-fd4d8a2ed2a0">
-         <div class="d-flex justify-content-between" id="5ae730cb-b878-4089-8a1b-da67d73666e9">
-          <h1 id="30469229-6c3e-4483-af11-58e156a1efbc">
+       <div class="tab-pane fade active show" id="1ff9dca8-ae29-4df4-9595-31ed13071651">
+        <div class="mt-5" id="346fe164-1a16-45d5-a52b-ae0497950345">
+         <div class="d-flex justify-content-between" id="7c321e58-efc5-4f2e-9835-656c5cbcc1a0">
+          <h1 id="a4c9f6d7-f0bf-4c92-b571-80c42f8ed7ea">
            Class
-           <span class="text-primary" id="68350207-2c7a-4d39-bf9d-ad9ae9773e6b">
-            <span id="15b4fe03-cc5d-484c-b543-b5864c0bd664">
+           <span class="text-primary" id="98a6c44d-359b-419e-80c4-76a2fbfb0ed7">
+            <span id="562ae49a-4e78-4133-888c-5f63d6319a4e">
              Button
             </span>
            </span>
           </h1>
-          <div id="e0fdf12e-e689-4a84-aac2-60cd9f40e085">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#d8f90a44-787b-49c3-b42f-830d4cb451e5" data-toggle="collapse" id="1e3382a1-1d71-4369-97be-c510f4d0eda7" onclick="return false;" type="button">
+          <div id="172b1bce-0916-4189-97c5-a98f959bda0d">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#62a5214c-63f7-49a4-9404-b2fd2eee1f1b" data-toggle="collapse" id="f8fe7e3c-099d-4394-9465-efee2a29c8e3" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="e2841b22-8c91-4050-9e84-80b1e33a2048">
+         <span class="text-muted" id="c944461c-3b95-45d5-aca4-82ef7a912f1c">
           A web component for a button.
          </span>
-         <pre id="f074024d-0760-43fe-bd8c-c462e934bb6a"><code a="" c="" l="" s=" p y t h o n ">Button(name)</code></pre>
-         <div class="ml-3 collapse" id="d8f90a44-787b-49c3-b42f-830d4cb451e5">
-          <h6 id="06b43696-397d-455c-9e80-3d143f75bcc9">
+         <pre id="8b1f2349-0d7b-4480-84cb-75a2acfd678f"><code a="" c="" l="" s=" p y t h o n ">Button(name)</code></pre>
+         <div class="ml-3 collapse" id="62a5214c-63f7-49a4-9404-b2fd2eee1f1b">
+          <h6 id="3836f88b-a499-4449-bfa3-1b1c0f18b2de">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="73af3284-c5cb-4449-9d02-73b108e56217">
+          <table class="table table-sm bg-light" id="725b42ba-97c4-4b65-a4ae-736b0898b532">
            <thead>
             <tr>
              <th scope="col">
@@ -975,7 +975,7 @@ Badge("Dark").as_dark()</code></pre>
            </tbody>
           </table>
          </div>
-         <p id="cb87e62f-47a6-4d6f-ab6b-841b0c855124">
+         <p id="1f1cba98-9fc2-4d36-b322-89c0c6d79bb8">
           Without applying a stylized method
           <code>
            Button
@@ -987,43 +987,43 @@ Badge("Dark").as_dark()</code></pre>
           </code>
           .
          </p>
-         <div class="ml-3" id="15f69a30-59d6-4810-b75b-b59f87203174">
-          <h6 id="9f321753-3833-4abd-9fe5-ba95b54ab983">
+         <div class="ml-3" id="39ce42b2-6465-43d6-a710-11fe6de15566">
+          <h6 id="5f358bca-5e10-45d0-951a-38313dc9c0d5">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="9fabdf09-b2f4-41d3-9c6b-6c175719fbde"><code a="" c="" l="" s=" p y t h o n ">Button('Google Search').link('https://www.google.com/')</code></pre>
+          <pre id="225634f5-f8fb-4442-9bc1-2c196e1ffdcf"><code a="" c="" l="" s=" p y t h o n ">Button('Google Search').link('https://www.google.com/')</code></pre>
          </div>
-         <div class="ml-3" id="3a39b846-a8ed-4bc0-a968-b583b3e23813">
-          <a class="btn" href="https://www.google.com/" id="5d6e77dc-2c65-4f25-a858-10aaa496032e" role="button">
+         <div class="ml-3" id="97d29e78-ca70-48b1-94e4-400ee30894af">
+          <a class="btn" href="https://www.google.com/" id="6b63fba1-cb8a-4c3d-be9d-f55d9d8e7c4e" role="button">
            Google Search
           </a>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="4e8f426d-4bce-43ee-ba24-ac7f21ceb6f3">
-        <div class="mt-3" id="a7043fde-e405-4e92-9427-12a374897031">
-         <div id="84efe1fa-280b-4ed7-9740-44faa94efeb1">
+       <div class="tab-pane fade" id="aee59a1d-6b33-4002-b1c4-8001cef4fd1c">
+        <div class="mt-3" id="3e0fdf6d-d65f-4d1b-9cc6-2f41147ba91f">
+         <div id="bb025699-d598-47d6-8cd2-3f9b931dc96a">
           <div class="row">
            <div class="col-md">
-            <div id="ced186f6-6bd1-479a-bb02-a8a5dd5a7bff">
-             <h1 id="34120cc5-9d93-419b-a83d-739a9a258a31">
+            <div id="972de916-01a1-45f6-b571-59992a8245e8">
+             <h1 id="66662a8e-651b-41c5-8557-f701abf38d2d">
               Appearance
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="295bfae0-8708-4702-ac38-b768b43f0d6c">
+            <div id="3ef3a527-39a1-4f9a-899a-934b8f134c47">
             </div>
            </div>
           </div>
          </div>
-         <div id="94a4a0f3-3e98-4529-8a71-6a4a5381dd70">
+         <div id="22400530-386f-4a55-8016-66b8fb951a39">
           <div class="row">
            <div class="col-md">
-            <div id="c0164467-3f60-4e1f-83e0-295648e5f218">
-             <p id="ad514a07-63f2-41df-bd77-17fa02c7790f">
+            <div id="c69defbd-302d-4824-b14e-bb8ba80cf1bd">
+             <p id="2727159e-eeff-4bc6-9a35-bc343fce0939">
               Change
               <code>
                Button
@@ -1065,8 +1065,8 @@ Badge("Dark").as_dark()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="775dcd98-c38c-4f00-81a3-a22e893a2bbe">
-             <pre id="819cdc30-5ec2-40b5-a74d-f16307a51f61"><code a="" c="" l="" s=" p y t h o n ">Button("Primary").as_primary()
+            <div id="4010f642-9639-4ecc-adbc-6ee0ba1803a7">
+             <pre id="c3904792-0815-4c3b-8a46-bb41aa53eb52"><code a="" c="" l="" s=" p y t h o n ">Button("Primary").as_primary()
 Button("Secondary").as_secondary()
 Button("Success").as_success()
 Button("Warning").as_warning()
@@ -1074,29 +1074,29 @@ Button("Danger").as_danger()
 Button("Info").as_info()
 Button("Light").as_light()
 Button("Dark").as_dark()</code></pre>
-             <div id="cc20b24e-95a1-48df-a1b3-b9566813b402">
-              <a class="mb-1 btn btn-primary" href="#" id="903938d1-335e-49af-b316-f102cddb5737" role="button">
+             <div id="665c4174-32f4-479d-8cbe-6d37aa04fb8c">
+              <a class="mb-1 btn btn-primary" href="#" id="cc1dd88c-a2f4-477e-9865-765e5f6a6108" role="button">
                Primary
               </a>
-              <a class="mb-1 btn btn-secondary" href="#" id="6071fdb7-dabe-4719-8f6d-a9adf4e5bfcd" role="button">
+              <a class="mb-1 btn btn-secondary" href="#" id="6f55482a-08ab-48b0-9f7f-2737d327e70a" role="button">
                Secondary
               </a>
-              <a class="mb-1 btn btn-success" href="#" id="0c2d7ce7-fc23-4f07-86d8-2e77db7341bf" role="button">
+              <a class="mb-1 btn btn-success" href="#" id="62fcda76-2358-40b2-9d87-8159ccfb20df" role="button">
                Success
               </a>
-              <a class="mb-1 btn btn-warning" href="#" id="bd50f701-95b6-40e8-a600-05860234c6b7" role="button">
+              <a class="mb-1 btn btn-warning" href="#" id="064e1c22-2500-4e19-a98d-cc2fdad09301" role="button">
                Warning
               </a>
-              <a class="mb-1 btn btn-danger" href="#" id="3ed27d08-4150-4b2f-83d4-bff0e7fc3fc3" role="button">
+              <a class="mb-1 btn btn-danger" href="#" id="42898c29-1825-4791-998f-425a7873b43d" role="button">
                Danger
               </a>
-              <a class="mb-1 btn btn-info" href="#" id="11b4662a-59f2-4cca-8584-8e0e5228010f" role="button">
+              <a class="mb-1 btn btn-info" href="#" id="8aba5337-d75c-4149-bf4c-272b1595ac3d" role="button">
                Info
               </a>
-              <a class="mb-1 btn btn-light" href="#" id="38145a47-afe7-495d-bcf8-bb45c8ad7846" role="button">
+              <a class="mb-1 btn btn-light" href="#" id="83aabf12-7198-4a09-afef-a286e72bf7c5" role="button">
                Light
               </a>
-              <a class="mb-1 btn btn-dark" href="#" id="8d78ce4d-cc22-46d3-a8f1-664c98eef481" role="button">
+              <a class="mb-1 btn btn-dark" href="#" id="c68f652d-f47a-4c65-b245-80cbf408008a" role="button">
                Dark
               </a>
              </div>
@@ -1106,28 +1106,28 @@ Button("Dark").as_dark()</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="5db8fa98-bac6-45b3-b09d-50c87edf1e0c">
-        <div class="mt-3" id="15e2bfe3-4680-44e7-b1cf-5700962eca34">
-         <div id="f58396a7-2ae6-42b7-b445-fb550ab800fe">
+       <div class="tab-pane fade" id="fd21f4cd-8dfd-465e-8f56-811151f58f6f">
+        <div class="mt-3" id="8c97c669-e617-45e2-84d0-139880a655a2">
+         <div id="ac5e9403-4ed2-4868-b057-3e09c86f0100">
           <div class="row">
            <div class="col-md">
-            <div id="de7f3286-ba1e-4651-9f68-803fdb7ffb1b">
-             <h1 id="e9c9c4be-9efb-47bc-8e5e-842b760adc38">
+            <div id="f9e0106a-6c43-43bf-9c20-fe1651fad9c5">
+             <h1 id="96298b9d-e139-4e55-9331-7954c01722d9">
               Outline
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="2789f547-eca7-48c1-8c23-889fc186f474">
+            <div id="d15f2eef-80af-4852-a37c-9f375c1e1e6c">
             </div>
            </div>
           </div>
          </div>
-         <div id="3003d0da-0469-42e3-a5b8-e178dfc4408a">
+         <div id="49da0add-29f1-4c11-bad2-96be07f92830">
           <div class="row">
            <div class="col-md">
-            <div id="a4b43f5e-b948-4b94-bb3d-14e14e3d6281">
-             <p id="88d14151-38a8-48a6-9765-13e4056a4bf9">
+            <div id="1084b5c9-3722-4093-971b-840141dfa93c">
+             <p id="b5e5e1f1-e53d-4038-b912-ef35677fd32e">
               Make
               <code>
                Button
@@ -1141,8 +1141,8 @@ Button("Dark").as_dark()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="1e1d4df8-2b69-44e3-8940-e55454a48690">
-             <pre id="e19d0799-4356-4555-897f-657bc464f7a6"><code a="" c="" l="" s=" p y t h o n ">Button("Primary").as_primary().as_outline()
+            <div id="ab088727-304f-485a-863e-d05abfbceaf0">
+             <pre id="81d2f376-1099-4b3b-9e15-4ed8287ec5ba"><code a="" c="" l="" s=" p y t h o n ">Button("Primary").as_primary().as_outline()
 Button("Secondary").as_secondary().as_outline()
 Button("Success").as_success().as_outline()
 Button("Warning").as_warning().as_outline()
@@ -1150,29 +1150,29 @@ Button("Danger").as_danger().as_outline()
 Button("Info").as_info().as_outline()
 Button("Light").as_light().as_outline()
 Button("Dark").as_dark().as_outline()</code></pre>
-             <div id="fa357daa-2cc8-4d2c-9184-abaca63b6e51">
-              <a class="mb-1 btn btn-outline-primary" href="#" id="ccbb9eb4-810a-4de4-bf0d-ce9d0b7fc6c4" role="button">
+             <div id="efb1ea8d-1c07-497b-9612-5a3ddd0e2640">
+              <a class="mb-1 btn btn-outline-primary" href="#" id="71a9f747-c520-43e3-87d8-416bc763ae96" role="button">
                Primary
               </a>
-              <a class="mb-1 btn btn-outline-secondary" href="#" id="2e77fc81-8af6-4d8e-87ec-dbc8f8524a33" role="button">
+              <a class="mb-1 btn btn-outline-secondary" href="#" id="5470d4df-3bf7-437f-977a-4e657c18e3b4" role="button">
                Secondary
               </a>
-              <a class="mb-1 btn btn-outline-success" href="#" id="19915b8d-685e-4d00-8fd8-385b6f8bf8c2" role="button">
+              <a class="mb-1 btn btn-outline-success" href="#" id="892d934c-afbd-443d-a8f8-8fcc58d36685" role="button">
                Success
               </a>
-              <a class="mb-1 btn btn-outline-warning" href="#" id="37aef20b-a01a-4c9d-9787-ae514348add0" role="button">
+              <a class="mb-1 btn btn-outline-warning" href="#" id="f66dc123-bca9-41a9-aac2-0ed8e53ba5eb" role="button">
                Warning
               </a>
-              <a class="mb-1 btn btn-outline-danger" href="#" id="e6ef8098-14d2-4850-a1e3-dfd439588bc1" role="button">
+              <a class="mb-1 btn btn-outline-danger" href="#" id="4e6ce4d3-4ade-4f43-839d-2ec607df7d72" role="button">
                Danger
               </a>
-              <a class="mb-1 btn btn-outline-info" href="#" id="c7013ce7-1b54-4857-95ee-96412e387c02" role="button">
+              <a class="mb-1 btn btn-outline-info" href="#" id="7de7948a-2003-449a-a06e-c01b9ea67812" role="button">
                Info
               </a>
-              <a class="mb-1 btn btn-outline-light" href="#" id="36561fe5-8f5f-4f0c-9fb5-fe2e720a3d97" role="button">
+              <a class="mb-1 btn btn-outline-light" href="#" id="9fc5c4ac-7a38-4833-b9b9-584d995c0898" role="button">
                Light
               </a>
-              <a class="mb-1 btn btn-outline-dark" href="#" id="2895f7d0-c944-4181-9816-779b05e768b8" role="button">
+              <a class="mb-1 btn btn-outline-dark" href="#" id="010f9e24-91d3-4090-9207-52de46ec0df1" role="button">
                Dark
               </a>
              </div>
@@ -1182,28 +1182,28 @@ Button("Dark").as_dark().as_outline()</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="2376a06f-8ba5-40a5-8452-d07bb9b90c86">
-        <div class="mt-3" id="d5436541-a650-4e6a-8204-075efc7386ba">
-         <div id="e12d2549-5d95-4f05-b1bc-5e269ad97e32">
+       <div class="tab-pane fade" id="72ff8849-2db3-424c-8d9a-8b5d42ad9740">
+        <div class="mt-3" id="975a3abe-71cd-48f8-97e6-43f670ae7798">
+         <div id="6f1b2333-8f20-4894-a04a-007c5dcbcb7f">
           <div class="row">
            <div class="col-md">
-            <div id="22fd5b7d-584c-4455-9c99-192be1051204">
-             <h1 id="3f290157-6bc5-4217-b8f1-6acaa4cc84f0">
+            <div id="1f41202e-d807-40e0-9adb-8534f2c576c5">
+             <h1 id="521e3e6a-cb4b-4298-b04f-1600141ecff3">
               Disable
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="2dedfd7f-8222-4dbc-9e28-d4b79083a243">
+            <div id="4b48a5f8-71f5-483d-bb91-0963cfa8947d">
             </div>
            </div>
           </div>
          </div>
-         <div id="cef2208f-f4ca-44ab-8184-1af27c0c8991">
+         <div id="f9fe855e-7c1a-4010-a00d-74096ddcb356">
           <div class="row">
            <div class="col-md">
-            <div id="58674d41-4590-4e22-bf66-a5ffa7cb3b47">
-             <p id="f929583b-41c9-45cf-9b2a-3ad5959288ba">
+            <div id="2fd45de5-4e36-4956-b483-8b75628bcc16">
+             <p id="f58ea808-1b32-494b-be95-aa3cd69c2b66">
               But default the
               <code>
                Button
@@ -1225,14 +1225,14 @@ Button("Dark").as_dark().as_outline()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="9f8fbd17-82ba-473b-bdcf-833d9b8e50b8">
-             <pre id="eb5a9b45-8593-4271-aa0f-a0c5f399bdba"><code a="" c="" l="" s=" p y t h o n ">Button("Enabled").as_primary()
+            <div id="a373a4ea-0f3f-49fd-b3df-6ec11cb13ce1">
+             <pre id="02354d35-161b-491b-b44c-3fcac1fa8f79"><code a="" c="" l="" s=" p y t h o n ">Button("Enabled").as_primary()
 Button("Disabled").as_primary().as_disabled()</code></pre>
-             <div id="84d9aa73-7af6-48bd-8585-387542fc24b1">
-              <button class="btn btn-primary" id="ac4b0c85-d851-4185-be1d-8d4da6f43681" onclick="return false;">
+             <div id="1642ccb3-00cf-4b8c-9914-55ef9ce858a0">
+              <button class="btn btn-primary" id="1a6f2bc2-fba3-49e2-abd3-c9397e6e3edb" onclick="return false;">
                Enabled
               </button>
-              <button class="btn btn-primary" disabled="" id="30519268-5a30-4398-90de-ef6dae5e1643" onclick="return false;">
+              <button class="btn btn-primary" disabled="" id="e72cf4d9-226f-4c50-b436-968e0ad5520c" onclick="return false;">
                Disabled
               </button>
              </div>
@@ -1242,28 +1242,28 @@ Button("Disabled").as_primary().as_disabled()</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="5671534d-5818-46d7-8b9e-8c6f45664869">
-        <div class="mt-3" id="d3b6c0f5-3c4f-4890-b0f2-08a226f20ea3">
-         <div id="cd30ce9a-086d-4e4f-b958-dd4a088e04d1">
+       <div class="tab-pane fade" id="99b27211-3354-4a7d-973b-2479c7e1dc43">
+        <div class="mt-3" id="d2676733-e8fa-4e48-87f5-2afee80ade5a">
+         <div id="42705a27-ad10-4704-9d41-7641aba2eed5">
           <div class="row">
            <div class="col-md">
-            <div id="4e6938a6-375e-441f-8edb-0f69670c055a">
-             <h1 id="0c405bb9-a9a1-4027-82b9-5efa8d67d099">
+            <div id="2672a531-e707-49e2-9e41-5a760e3726e7">
+             <h1 id="5f7fce50-2898-45dc-8ab9-a3de551c9748">
               Link Resource
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="c752c672-2c4e-46d5-ae6d-e031b12b775f">
+            <div id="5f563285-cd68-4438-8ed1-11c0d37e16a4">
             </div>
            </div>
           </div>
          </div>
-         <div id="ba324c35-f257-4d10-bc1b-bb74e1accbfd">
+         <div id="f66c1dd1-398a-4de2-b4c4-2f080821add5">
           <div class="row">
            <div class="col-md">
-            <div id="6e5a1c0d-9639-42da-a569-67b538ed8625">
-             <p id="f17fc4ef-d096-46a2-a901-5b80e2f89954">
+            <div id="63bf206c-af5e-40db-bb26-7e7f840fb1c2">
+             <p id="96610b77-2de5-436a-98f6-934fe262238c">
               Associate
               <code>
                Button
@@ -1277,10 +1277,10 @@ Button("Disabled").as_primary().as_disabled()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="4cec393b-2d3d-4038-a22c-7b7397ed0abf">
-             <pre id="de22f5bf-99f0-4b01-93c6-0646c3e170d2"><code a="" c="" l="" s=" p y t h o n ">Button("Google Search").as_primary().link("https://www.google.com/")</code></pre>
-             <div id="e04948c9-78dc-4be6-99b4-36e7cf5cfcc3">
-              <a class="btn btn-primary" href="https://www.google.com/" id="dea70a43-7734-4919-83f4-67bd5f538b4a" role="button">
+            <div id="b327a384-0f3c-4912-9033-85e9eef9d0e0">
+             <pre id="7676268a-abaf-4d26-85ff-c4b080b1128a"><code a="" c="" l="" s=" p y t h o n ">Button("Google Search").as_primary().link("https://www.google.com/")</code></pre>
+             <div id="0ed5b0ed-b6c3-4e4a-8630-2be7fe4c671d">
+              <a class="btn btn-primary" href="https://www.google.com/" id="24e80c82-79de-4e36-8f5e-66a1d368aaca" role="button">
                Google Search
               </a>
              </div>
@@ -1290,28 +1290,28 @@ Button("Disabled").as_primary().as_disabled()</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="b42e1872-74a2-41cd-a3da-cebcd5481f5b">
-        <div class="mt-3" id="087c36db-bdb4-47d3-bee8-38e34c79ee61">
-         <div id="c44ff22b-22b2-4c80-8f4b-b540cf786c72">
+       <div class="tab-pane fade" id="63f94af5-00fe-4e62-8f5e-cb4b29802f1a">
+        <div class="mt-3" id="edc09a85-ac79-4eb7-9742-436dccf23e2c">
+         <div id="482176da-56f3-4fa3-b3ea-fd0d366cd7c2">
           <div class="row">
            <div class="col-md">
-            <div id="4c39b687-9ccd-4024-9702-06442f7cc927">
-             <h1 id="f1169f87-9ad7-4011-9214-2eb307bf6794">
+            <div id="68d1da13-fb55-445d-960b-a95b07558394">
+             <h1 id="70d86ab3-78b6-40a3-adb6-ab42f99c704a">
               Open Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="8886e246-fec9-4647-99f2-76fa9c3729d4">
+            <div id="091755c8-1b87-4520-982b-67fc40754d02">
             </div>
            </div>
           </div>
          </div>
-         <div id="4daa521d-0a6a-497b-9629-16eed3a64847">
+         <div id="2f120e07-d8b9-4425-a2d2-05a4b3de90a4">
           <div class="row">
            <div class="col-md">
-            <div id="8b2bdd45-80ba-4187-bcdf-d96587529715">
-             <p id="c8eca3eb-656e-4ebe-8184-61eef9022c1c">
+            <div id="69b690d0-62a6-4f99-83a5-20444ec37814">
+             <p id="45d0f6c7-4c03-4a76-ae12-54fa07ce15c8">
               Use
               <code>
                Button
@@ -1325,14 +1325,14 @@ Button("Disabled").as_primary().as_disabled()</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="78fd44a8-838c-48bc-be89-c1812710c53e">
-             <pre id="d86fd135-9ef6-4588-a2e9-f32f459992c5"><code a="" c="" l="" s=" p y t h o n ">dialog = Dialog(
+            <div id="64fe00c3-bb80-432b-8150-664ef0a3060f">
+             <pre id="b5fe7276-2d70-4b11-8272-fd02ede1efcd"><code a="" c="" l="" s=" p y t h o n ">dialog = Dialog(
   "Greeting",
   "Hello World!"
 )
 button = Button("Say Hello").as_primary().toggle(dialog)</code></pre>
-             <div id="249d2c58-bd3a-4417-a86d-7374d3f7fb7d">
-              <div class="modal" id="6241c266-69fe-44e4-befb-dca450bba278">
+             <div id="df72f768-2481-4cda-93e0-e192118b9297">
+              <div class="modal" id="bca1b6ab-2e99-4aa5-a3a5-1aeb010817bb">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -1351,7 +1351,7 @@ button = Button("Say Hello").as_primary().toggle(dialog)</code></pre>
                 </div>
                </div>
               </div>
-              <button class="btn btn-primary" data-target="#6241c266-69fe-44e4-befb-dca450bba278" data-toggle="modal" id="1ebba786-9c32-4be8-a7da-72844edae991" onclick="return false;" type="button">
+              <button class="btn btn-primary" data-target="#bca1b6ab-2e99-4aa5-a3a5-1aeb010817bb" data-toggle="modal" id="a6a17f16-049c-457d-b320-ff6ff047c503" onclick="return false;" type="button">
                Say Hello
               </button>
              </div>
@@ -1361,28 +1361,28 @@ button = Button("Say Hello").as_primary().toggle(dialog)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="aeeaaf5e-b5a1-4e29-9e37-f61792bc51ab">
-        <div class="mt-3" id="01e24f1f-7f22-4ba9-89ca-8337a7a887db">
-         <div id="26c1abd5-df07-4bab-998e-01e3d6805553">
+       <div class="tab-pane fade" id="72859040-76ae-40cf-9b40-5ac469a991ed">
+        <div class="mt-3" id="7e29a182-0541-4374-a4b4-3ed720cf48c5">
+         <div id="9264b539-a0ae-4d2c-b7a8-6966000f62c7">
           <div class="row">
            <div class="col-md">
-            <div id="4f8123b2-aed2-4efe-b280-6a7b122186f5">
-             <h1 id="61c9f38b-8d6e-4398-abbb-5ef0446a9cfe">
+            <div id="6fcefa23-9414-4f1b-8cee-289bce3b38db">
+             <h1 id="35b3dab5-5ee1-4277-9600-09f23291e7a6">
               Close Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="9ed51755-4748-4293-bf36-3a1fa8208b03">
+            <div id="3cef9340-e575-41a6-bfa0-c8c2919ede72">
             </div>
            </div>
           </div>
          </div>
-         <div id="a7e6427d-1235-4059-b81f-24c008bcb808">
+         <div id="329e1448-e4c3-4a27-a26b-7ba327af4832">
           <div class="row">
            <div class="col-md">
-            <div id="bf5c1c13-23f2-4e64-aacf-d7afb8820d1c">
-             <p id="54288d57-51d4-4c70-af84-84432131548a">
+            <div id="67cef77e-efd1-45b8-bab4-7a92a8629d1a">
+             <p id="1aa07ab0-d001-46db-b734-af2ab0983ffe">
               Use
               <code>
                Button
@@ -1396,15 +1396,15 @@ button = Button("Say Hello").as_primary().toggle(dialog)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="346748ad-0c1c-4420-b26b-155deb6e4fe6">
-             <pre id="dc0b2332-82d6-4824-b64f-e602abb983bc"><code a="" c="" l="" s=" p y t h o n ">dialog = Dialog(
+            <div id="b239ef69-501e-46b9-bf33-257276fc1d46">
+             <pre id="233f2a61-c159-4d1f-a6ce-7b32a201f972"><code a="" c="" l="" s=" p y t h o n ">dialog = Dialog(
   "Greeting",
   "Hello World!",
   Button("Bye").as_primary().dismiss()
 )
 button = Button("Say Hello").as_primary().toggle(dialog)</code></pre>
-             <div id="585838bf-2300-4f97-a671-5a41a982739c">
-              <div class="modal" id="c8238197-ef21-49a9-ad4d-b3565fa6d979">
+             <div id="a6125242-2f7b-40fe-bd22-4a8ddd759ace">
+              <div class="modal" id="4b9fdb8f-f68a-43b2-ab01-aad11923cc0d">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -1421,14 +1421,14 @@ button = Button("Say Hello").as_primary().toggle(dialog)</code></pre>
                   Hello World!
                  </div>
                  <div class="modal-footer">
-                  <button class="btn btn-primary" data-dismiss="modal" id="88de63a2-a3b0-4ba6-9cee-184c0971b329" onclick="return false;" type="button">
+                  <button class="btn btn-primary" data-dismiss="modal" id="547d231f-e8cc-4e9f-a167-be8da44f5535" onclick="return false;" type="button">
                    Bye
                   </button>
                  </div>
                 </div>
                </div>
               </div>
-              <button class="btn btn-primary" data-target="#c8238197-ef21-49a9-ad4d-b3565fa6d979" data-toggle="modal" id="aca6aef4-1744-4635-8d47-34c7874bf13d" onclick="return false;" type="button">
+              <button class="btn btn-primary" data-target="#4b9fdb8f-f68a-43b2-ab01-aad11923cc0d" data-toggle="modal" id="c60e2dd3-afef-43ae-8334-2b632476198e" onclick="return false;" type="button">
                Say Hello
               </button>
              </div>
@@ -1438,28 +1438,28 @@ button = Button("Say Hello").as_primary().toggle(dialog)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="143614a0-7c65-4917-b58c-753aaba84141">
-        <div class="mt-3" id="787200f4-9ae2-4892-b9a4-be9445fdd687">
-         <div id="9291b378-fbe2-4a55-b1cd-2e801cacdf21">
+       <div class="tab-pane fade" id="46a875ef-9896-4a39-bb77-b3b19a1d3c6d">
+        <div class="mt-3" id="0bda8259-ab2c-4b32-b47d-7f54acb7743c">
+         <div id="628e46fe-9ccd-4d36-afe1-0c6feae1a286">
           <div class="row">
            <div class="col-md">
-            <div id="b59829ad-2e7e-4fe6-a0dd-d8ddb2e3aea3">
-             <h1 id="0efb13a9-bca9-466e-a0a2-6cec78cfe42c">
+            <div id="af934530-cf2c-41cf-a14e-6a3024c0111c">
+             <h1 id="c5ef616b-f1b8-4949-875d-078c94184592">
               Expand/Collapse Panel
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="0342b19c-cec7-4092-b624-4607860b8bf2">
+            <div id="646f81b7-e65a-40b2-8f44-539c20ea2d24">
             </div>
            </div>
           </div>
          </div>
-         <div id="487e8bc2-756e-43f6-9a45-116fe41cc0d1">
+         <div id="f60755ac-dc6b-4ac9-ac52-03fac8750e80">
           <div class="row">
            <div class="col-md">
-            <div id="729e1594-365c-4728-8696-63c26a6796fd">
-             <p id="49eb8bd5-b1c4-44de-996b-bf36c7d3a5ff">
+            <div id="503e450c-ebb4-4128-bf21-c9a3c8a919b1">
+             <p id="4e02605d-49f7-4256-844b-8a6a7796c468">
               Use
               <code>
                Button
@@ -1473,17 +1473,17 @@ button = Button("Say Hello").as_primary().toggle(dialog)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="6cf6a67b-1173-4aff-b3a2-12cc6ce79fc3">
-             <pre id="02f2ec5c-9c88-424b-92ec-6c628bb98262"><code a="" c="" l="" s=" p y t h o n ">quote = Panel(
+            <div id="a390cbd3-e7bb-44fc-a972-b691c97f0d75">
+             <pre id="de329ce6-d2b4-4b38-b2fe-fc265cd7ae18"><code a="" c="" l="" s=" p y t h o n ">quote = Panel(
   "Sometimes life is going to hit you in " +
   "the head with a brick. Don’t lose faith."
 ).as_collapse()
 Button("Steve Jobs Quote").as_primary().toggle(quote)</code></pre>
-             <div id="272f9052-eb5c-4a30-bb3d-78e5ac643398">
-              <button class="btn btn-primary" data-target="#6fbe0958-075c-4177-97cb-e325ada75fd8" data-toggle="collapse" id="be5a4dd4-735c-455b-8688-e1d7cb162e42" onclick="return false;" type="button">
+             <div id="eff40344-80a9-49d1-82d6-cd899e026181">
+              <button class="btn btn-primary" data-target="#e0d3aee1-9d55-4793-89ce-20cad6709fa2" data-toggle="collapse" id="66642f3c-ea6b-4304-bf59-486b1da402f4" onclick="return false;" type="button">
                Steve Jobs Quote
               </button>
-              <div class="collapse" id="6fbe0958-075c-4177-97cb-e325ada75fd8">
+              <div class="collapse" id="e0d3aee1-9d55-4793-89ce-20cad6709fa2">
                Sometimes life is going to hit you in the head with a brick. Don’t lose faith.
               </div>
              </div>
@@ -1493,28 +1493,28 @@ Button("Steve Jobs Quote").as_primary().toggle(quote)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="bc78d598-be01-4c33-b182-43569e4977f9">
-        <div class="mt-3" id="84a3b80b-c597-4327-b435-6f0088c2c3be">
-         <div id="b8485197-01be-49c0-930f-6d9764eabeb2">
+       <div class="tab-pane fade" id="758e9547-c273-41a2-a057-381da69a3348">
+        <div class="mt-3" id="6000aa1c-eaff-499b-8392-f57d691eb33e">
+         <div id="d11e4719-3b1c-4f37-9a31-50afd3b90249">
           <div class="row">
            <div class="col-md">
-            <div id="2a1baedf-ba83-41b5-8f87-19e2926181ae">
-             <h1 id="e8564b49-e1bd-44c4-8702-b28f03babb9f">
+            <div id="588c0984-213d-4183-a9bf-1a622819b0d5">
+             <h1 id="b65a738a-77b2-4bce-97a1-ea20063cea42">
               Submit Action
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="37dbde9c-8e04-4d83-9aed-a01c3c227f3c">
+            <div id="c6cce387-b5ea-40e3-b1c7-237425e2e50e">
             </div>
            </div>
           </div>
          </div>
-         <div id="d110926c-a890-4c33-8c0f-94f9064adece">
+         <div id="9a43e81a-52b6-409c-9052-82a8e8d73bc1">
           <div class="row">
            <div class="col-md">
-            <div id="521db348-d098-4797-9328-c2e371d63622">
-             <p id="f3c9693e-f6f6-4a5b-a393-866b61789e87">
+            <div id="7f3c3cad-9fb5-47e0-862d-0ccc5a1a9e61">
+             <p id="c8e89167-d9d2-4dd6-b564-27270b64d750">
               Use
               <code>
                Button
@@ -1525,7 +1525,7 @@ Button("Steve Jobs Quote").as_primary().toggle(quote)</code></pre>
               </code>
               function.
              </p>
-             <p id="574e5fc2-fb19-4499-801d-66a07842ad5c">
+             <p id="df691905-bbf8-43de-afdf-773b4bfa13fc">
               <strong>
                Note:
               </strong>
@@ -1546,21 +1546,21 @@ Button("Steve Jobs Quote").as_primary().toggle(quote)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="1b3b1705-7fb0-49c9-8ade-ef3dace2213e">
-             <pre id="b9eaafad-545f-47c7-91ed-9683735b1cc2"><code a="" c="" l="" s=" p y t h o n ">Form(
+            <div id="5814ef87-c33b-4f73-a720-bb92d2c8a1cd">
+             <pre id="09e441fb-eed0-49f2-be12-5de08ab7d9ef"><code a="" c="" l="" s=" p y t h o n ">Form(
   TextInput("Email", "email", "my@email.com").for_email(),
   Button("Send").as_primary().submit()
 )</code></pre>
-             <form enctype="multipart/form-data" id="2e8d26e0-03d7-407a-8c68-9ac416c97caf" method="POST">
+             <form enctype="multipart/form-data" id="d2986165-348a-4fb9-afc6-6976001fea4c" method="POST">
               <div class="form-group row">
-               <label class="col-sm-2 col-form-label d-flex align-items-center" for="047c0c73-dc72-4564-a33d-3d09bb547c04">
+               <label class="col-sm-2 col-form-label d-flex align-items-center" for="c189992a-fe88-48eb-b4f7-392b36fd6c57">
                 Email
                </label>
                <div class="col-sm-10 d-flex align-items-center">
-                <input class="form-control" id="047c0c73-dc72-4564-a33d-3d09bb547c04" name="email" type="email" value="my@email.com"/>
+                <input class="form-control" id="c189992a-fe88-48eb-b4f7-392b36fd6c57" name="email" type="email" value="my@email.com"/>
                </div>
               </div>
-              <button class="btn btn-primary" id="e978f078-8ac5-4217-9524-1b3283873127" onclick="return false;" type="submit">
+              <button class="btn btn-primary" id="d845e24b-44b9-401c-a11d-7818c320a461" onclick="return false;" type="submit">
                Send
               </button>
              </form>
@@ -1573,41 +1573,41 @@ Button("Steve Jobs Quote").as_primary().toggle(quote)</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="70f16d06-abfe-4c23-8bbf-972997227f6f">
-     <div id="947dd64a-816e-4b2d-9b9d-f555e6a4c699">
+    <div class="tab-pane fade" id="801469d3-85a3-4199-89de-eb4cd34fc5b6">
+     <div id="2e5a7285-502d-47ce-b68b-e2905f291360">
       <hr/>
-      <ul class="nav" id="48008fdc-1c42-45a5-a181-09f8ac855f9e" role="tablist">
+      <ul class="nav" id="49470d67-a773-4bd2-97e7-f2f0a186e987" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-target="#789fd779-720f-45f2-bed9-c6d74908e3e3" data-toggle="tab" href="#789fd779-720f-45f2-bed9-c6d74908e3e3" id="dd7f8f65-6724-40ca-aa05-ff2c7728aa14">
-         <span class="text-secondary" id="be0fe7fb-47ae-40b7-9567-67c252fdcaf6">
-          <span id="8613f7e3-c922-4c3a-bbc5-bc7e33752ace">
+        <a class="nav-link active" data-target="#2bf965b0-aabf-4386-8b41-24f601fa99c8" data-toggle="tab" href="#2bf965b0-aabf-4386-8b41-24f601fa99c8" id="acb82016-0e58-48d4-b8ad-e35085d1c4dc">
+         <span class="text-secondary" id="751c8b74-811f-4097-8b82-a0f04bdafd87">
+          <span id="5e640c66-5221-4ace-a1c6-1f925f524c5e">
            List
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#808a9152-06e7-44e4-9780-2ab6cef97b77" data-toggle="tab" href="#808a9152-06e7-44e4-9780-2ab6cef97b77" id="81615f85-67cc-44a7-9343-54927a198c78">
-         <span class="text-secondary" id="40437fac-8ee8-4080-bc52-c45da1e5e32b">
-          <span id="dc493ba4-5ec7-4b63-864f-ee5341bf40c2">
+        <a class="nav-link" data-target="#99ca2714-9241-4870-83b6-9ccefdab4455" data-toggle="tab" href="#99ca2714-9241-4870-83b6-9ccefdab4455" id="6de7f07b-e231-4368-8b09-34ea79c225c8">
+         <span class="text-secondary" id="2cb71913-de58-4688-9bf9-730ebb196057">
+          <span id="39316a7c-9c61-4a67-805b-9e7e3af715a5">
            List.Item
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#5920ba3d-1250-4dc2-8025-074f4534c2e8" data-toggle="tab" href="#5920ba3d-1250-4dc2-8025-074f4534c2e8" id="c72771b4-cee2-4ef0-8bc0-a261a73031be">
-         <span class="text-secondary" id="d706de71-8655-4744-b4ce-cdf2c933c793">
-          <span id="6956234c-d97e-4ec4-a703-b6d62862d0a0">
+        <a class="nav-link" data-target="#143aebaf-2ba7-47f4-b2f9-0714375983f9" data-toggle="tab" href="#143aebaf-2ba7-47f4-b2f9-0714375983f9" id="804949e6-c043-4afb-8fe2-2e82e4a88141">
+         <span class="text-secondary" id="0f8227ca-ad96-4eca-b4aa-f69991540ab8">
+          <span id="0dfa5613-d5f6-4a1f-8398-cd3e420e6131">
            Deck
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#fb9cab0b-7f5a-491b-9a29-865760713446" data-toggle="tab" href="#fb9cab0b-7f5a-491b-9a29-865760713446" id="b68a54bb-09c3-4621-9459-af3fe5227bf1">
-         <span class="text-secondary" id="197840fe-934a-492f-8bb9-62aa51c6ec5c">
-          <span id="c11e230b-f39d-4c90-8e52-b60608d28c6e">
+        <a class="nav-link" data-target="#0904baf1-e955-4578-86e7-a48bbc1d8d93" data-toggle="tab" href="#0904baf1-e955-4578-86e7-a48bbc1d8d93" id="d52428de-622d-4b4c-9bef-12a846e6e494">
+         <span class="text-secondary" id="2d44ce95-6b0f-4597-995b-c5d2c6abd436">
+          <span id="3b5de0bb-0702-4c7c-8ad9-60d30a12be0e">
            Deck.Card
           </span>
          </span>
@@ -1615,34 +1615,34 @@ Button("Steve Jobs Quote").as_primary().toggle(quote)</code></pre>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="789fd779-720f-45f2-bed9-c6d74908e3e3">
-        <div class="mt-5" id="f479fe68-26c9-4a2a-8edb-b62bd1ab63ee">
-         <div class="d-flex justify-content-between" id="dd49391e-5839-498a-8deb-2d614cd1660f">
-          <h1 id="fded8703-224a-42be-9f98-17e1b62e7165">
+       <div class="tab-pane fade active show" id="2bf965b0-aabf-4386-8b41-24f601fa99c8">
+        <div class="mt-5" id="51c3e721-1b89-44db-ad71-3c031db7756e">
+         <div class="d-flex justify-content-between" id="c34aa975-8e1d-43bf-a8b2-3af65d5fa4e8">
+          <h1 id="e46f63e9-a6d8-47b4-bce3-9ef9f77d2d8b">
            Class
-           <span class="text-primary" id="0aedc1be-1ba4-4fa7-a625-69f922e46353">
-            <span id="8613f7e3-c922-4c3a-bbc5-bc7e33752ace">
+           <span class="text-primary" id="664676da-f1a4-4f66-84b3-6a74af1a29f4">
+            <span id="5e640c66-5221-4ace-a1c6-1f925f524c5e">
              List
             </span>
            </span>
           </h1>
-          <div id="ed1d5d3c-6b5e-47bf-aae6-a2fa6a4c3e7e">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#41c447be-5092-4b2d-8287-04743debbc94" data-toggle="collapse" id="2fb3a93c-8495-4869-95ff-308a7bc9c2e6" onclick="return false;" type="button">
+          <div id="4bd40104-f2c0-4dc5-9cd8-b6b482c8c795">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#5b49ce46-e1fc-420c-92f9-5c8e90250c4f" data-toggle="collapse" id="33dd4314-7e80-4499-8267-8502bd5df935" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="8dd1b95d-8fad-40cf-8bb4-853d17f6353c">
+         <span class="text-muted" id="48806a0d-2f08-42e3-a152-682b64d9ebf3">
           A web component for a list of items.
          </span>
-         <pre id="917be3c5-e051-42e7-ae27-7f219989827a"><code a="" c="" l="" s=" p y t h o n ">List(*items)</code></pre>
-         <div class="ml-3 collapse" id="41c447be-5092-4b2d-8287-04743debbc94">
-          <h6 id="803d59d6-3080-4351-8fa6-f3b83e3cf833">
+         <pre id="c303810a-8ebd-43b5-b2f8-df922b4c01ca"><code a="" c="" l="" s=" p y t h o n ">List(*items)</code></pre>
+         <div class="ml-3 collapse" id="5b49ce46-e1fc-420c-92f9-5c8e90250c4f">
+          <h6 id="42f38036-1dc9-405b-b85b-60ccc2d682b8">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="fda84f16-06ea-498e-8978-aa84ac5e0094">
+          <table class="table table-sm bg-light" id="3c37a3a7-bfef-4413-b4cd-17ae4adeba34">
            <thead>
             <tr>
              <th scope="col">
@@ -1683,13 +1683,13 @@ Button("Steve Jobs Quote").as_primary().toggle(quote)</code></pre>
            </tbody>
           </table>
          </div>
-         <div class="ml-3" id="8fd788f1-734f-4dbd-a7c3-a7c2c752c48c">
-          <h6 id="510bcdbc-c37c-4fca-9672-1c78560658df">
+         <div class="ml-3" id="2034e991-aae4-4cad-85dd-51e1d14be1f9">
+          <h6 id="c09f7304-7a19-46fd-b324-f4d5f8115222">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="7da96f13-9008-440d-b2f5-b5640df8c163"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, List, Image
+          <pre id="bb54980d-9669-4740-8d95-c43204c9de62"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy"),
@@ -1721,17 +1721,17 @@ List(
         "https://www.amazon.com")
 )</code></pre>
          </div>
-         <div class="ml-3" id="c7a4242a-e7a2-417d-adf9-fbd5c01c5e43">
-          <div class="list-group" id="b41c3a91-e472-4252-be8b-6199332533e4">
-           <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="5095ae32-613a-46c1-a2dd-424a50727059">
+         <div class="ml-3" id="6fe71cd5-52c3-4f1b-ab34-0a5b3787f44a">
+          <div class="list-group" id="3d41a924-899a-4fce-8317-fc9480ef6f3d">
+           <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="f031aa95-0c83-4108-87af-1e468e2c580a">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="bff39ecd-081d-4da0-aa2a-8a2d757824e9" src="google-logo.png" width="32"/>
+             <img height="32" id="facb2e18-5b0a-4ca9-bdde-6b98e56a61b1" src="google-logo.png" width="32"/>
              <div class="ml-2 mr-2 w-100">
               <div class="d-flex w-100 justify-content-between">
-               <h5 id="2dd5e2d9-455d-47a6-87ee-b0a711d05db3">
+               <h5 id="8d586b83-8463-4db2-9b7c-0384d3076458">
                 Google (NASDAQ: GOOGL)
                </h5>
-               <span id="326c4496-8cc7-47f9-873f-cda8bf7bae08">
+               <span id="ae2fa39b-752b-46f7-b7f9-97597213da7e">
                 <small>
                  12:04:58 12/01/2021
                 </small>
@@ -1741,16 +1741,16 @@ List(
              </div>
              <div class="d-flex align-items-start">
               <div class="btn-group">
-               <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="833f9b38-35a0-471f-a0dc-e1dabc1fe5d8" onclick="return false;" style="cursor: pointer">
+               <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="94cf1b4e-5ac7-4fed-bb67-583f75460cfa" onclick="return false;" style="cursor: pointer">
                </i>
                <div class="dropdown-menu dropdown-menu-right">
-                <button class="dropdown-item btn btn-success" id="1ffa4877-76f3-4d93-8206-8579440c3719" onclick="return false;">
+                <button class="dropdown-item btn btn-success" id="cb2ac092-a5b6-40c5-a197-a61e1965ae7e" onclick="return false;">
                  Buy
                 </button>
-                <button class="dropdown-item btn" id="52b28a80-31a6-4766-bcc8-c38fa7f11104" onclick="return false;">
+                <button class="dropdown-item btn" id="d39fa909-5e5e-4046-bc45-a57ac637bb98" onclick="return false;">
                  Sell
                 </button>
-                <button class="dropdown-item btn" id="fc02f583-b08a-466f-94b0-e5cd025930ba" onclick="return false;">
+                <button class="dropdown-item btn" id="c2c306ca-21ae-4c21-b6af-40422943ccdd" onclick="return false;">
                  Transfer
                 </button>
                </div>
@@ -1758,15 +1758,15 @@ List(
              </div>
             </div>
            </a>
-           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.linkedin.com" id="0932110a-ac1f-4937-9209-92ab18d17eae">
+           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.linkedin.com" id="107891f0-f927-4089-9954-0ccb8e01ff10">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="e8f78604-dae4-4bf7-b001-62b618eeba79" src="linkedin-logo.png" width="32"/>
+             <img height="32" id="f02af039-c168-4dcd-8187-5f4f53a1f375" src="linkedin-logo.png" width="32"/>
              <div class="ml-2 mr-2 w-100">
               <div class="d-flex w-100 justify-content-between">
-               <h5 id="ee013f12-7558-4a4d-8d7b-951bef84395a">
+               <h5 id="02c3c877-1974-4bcb-b1d9-445cdc2bf9a8">
                 LinkedIn (NASDAQ: LNKD)
                </h5>
-               <span id="602abfa8-51ab-410a-b631-d700b238aa62">
+               <span id="96ccbfc7-1962-440a-b167-cbbdfecaba67">
                 <small>
                  12:04:58 12/01/2021
                 </small>
@@ -1776,16 +1776,16 @@ List(
              </div>
              <div class="d-flex align-items-start">
               <div class="btn-group">
-               <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="883cd340-c5b5-4cb1-96ff-50417bb6dd05" onclick="return false;" style="cursor: pointer">
+               <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="8a5022fc-088d-4102-8a0e-7cad6551bb17" onclick="return false;" style="cursor: pointer">
                </i>
                <div class="dropdown-menu dropdown-menu-right">
-                <button class="dropdown-item btn btn-success" id="1ffa4877-76f3-4d93-8206-8579440c3719" onclick="return false;">
+                <button class="dropdown-item btn btn-success" id="cb2ac092-a5b6-40c5-a197-a61e1965ae7e" onclick="return false;">
                  Buy
                 </button>
-                <button class="dropdown-item btn" id="52b28a80-31a6-4766-bcc8-c38fa7f11104" onclick="return false;">
+                <button class="dropdown-item btn" id="d39fa909-5e5e-4046-bc45-a57ac637bb98" onclick="return false;">
                  Sell
                 </button>
-                <button class="dropdown-item btn" id="fc02f583-b08a-466f-94b0-e5cd025930ba" onclick="return false;">
+                <button class="dropdown-item btn" id="c2c306ca-21ae-4c21-b6af-40422943ccdd" onclick="return false;">
                  Transfer
                 </button>
                </div>
@@ -1793,15 +1793,15 @@ List(
              </div>
             </div>
            </a>
-           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.amazon.com" id="04c524d9-a6d7-4287-9535-5fa4020b60fd">
+           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.amazon.com" id="b8b1f3f9-71b8-498e-9121-20fd16dc0124">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="62c66bc7-82fe-4df8-a4d5-11ec2c35a095" src="amazon-logo.png" width="32"/>
+             <img height="32" id="d35efb39-52d1-45ca-bed4-7b3b06c15210" src="amazon-logo.png" width="32"/>
              <div class="ml-2 mr-2 w-100">
               <div class="d-flex w-100 justify-content-between">
-               <h5 id="4ac3dc5e-de4e-4267-8c23-f7de0cd875c3">
+               <h5 id="198a357c-e4f1-49f0-b033-73cb2b7494f8">
                 Amazon (NASDAQ: AMZN)
                </h5>
-               <span id="f17d5c7f-3b98-4cb2-a7cf-10a9e5d6bb68">
+               <span id="15745750-d9e0-41ec-ae01-5f0c7097b7aa">
                 <small>
                  12:04:58 12/01/2021
                 </small>
@@ -1811,16 +1811,16 @@ List(
              </div>
              <div class="d-flex align-items-start">
               <div class="btn-group">
-               <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="cfa85079-b199-4523-b0ea-a337aecd95c5" onclick="return false;" style="cursor: pointer">
+               <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="87089bc3-3102-4972-9ac1-d5d70ad89a54" onclick="return false;" style="cursor: pointer">
                </i>
                <div class="dropdown-menu dropdown-menu-right">
-                <button class="dropdown-item btn btn-success" id="1ffa4877-76f3-4d93-8206-8579440c3719" onclick="return false;">
+                <button class="dropdown-item btn btn-success" id="cb2ac092-a5b6-40c5-a197-a61e1965ae7e" onclick="return false;">
                  Buy
                 </button>
-                <button class="dropdown-item btn" id="52b28a80-31a6-4766-bcc8-c38fa7f11104" onclick="return false;">
+                <button class="dropdown-item btn" id="d39fa909-5e5e-4046-bc45-a57ac637bb98" onclick="return false;">
                  Sell
                 </button>
-                <button class="dropdown-item btn" id="fc02f583-b08a-466f-94b0-e5cd025930ba" onclick="return false;">
+                <button class="dropdown-item btn" id="c2c306ca-21ae-4c21-b6af-40422943ccdd" onclick="return false;">
                  Transfer
                 </button>
                </div>
@@ -1832,34 +1832,34 @@ List(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="808a9152-06e7-44e4-9780-2ab6cef97b77">
-        <div class="mt-5" id="2f0cc46c-1580-4b0d-ba3a-0a0ff448c69f">
-         <div class="d-flex justify-content-between" id="d7d5219d-f0b9-42b6-a382-42e4caa94d04">
-          <h1 id="34430cac-7a82-47dc-a94e-68aaa8eb72d7">
+       <div class="tab-pane fade" id="99ca2714-9241-4870-83b6-9ccefdab4455">
+        <div class="mt-5" id="287a3417-0ce5-4b73-9fbf-e1b98566c071">
+         <div class="d-flex justify-content-between" id="8c4be5f9-de86-4c59-bd08-f72f2475cbfe">
+          <h1 id="cd2744e0-8d74-48a6-8de1-e8b585c6eb36">
            Class
-           <span class="text-primary" id="6fdf668c-de25-4d81-832b-bb5331a7b621">
-            <span id="dc493ba4-5ec7-4b63-864f-ee5341bf40c2">
+           <span class="text-primary" id="90c16fee-b262-46ce-8de1-0cd5b4171fec">
+            <span id="39316a7c-9c61-4a67-805b-9e7e3af715a5">
              List.Item
             </span>
            </span>
           </h1>
-          <div id="ce91458a-742c-4e4e-ae7a-44a96deaf37b">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#c8712ec7-44b3-4a7a-8d4e-0b7fe8881dce" data-toggle="collapse" id="711d4091-fd08-4c88-ac34-a70ed208c65d" onclick="return false;" type="button">
+          <div id="c9989e93-3cad-48f1-a94d-2e6efc50d19f">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#ba220369-6729-4759-93e7-42c4d6ecdbb1" data-toggle="collapse" id="7bc8c7cf-1e58-481a-856e-3cd2e76966e3" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="7f3d9e1f-0ccd-4875-bf3a-004fb01ae1c9">
+         <span class="text-muted" id="363cfd6f-b8b2-41dd-9efb-4a392c505ac2">
           A list item.
          </span>
-         <pre id="cde77c33-747f-4939-adf1-97a28fbcc3f7"><code a="" c="" l="" s=" p y t h o n ">List.Item(title, description=None, marker=None, figure=None)</code></pre>
-         <div class="ml-3 collapse" id="c8712ec7-44b3-4a7a-8d4e-0b7fe8881dce">
-          <h6 id="91f7a12b-8e9e-48fc-bdfd-c2f9e7c66a81">
+         <pre id="c9c4377f-d5bc-4871-886e-eefd1cd39a98"><code a="" c="" l="" s=" p y t h o n ">List.Item(title, description=None, marker=None, figure=None)</code></pre>
+         <div class="ml-3 collapse" id="ba220369-6729-4759-93e7-42c4d6ecdbb1">
+          <h6 id="c1739f95-4430-4de0-a795-9b19c2d40a85">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="65143f5e-b0e4-428c-b50f-abc86e12b0d6">
+          <table class="table table-sm bg-light" id="cb8fb102-2062-49e6-b9d6-e7156864f0cc">
            <thead>
             <tr>
              <th scope="col">
@@ -1937,13 +1937,13 @@ List(
            </tbody>
           </table>
          </div>
-         <div class="ml-3" id="cba3725b-2ab7-4b17-9874-06a85eff154a">
-          <h6 id="4afe3c18-11aa-456d-a41c-75c4e5d828fc">
+         <div class="ml-3" id="3fc97afa-594c-47c1-bac2-65d520f4a938">
+          <h6 id="6ac28bd8-fa90-4158-9f0c-9c8f284fecdc">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="addf0295-c3f5-4e55-b067-9b6abe25bb1d"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, List, Image
+          <pre id="33365cda-16b7-466f-a494-24293141433b"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy"),
@@ -1959,16 +1959,16 @@ List.Item(
 ).add_menu(*actions).link(
     "https://www.google.com")</code></pre>
          </div>
-         <div class="ml-3" id="fbc39139-e43e-42e6-8cba-144f4092bd9a">
-          <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="a9fe3fb3-087a-45db-860d-52b1317b6585">
+         <div class="ml-3" id="3772d7b5-7b29-4b00-b71b-af3a2d452d06">
+          <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="7eb564f9-f151-4271-973f-a2658276b4a0">
            <div class="d-flex w-100 justify-content-between">
-            <img height="32" id="ef595c98-a244-43b2-bc79-483c84dbae15" src="google-logo.png" width="32"/>
+            <img height="32" id="1429e368-eb98-46ce-b8e5-fabbbded5143" src="google-logo.png" width="32"/>
             <div class="ml-2 mr-2 w-100">
              <div class="d-flex w-100 justify-content-between">
-              <h5 id="db64eda4-2976-4573-885a-9bb792b6dda8">
+              <h5 id="962dc17a-90a4-44bb-b33d-685503bb78ec">
                Google (NASDAQ: GOOGL)
               </h5>
-              <span id="6d8fd837-3fa9-4419-b00f-929b475f39e6">
+              <span id="bfe74ea5-62f9-4f25-8d4e-d5d79429cabf">
                <small>
                 12:04:58 12/01/2021
                </small>
@@ -1977,41 +1977,41 @@ List.Item(
              Price for a single Google share
             </div>
             <div class="d-flex align-items-start">
-             <button class="ml-1 btn" id="564920e6-0c06-447c-87c1-5bf877b9b24d" onclick="return false;">
+             <button class="ml-1 btn" id="fcce4eb1-5823-4d7b-91b3-bea1841a412e" onclick="return false;">
               Buy
              </button>
-             <button class="ml-1 btn" id="4704bc6d-a7c6-4397-9cbd-f4e29846bd6a" onclick="return false;">
+             <button class="ml-1 btn" id="d5745339-81a1-4845-af63-22147e40de37" onclick="return false;">
               Sell
              </button>
-             <button class="ml-1 btn" id="d7a5838d-84b1-44fe-9229-2d2557715cec" onclick="return false;">
+             <button class="ml-1 btn" id="965f374b-3d00-47df-9938-514bb55ba9ad" onclick="return false;">
               Transfer
              </button>
             </div>
            </div>
           </a>
          </div>
-         <div class="mt-5" id="ace002c7-1f0b-4a77-8fad-5ae9085ba635">
-          <div class="d-flex justify-content-between" id="cb58028e-6fe7-45df-953b-65b7ebff8e87">
-           <h4 id="59032bb1-a2aa-4a0d-a460-307c1a411095">
+         <div class="mt-5" id="c1d0a06b-7d2a-4bb7-bd5b-25aefa9cc321">
+          <div class="d-flex justify-content-between" id="77575c8f-86ca-4e7b-b41c-1ea6079767c5">
+           <h4 id="fa82a7bf-a932-4368-b676-25fb70885cb7">
             Method
-            <span class="text-primary" id="5867fcbc-8108-491e-acc0-52b809505e8c">
+            <span class="text-primary" id="f8e1dc0f-c2f0-4f0f-b449-f636a1bf54f7">
              as_selected
             </span>
            </h4>
-           <div id="65ed7001-aece-4b94-944f-b94667c72120">
+           <div id="7574657d-a24d-4643-8879-fcb5a01c78ea">
            </div>
           </div>
-          <span class="text-muted" id="5c15bfb8-6c2c-40e6-bccc-15f83a61cb22">
+          <span class="text-muted" id="fa6e43bf-20b7-4168-bb8a-8c7a3d8b35a4">
            Makes a list item selected.
           </span>
-          <pre id="aabbd850-d998-4a58-bb7f-34ec866662dd"><code a="" c="" l="" s=" p y t h o n ">as_selected()</code></pre>
-          <div class="ml-3" id="7a68ecce-742c-472a-b0a5-a710f6d10cb7">
-           <h6 id="ff67c03d-998e-4daa-a564-030c1d2612a8">
+          <pre id="7efbc839-7412-47ed-974b-caed8b6ee5fc"><code a="" c="" l="" s=" p y t h o n ">as_selected()</code></pre>
+          <div class="ml-3" id="a45f005d-6d03-47c5-b5d9-2b8532d687ac">
+           <h6 id="e7b16505-670c-4b18-8d6c-b99bb8082598">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="41bc8775-52e5-435e-a637-1a0dc631510d"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, List, Image
+           <pre id="5c377ba6-cdf0-4eb6-8a43-5de7c2965bd1"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy"),
@@ -2027,16 +2027,16 @@ List.Item(
 ).add_menu(*actions).as_selected().link(
     "https://www.google.com")</code></pre>
           </div>
-          <div class="ml-3" id="ddf6eb87-4c54-442d-b683-66a88d064b33">
-           <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="7ae21505-5a01-4771-a720-63485b8a946b">
+          <div class="ml-3" id="d57a3d3d-4ac6-4bb5-874e-2287f939f06f">
+           <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="56a15141-d04c-4149-a42e-e48083bbc648">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="e881f8cb-8888-4dca-9b6d-d1eb59190295" src="google-logo.png" width="32"/>
+             <img height="32" id="d51d334e-ebbb-461f-ab52-764891bb7e97" src="google-logo.png" width="32"/>
              <div class="ml-2 mr-2 w-100">
               <div class="d-flex w-100 justify-content-between">
-               <h5 id="4321c24f-b180-4fac-9a5a-3eedd1f720e7">
+               <h5 id="b1f42ddd-622a-4965-92de-0d43628fd11e">
                 Google (NASDAQ: GOOGL)
                </h5>
-               <span id="fd3fa386-d597-490d-8a01-07c8f0779ba6">
+               <span id="72d42f73-4c80-46ee-8835-59bd7f96b664">
                 <small>
                  12:04:58 12/01/2021
                 </small>
@@ -2045,13 +2045,13 @@ List.Item(
               Price for a single Google share
              </div>
              <div class="d-flex align-items-start">
-              <button class="ml-1 btn" id="2d2f2b4a-5b21-4042-b1a6-9eb98f5019d8" onclick="return false;">
+              <button class="ml-1 btn" id="5dfc3ea4-a2c4-4e9d-a4d9-55eaecffdb6c" onclick="return false;">
                Buy
               </button>
-              <button class="ml-1 btn" id="66294e51-d351-45f8-b518-4d674a059eae" onclick="return false;">
+              <button class="ml-1 btn" id="e6379fe7-4708-41a7-a432-70b9fe0eb00d" onclick="return false;">
                Sell
               </button>
-              <button class="ml-1 btn" id="0685a041-9ad2-4d91-99fe-de39ae961369" onclick="return false;">
+              <button class="ml-1 btn" id="63b42c46-d737-4353-8aaa-55d885d25989" onclick="return false;">
                Transfer
               </button>
              </div>
@@ -2059,28 +2059,28 @@ List.Item(
            </a>
           </div>
          </div>
-         <div class="mt-5" id="9f316451-bbd5-4906-b54e-eaac810eae8d">
-          <div class="d-flex justify-content-between" id="4088e80c-7171-4147-bd98-2d071b1ab6a4">
-           <h4 id="38c7b6dd-fc22-4bc1-b4d8-2e66ca6ab0c7">
+         <div class="mt-5" id="b69293f6-04b0-4f52-807f-62918f5666b6">
+          <div class="d-flex justify-content-between" id="f32af2c5-115d-4a7e-afa2-8b44eb417774">
+           <h4 id="e0dbb14c-e541-4789-a7f5-cd8cc21a9492">
             Method
-            <span class="text-primary" id="1b6270ef-e777-43e1-a1c7-e97c5b7ebde9">
+            <span class="text-primary" id="8538c6ad-a3ce-4b5a-bfc1-6eeffddb9f5c">
              pack_actions
             </span>
            </h4>
-           <div id="7678b50b-f501-4557-b756-23151bd4154f">
+           <div id="78ca26c1-b463-4e82-b795-6b43c02694ff">
            </div>
           </div>
-          <span class="text-muted" id="c2df26ab-8946-45e3-b33c-86cf91fd6a59">
+          <span class="text-muted" id="f9c0a9ce-37e9-4837-a547-9fdcb92767fe">
            Makes item actions packed under a drop-down menu.
           </span>
-          <pre id="b6d1edd3-88a5-40f7-baca-50a08540d608"><code a="" c="" l="" s=" p y t h o n ">pack_actions()</code></pre>
-          <div class="ml-3" id="3825c016-da50-4d07-aa7b-212835fffc42">
-           <h6 id="6a15b1df-cecc-402b-97ae-701c94c4d266">
+          <pre id="c98f0f3b-a6fe-4f1f-b164-3e60095a434b"><code a="" c="" l="" s=" p y t h o n ">pack_actions()</code></pre>
+          <div class="ml-3" id="55e9d67d-ada2-41be-a9ea-f20faaba3e4d">
+           <h6 id="81b8afe5-6003-42f9-81a3-8af40949a74b">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="7bc04042-c3ee-4cad-8f0d-cdc60e8ef2e4"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, List, Image
+           <pre id="eaa90aa2-0d7b-4105-8037-81618824b845"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy"),
@@ -2096,16 +2096,16 @@ List.Item(
 ).add_menu(*actions).pack_actions().link(
     "https://www.google.com")</code></pre>
           </div>
-          <div class="ml-3" id="36d04087-e06b-4488-9348-d98b7c01d1ea">
-           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="7bda1e61-a174-4651-b3f8-5580ed59b605">
+          <div class="ml-3" id="30fe7267-86f1-40fe-94a1-867c36439623">
+           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="3d2f4857-4162-4c2b-8c3a-0fbfcd816a1d">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="27542f02-0388-47b2-a896-d199c7488e50" src="google-logo.png" width="32"/>
+             <img height="32" id="967175db-c0dd-4b95-b512-598bd3fd1bde" src="google-logo.png" width="32"/>
              <div class="ml-2 mr-2 w-100">
               <div class="d-flex w-100 justify-content-between">
-               <h5 id="1903bec6-5b79-4b92-92ed-0b56fcb67ba8">
+               <h5 id="9cd3e8fc-977f-45ab-91d1-8eff34d58165">
                 Google (NASDAQ: GOOGL)
                </h5>
-               <span id="808439b6-0e91-45e4-928c-1ab0da61aca1">
+               <span id="52747062-541c-4b53-b26a-973538dcc194">
                 <small>
                  12:04:58 12/01/2021
                 </small>
@@ -2115,16 +2115,16 @@ List.Item(
              </div>
              <div class="d-flex align-items-start">
               <div class="btn-group">
-               <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="324a27f4-d7df-4386-854a-d9f91fbb43d2" onclick="return false;" style="cursor: pointer">
+               <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="e01d61eb-f10a-4d56-bf09-ec9a8640f424" onclick="return false;" style="cursor: pointer">
                </i>
                <div class="dropdown-menu dropdown-menu-right">
-                <button class="dropdown-item btn" id="a3455312-9da8-4888-9afc-cbc36c4279e0" onclick="return false;">
+                <button class="dropdown-item btn" id="de6dc4a4-3bbd-4ae9-b748-ded20fa31790" onclick="return false;">
                  Buy
                 </button>
-                <button class="dropdown-item btn" id="c520fa36-281e-4b06-bc29-7e4f9e666bb2" onclick="return false;">
+                <button class="dropdown-item btn" id="a19c3b72-9854-420c-bb85-e0f46017abf1" onclick="return false;">
                  Sell
                 </button>
-                <button class="dropdown-item btn" id="b1929a48-e202-430f-ad36-3886992dd59c" onclick="return false;">
+                <button class="dropdown-item btn" id="c2a9e413-85b6-484f-9f04-7734991715c8" onclick="return false;">
                  Transfer
                 </button>
                </div>
@@ -2136,34 +2136,34 @@ List.Item(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="5920ba3d-1250-4dc2-8025-074f4534c2e8">
-        <div class="mt-5" id="17caf82f-c832-4778-9433-2efe089ec240">
-         <div class="d-flex justify-content-between" id="433ae768-b2a1-4875-9ce6-86227e422161">
-          <h1 id="79416f97-ee1a-4ed7-9ffc-fde4241dd1d5">
+       <div class="tab-pane fade" id="143aebaf-2ba7-47f4-b2f9-0714375983f9">
+        <div class="mt-5" id="555fec3e-c80b-4b22-82c5-728dceaedbe3">
+         <div class="d-flex justify-content-between" id="2d3f1c78-84c1-4596-adea-ee30759eba99">
+          <h1 id="25822091-5074-44b3-aab6-08438620f308">
            Class
-           <span class="text-primary" id="e3d54d18-47a1-4ef2-a2bb-2b0552306b23">
-            <span id="6956234c-d97e-4ec4-a703-b6d62862d0a0">
+           <span class="text-primary" id="1ba0bb53-026c-413c-b0d2-11ba595f653d">
+            <span id="0dfa5613-d5f6-4a1f-8398-cd3e420e6131">
              Deck
             </span>
            </span>
           </h1>
-          <div id="5023294c-8fb9-46a9-be63-112bd5e72ca1">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#e47ba6ad-a72a-4f41-bcaa-7863d906d9d5" data-toggle="collapse" id="b9c86b3f-e88e-4f96-8210-90946768c0cd" onclick="return false;" type="button">
+          <div id="5c63238d-c1f3-4600-9b26-72df635a5f6c">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#04848fff-f8b5-4e01-9f15-71a8b821acc4" data-toggle="collapse" id="24d612b7-a4d6-4f85-b4fb-04b382c06ece" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="fe165bfb-3c38-4db2-969a-14259dcc24bf">
+         <span class="text-muted" id="4a388b2d-f913-41dc-ae8b-5863b34e08e1">
           A web component for a deck of cards.
          </span>
-         <pre id="3489f431-a301-4898-bb74-f0f3aa4254b9"><code a="" c="" l="" s=" p y t h o n ">Deck(*cards)</code></pre>
-         <div class="ml-3 collapse" id="e47ba6ad-a72a-4f41-bcaa-7863d906d9d5">
-          <h6 id="6f640802-a3fb-40da-a6f4-96a2534da958">
+         <pre id="46a12d70-bd63-400f-b640-e3414cd5289f"><code a="" c="" l="" s=" p y t h o n ">Deck(*cards)</code></pre>
+         <div class="ml-3 collapse" id="04848fff-f8b5-4e01-9f15-71a8b821acc4">
+          <h6 id="7f6a740e-a62c-4260-85b8-c3a7561c4e0e">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="97afb1d1-6d57-4e09-86ae-19238d061977">
+          <table class="table table-sm bg-light" id="6ec8716c-a7e5-42ce-8023-c5b5aacb406d">
            <thead>
             <tr>
              <th scope="col">
@@ -2204,13 +2204,13 @@ List.Item(
            </tbody>
           </table>
          </div>
-         <div class="ml-3" id="9dc3cb85-9796-4f12-9205-f8ef532dfae4">
-          <h6 id="631a3c1a-1075-4f7a-9f34-fb5d8634c9c5">
+         <div class="ml-3" id="7b7f19bd-acb1-4abe-8a96-9b9b11e1caaf">
+          <h6 id="6c443e52-ad1d-4062-9401-dff0bb05b45f">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="acdb7116-f6e0-449d-9f21-747a6bd333a1"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, Deck, Image
+          <pre id="2809b9b5-7dc3-4c5a-9db4-405edf38792b"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, Deck, Image
 
 actions = [
     Button("Buy"),
@@ -2245,107 +2245,107 @@ Deck(
         "https://www.amazon.com")
 )</code></pre>
          </div>
-         <div class="ml-3" id="7e245380-e11d-4c42-9cc9-f3013244c207">
-          <div class="card-deck grid-container" id="45f50602-5025-42e1-beb3-2bb44c876f1b">
-           <a class="card" href="https://www.google.com" id="aac900fd-aee0-45a6-9fd7-5e19daa623b7">
+         <div class="ml-3" id="488b569b-0c32-4270-a726-d5c79f6ff39a">
+          <div class="card-deck grid-container" id="0152a795-9c39-4f68-9a3b-b7d9814a980d">
+           <a class="card" href="https://www.google.com" id="8246d766-8183-43cf-88a8-9ca61d6a27cb">
             <div class="row justify-content-center">
-             <img class="mt-3" id="941ae7dd-73a8-4f70-9547-dcae474f1df4" src="google-logo.png" width="128"/>
+             <img class="mt-3" id="e1bb0d27-ef79-4b1f-81e3-bcadb87bb2ae" src="google-logo.png" width="128"/>
             </div>
             <div class="card-body">
              <div class="text-right mb-2">
-              <span class="text-muted" id="64fc7779-3618-44c2-9d11-5634095b972f">
+              <span class="text-muted" id="62554594-166a-4623-85b0-276337d215ef">
                <small>
                 12:04:58 12/01/2021
                </small>
               </span>
              </div>
-             <h5 class="card-title" id="f40ec851-ecda-49b2-87a0-42085643ad38">
+             <h5 class="card-title" id="473265ca-291a-46f9-8049-3737ccb59507">
               Google (NASDAQ: GOOGL)
              </h5>
              Price for a single Google share
             </div>
             <div class="card-footer text-right">
              <div class="btn-group">
-              <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="0959882c-39e6-4237-a9cb-4a3f33e60ea0" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="4a1a1754-9a09-438f-a343-094560e3addf" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="fe1f3708-d75e-4377-8d2f-121d028b6366" onclick="return false;">
+               <button class="dropdown-item btn" id="ada0487c-dd1f-4b09-ba88-f232d53ce4b1" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="950d5cf8-253e-41a1-bb73-54c4c28d7ded" onclick="return false;">
+               <button class="dropdown-item btn" id="390c218c-ff78-467c-a271-aa612ad4363e" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="1a30206b-7c69-4e69-bcba-ce2dab3d4c5e" onclick="return false;">
+               <button class="dropdown-item btn" id="a1975f53-2643-4176-8e00-8b462c96868f" onclick="return false;">
                 Transfer
                </button>
               </div>
              </div>
             </div>
            </a>
-           <a class="card" href="https://www.linkedin.com" id="e630e7c8-008a-42c3-a909-c4fc5db18d43">
+           <a class="card" href="https://www.linkedin.com" id="7586a660-c3b6-4775-9ff1-b14d7f75b829">
             <div class="row justify-content-center">
-             <img class="mt-3" id="6dbcd9d7-610e-4578-b103-ef84420f67b6" src="linkedin-logo.png" width="128"/>
+             <img class="mt-3" id="fff04028-0722-4e86-a902-41a121a5c350" src="linkedin-logo.png" width="128"/>
             </div>
             <div class="card-body">
              <div class="text-right mb-2">
-              <span class="text-muted" id="26ab27af-33f1-4529-b58f-0776b8678457">
+              <span class="text-muted" id="701bd909-6ad7-467b-878a-4954daafa921">
                <small>
                 12:04:58 12/01/2021
                </small>
               </span>
              </div>
-             <h5 class="card-title" id="2e65ebb8-6ebb-4974-8049-294e0f71786d">
+             <h5 class="card-title" id="7ff276e9-9d88-4825-890b-aa1ff87971be">
               LinkedIn (NASDAQ: LNKD)
              </h5>
              Price for a single LinkedIn share
             </div>
             <div class="card-footer text-right">
              <div class="btn-group">
-              <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="976479a1-80f8-4fbf-b133-6c2d613a4c83" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="67a0d40f-5465-46a1-aec3-b5b4ada5bb04" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="fe1f3708-d75e-4377-8d2f-121d028b6366" onclick="return false;">
+               <button class="dropdown-item btn" id="ada0487c-dd1f-4b09-ba88-f232d53ce4b1" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="950d5cf8-253e-41a1-bb73-54c4c28d7ded" onclick="return false;">
+               <button class="dropdown-item btn" id="390c218c-ff78-467c-a271-aa612ad4363e" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="1a30206b-7c69-4e69-bcba-ce2dab3d4c5e" onclick="return false;">
+               <button class="dropdown-item btn" id="a1975f53-2643-4176-8e00-8b462c96868f" onclick="return false;">
                 Transfer
                </button>
               </div>
              </div>
             </div>
            </a>
-           <a class="card" href="https://www.amazon.com" id="ba1bbfd2-bc4a-458a-83c1-3233a88e708c">
+           <a class="card" href="https://www.amazon.com" id="f62692c2-4eb8-4fc5-91b1-000dfa140252">
             <div class="row justify-content-center">
-             <img class="mt-3" id="fcb26ff5-72c9-48c8-a92a-642382554c88" src="amazon-logo.png" width="128"/>
+             <img class="mt-3" id="729e6bef-ced8-4e12-89b7-e6cc682640c8" src="amazon-logo.png" width="128"/>
             </div>
             <div class="card-body">
              <div class="text-right mb-2">
-              <span class="text-muted" id="fb616756-62dd-4a27-bdbb-59c71a825fb8">
+              <span class="text-muted" id="cad03c27-3c6b-402e-a91d-598c924faf05">
                <small>
                 12:04:58 12/01/2021
                </small>
               </span>
              </div>
-             <h5 class="card-title" id="4e03bf3a-1b8e-4284-a376-fb716b594471">
+             <h5 class="card-title" id="e429c427-cfff-4885-a0ea-aefa3a329394">
               Amazon (NASDAQ: AMZN)
              </h5>
              Price for a single Amazon share
             </div>
             <div class="card-footer text-right">
              <div class="btn-group">
-              <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="8dc7418e-107e-4bb4-839f-37f72ed8a6f5" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="2dc698f0-4e5a-4946-b5f0-0ed5f0bfcc11" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="fe1f3708-d75e-4377-8d2f-121d028b6366" onclick="return false;">
+               <button class="dropdown-item btn" id="ada0487c-dd1f-4b09-ba88-f232d53ce4b1" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="950d5cf8-253e-41a1-bb73-54c4c28d7ded" onclick="return false;">
+               <button class="dropdown-item btn" id="390c218c-ff78-467c-a271-aa612ad4363e" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="1a30206b-7c69-4e69-bcba-ce2dab3d4c5e" onclick="return false;">
+               <button class="dropdown-item btn" id="a1975f53-2643-4176-8e00-8b462c96868f" onclick="return false;">
                 Transfer
                </button>
               </div>
@@ -2365,34 +2365,34 @@ Deck(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="fb9cab0b-7f5a-491b-9a29-865760713446">
-        <div class="mt-5" id="80853ef0-0248-4635-9db4-066f0ab6c815">
-         <div class="d-flex justify-content-between" id="8174d108-22f8-48ba-97b2-c462c0e16190">
-          <h1 id="a42aea17-0a3c-41a8-b84a-8bd7e85894f3">
+       <div class="tab-pane fade" id="0904baf1-e955-4578-86e7-a48bbc1d8d93">
+        <div class="mt-5" id="f13001d6-0593-4b10-86d6-180c610864e3">
+         <div class="d-flex justify-content-between" id="17defc4d-886c-4d0b-bd47-347f4fab5031">
+          <h1 id="e7c68f40-748f-48ce-bfd8-cde2e54f9b9c">
            Class
-           <span class="text-primary" id="ab908460-ebd4-49aa-ab09-68932f0052e6">
-            <span id="c11e230b-f39d-4c90-8e52-b60608d28c6e">
+           <span class="text-primary" id="2e339454-1278-4127-994b-ccb6d3eb233c">
+            <span id="3b5de0bb-0702-4c7c-8ad9-60d30a12be0e">
              Deck.Card
             </span>
            </span>
           </h1>
-          <div id="fc30cc62-d08e-49c5-8266-3708e2658211">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#a9d3f6fd-df85-4026-b396-fdcf6ebddb5a" data-toggle="collapse" id="84366bbd-a77f-411f-9798-694cd55b7eca" onclick="return false;" type="button">
+          <div id="7ebba745-7e0d-4eb9-817d-32e755dcc695">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#607393ab-a82e-49e1-bfb2-a8b70da6f31b" data-toggle="collapse" id="13ae91d8-c369-4ae6-8105-7b2fa4a45297" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="82a9a1d2-1df5-43fd-b731-81656f6c1435">
+         <span class="text-muted" id="1c363dcd-aa67-4279-a757-5239ac29f87d">
           A deck card.
          </span>
-         <pre id="1ee054cb-8c4c-4f36-986a-98a7619c49a1"><code a="" c="" l="" s=" p y t h o n ">Deck.Card(title, description=None, marker=None, figure=None)</code></pre>
-         <div class="ml-3 collapse" id="a9d3f6fd-df85-4026-b396-fdcf6ebddb5a">
-          <h6 id="85fd7dd8-f3f6-4bbf-9835-325812401d35">
+         <pre id="d7d1013d-2b4e-4a9c-8c35-cfc0923fda57"><code a="" c="" l="" s=" p y t h o n ">Deck.Card(title, description=None, marker=None, figure=None)</code></pre>
+         <div class="ml-3 collapse" id="607393ab-a82e-49e1-bfb2-a8b70da6f31b">
+          <h6 id="33288aba-d506-4653-b4b7-43acde7d55dc">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="947be1dd-dc2b-4d8e-9281-a3d9a7f33eb7">
+          <table class="table table-sm bg-light" id="49d62cc2-0c6c-45fa-9646-caacc6dee067">
            <thead>
             <tr>
              <th scope="col">
@@ -2470,13 +2470,13 @@ Deck(
            </tbody>
           </table>
          </div>
-         <div class="ml-3" id="db3e00e4-4371-4ec0-a807-90a61c4849f9">
-          <h6 id="f4bc8d79-9452-4fad-8c8b-332b48fbf08b">
+         <div class="ml-3" id="19cd07ec-6c8e-4a2e-9646-e9ef29a44fb2">
+          <h6 id="50b0f1ae-f742-4b20-82a8-f547edf9ac31">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="b257fc85-10b7-47c1-8ae4-64fdb4b22f52"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, Deck, Image
+          <pre id="5533661d-88be-446d-bb7e-a33e45074c4b"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, Deck, Image
 
 actions = [
     Button("Buy"),
@@ -2492,59 +2492,59 @@ Deck.Card(
 ).add_menu(*actions).link(
     "https://www.google.com")</code></pre>
          </div>
-         <div class="ml-3" id="8b0390f3-9a83-4f22-8909-642fd63c7a90">
-          <a class="card" href="https://www.google.com" id="8d17e2bc-b201-47b7-adf3-8f4514650d62">
+         <div class="ml-3" id="e8571754-9648-4e92-9f0e-2c6c8e02d0fe">
+          <a class="card" href="https://www.google.com" id="392da726-16ce-4b75-810a-553254563e08">
            <div class="row justify-content-center">
-            <img class="mt-3" id="1a8a4c06-5866-4b7b-be60-9e9826536778" src="google-logo.png" width="128"/>
+            <img class="mt-3" id="effb6793-f290-4178-bcdb-e8ca129fa701" src="google-logo.png" width="128"/>
            </div>
            <div class="card-body">
             <div class="text-right mb-2">
-             <span class="text-muted" id="4bf51c38-1d03-47c6-b1ad-aabf5be70c38">
+             <span class="text-muted" id="edacc505-bb27-491d-b330-6196cf6dbbb8">
               <small>
                12:04:58 12/01/2021
               </small>
              </span>
             </div>
-            <h5 class="card-title" id="49f62d32-16d6-4309-9944-f42e59f0c0b1">
+            <h5 class="card-title" id="2bbac919-4209-4ad5-9ac5-7fbbcce31b89">
              Google (NASDAQ: GOOGL)
             </h5>
             Price for a single Google share
            </div>
            <div class="card-footer text-right">
-            <button class="ml-1 btn" id="02c51312-46e3-4c71-a765-9e9a7a301170" onclick="return false;">
+            <button class="ml-1 btn" id="7322a22a-3975-497c-8030-107bc6859e5f" onclick="return false;">
              Buy
             </button>
-            <button class="ml-1 btn" id="350c262d-9143-4bb6-adcf-5a6f29515878" onclick="return false;">
+            <button class="ml-1 btn" id="7837ad4d-8eb2-4630-8510-ba6ddacb95b7" onclick="return false;">
              Sell
             </button>
-            <button class="ml-1 btn" id="a1fd5c8e-0a3a-4304-a0c6-0a370b0b3392" onclick="return false;">
+            <button class="ml-1 btn" id="54292d0c-2e4a-4386-a906-3e4ff87c7231" onclick="return false;">
              Transfer
             </button>
            </div>
           </a>
          </div>
-         <div class="mt-5" id="b5c3f338-e915-4e9c-a163-5bcf13803790">
-          <div class="d-flex justify-content-between" id="4d44a3f2-fda2-4b6e-b6fb-e3fe5c156778">
-           <h4 id="a8966a29-2fd6-4438-9286-b47f09b753e2">
+         <div class="mt-5" id="24cbbf23-4b9c-428e-8b08-b0f6b70e964c">
+          <div class="d-flex justify-content-between" id="3c6380dc-3719-401e-853a-9eff300886b1">
+           <h4 id="68ab71e4-5435-4673-af81-b4dd808cc0c2">
             Method
-            <span class="text-primary" id="d240c2b9-f67c-488e-ad7f-e7b8638e912f">
+            <span class="text-primary" id="8e666292-827d-49a5-93f4-2d67e8c640d5">
              pack_actions
             </span>
            </h4>
-           <div id="06e6dc70-7b65-4a83-9368-f89156a475ed">
+           <div id="f6edfd16-7a87-4684-8c6f-7c4d9cc21e5e">
            </div>
           </div>
-          <span class="text-muted" id="696d9595-1b6d-4e46-9323-212b2f8e60b0">
+          <span class="text-muted" id="b948ff03-2ca3-4509-aed5-a9811b701cee">
            Makes item actions packed under a drop-down menu.
           </span>
-          <pre id="9c41e204-6ec2-408d-b57f-15d30e0668f5"><code a="" c="" l="" s=" p y t h o n ">pack_actions()</code></pre>
-          <div class="ml-3" id="af062439-1dd8-4f63-b9d2-59b6837b6b17">
-           <h6 id="dbcf1818-4da7-4682-842b-946bebc93eb1">
+          <pre id="1f6b82c3-16b0-4f2a-9241-1e3b393cd9f3"><code a="" c="" l="" s=" p y t h o n ">pack_actions()</code></pre>
+          <div class="ml-3" id="aeebce29-218f-431b-9bbd-a54ff4c9a78a">
+           <h6 id="efa12eeb-513b-4a8f-981c-e209407666d5">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="31e92ce1-6536-4802-a6c1-032a6b6183a2"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, Deck, Image
+           <pre id="57426184-4a90-48fa-8113-01eb27668695"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Button, Deck, Image
 
 actions = [
     Button("Buy"),
@@ -2560,36 +2560,36 @@ Deck.Card(
 ).add_menu(*actions).pack_actions().link(
     "https://www.google.com")</code></pre>
           </div>
-          <div class="ml-3" id="f98f997e-d6c8-45ec-92ea-e361fc8b7567">
-           <a class="card" href="https://www.google.com" id="3517194e-92dd-4e19-86da-73cee70aeb15">
+          <div class="ml-3" id="55e1ace3-eb22-4ef8-8fcf-c3724df33b6a">
+           <a class="card" href="https://www.google.com" id="5cd5b0d4-3cbf-49be-b042-fa52feaf97d0">
             <div class="row justify-content-center">
-             <img class="mt-3" id="84d0315b-5c5c-4d44-91b2-fa96ae462bdb" src="google-logo.png" width="128"/>
+             <img class="mt-3" id="063e70ec-dac4-45de-871f-856d057ab7c1" src="google-logo.png" width="128"/>
             </div>
             <div class="card-body">
              <div class="text-right mb-2">
-              <span class="text-muted" id="b255f536-22c0-4a7a-9359-bb7f3e5452a3">
+              <span class="text-muted" id="e06ffef1-acdc-422c-88fa-8d7c48640433">
                <small>
                 12:04:58 12/01/2021
                </small>
               </span>
              </div>
-             <h5 class="card-title" id="df78e64e-0a76-4398-8d6f-747c35347a6e">
+             <h5 class="card-title" id="3d0abb91-cbde-4a12-a8bb-97433d4c638f">
               Google (NASDAQ: GOOGL)
              </h5>
              Price for a single Google share
             </div>
             <div class="card-footer text-right">
              <div class="btn-group">
-              <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="1638de4b-aa65-4ad5-a96a-77696a9e6a9e" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-toggle="dropdown" id="40c92b85-5d7e-40fe-9ee9-b965d29bc63f" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="dc39ad42-2a82-42db-aba8-ab948ce7fb8b" onclick="return false;">
+               <button class="dropdown-item btn" id="69efa59b-f041-4a20-ade9-9d1dbc9e966c" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="e09b951e-29d2-466e-8e83-7231e2a7acf9" onclick="return false;">
+               <button class="dropdown-item btn" id="d1cc2725-c685-4a96-957f-e4ee30e20d43" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="d2a73f2d-bacb-4e02-ab06-d486bec799d9" onclick="return false;">
+               <button class="dropdown-item btn" id="4e8e740c-a04e-452c-bd25-65177ee26403" onclick="return false;">
                 Transfer
                </button>
               </div>
@@ -2603,63 +2603,63 @@ Deck.Card(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="23f209dd-e10b-4160-993c-a7447792f714">
-     <div id="9fa8a556-e4de-487b-bd9b-811ff89b5ed0">
+    <div class="tab-pane fade" id="c5ed8f32-8aeb-4f20-86b2-7b68b85c7a79">
+     <div id="a07a8bbd-c141-48c0-ac0a-472e09266e00">
       <hr/>
-      <ul class="nav" id="494be50a-4161-49a1-99b7-d35fb2105f74" role="tablist">
+      <ul class="nav" id="a26dd6f7-41a3-4ef0-b9d9-7e8d50e9083f" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-target="#da208f6d-1a14-4ab2-b3f5-09d97104b79e" data-toggle="tab" href="#da208f6d-1a14-4ab2-b3f5-09d97104b79e" id="e41bf096-d88f-4c2f-903a-11d7dd6ea58e">
-         <span class="text-secondary" id="80837973-cd44-41c7-a151-42fadd721dd7">
-          <span id="cbc80716-3a63-4bad-b0f3-66b66e47bb00">
+        <a class="nav-link active" data-target="#75490a32-8ffb-4391-963c-0e823fd7943b" data-toggle="tab" href="#75490a32-8ffb-4391-963c-0e823fd7943b" id="c927bd4e-8820-43b6-a973-8fcc81b89003">
+         <span class="text-secondary" id="58a6fc6c-343c-4cd8-9ab3-b96c26947b7f">
+          <span id="223e2dbf-dd1f-460e-bd97-ae6e1ee89de8">
            Dialog
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#4e403a1f-5d45-4972-8235-8f4c0b5bf83b" data-toggle="tab" href="#4e403a1f-5d45-4972-8235-8f4c0b5bf83b" id="f6af6fee-edc2-4760-a71f-f0a6a22d6f85">
-         <span class="text-secondary" id="759fd9b0-87f3-4fac-9d12-10bc0cf9da24">
+        <a class="nav-link" data-target="#62b0444e-fac5-410a-9863-e76760846fd4" data-toggle="tab" href="#62b0444e-fac5-410a-9863-e76760846fd4" id="8d10874a-23e6-4d47-b3cd-989fb6eb2886">
+         <span class="text-secondary" id="01a8d36b-742f-4570-a6a3-dc630b1619a6">
           Question Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#bfdc17df-4fa9-45f1-96f1-c26d493fc87f" data-toggle="tab" href="#bfdc17df-4fa9-45f1-96f1-c26d493fc87f" id="b4dde222-a9f6-47b6-b0f7-d5a535eed494">
-         <span class="text-secondary" id="e011633e-b11d-4f76-98f0-c15967047908">
+        <a class="nav-link" data-target="#53df9972-567c-49fa-b0c8-6205e30445c6" data-toggle="tab" href="#53df9972-567c-49fa-b0c8-6205e30445c6" id="8c9b4b0e-926e-4664-bdf8-c0be35ea0f79">
+         <span class="text-secondary" id="7a4e2e28-a24d-4ad9-9e31-c852abdeb4f3">
           Complex Dialog
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="da208f6d-1a14-4ab2-b3f5-09d97104b79e">
-        <div class="mt-5" id="56307551-096f-4baf-a8eb-01eeb59133ed">
-         <div class="d-flex justify-content-between" id="d3267595-f46c-42bf-a5b1-ba420f9f8bc7">
-          <h1 id="a95d4f81-8def-4838-b67d-170426ecd645">
+       <div class="tab-pane fade active show" id="75490a32-8ffb-4391-963c-0e823fd7943b">
+        <div class="mt-5" id="e5a8bbcb-e046-4492-a903-3ff6deead88a">
+         <div class="d-flex justify-content-between" id="d6bd5a84-8240-422a-91b9-128d7c193f98">
+          <h1 id="6cfb2f7a-00ca-43cc-b329-038b264e855d">
            Class
-           <span class="text-primary" id="5b77d4da-e5b6-43fd-bd8d-4ca578645acf">
-            <span id="cbc80716-3a63-4bad-b0f3-66b66e47bb00">
+           <span class="text-primary" id="ca44d6c6-be3a-42a4-b79a-41d3459d16ea">
+            <span id="223e2dbf-dd1f-460e-bd97-ae6e1ee89de8">
              Dialog
             </span>
            </span>
           </h1>
-          <div id="896e01ac-3ca1-41f4-a2a4-5adc1c0ded07">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#776410ad-d146-4ade-a120-3278d23ab3ae" data-toggle="collapse" id="50259c96-0262-4839-8395-bbd19270a6e9" onclick="return false;" type="button">
+          <div id="15acbbe6-5560-4fca-a941-b7405f15321c">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#39831fd3-054d-4eb9-a6cf-ea0eed936b77" data-toggle="collapse" id="3d3d5ae4-f94f-4429-add1-a44d1ec90fca" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="d78d5e65-fbd9-44a0-9fbb-0b0d93518da6">
+         <span class="text-muted" id="739b4873-5d19-4aba-a5f6-e6729321f443">
           A dialog.
          </span>
-         <pre id="ed77175d-1e11-49aa-80d1-d12c57ae6b05"><code a="" c="" l="" s=" p y t h o n ">Dialog(title, content, *actions)</code></pre>
-         <div class="ml-3 collapse" id="776410ad-d146-4ade-a120-3278d23ab3ae">
-          <h6 id="11bc1797-56f9-4bea-81e3-8f1056a97115">
+         <pre id="f0d090c2-9f15-4b11-9610-867b0ade14bf"><code a="" c="" l="" s=" p y t h o n ">Dialog(title, content, *actions)</code></pre>
+         <div class="ml-3 collapse" id="39831fd3-054d-4eb9-a6cf-ea0eed936b77">
+          <h6 id="9f9a42f5-5dec-461b-a888-f5df66a0e061">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="650bc856-72f0-4e11-bec9-4adf38078cfc">
+          <table class="table table-sm bg-light" id="2278e03a-7d8e-48c1-a509-1ece9b094e59">
            <thead>
             <tr>
              <th scope="col">
@@ -2722,13 +2722,13 @@ Deck.Card(
            </tbody>
           </table>
          </div>
-         <div class="ml-3" id="6173eb36-8433-417b-9640-d16e555b2af5">
-          <h6 id="b264e481-71f8-4c91-84c9-8e99ea3e93a9">
+         <div class="ml-3" id="3b4e172f-2bb7-4cb1-85c4-615f8e0ae8d6">
+          <h6 id="05a20a2e-1e1d-40b5-876d-d28bc2dc6af5">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="b9a1ea13-1da1-40a8-a1e5-99df9b3e7ba0"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Dialog, Button
+          <pre id="778094b1-d245-4c0c-9055-de10d7836e4f"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Dialog, Button
 
 dialog = Dialog(
     'Greeting',
@@ -2737,9 +2737,9 @@ dialog = Dialog(
 )
 button = Button('Say Hello').toggle(dialog)</code></pre>
          </div>
-         <div class="ml-3" id="3fc2cb6b-7150-4194-91c3-4892f98694b3">
-          <div id="e29ea5d8-cbda-498d-a260-75734335c491">
-           <div class="modal" id="fd14d9bf-159c-416e-824c-edd036896f50">
+         <div class="ml-3" id="92583d63-81db-4678-abb4-b36dd1e80c2a">
+          <div id="5ea3f243-e5cb-46af-81f7-45fe24e3a449">
+           <div class="modal" id="1163252c-2148-440b-b3cf-cbce85fde621">
             <div class="modal-dialog" role="document">
              <div class="modal-content">
               <div class="modal-header">
@@ -2756,42 +2756,42 @@ button = Button('Say Hello').toggle(dialog)</code></pre>
                Hello World!
               </div>
               <div class="modal-footer">
-               <button class="btn" data-dismiss="modal" id="f18fbea4-f5ad-4862-936b-46b604f96b22" onclick="return false;" type="button">
+               <button class="btn" data-dismiss="modal" id="ee88bc9b-4383-46b6-924f-76e4c8c8ee1f" onclick="return false;" type="button">
                 Bye
                </button>
               </div>
              </div>
             </div>
            </div>
-           <button class="btn" data-target="#fd14d9bf-159c-416e-824c-edd036896f50" data-toggle="modal" id="f07e86bf-18b2-40b3-adca-21f329f5e475" onclick="return false;" type="button">
+           <button class="btn" data-target="#1163252c-2148-440b-b3cf-cbce85fde621" data-toggle="modal" id="7cd74044-93b6-480c-87a2-f434d32799c2" onclick="return false;" type="button">
             Say Hello
            </button>
           </div>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="4e403a1f-5d45-4972-8235-8f4c0b5bf83b">
-        <div class="mt-3" id="40c80f63-3c7e-4ca3-954e-c0ae26c00eb2">
-         <div id="d6ac7895-3dc8-443d-9949-dafcf9738dd0">
+       <div class="tab-pane fade" id="62b0444e-fac5-410a-9863-e76760846fd4">
+        <div class="mt-3" id="3661ce11-880a-4cb7-9fee-49565e77abb8">
+         <div id="795be4d0-e7b0-4ce7-9318-73511a534dec">
           <div class="row">
            <div class="col-md">
-            <div id="d01d4db7-bd35-4b6a-aebf-4efffba5e410">
-             <h1 id="72f51e09-890c-4bc2-8a1b-e8be477de3b4">
+            <div id="2fd0b44b-f950-4830-a9e0-65a097b1d197">
+             <h1 id="3ee22719-5ebc-482c-8b7a-5f4b1f5a6ff7">
               Question Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="62e5da91-234e-462d-a86c-28aef86bdad9">
+            <div id="65d3477e-4ff9-45e4-8660-ebb8049f3dc3">
             </div>
            </div>
           </div>
          </div>
-         <div id="7f1ed4e8-4098-47ef-b738-f94e65754bce">
+         <div id="36aa48db-af30-4218-81da-e7f6533e9903">
           <div class="row">
            <div class="col-md">
-            <div id="cdea2117-7f88-42f3-bf30-e9f4bdb5d330">
-             <p id="7137ef32-49c2-41ea-8460-7f3545a22021">
+            <div id="8831fe58-1564-4022-a1fb-1ef245bcbb63">
+             <p id="50b03be6-eba5-437c-b6ee-005219bd9473">
               An example of how
               <code>
                Dialog
@@ -2811,8 +2811,8 @@ button = Button('Say Hello').toggle(dialog)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="549b804a-fba5-435f-85e8-068d41bed7a4">
-             <pre id="123b0e47-ca87-4786-8d95-17c88e736d7f"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Dialog, Button
+            <div id="22419abf-204b-4807-8ac5-b0d86eb3035c">
+             <pre id="3019afb3-723e-4477-a9d6-55ca8978d66b"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Dialog, Button
 
 dialog = Dialog(
   "Delete File",
@@ -2822,8 +2822,8 @@ dialog = Dialog(
 ).as_danger()
 
 button = Button("Delete").as_danger().toggle(dialog)</code></pre>
-             <div id="b3667676-8cc2-4150-a23a-a1e664510264">
-              <div class="modal" id="f2b34b50-3cd5-4ad9-ac28-10eafaa5c667">
+             <div id="6d6496b1-6f46-4df2-bcd6-b381d22300aa">
+              <div class="modal" id="b121ed43-71f2-466f-bedf-94614a38a39f">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -2840,17 +2840,17 @@ button = Button("Delete").as_danger().toggle(dialog)</code></pre>
                   Are you sure that you want to delete this file?
                  </div>
                  <div class="modal-footer">
-                  <button class="btn btn-danger" data-dismiss="modal" id="9731c55b-6e94-4662-bf21-eafa663e2bbf" onclick="return false;" type="button">
+                  <button class="btn btn-danger" data-dismiss="modal" id="87499087-032c-4404-8700-68857974338e" onclick="return false;" type="button">
                    Confirm
                   </button>
-                  <button class="btn" data-dismiss="modal" id="b92b7640-e571-424b-9e31-59fc50d00a70" onclick="return false;" type="button">
+                  <button class="btn" data-dismiss="modal" id="8eb10642-9707-441e-a0f1-35c17dbd668d" onclick="return false;" type="button">
                    Cancel
                   </button>
                  </div>
                 </div>
                </div>
               </div>
-              <button class="btn btn-danger" data-target="#f2b34b50-3cd5-4ad9-ac28-10eafaa5c667" data-toggle="modal" id="dbb385f7-fc9b-41b7-8347-834994d6e824" onclick="return false;" type="button">
+              <button class="btn btn-danger" data-target="#b121ed43-71f2-466f-bedf-94614a38a39f" data-toggle="modal" id="d3cb47b5-5398-423c-b39e-e1cb46e01edb" onclick="return false;" type="button">
                Delete
               </button>
              </div>
@@ -2860,28 +2860,28 @@ button = Button("Delete").as_danger().toggle(dialog)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="bfdc17df-4fa9-45f1-96f1-c26d493fc87f">
-        <div class="mt-3" id="b0d334bd-8ccc-408e-bf65-a8204f1603f6">
-         <div id="eab85890-fde3-4ba1-874d-df31117ade70">
+       <div class="tab-pane fade" id="53df9972-567c-49fa-b0c8-6205e30445c6">
+        <div class="mt-3" id="5650bff2-c2cf-46ba-a0b9-70f29f16da8f">
+         <div id="fcf3f795-5646-4d99-b818-23a45504c146">
           <div class="row">
            <div class="col-md">
-            <div id="41a9d682-8909-4aa9-9892-335526852e2b">
-             <h1 id="d84b42e9-254a-400c-9e93-0f38473bf196">
+            <div id="7ce872bf-92f4-4312-a546-4238c3657463">
+             <h1 id="0531ec11-6e4a-4012-8c93-a2be74faef83">
               Complex Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="f6021d5a-1148-4755-b2b8-8fe4445ad9fc">
+            <div id="01213d7d-8a77-47be-ab21-d939661da720">
             </div>
            </div>
           </div>
          </div>
-         <div id="e31cbb5c-99d2-4e3c-a46f-c991a60bcfb2">
+         <div id="6f704e94-42b9-4a61-b241-50b955f2e962">
           <div class="row">
            <div class="col-md">
-            <div id="ea7988b0-e712-45f5-923c-14cc0290ef72">
-             <p id="7bcf5731-8c6a-4443-8342-a8e087d45671">
+            <div id="49b30527-7763-4f6c-bc24-ca809c5a6d9d">
+             <p id="475105cd-8420-4ac9-a48c-a8f00477fba7">
               An example of how
               <code>
                Dialog
@@ -2910,8 +2910,8 @@ button = Button("Delete").as_danger().toggle(dialog)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="bed937ba-f7d3-4670-9a29-eaf49ddac083">
-             <pre id="a0add425-ae32-4b7f-bf0f-cc60a08773e1"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, NumericInput, Dialog, Button
+            <div id="dd4ddeb3-86e0-4c24-884a-6502c526d0b3">
+             <pre id="6dd9c3b5-c6fd-4b72-8d05-1b8451c9d817"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, NumericInput, Dialog, Button
 
 dialog = Dialog(
     "Buy Company Shares",
@@ -2929,8 +2929,8 @@ dialog = Dialog(
 )
 
 button = Button("Buy Shares").as_primary().toggle(dialog)</code></pre>
-             <div id="d2c649e7-0e71-4c70-8a24-cfcbf3dc6b26">
-              <div class="modal" id="5ef9737c-bc20-47c5-a420-a283a33ed857">
+             <div id="747c5de6-576f-441d-bd50-f151caf3ca19">
+              <div class="modal" id="b9d41869-e17d-4cc2-87a0-a4c657ba2c92">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -2944,19 +2944,19 @@ button = Button("Buy Shares").as_primary().toggle(dialog)</code></pre>
                   </button>
                  </div>
                  <div class="modal-body">
-                  <form enctype="multipart/form-data" id="cb46a708-2b8b-4603-b1a7-f25445b8ba2a" method="POST">
+                  <form enctype="multipart/form-data" id="468f2f7e-094e-4499-8a92-02782f7a8fe1" method="POST">
                    <div class="form-group row">
-                    <label class="col-sm-2 col-form-label d-flex align-items-center" for="2f1d9107-0250-429a-9a6d-3e47f24a7fbc">
+                    <label class="col-sm-2 col-form-label d-flex align-items-center" for="815295da-9b9a-45df-a354-832802efd586">
                      Amount($)
                     </label>
                     <div class="col-sm-10 d-flex align-items-center">
-                     <input class="form-control" id="2f1d9107-0250-429a-9a6d-3e47f24a7fbc" name="amount" placeholder="enter an amount for buying shares" type="number"/>
+                     <input class="form-control" id="815295da-9b9a-45df-a354-832802efd586" name="amount" placeholder="enter an amount for buying shares" type="number"/>
                     </div>
                    </div>
-                   <button class="float-right btn" data-dismiss="modal" id="b5a3dd58-6e9e-4df8-bfd6-f9ed1d622d69" onclick="return false;" type="button">
+                   <button class="float-right btn" data-dismiss="modal" id="8b19ec0d-d591-4697-ad12-81e6758d8a04" onclick="return false;" type="button">
                     Cancel
                    </button>
-                   <button class="float-right mr-2 btn btn-success" data-dismiss="modal" id="37ed9b19-e681-483d-8f27-2ae8385ba0a6" onclick="return false;" type="button">
+                   <button class="float-right mr-2 btn btn-success" data-dismiss="modal" id="c4901489-2141-40be-802b-a22fccb03b9b" onclick="return false;" type="button">
                     Buy
                    </button>
                   </form>
@@ -2964,7 +2964,7 @@ button = Button("Buy Shares").as_primary().toggle(dialog)</code></pre>
                 </div>
                </div>
               </div>
-              <button class="btn btn-primary" data-target="#5ef9737c-bc20-47c5-a420-a283a33ed857" data-toggle="modal" id="59de9d2e-2a8f-4176-8ec4-8b21555961db" onclick="return false;" type="button">
+              <button class="btn btn-primary" data-target="#b9d41869-e17d-4cc2-87a0-a4c657ba2c92" data-toggle="modal" id="426aa82d-f822-4f07-8604-f5a7af9a7b74" onclick="return false;" type="button">
                Buy Shares
               </button>
              </div>
@@ -2977,77 +2977,77 @@ button = Button("Buy Shares").as_primary().toggle(dialog)</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="05813e22-2740-40f1-a3d6-ca70513aaf9b">
-     <div id="5382ddbf-0d30-4e23-b82c-7e6845c34289">
+    <div class="tab-pane fade" id="49c818e6-f3fd-4d3e-85ce-9a22e6f82a64">
+     <div id="4c5a91b2-22a9-4d1a-ad62-fc0684efb1da">
       <hr/>
-      <ul class="nav" id="a68d5e30-9609-4ec1-a164-a4a15d746325" role="tablist">
+      <ul class="nav" id="754e64fb-8bc0-4319-821d-48b08dd87c66" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-target="#90e417f2-5656-403b-b277-b021f5ee40e7" data-toggle="tab" href="#90e417f2-5656-403b-b277-b021f5ee40e7" id="24956e2b-8798-460c-be1f-ff9adfdfad5c">
-         <span class="text-secondary" id="756a2729-1a8f-4d5d-997a-babcabf5ee18">
-          <span id="aa112f1f-4633-42f6-9ca7-c1ae35740eba">
+        <a class="nav-link active" data-target="#ebdf4daa-aa6b-4e93-aecc-3b945bd05847" data-toggle="tab" href="#ebdf4daa-aa6b-4e93-aecc-3b945bd05847" id="361f44e6-166d-4f44-8b8b-0609e01f1a32">
+         <span class="text-secondary" id="56d70be4-d33e-432b-9275-3e8867fb74b2">
+          <span id="0c5a7a5b-7184-44ea-968a-e0c128c5ee7a">
            Form
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#ad4986bd-f0fe-4d34-bdf7-63d39d1d0dee" data-toggle="tab" href="#ad4986bd-f0fe-4d34-bdf7-63d39d1d0dee" id="cf3b9777-c041-49d9-8e24-d95a98140f7b">
-         <span class="text-secondary" id="7644aad0-9e90-4c2a-a8f5-69c13801a8be">
-          <span id="03a74aa3-cf28-404c-abd2-ab1ead705584">
+        <a class="nav-link" data-target="#9bb0ef48-d39d-4467-8706-bf000899d02b" data-toggle="tab" href="#9bb0ef48-d39d-4467-8706-bf000899d02b" id="8a3f3a67-7807-4614-8cc8-a75a50d487c6">
+         <span class="text-secondary" id="e7b7e8d2-dc3c-48fd-b061-3abd0b26f423">
+          <span id="aa157247-8e62-4f59-80bf-11eade43fe43">
            CheckboxInput
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#4c0e1a1d-c3ce-4f6c-bed4-8e4b923b4df7" data-toggle="tab" href="#4c0e1a1d-c3ce-4f6c-bed4-8e4b923b4df7" id="20b37804-b2ef-4a20-a3b0-aeca88759b6a">
-         <span class="text-secondary" id="c7646274-526f-471d-9a42-9cb0207ff3b5">
-          <span id="4c19e027-3cf5-460b-856c-b1e8c842dbfb">
+        <a class="nav-link" data-target="#41a8a8c3-4b12-4a5f-a4f3-30bdf2dc7286" data-toggle="tab" href="#41a8a8c3-4b12-4a5f-a4f3-30bdf2dc7286" id="6c42f607-ec29-428e-9c8c-19a3a675cf67">
+         <span class="text-secondary" id="471f8c8e-afeb-4d5d-a380-8dfb26376ef4">
+          <span id="a91522fb-6be2-419e-b2ed-fb09e0f2603c">
            TextInput
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#d88bab65-390f-4de1-94c5-00d70a6e7ab6" data-toggle="tab" href="#d88bab65-390f-4de1-94c5-00d70a6e7ab6" id="5a7bb58f-3043-4595-8706-6c3153053bc4">
-         <span class="text-secondary" id="9f68fe3e-cf3e-40ce-82cf-f7ce39e4a017">
-          <span id="e12d69a8-8d55-4026-95ed-d5fad51cb7f1">
+        <a class="nav-link" data-target="#43c51767-1d8c-4f61-98fb-862cdc209c12" data-toggle="tab" href="#43c51767-1d8c-4f61-98fb-862cdc209c12" id="5bc6c400-7727-4473-a6d7-ab8c21de2107">
+         <span class="text-secondary" id="00e57a96-2d74-41ff-b208-eb95fb53e68b">
+          <span id="45156409-0bbf-4235-8c72-17bd21ef035f">
            NumericInput
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#1e794278-af75-4200-9582-98be3d2b4ce8" data-toggle="tab" href="#1e794278-af75-4200-9582-98be3d2b4ce8" id="52a36177-a5b5-42bd-a21d-919c504eabf7">
-         <span class="text-secondary" id="7e07d33c-e7be-41ab-b911-2bfd55cf250b">
-          <span id="8cc3e3c6-b0bb-41ea-a26f-81760768f2da">
+        <a class="nav-link" data-target="#6cb3fbc9-b347-4c7c-ac63-5050894e2a5c" data-toggle="tab" href="#6cb3fbc9-b347-4c7c-ac63-5050894e2a5c" id="fa814f13-d312-4eff-8785-75b4a2b298c0">
+         <span class="text-secondary" id="62959e77-2be9-4816-89ed-f6eca3c48cc0">
+          <span id="77753bcb-eff2-465e-98c0-d621c770bf71">
            SelectInput
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#2d391801-6ee1-40d2-810a-df41c3cec9ba" data-toggle="tab" href="#2d391801-6ee1-40d2-810a-df41c3cec9ba" id="548cd97c-e64a-430f-8333-50fae64c3cc5">
-         <span class="text-secondary" id="b8a8b125-3bdb-4f18-8961-eb8a9be7daa3">
-          <span id="3a542ce3-a4c3-43b1-a0b1-60c0c6ce97ee">
+        <a class="nav-link" data-target="#4a7b402d-bf54-41e1-b279-145b84fa7359" data-toggle="tab" href="#4a7b402d-bf54-41e1-b279-145b84fa7359" id="8c342b55-7832-484e-84b3-05507d9f765c">
+         <span class="text-secondary" id="0edc186d-40c1-4122-983a-18570e85150a">
+          <span id="7d0972c8-8266-40dc-928c-1ad15f6b997d">
            SelectInput.Option
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#fe8f9436-f35f-4777-8786-fc27b467306d" data-toggle="tab" href="#fe8f9436-f35f-4777-8786-fc27b467306d" id="81a167df-5a5c-4dbe-b0fa-096f896aa099">
-         <span class="text-secondary" id="a8d965ed-4a56-49f7-85c9-8d4784ef31d6">
-          <span id="425793e1-2169-4ec8-ba91-e614bb64eb28">
+        <a class="nav-link" data-target="#e24703ed-25e2-4c12-afed-4d1385d74710" data-toggle="tab" href="#e24703ed-25e2-4c12-afed-4d1385d74710" id="38a8b0f8-5630-4ea5-a737-96e3bed11742">
+         <span class="text-secondary" id="2267b055-4f58-4cc7-b8a6-49a273e82b61">
+          <span id="6f04aba9-d6d3-4942-b022-e377891773dd">
            HiddenInput
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#c3233caf-78a1-4c8e-a7d3-3944cef20f08" data-toggle="tab" href="#c3233caf-78a1-4c8e-a7d3-3944cef20f08" id="572926f5-fd12-4281-b9fc-586aa9a89220">
-         <span class="text-secondary" id="af836ce1-5947-45f2-a75f-b0ff5b3964b2">
-          <span id="0f8aeeaa-61b7-4847-ab14-ed75154ba28c">
+        <a class="nav-link" data-target="#14f7cd0d-d87e-4216-bb6c-a3c990de28f9" data-toggle="tab" href="#14f7cd0d-d87e-4216-bb6c-a3c990de28f9" id="68222066-3d15-4d1b-9dcf-d23e6466e2db">
+         <span class="text-secondary" id="93c8d7bf-a28e-4043-a010-068164b18ea7">
+          <span id="2a3cfa17-99ba-441c-8554-7f6f07d7b41a">
            FileInput
           </span>
          </span>
@@ -3055,34 +3055,34 @@ button = Button("Buy Shares").as_primary().toggle(dialog)</code></pre>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="90e417f2-5656-403b-b277-b021f5ee40e7">
-        <div class="mt-5" id="5d5470bc-b1f7-467d-835a-837577b23fee">
-         <div class="d-flex justify-content-between" id="a8170a26-8407-43d2-a1cb-07f5b6634139">
-          <h1 id="0039f220-2144-4e1b-a56e-5063993c376f">
+       <div class="tab-pane fade active show" id="ebdf4daa-aa6b-4e93-aecc-3b945bd05847">
+        <div class="mt-5" id="7d3b33c2-6ecd-44ff-9072-ffbc93d474e7">
+         <div class="d-flex justify-content-between" id="d395b817-7f44-4736-8ecf-42885758adac">
+          <h1 id="c61b3752-51ed-4a3c-8bb1-9136a9c4906e">
            Class
-           <span class="text-primary" id="89c0bb00-a1ca-42f3-afd6-a34910dc2f7b">
-            <span id="aa112f1f-4633-42f6-9ca7-c1ae35740eba">
+           <span class="text-primary" id="5e173fcb-991a-47dc-bd02-b2c867c04a6f">
+            <span id="0c5a7a5b-7184-44ea-968a-e0c128c5ee7a">
              Form
             </span>
            </span>
           </h1>
-          <div id="b01fd11f-d57c-4185-a975-3c3ff911ab94">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#e0e52e1c-abaf-415b-b78e-c3b40ce14ecd" data-toggle="collapse" id="6725d961-f43f-4b2b-b3bd-eb53633f78b8" onclick="return false;" type="button">
+          <div id="295f8629-887e-47a4-acfa-596007f6aa29">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#7f94a37b-f1fb-457e-b2db-1828454385e5" data-toggle="collapse" id="42e78789-595a-45bb-a61d-c904a7528228" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="cc8952da-0dc0-4abd-9c0f-423a47b78e18">
+         <span class="text-muted" id="196252b9-6e3e-451d-b0b7-59f8251eeec6">
           A web component for a form.
          </span>
-         <pre id="ed67cd37-aac7-4251-9ad6-d7213baf00a4"><code a="" c="" l="" s=" p y t h o n ">Form(*components)</code></pre>
-         <div class="ml-3 collapse" id="e0e52e1c-abaf-415b-b78e-c3b40ce14ecd">
-          <h6 id="ae6c5ea3-f167-466e-ada3-0635d90e381f">
+         <pre id="f96ef24d-234c-48f6-b6ad-c5d48e2bd48c"><code a="" c="" l="" s=" p y t h o n ">Form(*components)</code></pre>
+         <div class="ml-3 collapse" id="7f94a37b-f1fb-457e-b2db-1828454385e5">
+          <h6 id="5ef55608-0e45-4717-b046-8a8f7331deae">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="927eef24-8723-4836-90d2-2a241aaad9aa">
+          <table class="table table-sm bg-light" id="c1193f61-22a1-458d-9a39-64ae8061f0d6">
            <thead>
             <tr>
              <th scope="col">
@@ -3120,7 +3120,7 @@ button = Button("Buy Shares").as_primary().toggle(dialog)</code></pre>
            </tbody>
           </table>
          </div>
-         <p id="e4011f35-436d-4789-8014-4f3c5c0fd497">
+         <p id="a597b006-2d73-4d90-b323-d5e1f0b71577">
           Use the
           <code>
            on_submit(href)
@@ -3128,13 +3128,13 @@ button = Button("Buy Shares").as_primary().toggle(dialog)</code></pre>
           function to specify URL where entered
     information should to be sent for processing.
          </p>
-         <div class="ml-3" id="952e21dc-b432-43e4-b7ce-f876e54f690f">
-          <h6 id="2a0bbfb9-cff2-4c36-a559-563ddf440622">
+         <div class="ml-3" id="2f19e5f2-ca6b-4b42-9fd7-f2aba8cad991">
+          <h6 id="1737ae7c-0dfe-401b-82d8-81b299df1491">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="8429a710-bebf-47dd-9f63-906dcc1baf77"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form
+          <pre id="0ebe1c55-0c51-475c-9e87-61849b55c5e4"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form
 
 Form(
     # here should be an enumeration  of
@@ -3142,34 +3142,34 @@ Form(
     ...
 ).on_submit('go/to/this/url')</code></pre>
          </div>
-         <div class="mt-5" id="25a9a0f1-e65b-491a-9424-abe01ad62028">
-          <div class="d-flex justify-content-between" id="acfe6d62-2bb2-4f7d-8690-1277323c17dd">
-           <h4 id="7f6c74a2-7205-4f51-a433-9dcf38ff933c">
+         <div class="mt-5" id="ed557a4c-7c6e-409c-aed7-70c33c717e81">
+          <div class="d-flex justify-content-between" id="26bf6a49-2b1f-464f-a17f-0b164fa63b31">
+           <h4 id="7d7c3291-d347-4847-9174-e6856bb4da4b">
             Method
-            <span class="text-primary" id="a79defff-9bfa-4f3d-af64-4a9bf5ad70e3">
+            <span class="text-primary" id="e43d5cea-da3f-411c-9bcb-490a64747953">
              on_submit
             </span>
            </h4>
-           <div id="839e5385-dfad-402c-ab50-28dc37a95e71">
-            <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#0cb77cd3-60c7-45f0-a013-5837dda1ad01" data-toggle="collapse" id="757085df-c18d-4aed-9d15-5b281bb33757" onclick="return false;" type="button">
+           <div id="e186d627-02b2-4230-991d-1f69aa661300">
+            <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#dfb9e260-cb32-48f1-a10f-44374cbded80" data-toggle="collapse" id="acca306b-c95a-46f8-8d22-d997261723a3" onclick="return false;" type="button">
              Argument
             </button>
-            <button class="btn-sm btn btn-outline-primary" data-target="#fa6a967e-17f9-4229-9927-fac3462b9b8f" data-toggle="collapse" id="713af79a-0b4b-431b-91ad-76740e41b651" onclick="return false;" type="button">
+            <button class="btn-sm btn btn-outline-primary" data-target="#ce71723e-5594-44ab-bebb-94ef7f18c0c2" data-toggle="collapse" id="c55b2628-aed1-40d8-9a2b-32c9b6719c5c" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="e66866f0-b027-44e4-b609-2615760fe881">
+          <span class="text-muted" id="978a13f0-d4d1-45ac-ac18-43ac685314b8">
            Sets the submit URL, for the POST request.
           </span>
-          <pre id="dcf8c2ba-fefb-4d2d-b0ad-9ba7181e1270"><code a="" c="" l="" s=" p y t h o n ">on_submit(href)</code></pre>
-          <div class="ml-3 collapse" id="0cb77cd3-60c7-45f0-a013-5837dda1ad01">
-           <h6 id="241ae4cd-e62d-451a-a7a8-1b44c24dcad1">
+          <pre id="f1ad457f-5be3-48b4-9918-a1b45ee6a84c"><code a="" c="" l="" s=" p y t h o n ">on_submit(href)</code></pre>
+          <div class="ml-3 collapse" id="dfb9e260-cb32-48f1-a10f-44374cbded80">
+           <h6 id="e3117f39-39bb-4ac7-bf7d-bf4048b5fe06">
             <strong>
              Arguments
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="7b2d6d9f-6c68-46f7-bee6-3f30cdb44425">
+           <table class="table table-sm bg-light" id="c9636547-cc62-4451-85bd-d64b0d469e56">
             <thead>
              <tr>
               <th scope="col">
@@ -3202,13 +3202,13 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ml-3 collapse" id="fa6a967e-17f9-4229-9927-fac3462b9b8f">
-           <h6 id="c77c418b-9783-44d3-8be0-c00a40ef63a1">
+          <div class="ml-3 collapse" id="ce71723e-5594-44ab-bebb-94ef7f18c0c2">
+           <h6 id="bde47f06-eb73-4e7c-a85d-92db81965870">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="19ea300c-bc0a-4954-9afd-42ecc631600a">
+           <table class="table table-sm bg-light" id="76f3a896-e5bb-4c3e-92ca-6f39c0a7c26d">
             <thead>
              <tr>
               <th scope="col">
@@ -3241,47 +3241,47 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="d80f26da-3323-4d4c-b15c-b3fe4b978ad1">
-           <h6 id="f50f4224-5bf7-4a97-804d-4a2237b7e0a7">
+          <div class="ml-3" id="7d7ca6ad-cebd-4643-9d5a-85e907221b02">
+           <h6 id="83505415-7cee-4acc-861e-902f4eb052fd">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="29d484fa-269c-4485-8a45-34ed3c7957b9"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form
+           <pre id="56cb1f15-8130-42cc-8758-890866836064"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form
 
 Form(...).on_submit('go/to/this/url')</code></pre>
           </div>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="ad4986bd-f0fe-4d34-bdf7-63d39d1d0dee">
-        <div class="mt-5" id="5f7acf09-2142-4d90-8403-26474ce6c6a7">
-         <div class="d-flex justify-content-between" id="cdb0df01-fd8d-41c2-bbb6-571d651240aa">
-          <h1 id="1891611e-c9a4-4bde-adb5-24e4ef261206">
+       <div class="tab-pane fade" id="9bb0ef48-d39d-4467-8706-bf000899d02b">
+        <div class="mt-5" id="4542c927-e996-4af3-a7f2-bc25957d7eb0">
+         <div class="d-flex justify-content-between" id="71c2c4c8-d0a4-43e4-af06-9aba1435ad07">
+          <h1 id="9009d463-e8bf-461f-95ad-3845f98a54a3">
            Class
-           <span class="text-primary" id="14d2b6da-5645-485e-968e-bbe070072136">
-            <span id="03a74aa3-cf28-404c-abd2-ab1ead705584">
+           <span class="text-primary" id="a013e72a-13bc-46cb-8893-91b9c02e2e3a">
+            <span id="aa157247-8e62-4f59-80bf-11eade43fe43">
              CheckboxInput
             </span>
            </span>
           </h1>
-          <div id="57aa5fc8-8d78-43b3-a454-7a3f6f2b302a">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#2e6ebc54-fa82-455c-9c50-31dcfce6ef81" data-toggle="collapse" id="699a04af-d9ab-4131-9fa4-e1711c74da98" onclick="return false;" type="button">
+          <div id="9da27daa-230c-4146-b7ef-6b683f373306">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#5db5bc90-3965-44d4-820a-59103374299e" data-toggle="collapse" id="a4a14691-bf4f-4d7a-bb53-76c55e339912" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="dc2cb340-40de-41d1-81b8-d57b91e55b40">
+         <span class="text-muted" id="15f0feb7-3436-4019-969e-ee9cf69e54be">
           A checkbox input.
          </span>
-         <pre id="ef82f85d-c2e9-4c02-9729-8d98adb5c9c3"><code a="" c="" l="" s=" p y t h o n ">CheckboxInput(label, name, checked=False)</code></pre>
-         <div class="ml-3 collapse" id="2e6ebc54-fa82-455c-9c50-31dcfce6ef81">
-          <h6 id="aecfb2ef-8f4d-48a7-983d-c7dc7b7b10f6">
+         <pre id="3ececde8-7a0f-4ab8-9e6b-e55e3f0f74d5"><code a="" c="" l="" s=" p y t h o n ">CheckboxInput(label, name, checked=False)</code></pre>
+         <div class="ml-3 collapse" id="5db5bc90-3965-44d4-820a-59103374299e">
+          <h6 id="a38b2229-db50-44e2-b767-a49a344ca6dd">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="02d8539e-cda0-4c41-bbdb-2572f0cc3452">
+          <table class="table table-sm bg-light" id="bb02829b-ad8e-495d-bce4-07b6e573c98a">
            <thead>
             <tr>
              <th scope="col">
@@ -3344,7 +3344,7 @@ Form(...).on_submit('go/to/this/url')</code></pre>
            </tbody>
           </table>
          </div>
-         <p id="76279993-06e1-4918-aed6-0f1b978b6fed">
+         <p id="c25c7a2c-c8ed-4f27-a4d4-09b61d1dce37">
           Use the
           <code>
            as_disabled()
@@ -3356,13 +3356,13 @@ Form(...).on_submit('go/to/this/url')</code></pre>
           </code>
           component.
          </p>
-         <div class="ml-3" id="39713b35-de6b-4e98-b1fe-7db8411f4e26">
-          <h6 id="57d23b15-bca7-4dd1-9d73-d8eb72b8e938">
+         <div class="ml-3" id="2948b267-722d-46bc-ac63-fa66d7be12fa">
+          <h6 id="40158b49-eb0d-4fd4-8e41-ff83e81aef5b">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="2f0b3946-17d7-44ee-b0fd-d5109b3f4aef"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, CheckboxInput
+          <pre id="a2b67854-e368-4ad8-8225-6713ed06e2d2"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, CheckboxInput
 
 Form(
     CheckboxInput('One', 'opt1'),
@@ -3370,64 +3370,64 @@ Form(
     CheckboxInput('Three', 'opt3').as_disabled()
 )</code></pre>
          </div>
-         <div class="ml-3" id="eda70348-0ea9-4d2a-b898-bfe4b742646e">
-          <form enctype="multipart/form-data" id="989c54c6-8021-40a2-91b2-6c2d1d83b84e" method="POST">
+         <div class="ml-3" id="af322333-397a-42de-a7dd-79761d402d42">
+          <form enctype="multipart/form-data" id="31aa8f07-c0cf-4ac3-8418-c240530f1f4b" method="POST">
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="a70c28fb-2b33-4c81-b461-37de4eb042fb">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="721eec5d-e5a2-493a-890e-bf22547b37b6">
              One
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <input autocomplete="off" class="form-check-input" id="a70c28fb-2b33-4c81-b461-37de4eb042fb" name="opt1" type="checkbox"/>
+             <input autocomplete="off" class="form-check-input" id="721eec5d-e5a2-493a-890e-bf22547b37b6" name="opt1" type="checkbox"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="58f097f6-1a27-4346-94e3-d793933dea15">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="7fdbd659-4679-494d-856b-36d136401b3d">
              Two
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <input autocomplete="off" checked="" class="form-check-input" id="58f097f6-1a27-4346-94e3-d793933dea15" name="opt2" type="checkbox"/>
+             <input autocomplete="off" checked="" class="form-check-input" id="7fdbd659-4679-494d-856b-36d136401b3d" name="opt2" type="checkbox"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="86d573df-1ed0-4ef7-b52f-c28c0de8bc85">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="26c19394-8877-41f0-88da-62bdcc38e127">
              Three
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <input autocomplete="off" class="form-check-input" disabled="" id="86d573df-1ed0-4ef7-b52f-c28c0de8bc85" name="opt3" type="checkbox"/>
+             <input autocomplete="off" class="form-check-input" disabled="" id="26c19394-8877-41f0-88da-62bdcc38e127" name="opt3" type="checkbox"/>
             </div>
            </div>
           </form>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="4c0e1a1d-c3ce-4f6c-bed4-8e4b923b4df7">
-        <div class="mt-5" id="4232df26-3421-4895-aef3-868262acd982">
-         <div class="d-flex justify-content-between" id="3b316b2d-603e-4224-9f74-b7fbb599f6fa">
-          <h1 id="7cb3eb0c-1ea2-4d88-829a-3b06e8784da8">
+       <div class="tab-pane fade" id="41a8a8c3-4b12-4a5f-a4f3-30bdf2dc7286">
+        <div class="mt-5" id="bba0f5b9-fa3e-4657-ab9a-4d7a51e9249f">
+         <div class="d-flex justify-content-between" id="982ffd78-8738-48be-8fab-73cb329f6428">
+          <h1 id="8b85dcf1-9278-42b9-9839-465b0932a49d">
            Class
-           <span class="text-primary" id="3583de14-43f3-4332-a63f-d05978bcbd9e">
-            <span id="4c19e027-3cf5-460b-856c-b1e8c842dbfb">
+           <span class="text-primary" id="eff0db2d-753c-4f5b-8990-f0e1ae19a1a2">
+            <span id="a91522fb-6be2-419e-b2ed-fb09e0f2603c">
              TextInput
             </span>
            </span>
           </h1>
-          <div id="12d96d95-f70b-4066-b17b-c3793346bd00">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#b17f4710-1d46-4b88-8817-310da1c71363" data-toggle="collapse" id="f818b692-3181-4a06-9ab4-5569ee01302d" onclick="return false;" type="button">
+          <div id="2623cb36-0369-4df5-938d-a8375efe2f2a">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#f3df34b9-dee2-4c23-9491-054af7384b6a" data-toggle="collapse" id="1f73888b-bcbc-4823-94c8-b7bd8b17d154" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="658494f7-e2fa-4ee8-a8e9-f7ac1f81af6c">
+         <span class="text-muted" id="ec7a4c93-df1b-482e-991a-b08ef686461c">
           A text input.
          </span>
-         <pre id="e0125faa-6ce5-408a-92a3-593a5c9017b0"><code a="" c="" l="" s=" p y t h o n ">TextInput(label, name, value=None, placeholder=None)</code></pre>
-         <div class="ml-3 collapse" id="b17f4710-1d46-4b88-8817-310da1c71363">
-          <h6 id="1d744b88-ee52-45a0-8d24-6f3ee0ff3706">
+         <pre id="e7431814-51c4-46a0-b43a-a08feaf0378d"><code a="" c="" l="" s=" p y t h o n ">TextInput(label, name, value=None, placeholder=None)</code></pre>
+         <div class="ml-3 collapse" id="f3df34b9-dee2-4c23-9491-054af7384b6a">
+          <h6 id="0d20019c-7480-43b8-917d-9a92798fd49a">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="78b6a43d-c855-4d29-8cb8-771b42791a3a">
+          <table class="table table-sm bg-light" id="7dca674a-1f42-44ac-8f4e-c0518200efcd">
            <thead>
             <tr>
              <th scope="col">
@@ -3505,7 +3505,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="49de57fd-a9f3-4499-89d8-ffd9106716e2">
+         <p id="621be344-7261-47a4-a8c4-c2c317cf6f2f">
           Use the
           <code>
            as_disabled()
@@ -3517,13 +3517,13 @@ Form(
           </code>
           component.
          </p>
-         <div class="ml-3" id="70f85f50-3b9f-438a-8626-536fceaea784">
-          <h6 id="20692bee-73fb-44fe-b5f9-6f6615bd8f46">
+         <div class="ml-3" id="d09a5522-5836-476d-87c4-d13dac277cff">
+          <h6 id="d7520e0d-8782-44d5-9423-e715c6bd4935">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="cac3c242-4bd3-4e6e-a2e3-fd90f543dad7"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, TextInput
+          <pre id="136dd6a4-f6ce-4338-8ef7-cfa179e2ab28"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Text1', 'text'),
@@ -3532,67 +3532,67 @@ Form(
     TextInput('Text4', 'text').as_disabled()
 )</code></pre>
          </div>
-         <div class="ml-3" id="aec8727e-541a-4873-bb22-afd03dbe470f">
-          <form enctype="multipart/form-data" id="53f8c890-c81d-4f2e-aa51-f8bc7ca0a82b" method="POST">
+         <div class="ml-3" id="c611c9f4-cdb0-48f5-a777-6f8a77ed0ca9">
+          <form enctype="multipart/form-data" id="9d02cc6d-1246-42ae-9ad7-38f899d14d47" method="POST">
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="be240dbd-5ee2-4bec-b226-f366f08343c4">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="32bd7069-1cb9-4113-a1ae-04e26934c818">
              Text1
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <input class="form-control" id="be240dbd-5ee2-4bec-b226-f366f08343c4" name="text" type="text"/>
+             <input class="form-control" id="32bd7069-1cb9-4113-a1ae-04e26934c818" name="text" type="text"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="bfed5a0d-4fc3-4611-a352-59f37c9f0ccb">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="a924e74f-0a70-4eb4-bd64-a835be204c15">
              Text2
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <input class="form-control" id="bfed5a0d-4fc3-4611-a352-59f37c9f0ccb" name="text" placeholder="type here" type="text"/>
+             <input class="form-control" id="a924e74f-0a70-4eb4-bd64-a835be204c15" name="text" placeholder="type here" type="text"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="94259584-f633-494f-926f-41fef0a7570b">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="061c6ab3-1ef7-47c6-a6c4-26f0749e4f38">
              Text3
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <input class="form-control" id="94259584-f633-494f-926f-41fef0a7570b" name="text" type="text" value="Hello World!"/>
+             <input class="form-control" id="061c6ab3-1ef7-47c6-a6c4-26f0749e4f38" name="text" type="text" value="Hello World!"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="3b21825c-3152-49cc-93b5-5d3571e23361">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="977fde3e-3664-4b8f-ae69-8afee335f8cc">
              Text4
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <input class="form-control" disabled="" id="3b21825c-3152-49cc-93b5-5d3571e23361" name="text" type="text"/>
+             <input class="form-control" disabled="" id="977fde3e-3664-4b8f-ae69-8afee335f8cc" name="text" type="text"/>
             </div>
            </div>
           </form>
          </div>
-         <div class="mt-5" id="6ab6ac91-6535-4837-a194-e4cfbdd9159d">
-          <div class="d-flex justify-content-between" id="803b0f3d-fd6e-41de-a6f8-4bb3e1548dfc">
-           <h4 id="8e1381be-374d-4393-a15c-8f152396d030">
+         <div class="mt-5" id="f4b68bc2-a204-4dd0-976d-71d9d5afa99c">
+          <div class="d-flex justify-content-between" id="c73bca97-bf96-4733-8820-940b1ef06247">
+           <h4 id="21696616-7840-4e0d-97a2-7c8320c54739">
             Method
-            <span class="text-primary" id="4a9d0539-31ba-4620-9ee3-6898434841bf">
+            <span class="text-primary" id="f3f78eba-16b7-4a94-a9ee-67c63886e9b9">
              for_email
             </span>
            </h4>
-           <div id="b937d90a-0515-4bd0-bb87-bc70765ca9da">
-            <button class="btn-sm btn btn-outline-primary" data-target="#779bf35f-57b4-41f5-a812-7088b0ee92a5" data-toggle="collapse" id="1d9ac684-ec40-4215-820b-255d641902be" onclick="return false;" type="button">
+           <div id="e1b75a63-e3f7-4bbf-94b2-8ea2a92a8f79">
+            <button class="btn-sm btn btn-outline-primary" data-target="#751c348d-2b97-4e69-970f-9fb059641508" data-toggle="collapse" id="e5075a79-b14a-4d3a-a24b-75415f120e14" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="9617b396-2880-45b1-822e-9535d37488ca">
+          <span class="text-muted" id="98b596a9-68b0-4c45-bc8f-69158ba61a9d">
            Configuring input for entering email.
           </span>
-          <pre id="90af603f-470b-4b8e-a53a-c0c36cc192cd"><code a="" c="" l="" s=" p y t h o n ">for_email()</code></pre>
-          <div class="ml-3 collapse" id="779bf35f-57b4-41f5-a812-7088b0ee92a5">
-           <h6 id="421c0703-243f-44b0-b699-c8207ad78e33">
+          <pre id="df557d30-0521-44e8-b88c-52a7eb4c0028"><code a="" c="" l="" s=" p y t h o n ">for_email()</code></pre>
+          <div class="ml-3 collapse" id="751c348d-2b97-4e69-970f-9fb059641508">
+           <h6 id="f8a3034a-e14d-4f2f-827f-85e5266b8f73">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="a95fe993-fbcf-4935-9da2-81b8fd7f53a2">
+           <table class="table table-sm bg-light" id="7c931642-1855-4839-bfe7-d69e5edf3618">
             <thead>
              <tr>
               <th scope="col">
@@ -3625,56 +3625,56 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="043d7d4c-2aff-4348-bcd7-648fc333dbd0">
-           <h6 id="325367c1-e1c0-4d55-8a52-e63ca90fef85">
+          <div class="ml-3" id="20e6700f-626e-4dee-a6aa-792a2613aa42">
+           <h6 id="ce0e0e64-7150-4850-a902-a96635d0ab6f">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="7eb26831-be19-44e7-a6aa-f58383e2a7bc"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, TextInput
+           <pre id="993f33da-87b8-4a10-9600-6c504f136b62"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Email', 'email', 'my@email.com').for_email()
 )</code></pre>
           </div>
-          <div class="ml-3" id="d4c821f7-511f-4d59-a6b9-4ea6afd62b84">
-           <form enctype="multipart/form-data" id="8f26134b-3db2-4279-9eb1-1a91d21d6232" method="POST">
+          <div class="ml-3" id="af878018-cee9-4130-b735-f364930f3760">
+           <form enctype="multipart/form-data" id="ff2d2e28-5fe5-4a7b-9079-8b3011407fc2" method="POST">
             <div class="form-group row">
-             <label class="col-sm-2 col-form-label d-flex align-items-center" for="3324c1c8-8988-40b3-9c49-e5b5a8497df3">
+             <label class="col-sm-2 col-form-label d-flex align-items-center" for="ac077e80-a4d6-4ef7-aa00-58fd70265242">
               Email
              </label>
              <div class="col-sm-10 d-flex align-items-center">
-              <input class="form-control" id="3324c1c8-8988-40b3-9c49-e5b5a8497df3" name="email" type="email" value="my@email.com"/>
+              <input class="form-control" id="ac077e80-a4d6-4ef7-aa00-58fd70265242" name="email" type="email" value="my@email.com"/>
              </div>
             </div>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="48e228b7-520d-4f49-83b4-00e4381997cd">
-          <div class="d-flex justify-content-between" id="8f8edb84-aef2-4eaf-8442-577414dbd286">
-           <h4 id="0f0c0615-90f5-4dc3-a071-2619820b7687">
+         <div class="mt-5" id="7218ea25-e0c0-4a8d-9f4d-6a8d0d48a488">
+          <div class="d-flex justify-content-between" id="5e491124-7d0f-42ae-b304-64ca9726f842">
+           <h4 id="95bb67d5-0350-4df4-a543-91d3864b0a09">
             Method
-            <span class="text-primary" id="9abd91db-9ddb-4a43-9010-d51bc413fdec">
+            <span class="text-primary" id="666658c9-299b-4e7c-b556-fa8a3ce461cd">
              for_password
             </span>
            </h4>
-           <div id="676ae7c8-5604-4cc0-8365-879bfeac97c2">
-            <button class="btn-sm btn btn-outline-primary" data-target="#8a93b022-0629-4654-8d5c-dd915ce3793d" data-toggle="collapse" id="48c18347-59a9-43d8-bb2d-9dbf8f002918" onclick="return false;" type="button">
+           <div id="6316b2c9-3b01-4e58-b375-ba73b2796167">
+            <button class="btn-sm btn btn-outline-primary" data-target="#1ad1c73a-3f45-479b-8bce-1bf1a4f08fd1" data-toggle="collapse" id="166b8450-0a95-415a-8c33-81ee00654db0" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="c3d28cd5-8fe9-438d-ade7-e17124a57095">
+          <span class="text-muted" id="e8f7f590-999c-41ae-965d-674f3b31070d">
            Configuring input for entering password.
           </span>
-          <pre id="3d6f1f05-cb9d-4e86-862e-4a053ddd3224"><code a="" c="" l="" s=" p y t h o n ">for_password()</code></pre>
-          <div class="ml-3 collapse" id="8a93b022-0629-4654-8d5c-dd915ce3793d">
-           <h6 id="6bc0b92e-ea5d-47a9-a852-9255a30275ff">
+          <pre id="a2fd4d53-2d47-4b07-87f4-0ea25f2f0084"><code a="" c="" l="" s=" p y t h o n ">for_password()</code></pre>
+          <div class="ml-3 collapse" id="1ad1c73a-3f45-479b-8bce-1bf1a4f08fd1">
+           <h6 id="010d0adf-22a8-4387-bce6-940d7a627861">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="4750b455-bac1-4231-b48a-267488e632b1">
+           <table class="table table-sm bg-light" id="4f639580-7032-4c20-90b3-2f984a493f84">
             <thead>
              <tr>
               <th scope="col">
@@ -3707,59 +3707,59 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="2e857554-6418-4718-9cde-07025a9c334a">
-           <h6 id="1849d8f7-a449-4e6b-9212-c44db2c9d849">
+          <div class="ml-3" id="33d5f6bd-3d93-4022-b2d5-f321374cca3a">
+           <h6 id="5053b7b3-2fa4-4639-9aad-16fccae2739c">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="d8249124-2660-4d3c-8bbd-a7b2c37cb8f8"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, TextInput
+           <pre id="4ffbf2e2-80e4-41cd-a8be-69829ca5e288"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Password', 'password', '********').for_password()
 )</code></pre>
           </div>
-          <div class="ml-3" id="fb7e9258-2e1c-4c5c-9c05-16b2325c9c6d">
-           <form enctype="multipart/form-data" id="9557b449-f885-46e9-9d6d-9fddba2330af" method="POST">
+          <div class="ml-3" id="4434f295-817f-477d-919e-71a5fa430e0f">
+           <form enctype="multipart/form-data" id="00dc7d4d-1c87-420b-b843-1a9444cf3bba" method="POST">
             <div class="form-group row">
-             <label class="col-sm-2 col-form-label d-flex align-items-center" for="41b3e939-82ee-4587-b3d2-f4f90f662d16">
+             <label class="col-sm-2 col-form-label d-flex align-items-center" for="ac93ada0-f984-4150-87e0-c121c8ebce6e">
               Password
              </label>
              <div class="col-sm-10 d-flex align-items-center">
-              <input class="form-control" id="41b3e939-82ee-4587-b3d2-f4f90f662d16" name="password" type="password" value="********"/>
+              <input class="form-control" id="ac93ada0-f984-4150-87e0-c121c8ebce6e" name="password" type="password" value="********"/>
              </div>
             </div>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="308d604d-4123-4411-8382-0c4d3ffff2f0">
-          <div class="d-flex justify-content-between" id="112d6892-cb93-403f-8802-f2af303c502f">
-           <h4 id="424e62e3-88d9-4afb-91b4-934ba848e095">
+         <div class="mt-5" id="0bcd2bb5-8d0b-47f3-8c94-ff7d94a7be76">
+          <div class="d-flex justify-content-between" id="41f67090-8d8b-4ab4-a6fa-1dc832e6f59f">
+           <h4 id="39939250-5a1e-4c5f-af4c-d00123fa32c6">
             Method
-            <span class="text-primary" id="deef2706-dea5-4c99-bfa6-10e1f27f60f8">
+            <span class="text-primary" id="5b8e5d18-f6f5-4271-ae90-3556a75eff20">
              with_multirows
             </span>
            </h4>
-           <div id="d137a48a-e32a-43c1-9f8a-3f7b4ee8615a">
-            <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#8f7b2dbc-f209-4c90-8eb2-551deff13f3b" data-toggle="collapse" id="c1298774-8b79-4480-b5b0-a3cee561efb4" onclick="return false;" type="button">
+           <div id="f4a802ba-deb1-4453-a986-21dff7573206">
+            <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#02230a7c-ea89-4432-9423-747cfa26d483" data-toggle="collapse" id="9f5f1c19-37b3-4d40-b3f1-b1530d4f2545" onclick="return false;" type="button">
              Argument
             </button>
-            <button class="btn-sm btn btn-outline-primary" data-target="#964a0fa2-63b6-48f4-9d4b-aa4439b90cea" data-toggle="collapse" id="a1b72f00-ab90-4df2-a85e-d98aa2c5e9a0" onclick="return false;" type="button">
+            <button class="btn-sm btn btn-outline-primary" data-target="#0e72ef04-5c41-46fc-ac2b-99a3394cc592" data-toggle="collapse" id="5d0fdf9f-df2d-4fb7-aeba-72b1cf18888d" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="ebbb988a-5779-489c-8be8-39f9b567b814">
+          <span class="text-muted" id="1788e4ba-33d0-49c0-98fa-539d33461ddc">
            Sets the number of rows.
           </span>
-          <pre id="8d5c0dae-c613-4c86-b86b-13a4d7d39105"><code a="" c="" l="" s=" p y t h o n ">with_multirows(n)</code></pre>
-          <div class="ml-3 collapse" id="8f7b2dbc-f209-4c90-8eb2-551deff13f3b">
-           <h6 id="ab941d40-bf55-465a-bf80-6eca68ccbb22">
+          <pre id="c3e6cc1a-2a74-4180-8c6a-adff905fb8ce"><code a="" c="" l="" s=" p y t h o n ">with_multirows(n)</code></pre>
+          <div class="ml-3 collapse" id="02230a7c-ea89-4432-9423-747cfa26d483">
+           <h6 id="fd4d7c8a-fc8c-4cfa-b3a3-59dfb5ba8ad1">
             <strong>
              Arguments
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="8d7289f1-b43e-4ea7-8953-11f76759af22">
+           <table class="table table-sm bg-light" id="d565a0c1-9083-4cf6-b6f2-80ccddac7060">
             <thead>
              <tr>
               <th scope="col">
@@ -3792,13 +3792,13 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ml-3 collapse" id="964a0fa2-63b6-48f4-9d4b-aa4439b90cea">
-           <h6 id="32a26092-e54b-4dbd-8e8e-bf10d08d5dfa">
+          <div class="ml-3 collapse" id="0e72ef04-5c41-46fc-ac2b-99a3394cc592">
+           <h6 id="c58cfbd4-c083-4c7f-aa87-f97581f20e2f">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="23ecb3d3-9a66-45e0-9b8e-8dfd9b427ca3">
+           <table class="table table-sm bg-light" id="23988c6a-6aec-4ad4-b83a-8e9f20941964">
             <thead>
              <tr>
               <th scope="col">
@@ -3831,26 +3831,26 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="0cb62eef-915a-4f65-9098-14b20525a71f">
-           <h6 id="c1988187-583e-45fe-a1c6-2be65bb48a0e">
+          <div class="ml-3" id="0e5bbf24-7603-4626-8e28-89c36a8f441f">
+           <h6 id="586f2018-2c89-4503-ab42-00faeda5e8b4">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="a0e38375-2ea5-4559-8520-2966677d80d1"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, TextInput
+           <pre id="8ed9d4a9-7fb9-49a4-95b3-13c4a407bae3"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Text', 'text').with_multirows(3)
 )</code></pre>
           </div>
-          <div class="ml-3" id="e2b4d910-ac61-4d31-aae2-dcfa6fc85a72">
-           <form enctype="multipart/form-data" id="6ddaeca6-ff1a-4936-aef4-df16198a0062" method="POST">
+          <div class="ml-3" id="44ee8ae7-67c1-4494-abc2-5b34f0d4d5dd">
+           <form enctype="multipart/form-data" id="ee269b44-692d-4aff-ba9b-548b4661606e" method="POST">
             <div class="form-group row">
-             <label class="col-sm-2 col-form-label d-flex align-items-center" for="c650715d-470c-4977-9f83-dc617de67d68">
+             <label class="col-sm-2 col-form-label d-flex align-items-center" for="7e7699b0-7128-41f9-8203-79e4d8897263">
               Text
              </label>
              <div class="col-sm-10 d-flex align-items-center">
-              <textarea class="form-control" id="c650715d-470c-4977-9f83-dc617de67d68" name="text" rows="3">
+              <textarea class="form-control" id="7e7699b0-7128-41f9-8203-79e4d8897263" name="text" rows="3">
                     
                 </textarea>
              </div>
@@ -3860,34 +3860,34 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="d88bab65-390f-4de1-94c5-00d70a6e7ab6">
-        <div class="mt-5" id="13ab957a-d8f4-4e67-bd89-7a69d8f48e23">
-         <div class="d-flex justify-content-between" id="21d2a0ac-6852-4d06-9455-49dcd1c02d5e">
-          <h1 id="2556ac3c-56bb-4059-939e-b4f71b56b183">
+       <div class="tab-pane fade" id="43c51767-1d8c-4f61-98fb-862cdc209c12">
+        <div class="mt-5" id="52323226-216e-4b87-b32c-9131f9f91c66">
+         <div class="d-flex justify-content-between" id="15d4d356-a505-4eab-aa20-a87e0f322df2">
+          <h1 id="294254b5-7251-46bb-b612-6a16056fa873">
            Class
-           <span class="text-primary" id="a79c204b-ac5e-4c96-b98a-83bff3469f9a">
-            <span id="e12d69a8-8d55-4026-95ed-d5fad51cb7f1">
+           <span class="text-primary" id="14891256-8592-4f31-8fdb-25684e4f184a">
+            <span id="45156409-0bbf-4235-8c72-17bd21ef035f">
              NumericInput
             </span>
            </span>
           </h1>
-          <div id="bc0f2336-98bf-4f4e-ad4c-79807c83fc04">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#38d5e571-b9aa-413f-b7e3-8909fec9eb09" data-toggle="collapse" id="ca9c9ecb-1539-4170-aad2-8550f50b9c58" onclick="return false;" type="button">
+          <div id="7d7f1f81-65da-493d-adcf-52a3718a066a">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#9b1c320f-0d57-41fd-a201-a2be0a92cd0d" data-toggle="collapse" id="77afbcf2-3c8c-4ead-acb6-6995cc20d365" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="4d1de045-5c90-414f-abe5-f14d9ceab599">
+         <span class="text-muted" id="33b1b80c-1237-4099-bd23-72d9cafd316f">
           A numeric input.
          </span>
-         <pre id="47c6c678-2601-4bf0-a1b6-fc6220ee8859"><code a="" c="" l="" s=" p y t h o n ">NumericInput(label, name, value=None, placeholder=None)</code></pre>
-         <div class="ml-3 collapse" id="38d5e571-b9aa-413f-b7e3-8909fec9eb09">
-          <h6 id="1648e070-7cd8-4c68-898f-4fc32e602f6b">
+         <pre id="6425ee4d-070c-4d39-bdeb-c59e5dca7766"><code a="" c="" l="" s=" p y t h o n ">NumericInput(label, name, value=None, placeholder=None)</code></pre>
+         <div class="ml-3 collapse" id="9b1c320f-0d57-41fd-a201-a2be0a92cd0d">
+          <h6 id="5065dc09-e147-4117-a8f3-457238388882">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="5b5d1e31-750d-4e5e-9da6-abe7b175b425">
+          <table class="table table-sm bg-light" id="9bc12bb4-c6c2-4de1-addc-a547fa5a5fa8">
            <thead>
             <tr>
              <th scope="col">
@@ -3965,7 +3965,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="bf8b3d5e-e5a0-4adb-9013-d51ce81b5b7a">
+         <p id="c0b9a117-b14f-4996-9a98-2541c34ccfbe">
           Use the
           <code>
            as_disabled()
@@ -3977,13 +3977,13 @@ Form(
           </code>
           component.
          </p>
-         <div class="ml-3" id="02327114-a953-4146-98f0-fde650e66485">
-          <h6 id="f56f03c4-01e8-4ae5-9d6e-47413dd446fd">
+         <div class="ml-3" id="e1750dee-73aa-4529-90b9-eeffdc19d89e">
+          <h6 id="6fcdd249-6cc4-4a66-b173-7a36c389e732">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="e430b902-6508-4c90-a543-1a0545c362dc"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, TextInput
+          <pre id="3af2aa4a-b1bf-403b-ac0d-11ce89f5078e"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, TextInput
 
 Form(
     NumericInput('Number1', 'number'),
@@ -3992,72 +3992,72 @@ Form(
     NumericInput('Number4', 'number').as_disabled()
 )</code></pre>
          </div>
-         <div class="ml-3" id="1daad3cc-ce02-41a5-b07c-e4c10029ca53">
-          <form enctype="multipart/form-data" id="cbf2486d-5832-47d3-baa5-655435f170f2" method="POST">
+         <div class="ml-3" id="159c9168-c0c3-4a7b-9338-b40f89e76853">
+          <form enctype="multipart/form-data" id="4e41b109-0250-4d6a-9188-79f9b0f4f323" method="POST">
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="b11685fb-7c6c-4b1d-bd80-de54aaa50362">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="0f1203c6-daa5-4973-adf6-778d5569a531">
              Number1
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <input class="form-control" id="b11685fb-7c6c-4b1d-bd80-de54aaa50362" name="number" type="number"/>
+             <input class="form-control" id="0f1203c6-daa5-4973-adf6-778d5569a531" name="number" type="number"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="8d39b887-1be5-42dd-9aa2-c2594221aa93">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="5cb792ec-6204-4aeb-807d-dfcb3695eaf6">
              Number2
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <input class="form-control" id="8d39b887-1be5-42dd-9aa2-c2594221aa93" name="number" placeholder="type here" type="number"/>
+             <input class="form-control" id="5cb792ec-6204-4aeb-807d-dfcb3695eaf6" name="number" placeholder="type here" type="number"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="cc0417c0-4181-4bd2-9249-fdae2ad8b0f1">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="419811c1-cc41-4f30-bcd0-37db47f26714">
              Number3
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <input class="form-control" id="cc0417c0-4181-4bd2-9249-fdae2ad8b0f1" name="number" type="number" value="123"/>
+             <input class="form-control" id="419811c1-cc41-4f30-bcd0-37db47f26714" name="number" type="number" value="123"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="ca9ae89f-c425-46c7-9d47-512256b275ce">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="93a07168-5bbf-4d54-842f-704d941cd56d">
              Number4
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <input class="form-control" disabled="" id="ca9ae89f-c425-46c7-9d47-512256b275ce" name="number" type="number"/>
+             <input class="form-control" disabled="" id="93a07168-5bbf-4d54-842f-704d941cd56d" name="number" type="number"/>
             </div>
            </div>
           </form>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="1e794278-af75-4200-9582-98be3d2b4ce8">
-        <div class="mt-5" id="001da195-bea4-4687-81c3-c37923f3f332">
-         <div class="d-flex justify-content-between" id="4449f650-b6c4-401b-8847-eeac40fddf87">
-          <h1 id="97233cc1-4b4b-4f31-b573-8d4192d9e55c">
+       <div class="tab-pane fade" id="6cb3fbc9-b347-4c7c-ac63-5050894e2a5c">
+        <div class="mt-5" id="073ad7bf-3cfd-4fd6-a437-73464398a65b">
+         <div class="d-flex justify-content-between" id="229dbaa7-11f4-4fe6-97d2-2cda4212ec39">
+          <h1 id="7f8ce66e-456a-4856-a974-7472d1d363f4">
            Class
-           <span class="text-primary" id="29d807fe-9f7e-462a-9e51-4b9b220ebe41">
-            <span id="8cc3e3c6-b0bb-41ea-a26f-81760768f2da">
+           <span class="text-primary" id="293d4e9a-d575-46c1-b978-27696604b9a9">
+            <span id="77753bcb-eff2-465e-98c0-d621c770bf71">
              SelectInput
             </span>
            </span>
           </h1>
-          <div id="ecbb5879-6a3f-487f-aa32-ac2ae171f4e5">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#ef8beae6-ea30-441c-a3f2-1a1b3106c201" data-toggle="collapse" id="3e85a08e-ffc5-440a-8ae9-5525c0c6dfd6" onclick="return false;" type="button">
+          <div id="fd2eb4de-9a4c-46de-b14c-fdfaf0e1ac01">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#2ff26b37-1181-439b-b824-076fc8725dd3" data-toggle="collapse" id="a1c025b3-0e4a-42d4-87f4-e4951e8c0396" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="c7b541af-f0a3-4043-a06f-a85f93776dd8">
+         <span class="text-muted" id="2381e9a3-f65f-475c-b40c-5a7d7cd8fd31">
           A select input.
          </span>
-         <pre id="8b009c6e-0ead-483f-b03f-e708b299e49b"><code a="" c="" l="" s=" p y t h o n ">SelectInput(label, name, value=None, options=None)</code></pre>
-         <div class="ml-3 collapse" id="ef8beae6-ea30-441c-a3f2-1a1b3106c201">
-          <h6 id="065da4d0-c284-45b1-bdf8-e36234771689">
+         <pre id="f9e49ae9-fbbf-4382-ae8a-e7f216ec9d19"><code a="" c="" l="" s=" p y t h o n ">SelectInput(label, name, value=None, options=None)</code></pre>
+         <div class="ml-3 collapse" id="2ff26b37-1181-439b-b824-076fc8725dd3">
+          <h6 id="7c352124-f6fe-4442-af6e-6733b109cfb4">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="1134a66b-865c-434b-b17e-5cf963b43d69">
+          <table class="table table-sm bg-light" id="e2b52e09-3c12-4fa8-9f97-48721d83262d">
            <thead>
             <tr>
              <th scope="col">
@@ -4135,7 +4135,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="a504228a-c2b1-4833-80b1-311709db105d">
+         <p id="1324ae56-3557-44c8-8bda-c407201ae71b">
           Use the
           <code>
            as_disabled()
@@ -4147,13 +4147,13 @@ Form(
           </code>
           component.
          </p>
-         <div class="ml-3" id="1e072ced-0b30-499f-b6c8-136279d8b119">
-          <h6 id="79d4cd85-6cc8-4a26-9816-92c2d1bbe59c">
+         <div class="ml-3" id="903cab32-6fcd-45c2-ba30-db15c43fd34e">
+          <h6 id="ee05fa10-223d-46f2-975e-b80c23a5393f">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="5b766d85-2fb0-4946-851f-847a883fc7db"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, SelectInput
+          <pre id="dc340604-91bc-4086-a185-5e3e6f97b212"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, SelectInput
 
 options = [
     SelectInput.Option('One', 1),
@@ -4166,39 +4166,39 @@ Form(
     SelectInput('Selector2', 'choice', 2, options).as_disabled()
 )</code></pre>
          </div>
-         <div class="ml-3" id="f0d654a5-606b-4b89-8e7c-8a298ebddb28">
-          <form enctype="multipart/form-data" id="6c5e63f2-3eee-4ea0-a1ea-a42ce17d7eed" method="POST">
+         <div class="ml-3" id="30fbcfd5-80fa-4247-a45d-774d660ee86a">
+          <form enctype="multipart/form-data" id="1fec57c5-51dc-4523-bd91-9b960b1f9b7a" method="POST">
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="ce6e8e6d-9a41-435b-82df-8e0a1464517f">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="002e5def-8039-4ee1-893b-061537a085e4">
              Selector1
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <select autocomplete="off" class="form-control" id="ce6e8e6d-9a41-435b-82df-8e0a1464517f" name="choice">
-              <option id="bfbacaaa-eded-44ab-a24d-c2607ab66a55" value="1">
+             <select autocomplete="off" class="form-control" id="002e5def-8039-4ee1-893b-061537a085e4" name="choice">
+              <option id="37d3bba3-4a76-4c03-8550-822cb217d7e7" value="1">
                One
               </option>
-              <option id="32957a59-ff1d-4897-83f3-2853c26cafba" selected="" value="2">
+              <option id="6f82c10b-8aa9-4195-b7df-108f9752f1ef" selected="" value="2">
                Two
               </option>
-              <option disabled="" id="3e798da8-9609-4cfe-993b-5bf39b76d5e6" value="3">
+              <option disabled="" id="6e33428b-ac7c-4ecc-ae22-7e6ae02a4510" value="3">
                Three
               </option>
              </select>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="e90c524f-cf5f-43bf-a569-4b2ca07ecf25">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="2ad4ab56-3f2b-410b-a40e-71ae0b54003d">
              Selector2
             </label>
             <div class="col-sm-10 d-flex align-items-center">
-             <select autocomplete="off" class="form-control" disabled="" id="e90c524f-cf5f-43bf-a569-4b2ca07ecf25" name="choice">
-              <option id="bfbacaaa-eded-44ab-a24d-c2607ab66a55" value="1">
+             <select autocomplete="off" class="form-control" disabled="" id="2ad4ab56-3f2b-410b-a40e-71ae0b54003d" name="choice">
+              <option id="37d3bba3-4a76-4c03-8550-822cb217d7e7" value="1">
                One
               </option>
-              <option id="32957a59-ff1d-4897-83f3-2853c26cafba" selected="" value="2">
+              <option id="6f82c10b-8aa9-4195-b7df-108f9752f1ef" selected="" value="2">
                Two
               </option>
-              <option disabled="" id="3e798da8-9609-4cfe-993b-5bf39b76d5e6" value="3">
+              <option disabled="" id="6e33428b-ac7c-4ecc-ae22-7e6ae02a4510" value="3">
                Three
               </option>
              </select>
@@ -4206,31 +4206,31 @@ Form(
            </div>
           </form>
          </div>
-         <div class="mt-5" id="5b2bf191-305a-4136-b8cc-eda30cf690fb">
-          <div class="d-flex justify-content-between" id="82af2a11-7433-44ac-947c-06f078220eb3">
-           <h4 id="ca358b80-a8fd-4021-8efc-23e7ffc1120c">
+         <div class="mt-5" id="774b4386-c2ea-4d05-ae79-d84f5ddcf846">
+          <div class="d-flex justify-content-between" id="75932936-c7dc-458a-b84f-ee7005ec9d2a">
+           <h4 id="58850d11-f2ab-4bd9-be70-1307f98bb35c">
             Method
-            <span class="text-primary" id="619a8774-76d4-4665-940e-3317dd84b75e">
+            <span class="text-primary" id="77117afd-882d-4985-b2c9-b69aa2d8057f">
              as_radio
             </span>
            </h4>
-           <div id="c2c26e2a-4540-42ab-b733-b3de025d7259">
-            <button class="btn-sm btn btn-outline-primary" data-target="#c3aa98ac-496f-4dd8-9957-862ab2cc1f4c" data-toggle="collapse" id="3a551fc1-1258-4d91-aecb-03f36d780ce2" onclick="return false;" type="button">
+           <div id="73827b2b-691f-4720-9057-440483ee56e2">
+            <button class="btn-sm btn btn-outline-primary" data-target="#ecaabfbb-3332-46f6-9301-31f7b473c3f0" data-toggle="collapse" id="685cc43a-4b2b-4530-8440-15b13ddb1eac" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="b5b49123-1097-411c-9073-2ffc8790f2c7">
+          <span class="text-muted" id="b08ca38a-5389-4307-ad36-23b50814ff67">
            Makes selection in a form of radio buttons.
           </span>
-          <pre id="729fdbe3-0dd9-4ec4-93bd-f91775e3bc0d"><code a="" c="" l="" s=" p y t h o n ">as_radio()</code></pre>
-          <div class="ml-3 collapse" id="c3aa98ac-496f-4dd8-9957-862ab2cc1f4c">
-           <h6 id="f87f9b09-0ae2-4500-ade3-494826aab63e">
+          <pre id="1d93d9a5-c37c-42f8-a22f-47c95bb1d46b"><code a="" c="" l="" s=" p y t h o n ">as_radio()</code></pre>
+          <div class="ml-3 collapse" id="ecaabfbb-3332-46f6-9301-31f7b473c3f0">
+           <h6 id="b41bf420-5666-4fe0-a156-7d699beaa96a">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="2d7cdfe6-0f23-4a33-832c-ffd47eca7c53">
+           <table class="table table-sm bg-light" id="adcbe53a-04b2-4163-848e-e666bca5f437">
             <thead>
              <tr>
               <th scope="col">
@@ -4263,13 +4263,13 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="943cd65a-dedd-4dbb-aa8e-1c7db1046a79">
-           <h6 id="b3405d9d-65cd-4c4c-b3df-93bbf5138a75">
+          <div class="ml-3" id="2c570c39-10b7-4fd6-85e4-630aa458bde6">
+           <h6 id="3a725c59-61c1-4a8d-8a24-00dfb0f63785">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="beae02b9-d410-4016-bfb3-30e1d1a41c4b"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, SelectInput
+           <pre id="6dc15819-0bd4-4f3f-95f7-827fc3c44ffa"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, SelectInput
 
 options = [
     SelectInput.Option('One', 1),
@@ -4281,28 +4281,28 @@ Form(
     SelectInput('Selector', 'choice', 2, options).as_radio()
 )</code></pre>
           </div>
-          <div class="ml-3" id="f2ea16d2-de8b-4a05-abd6-772ee9d8c6d9">
-           <form enctype="multipart/form-data" id="417536b8-c896-474f-b69f-cb99c9105afe" method="POST">
+          <div class="ml-3" id="a6ae9d4a-3091-403e-8e8d-5643633464c4">
+           <form enctype="multipart/form-data" id="a4afc51b-4c3f-430c-beda-3cf7778dcca3" method="POST">
             <div class="form-group row">
-             <label class="col-sm-2 col-form-label d-flex align-items-center" for="4eeb523c-f940-463d-a04a-64b17a08e5a2">
+             <label class="col-sm-2 col-form-label d-flex align-items-center" for="a30abcda-224a-49c5-af25-cef83dc524f6">
               Selector
              </label>
              <div class="col-sm-10 d-flex align-items-center">
               <div class="form-check mr-3">
-               <input autocomplete="off" class="form-check-input" id="72eb6ab1-fcd2-4887-957a-484be488d305" name="choice" type="radio" value="1"/>
-               <label class="form-check-label mr-1" for="72eb6ab1-fcd2-4887-957a-484be488d305">
+               <input autocomplete="off" class="form-check-input" id="6a838e43-c520-49c1-845b-777727a7f635" name="choice" type="radio" value="1"/>
+               <label class="form-check-label mr-1" for="6a838e43-c520-49c1-845b-777727a7f635">
                 One
                </label>
               </div>
               <div class="form-check mr-3">
-               <input autocomplete="off" checked="" class="form-check-input" id="dcb98230-8388-4029-bd61-104fe34c6a89" name="choice" type="radio" value="2"/>
-               <label class="form-check-label mr-1" for="dcb98230-8388-4029-bd61-104fe34c6a89">
+               <input autocomplete="off" checked="" class="form-check-input" id="813f5a1b-5474-4e33-959c-d6177086af88" name="choice" type="radio" value="2"/>
+               <label class="form-check-label mr-1" for="813f5a1b-5474-4e33-959c-d6177086af88">
                 Two
                </label>
               </div>
               <div class="form-check mr-3">
-               <input autocomplete="off" class="form-check-input" disabled="" id="f7fe3d95-c4ac-485a-8920-2e208611b638" name="choice" type="radio" value="3"/>
-               <label class="form-check-label mr-1" for="f7fe3d95-c4ac-485a-8920-2e208611b638">
+               <input autocomplete="off" class="form-check-input" disabled="" id="f21c8d52-c74f-492e-a850-f2ea8e0fca8d" name="choice" type="radio" value="3"/>
+               <label class="form-check-label mr-1" for="f21c8d52-c74f-492e-a850-f2ea8e0fca8d">
                 Three
                </label>
               </div>
@@ -4313,38 +4313,38 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="2d391801-6ee1-40d2-810a-df41c3cec9ba">
-        <div class="mt-5" id="64dc4a63-2581-471f-9172-59a48599613e">
-         <div class="d-flex justify-content-between" id="df450ce5-cfab-44a5-9d65-195f503acc10">
-          <h1 id="97cad4c6-5c66-4f29-b7cf-4e04ec3e7fb1">
+       <div class="tab-pane fade" id="4a7b402d-bf54-41e1-b279-145b84fa7359">
+        <div class="mt-5" id="38730cbc-56d1-4b66-a6db-ab06d726cde9">
+         <div class="d-flex justify-content-between" id="eb76dbf0-d0b7-460d-819c-3f883af07725">
+          <h1 id="95d650ba-46fe-43f7-b8b4-497702ca5573">
            Class
-           <span class="text-primary" id="5902611f-97fc-4e87-a6d1-15640774a266">
-            <span id="3a542ce3-a4c3-43b1-a0b1-60c0c6ce97ee">
+           <span class="text-primary" id="6dd589f9-5869-431a-9bcc-9159d4e0a984">
+            <span id="7d0972c8-8266-40dc-928c-1ad15f6b997d">
              SelectInput.Option
             </span>
            </span>
           </h1>
-          <div id="9cda3a50-93ce-469a-9569-05be88187699">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#95ced7e3-82da-489a-aacc-e0deba7baa80" data-toggle="collapse" id="efa601fb-fc5e-4100-814c-4d3f6d83b584" onclick="return false;" type="button">
+          <div id="8674017d-8309-4bfe-b00e-2cf06bc7ded9">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#233fb05d-dc58-4dee-a6f2-600a69c7a538" data-toggle="collapse" id="e2f05405-d8dc-4af1-977d-5fc37535d232" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="3f749330-028c-403e-bf4b-9f650ec9d2fa">
+         <span class="text-muted" id="f245efa7-cd7c-4bb1-bf64-db1c9ee63a8b">
           An option used by
           <code>
            SelectInput
           </code>
           .
          </span>
-         <pre id="ce3d1b72-fbf0-4df8-997c-25876a1f4875"><code a="" c="" l="" s=" p y t h o n ">SelectInput.Option(name, value, disabled=False)</code></pre>
-         <div class="ml-3 collapse" id="95ced7e3-82da-489a-aacc-e0deba7baa80">
-          <h6 id="593a8d67-6a10-45d3-bccd-0e29bd2412f0">
+         <pre id="bfe4b551-0805-4721-b56a-c5da9ba5715c"><code a="" c="" l="" s=" p y t h o n ">SelectInput.Option(name, value, disabled=False)</code></pre>
+         <div class="ml-3 collapse" id="233fb05d-dc58-4dee-a6f2-600a69c7a538">
+          <h6 id="fc5009f9-c384-4339-a126-7ca845b5d265">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="8224bf96-b1e9-44dc-9f32-411e03350471">
+          <table class="table table-sm bg-light" id="5888a150-a99d-4b53-bcff-305ad39f3d07">
            <thead>
             <tr>
              <th scope="col">
@@ -4411,69 +4411,69 @@ Form(
            </tbody>
           </table>
          </div>
-         <div class="mt-5" id="dce6a8e0-250e-4ac9-ad24-a137f1c6a3a7">
-          <h4 id="8b33267d-2943-4e4b-929e-b95f9c4276ba">
+         <div class="mt-5" id="87ca6e30-0402-4c3c-b238-a7b305124132">
+          <h4 id="edd2097e-ed05-4ade-8fd7-70953cdd3d7f">
            Property
-           <span class="text-primary" id="9b6c1274-25b3-431d-9c3f-df48e04699ad">
+           <span class="text-primary" id="1ecd4e4f-59e6-457b-87d9-1315e9e77f8f">
             disabled
            </span>
           </h4>
-          <span class="text-muted" id="d912d2e1-1f85-4154-bb1f-1b8b144f0fcf">
+          <span class="text-muted" id="76135835-8c8a-448c-8cab-3e25dbfecf4f">
            None
           </span>
          </div>
-         <div class="mt-5" id="33129376-27d6-42a4-9429-93a9bf7db79c">
-          <h4 id="87f922d5-0efa-4060-a3b1-c37af1338850">
+         <div class="mt-5" id="30fc73da-6f06-4a21-9af6-5b8297fd8be5">
+          <h4 id="1e97cbf4-3298-49ad-8f87-1aed9a5321c9">
            Property
-           <span class="text-primary" id="87b6227e-5ec0-4cc1-bd82-81ed9b556ad9">
+           <span class="text-primary" id="60a3eec4-d94e-4715-a62e-9dbf3b99f51f">
             name
            </span>
           </h4>
-          <span class="text-muted" id="0709a51b-11ce-4e17-a7a6-aacc91fc41ee">
+          <span class="text-muted" id="31918e93-b7a1-4f37-9d8a-ae1d01f94617">
            None
           </span>
          </div>
-         <div class="mt-5" id="f3ee17f4-12b9-447c-8372-b982cb7114f9">
-          <h4 id="d1b6596f-386b-4f0a-9af2-60190224b904">
+         <div class="mt-5" id="5eda7913-46be-4ff6-859b-185ea14bed88">
+          <h4 id="fc9815a3-73ad-45fb-8e27-9f19a4540068">
            Property
-           <span class="text-primary" id="bd43297e-7384-4874-b553-aaaf9d6ecc77">
+           <span class="text-primary" id="9f2e3cd8-fa95-4b08-81dc-29e41d5ab5ed">
             value
            </span>
           </h4>
-          <span class="text-muted" id="b32868f7-12ad-499d-9abe-fa7f73a7272a">
+          <span class="text-muted" id="2aded36e-72d9-400f-a367-39d2ce5ac475">
            None
           </span>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="fe8f9436-f35f-4777-8786-fc27b467306d">
-        <div class="mt-5" id="759986e2-8a20-4b41-8ad1-aa143b596c51">
-         <div class="d-flex justify-content-between" id="c0569f7a-efe6-43cc-bf57-a743b1bc511e">
-          <h1 id="87a1b7ed-b6f0-440a-91d6-55f9661b3dc3">
+       <div class="tab-pane fade" id="e24703ed-25e2-4c12-afed-4d1385d74710">
+        <div class="mt-5" id="4d22c65a-c1a8-46e9-ab28-c0ed0b71f9a4">
+         <div class="d-flex justify-content-between" id="2d252c1e-6545-4e33-801f-1b0d89dd510f">
+          <h1 id="f7e6df8b-849c-4269-8184-5ecb1c03182d">
            Class
-           <span class="text-primary" id="845b0a27-c19f-4330-a3f5-6255527c1855">
-            <span id="425793e1-2169-4ec8-ba91-e614bb64eb28">
+           <span class="text-primary" id="b29d63d2-1321-435b-aa76-dc2a8f0d045d">
+            <span id="6f04aba9-d6d3-4942-b022-e377891773dd">
              HiddenInput
             </span>
            </span>
           </h1>
-          <div id="36d8d101-b739-45ca-8679-701d3794d749">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#d40c41dc-7cde-4586-a6a6-027f76c4f650" data-toggle="collapse" id="c8af4451-b293-4264-86ce-48ceb7b56505" onclick="return false;" type="button">
+          <div id="0882cc83-a632-4774-acb7-aac736bb3ffb">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#bf265a9f-be74-4bb4-8dc9-2ad7fd303a4f" data-toggle="collapse" id="8c6d9a9c-0a50-4b2b-b2f7-6a3faccea054" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="7f801280-b8a7-4356-a755-de552e3a0b3a">
+         <span class="text-muted" id="0b250c4d-ea84-4ff7-a250-7727417f3851">
           A hidden input.
          </span>
-         <pre id="99dd1e1c-0326-4b19-8c24-bdb30c5aaf15"><code a="" c="" l="" s=" p y t h o n ">HiddenInput(name, value=None)</code></pre>
-         <div class="ml-3 collapse" id="d40c41dc-7cde-4586-a6a6-027f76c4f650">
-          <h6 id="a13a7e4c-0771-48e2-bc8b-095e51065a91">
+         <pre id="7e4a1f34-6a84-441b-a391-bc906ff9349f"><code a="" c="" l="" s=" p y t h o n ">HiddenInput(name, value=None)</code></pre>
+         <div class="ml-3 collapse" id="bf265a9f-be74-4bb4-8dc9-2ad7fd303a4f">
+          <h6 id="029dc6a1-2f8f-4f9f-b3ad-7a521631afbb">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="7e12ce9b-09f0-4fda-bbfe-6674bcfbd4d2">
+          <table class="table table-sm bg-light" id="1dd6693d-b50f-44a2-854a-d5606ef218ed">
            <thead>
             <tr>
              <th scope="col">
@@ -4521,13 +4521,13 @@ Form(
            </tbody>
           </table>
          </div>
-         <div class="ml-3" id="1e67ff0e-6abe-4770-b2c6-34e7fe3f657c">
-          <h6 id="eff5282f-444a-443e-9ff8-506b243b14aa">
+         <div class="ml-3" id="81792cea-04f9-41e9-a0e3-dba33da97760">
+          <h6 id="84620bd0-245a-46e7-9765-e9703e68a261">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="d18f41c0-d7c5-4d01-8584-5e007b2fc10c"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, SelectInput
+          <pre id="ab7ccf55-a647-48fa-b6f1-e4835fbba487"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, SelectInput
 
 Form(
     HiddenInput('token', '123')
@@ -4535,34 +4535,34 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="c3233caf-78a1-4c8e-a7d3-3944cef20f08">
-        <div class="mt-5" id="18c8206c-0dd5-4fc4-8fc2-26d32cc09fde">
-         <div class="d-flex justify-content-between" id="52c4da5d-1483-4c41-ab07-04d534967722">
-          <h1 id="c238a198-0a5d-421c-a9ee-ba920d37bbdb">
+       <div class="tab-pane fade" id="14f7cd0d-d87e-4216-bb6c-a3c990de28f9">
+        <div class="mt-5" id="e7fb7839-ea94-46d2-80af-a434f07283b0">
+         <div class="d-flex justify-content-between" id="aa98d223-a781-4b51-91ae-7bcdc8129551">
+          <h1 id="e3e84588-e414-4074-b8bf-293e7044df63">
            Class
-           <span class="text-primary" id="7c76b46d-5869-4468-8420-bd8b8e62112a">
-            <span id="0f8aeeaa-61b7-4847-ab14-ed75154ba28c">
+           <span class="text-primary" id="f78592ee-9f1e-4f7f-8557-34a33cec7ddb">
+            <span id="2a3cfa17-99ba-441c-8554-7f6f07d7b41a">
              FileInput
             </span>
            </span>
           </h1>
-          <div id="881b7d1c-289c-4855-af7e-8231c35525a6">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#8062cd0f-658a-440b-a883-204dbb1bd03c" data-toggle="collapse" id="e1c2df20-665c-4118-a545-5f1ee8dc2bc4" onclick="return false;" type="button">
+          <div id="2da5b002-27f0-4277-934f-7008aed1fbde">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#d9a693d9-67d8-497f-a7b5-a4c8f268efe8" data-toggle="collapse" id="e07942bc-4e97-444c-aac3-0c4562a8a1cc" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="e747e5b5-f94f-4f4e-9594-e7f63913f4b7">
+         <span class="text-muted" id="fe12ae95-e788-4b45-9a7b-0f40ef0a6949">
           A file input.
          </span>
-         <pre id="bd9c69aa-473a-4e9f-9e5b-de77e44e009d"><code a="" c="" l="" s=" p y t h o n ">FileInput(label, name)</code></pre>
-         <div class="ml-3 collapse" id="8062cd0f-658a-440b-a883-204dbb1bd03c">
-          <h6 id="80a1e431-ae4e-4214-8426-a33e37121761">
+         <pre id="99666ee3-7924-4224-baff-248bae965865"><code a="" c="" l="" s=" p y t h o n ">FileInput(label, name)</code></pre>
+         <div class="ml-3 collapse" id="d9a693d9-67d8-497f-a7b5-a4c8f268efe8">
+          <h6 id="880bea55-9f8c-491b-9024-a55d33bebc2e">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="a99d7428-4072-451a-90b1-8de7662a0a45">
+          <table class="table table-sm bg-light" id="6558c74b-13d1-44c5-a3f7-c603805555a8">
            <thead>
             <tr>
              <th scope="col">
@@ -4610,7 +4610,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="cc21fd0d-adeb-4241-afa3-9c8f61072de8">
+         <p id="238261ab-c2be-4bc1-94c7-a0fbe8a48614">
           Use the
           <code>
            as_disabled()
@@ -4622,23 +4622,23 @@ Form(
           </code>
           component.
          </p>
-         <div class="ml-3" id="3d9a5145-b21c-412b-a31b-8ad023ea41a2">
-          <h6 id="104a83e5-d329-4154-bb28-be13e040d4e3">
+         <div class="ml-3" id="2ee8d172-79c8-4cf3-9c11-da0e5988f9c8">
+          <h6 id="fdd75a19-c942-4375-8e07-7794da071f78">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="8b81de0c-a887-410e-9630-c10b7703b4e3"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, FileInput
+          <pre id="23895aa3-1cdc-46da-82c3-57245c5ac235"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Form, FileInput
 
 output = Form(
     FileInput('File', 'file'),
     FileInput('File', 'file').as_disabled()
 )</code></pre>
          </div>
-         <div class="ml-3" id="7c693df0-bc19-408c-959d-b33d936f50cc">
-          <form enctype="multipart/form-data" id="07c6ad43-d107-4e51-bced-4737a08c2272" method="POST">
+         <div class="ml-3" id="4613a1c4-47c2-466b-a491-a1e5f6d8c172">
+          <form enctype="multipart/form-data" id="83406672-be5c-4a09-b867-8dff0d9dc3ae" method="POST">
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="595dd740-8c98-4c18-a444-01547ea14dc1">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="870e2dd8-1bb3-4229-a428-58bdfaba4159">
              File
             </label>
             <div class="col-sm-10 d-flex align-items-center">
@@ -4649,13 +4649,13 @@ output = Form(
                <span class="btn btn-secondary" onclick="$(this).parent().find('input[type=file]').click();">
                 Browse
                </span>
-               <input id="595dd740-8c98-4c18-a444-01547ea14dc1" name="file" onchange="$(this).parent().parent().find('.form-control').html($(this).val().split(/[\|/]/).pop());" style="display: none;" type="file"/>
+               <input id="870e2dd8-1bb3-4229-a428-58bdfaba4159" name="file" onchange="$(this).parent().parent().find('.form-control').html($(this).val().split(/[\|/]/).pop());" style="display: none;" type="file"/>
               </div>
              </div>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-2 col-form-label d-flex align-items-center" for="ecca2c7f-c7ed-4ee4-9da5-e86c69b033ac">
+            <label class="col-sm-2 col-form-label d-flex align-items-center" for="60cd577c-fa57-411f-be95-9dcf5d4371fd">
              File
             </label>
             <div class="col-sm-10 d-flex align-items-center">
@@ -4666,7 +4666,7 @@ output = Form(
                <span class="btn btn-secondary disabled" onclick="$(this).parent().find('input[type=file]').click();">
                 Browse
                </span>
-               <input disabled="" id="ecca2c7f-c7ed-4ee4-9da5-e86c69b033ac" name="file" onchange="$(this).parent().parent().find('.form-control').html($(this).val().split(/[\|/]/).pop());" style="display: none;" type="file"/>
+               <input disabled="" id="60cd577c-fa57-411f-be95-9dcf5d4371fd" name="file" onchange="$(this).parent().parent().find('.form-control').html($(this).val().split(/[\|/]/).pop());" style="display: none;" type="file"/>
               </div>
              </div>
             </div>
@@ -4678,23 +4678,23 @@ output = Form(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="0b618d84-e60e-4d16-ad29-ed66144295c9">
-     <div id="b38da468-b29e-4129-b627-f412abbdf42c">
+    <div class="tab-pane fade" id="a536556e-c460-4ba4-8447-6c1d3a9a32f6">
+     <div id="032f4f62-3b34-441e-9423-16b585effa7a">
       <hr/>
-      <ul class="nav" id="7a3ea520-ddec-4615-9d83-6c86e87b86f4" role="tablist">
+      <ul class="nav" id="7a10e418-5bf3-4b20-833f-428f680404ba" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-target="#b11e72fe-97bf-48ef-b6f8-8b778e76db0a" data-toggle="tab" href="#b11e72fe-97bf-48ef-b6f8-8b778e76db0a" id="6ddb9bb5-d880-45b4-b5d1-1f9a66d82563">
-         <span class="text-secondary" id="253d085a-87c5-42db-8c33-5aee4731ba71">
-          <span id="8d9a37ad-067b-4b31-af4c-f8d3e7baf4eb">
+        <a class="nav-link active" data-target="#1aaba99f-18d8-4aa3-a9fe-359fab591639" data-toggle="tab" href="#1aaba99f-18d8-4aa3-a9fe-359fab591639" id="e21f1dfa-d314-4aa4-a3be-d43e1e7e9e4b">
+         <span class="text-secondary" id="440236a9-3cb9-4d9a-a374-c723e29ff540">
+          <span id="23766bce-1b5c-4918-aea9-1b0e37b04075">
            Icon
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#81095314-c0f2-40f4-9770-ff948cb9436c" data-toggle="tab" href="#81095314-c0f2-40f4-9770-ff948cb9436c" id="c4000aa9-48d3-48d3-a8f2-bb2ff60b62fe">
-         <span class="text-secondary" id="a0d9c8f6-c85d-4c1c-b75c-fe637c9b3fbd">
-          <span id="0760053a-d59c-463a-85d5-cafff96a0a02">
+        <a class="nav-link" data-target="#5fba614f-6c22-490c-9c9e-5398cd6df5b7" data-toggle="tab" href="#5fba614f-6c22-490c-9c9e-5398cd6df5b7" id="215ca2d3-c7e8-45f0-80ab-760d5416d84c">
+         <span class="text-secondary" id="0cdf8443-d2fd-48ad-af91-96b72451d1f6">
+          <span id="bd613164-7ee5-4d48-9e62-ff6a161a5859">
            Spinner
           </span>
          </span>
@@ -4702,34 +4702,34 @@ output = Form(
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="b11e72fe-97bf-48ef-b6f8-8b778e76db0a">
-        <div class="mt-5" id="38d41849-22cd-4e49-b483-2ccde7f8d5d8">
-         <div class="d-flex justify-content-between" id="460d964c-d94a-4c5c-a21d-dd8599686b9d">
-          <h1 id="e408a62f-8408-4c59-b36f-82a123d83dd0">
+       <div class="tab-pane fade active show" id="1aaba99f-18d8-4aa3-a9fe-359fab591639">
+        <div class="mt-5" id="63cb6755-5290-497b-9132-6c429480047f">
+         <div class="d-flex justify-content-between" id="a9f6a629-65a7-4954-8125-8914109e1f08">
+          <h1 id="83559ece-c106-4bd7-9d8a-2e93d0482c0b">
            Class
-           <span class="text-primary" id="c8df3459-639f-4a74-9bc6-76c2ce579714">
-            <span id="8d9a37ad-067b-4b31-af4c-f8d3e7baf4eb">
+           <span class="text-primary" id="8c637cff-3248-41ab-9883-c552a51cd207">
+            <span id="23766bce-1b5c-4918-aea9-1b0e37b04075">
              Icon
             </span>
            </span>
           </h1>
-          <div id="758921c8-e81e-4ed3-b0b5-8846d519d628">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#64eae0a6-8320-49e9-81e4-a83052264fa4" data-toggle="collapse" id="087281f8-dc8a-42ec-9fd8-27b53a4a01a4" onclick="return false;" type="button">
+          <div id="b43e2241-7505-4bb8-8a52-4faa13449afb">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#c41efe21-0e30-4971-a1bc-c80e6f6df507" data-toggle="collapse" id="511ae307-0462-4afa-ab29-00c2849229b2" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="2719ede2-9e11-4550-a85b-36de93400fb7">
+         <span class="text-muted" id="26c8d3e7-cc7f-4cb1-b1b2-7db8c3e559e6">
           An icon.
          </span>
-         <pre id="f743cdcd-c43b-4a55-9d59-5111556f92c7"><code a="" c="" l="" s=" p y t h o n ">Icon(name)</code></pre>
-         <div class="ml-3 collapse" id="64eae0a6-8320-49e9-81e4-a83052264fa4">
-          <h6 id="8a641678-4658-4d43-bb3e-3660634e2e42">
+         <pre id="c229b4f6-5c82-4509-8a3a-d579f1266e12"><code a="" c="" l="" s=" p y t h o n ">Icon(name)</code></pre>
+         <div class="ml-3 collapse" id="c41efe21-0e30-4971-a1bc-c80e6f6df507">
+          <h6 id="733b90e0-29af-4197-9615-d2ce0995a216">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="81756b3f-fbd8-4e48-b05a-d927aa7ce7a4">
+          <table class="table table-sm bg-light" id="57a56bf2-b488-445c-b1ba-60180c0511dc">
            <thead>
             <tr>
              <th scope="col">
@@ -4762,13 +4762,13 @@ output = Form(
            </tbody>
           </table>
          </div>
-         <div class="ml-3" id="dbbc3cdc-9e8f-4a84-8925-935bc4f593b3">
-          <h6 id="60fae168-31e5-4e80-a614-27c7534e23e6">
+         <div class="ml-3" id="438d6303-32a6-4890-96b9-02bd51103659">
+          <h6 id="3e7261a5-fff7-45ba-afb2-cdd17dad4a50">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="b0e836a1-f383-4a97-adc6-25805c833e7e"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Icon
+          <pre id="6cf47bd8-2096-4df0-8ede-ad3a22ff8611"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Icon
 
 Icon("fas fa-folder")
 Icon("fas fa-folder").as_primary()
@@ -4780,55 +4780,55 @@ Icon("fas fa-folder").as_info()
 Icon("fas fa-folder").as_light()
 Icon("fas fa-folder").as_dark()</code></pre>
          </div>
-         <div class="ml-3" id="5047cdbf-c0ea-47fa-bc6d-a58e44e3df91">
-          <div id="9c7cd5cd-79b0-457c-86d6-9e66e5c5df23">
-           <i class="fas fa-folder" id="bb512c53-bd23-4e5a-a7c1-eff9dd13cf6f">
+         <div class="ml-3" id="d2f70836-c71c-4aa4-8756-ac829a06167c">
+          <div id="014263a5-9dd5-42e3-82d9-d6cadc6cf2b4">
+           <i class="fas fa-folder" id="355f1f49-2678-4b19-875b-c4bbe98e0d36">
            </i>
-           <i class="fas fa-folder text-primary" id="e564804e-5227-441d-9cc8-0f89a0433b5a">
+           <i class="fas fa-folder text-primary" id="b558fae7-682b-47f5-b5eb-dc0d3dc5c6a9">
            </i>
-           <i class="fas fa-folder text-secondary" id="b2275193-b2b9-437a-b663-aeda9acd2bc1">
+           <i class="fas fa-folder text-secondary" id="7cd3356e-6ab5-4788-837a-e12dba61504a">
            </i>
-           <i class="fas fa-folder text-success" id="d39227aa-fe26-4add-aeff-d6a0a81bde55">
+           <i class="fas fa-folder text-success" id="e56fc8a0-4abc-43a4-9bc5-fb02f3248eed">
            </i>
-           <i class="fas fa-folder text-warning" id="366fbde3-284a-44cf-80ea-86c67cbe17db">
+           <i class="fas fa-folder text-warning" id="f5220665-9676-4566-bb3a-83a4bafa6926">
            </i>
-           <i class="fas fa-folder text-danger" id="d766ff23-93ae-4d39-86d1-de3e7afc20d6">
+           <i class="fas fa-folder text-danger" id="497c0774-f553-4f0a-bece-38a413679866">
            </i>
-           <i class="fas fa-folder text-info" id="ca25e67f-02cc-47e8-83ea-ed1fc43e491c">
+           <i class="fas fa-folder text-info" id="6e96f3ae-cd84-422f-98f6-df0645d15cbd">
            </i>
-           <i class="fas fa-folder text-light" id="f2dfea20-e586-4ca4-be31-897de2925664">
+           <i class="fas fa-folder text-light" id="81b322b1-5d9c-4d91-8fcb-8bbea0e90c72">
            </i>
-           <i class="fas fa-folder text-dark" id="897a17bd-53b0-4f9f-b2f2-1405bfe38c15">
+           <i class="fas fa-folder text-dark" id="11450e96-3ca2-41cd-8fc2-358b321245aa">
            </i>
           </div>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="81095314-c0f2-40f4-9770-ff948cb9436c">
-        <div class="mt-5" id="41674162-ce9c-483f-8a5c-ada190fd08bd">
-         <div class="d-flex justify-content-between" id="2cbf7b58-54b2-4853-8d56-c414d8f07366">
-          <h1 id="215f2b07-0dc0-43eb-8dc0-18c0655926e6">
+       <div class="tab-pane fade" id="5fba614f-6c22-490c-9c9e-5398cd6df5b7">
+        <div class="mt-5" id="c861a8dc-ed38-4e0d-aaa8-a9f70a8d4603">
+         <div class="d-flex justify-content-between" id="ea727693-e51a-460e-8d86-f3d665825eec">
+          <h1 id="891ef033-07ae-4b5b-a7b2-6113b5bc8d67">
            Class
-           <span class="text-primary" id="ace0dda1-a31d-4e02-84e3-b761946fd525">
-            <span id="0760053a-d59c-463a-85d5-cafff96a0a02">
+           <span class="text-primary" id="f715dad6-864f-439a-b17f-c357b69f4f8e">
+            <span id="bd613164-7ee5-4d48-9e62-ff6a161a5859">
              Spinner
             </span>
            </span>
           </h1>
-          <div id="f997297d-57e8-4719-8bda-a6a243e47488">
+          <div id="bfd79f32-8885-43fa-915b-25a29100666a">
           </div>
          </div>
-         <span class="text-muted" id="736a9836-6833-4df8-bdfb-25e6c1082a64">
+         <span class="text-muted" id="4feaf07f-1284-4fda-9663-098c15058a71">
           A spinner icon.
          </span>
-         <pre id="ea54c2c5-e033-4f8c-bd92-bb9a272461c4"><code a="" c="" l="" s=" p y t h o n ">Spinner()</code></pre>
-         <div class="ml-3" id="9b345735-c79f-411c-aaaf-e26cc1595d68">
-          <h6 id="c72d8f98-82ff-4838-b0d1-c7faaa694831">
+         <pre id="66abeead-ae74-425c-8b35-09989523a3d6"><code a="" c="" l="" s=" p y t h o n ">Spinner()</code></pre>
+         <div class="ml-3" id="a4bacffd-d228-4903-9d5c-0359a0ca0f22">
+          <h6 id="1526ab4e-e379-47f9-8bb1-73a6092f5250">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="0dc1d0f5-8bb2-4828-90cf-228fdfbfac45"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Spinner
+          <pre id="3414ed80-cb49-46b2-a514-581d355d2d1a"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Spinner
 
 Spinner()
 Spinner().as_primary()
@@ -4840,9 +4840,9 @@ Spinner().as_info()
 Spinner().as_light()
 Spinner().as_dark()</code></pre>
          </div>
-         <div class="ml-3" id="6888922c-b06d-48cf-93bc-f8d610c4f7bf">
-          <div id="23b43fb2-8f88-45fb-8c06-8e1eaca4ff7d">
-           <span class="spinner" id="452210a0-0b77-4b33-a7d7-6086bf819cf2">
+         <div class="ml-3" id="fefd1436-440b-4362-be89-826149fe9230">
+          <div id="de7609fa-a211-46be-b79a-b1d905708f8a">
+           <span class="spinner" id="0fcf98f3-1d6c-4468-9424-910af11a4f7e">
            </span>
            <style>
             @keyframes spinner-border {
@@ -4861,7 +4861,7 @@ Spinner().as_dark()</code></pre>
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-primary" id="2541289c-de64-4663-9571-37383a0b2631">
+           <span class="spinner text-primary" id="ee801ded-672e-4815-8a66-c5318a9f4fe7">
            </span>
            <style>
             @keyframes spinner-border {
@@ -4880,7 +4880,7 @@ Spinner().as_dark()</code></pre>
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-secondary" id="697c2701-98da-4c91-aaed-0ece5afaba67">
+           <span class="spinner text-secondary" id="515d5537-9bd0-4456-874a-5b26c7680915">
            </span>
            <style>
             @keyframes spinner-border {
@@ -4899,7 +4899,7 @@ Spinner().as_dark()</code></pre>
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-success" id="30ffc296-63a6-4d34-9a76-fa6b44a783e5">
+           <span class="spinner text-success" id="d6043aa7-7005-442d-ba87-f4a8b772ffe9">
            </span>
            <style>
             @keyframes spinner-border {
@@ -4918,7 +4918,7 @@ Spinner().as_dark()</code></pre>
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-warning" id="d13878a3-afc6-4005-aabd-b992e11fd160">
+           <span class="spinner text-warning" id="67bc2ceb-fdec-4a92-b5eb-d2517709c475">
            </span>
            <style>
             @keyframes spinner-border {
@@ -4937,7 +4937,7 @@ Spinner().as_dark()</code></pre>
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-danger" id="75bcf731-e9f2-49e1-a732-ac4e86a14eb9">
+           <span class="spinner text-danger" id="fb65859d-262a-43c9-80df-331533372808">
            </span>
            <style>
             @keyframes spinner-border {
@@ -4956,7 +4956,7 @@ Spinner().as_dark()</code></pre>
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-info" id="7c9cb82a-9189-435e-b7c2-86415723d609">
+           <span class="spinner text-info" id="65efa615-37c2-45d3-88d2-7b4d159a15bc">
            </span>
            <style>
             @keyframes spinner-border {
@@ -4975,7 +4975,7 @@ Spinner().as_dark()</code></pre>
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-light" id="c9dbf29e-9222-4728-865d-53f0d0c10093">
+           <span class="spinner text-light" id="3825af09-fa4d-4449-a53e-aa76381ece29">
            </span>
            <style>
             @keyframes spinner-border {
@@ -4994,7 +4994,7 @@ Spinner().as_dark()</code></pre>
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-dark" id="19d3531c-b2f0-4c9b-9a8c-5dc8657a2373">
+           <span class="spinner text-dark" id="0bf6c11e-2cb1-41f3-baa4-34c8d59304d8">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5020,34 +5020,34 @@ Spinner().as_dark()</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="7ce619f3-b689-49d7-8897-f6000ec039a7">
-     <div class="mt-5" id="69fa4a55-70d3-47ac-b9ec-3c1d181b85d9">
-      <div class="d-flex justify-content-between" id="ab7cca1d-201f-4ddf-a39c-c8c00c97838a">
-       <h1 id="140a3007-9c42-4735-9830-cf3fcc4b0998">
+    <div class="tab-pane fade" id="2a899b6c-25ef-46fe-a43b-fe17e89bf130">
+     <div class="mt-5" id="11d62908-7c11-4ba8-872c-2c39f3bd2a63">
+      <div class="d-flex justify-content-between" id="4e3d5f50-ea67-496c-b6ba-2a8842b152d2">
+       <h1 id="3fae4a6f-76a7-49f7-8beb-04ed5c4661f0">
         Class
-        <span class="text-primary" id="c1717318-9539-4c22-a1ba-dada69366493">
-         <span id="01a51842-ee62-4673-ad0b-00c4661f4446">
+        <span class="text-primary" id="3fd9e08a-2880-4c17-9177-f194d80dfada">
+         <span id="132b0078-b9db-4ed6-9e99-eeaf74f5e523">
           Image
          </span>
         </span>
        </h1>
-       <div id="72e3c2d0-2727-48b4-a2b6-24e5d0ab305d">
-        <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#baf0b789-7ef6-4a07-8bdb-5196dcb21333" data-toggle="collapse" id="cfa4af9a-c1f4-4c96-b030-67c0ea7785b2" onclick="return false;" type="button">
+       <div id="a515e40c-0073-4014-ba22-f285ac931702">
+        <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#f9b5a002-4181-4f29-a6c3-3d649e77e5e7" data-toggle="collapse" id="82ddd5d6-1b69-4a57-bdb5-c8c3b87d326a" onclick="return false;" type="button">
          Argument
         </button>
        </div>
       </div>
-      <span class="text-muted" id="f29ea318-6a54-4f01-a342-5231661c9ab3">
+      <span class="text-muted" id="66020a4b-a65c-4c20-bcba-ca2863284651">
        A web component for an image.
       </span>
-      <pre id="427163e3-886a-4623-8bbb-ac7208cffe70"><code a="" c="" l="" s=" p y t h o n ">Image(src, width=None, height=None, alt=None)</code></pre>
-      <div class="ml-3 collapse" id="baf0b789-7ef6-4a07-8bdb-5196dcb21333">
-       <h6 id="9ad7c43d-2685-4b32-a74b-1bdf014a2711">
+      <pre id="8fe8b6eb-8807-4e5e-9e0d-abcfcf52361d"><code a="" c="" l="" s=" p y t h o n ">Image(src, width=None, height=None, alt=None)</code></pre>
+      <div class="ml-3 collapse" id="f9b5a002-4181-4f29-a6c3-3d649e77e5e7">
+       <h6 id="281038ba-9f19-4f1f-8658-726e44b02c36">
         <strong>
          Arguments
         </strong>
        </h6>
-       <table class="table table-sm bg-light" id="d1aaa9c3-c3d4-4edd-b2c7-5c42eaa7d328">
+       <table class="table table-sm bg-light" id="2319c53b-5e37-47da-b2e7-deda9f80c334">
         <thead>
          <tr>
           <th scope="col">
@@ -5125,71 +5125,71 @@ Spinner().as_dark()</code></pre>
         </tbody>
        </table>
       </div>
-      <div class="ml-3" id="36516a50-0484-456d-bb1a-035134f338eb">
-       <h6 id="fd8cdefa-a6ff-46c5-90cf-6dc8811ba9e4">
+      <div class="ml-3" id="7c2cc1b8-01ec-4de4-b8cd-e9011d40cd28">
+       <h6 id="428da1d4-203c-42b7-9f41-4a09d0a77a8d">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="440596f6-b4f0-4dce-98df-d0f302ec14b5"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Image
+       <pre id="c27f80e8-8d8e-4248-92e2-f769883ddf77"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Image
 
 Image("logo.png", width=64, height=64, alt="Bootwarp Logo")</code></pre>
       </div>
-      <div class="ml-3" id="1915de36-7597-4394-88b4-12e4ef24d572">
-       <img id="13f3bf9f-2d55-4181-a824-08b45cc6d90e" src="logo.png"/>
+      <div class="ml-3" id="e92249c6-b319-48dc-b889-23725664ea53">
+       <img id="c60aed65-12ad-4f30-bf40-aebfe94baf1f" src="logo.png"/>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="5529eee2-0162-46db-839a-70d895e31fa6">
-     <div id="8552ce76-8b52-4b52-97bc-549adc846c85">
+    <div class="tab-pane fade" id="d4676427-9a33-4626-98f0-ddb9cc21356f">
+     <div id="4552b89c-42cc-4d6b-8a63-0b85ed17b005">
       <hr/>
-      <ul class="nav" id="d734af51-e389-4a52-a686-515be10f99bd" role="tablist">
+      <ul class="nav" id="5fb4534d-3bb4-4bd0-80cb-55c9e01096df" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-target="#a82c831a-87f0-4a2d-8a2d-189082327f69" data-toggle="tab" href="#a82c831a-87f0-4a2d-8a2d-189082327f69" id="f1800604-efda-4cb0-9e29-47f06f6f5063">
-         <span class="text-secondary" id="29aec5b8-37cb-457e-bf5b-0fe9dc6e8b30">
-          <span id="11781dc7-c47d-47ed-ab44-1489bd6fb7bc">
+        <a class="nav-link active" data-target="#bb0d5d9c-f9ee-4d5d-ac5a-0a15c9c68458" data-toggle="tab" href="#bb0d5d9c-f9ee-4d5d-ac5a-0a15c9c68458" id="8194d39c-e69c-4f0f-83e4-d99432ac3ba4">
+         <span class="text-secondary" id="bbf34409-d72c-4a7f-a6ab-fb0dbe6e5dfb">
+          <span id="8b0398aa-5bc8-4cba-8374-b84241091d67">
            Javascript
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#08eedd93-23ec-4c0a-a118-1be35278dae0" data-toggle="tab" href="#08eedd93-23ec-4c0a-a118-1be35278dae0" id="a931c698-e4e9-4dff-9666-f468953d8e31">
-         <span class="text-secondary" id="1bb52943-41fa-46bd-86a8-92dfe4d94a54">
+        <a class="nav-link" data-target="#8a5fa478-8277-42c7-a44c-c701dfbb4a36" data-toggle="tab" href="#8a5fa478-8277-42c7-a44c-c701dfbb4a36" id="cd01c46a-88f8-40cd-9554-029cf20a7913">
+         <span class="text-secondary" id="e58340d2-14f2-4630-b426-10043eb0b4bf">
           jQuery
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="a82c831a-87f0-4a2d-8a2d-189082327f69">
-        <div class="mt-5" id="7d808043-3c70-4ea0-ad51-72afc8c62990">
-         <div class="d-flex justify-content-between" id="300a0b30-227f-43cd-8a76-9c07d4142e51">
-          <h1 id="9a4ba4e9-0f07-427a-9027-e24208f4e9b6">
+       <div class="tab-pane fade active show" id="bb0d5d9c-f9ee-4d5d-ac5a-0a15c9c68458">
+        <div class="mt-5" id="be91b53f-31e4-4cda-9436-8761e9a48a02">
+         <div class="d-flex justify-content-between" id="4ec8bebe-f52d-491e-981a-a291edbb04e6">
+          <h1 id="59352ef8-c63d-43d9-91df-e00f8e1a3c97">
            Class
-           <span class="text-primary" id="68192c17-2994-44c2-8f29-6ceb25966d1b">
-            <span id="11781dc7-c47d-47ed-ab44-1489bd6fb7bc">
+           <span class="text-primary" id="ce504eb7-a648-45a9-a561-cdae85328403">
+            <span id="8b0398aa-5bc8-4cba-8374-b84241091d67">
              Javascript
             </span>
            </span>
           </h1>
-          <div id="87222f6a-f478-4ce2-87af-b30db11eb920">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#65e20a0c-9f2c-4a12-a7e0-5d8ec3355c87" data-toggle="collapse" id="ffc33a60-cf60-4dee-883c-ed64141c9c65" onclick="return false;" type="button">
+          <div id="786e02c7-d01b-41b0-9984-38e65e7a1d47">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#17379929-16fd-400f-8d4c-db5bc468e950" data-toggle="collapse" id="b8e5e6dc-1998-4d21-9ff1-bec6eb7fffbb" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="59678d1e-7453-4d94-97c3-3478f4422466">
+         <span class="text-muted" id="2dd85a1f-c06e-45d6-808b-40ad0bff7eeb">
           A web component for a javascript.
          </span>
-         <pre id="08204caf-fb57-4a50-b523-398050cadf5b"><code a="" c="" l="" s=" p y t h o n ">Javascript(src=None, script=None, submap=None)</code></pre>
-         <div class="ml-3 collapse" id="65e20a0c-9f2c-4a12-a7e0-5d8ec3355c87">
-          <h6 id="f3c99e67-1e9c-4b44-93d8-24cad5e74496">
+         <pre id="8eb8e89c-e508-434c-84e5-8096f523f537"><code a="" c="" l="" s=" p y t h o n ">Javascript(src=None, script=None, submap=None)</code></pre>
+         <div class="ml-3 collapse" id="17379929-16fd-400f-8d4c-db5bc468e950">
+          <h6 id="bffd118a-0dc5-4476-91be-624dc2b5b936">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="e4f44081-20e5-44a5-b4aa-ac21972311ed">
+          <table class="table table-sm bg-light" id="7891b2c1-fe31-4948-bbf9-4500b1449244">
            <thead>
             <tr>
              <th scope="col">
@@ -5254,13 +5254,13 @@ Image("logo.png", width=64, height=64, alt="Bootwarp Logo")</code></pre>
            </tbody>
           </table>
          </div>
-         <div class="ml-3" id="9d575d52-3507-4fdf-a287-7e0d23f27d99">
-          <h6 id="04739078-01f4-4bed-89e3-d86a1c720a6e">
+         <div class="ml-3" id="78db83fe-0cd2-411f-b474-7cfbfbb8c1bd">
+          <h6 id="85640d19-eaf5-4550-8cf8-4d460b0d9388">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="69036ad3-5b6e-4192-9e92-35edc51a3900"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Page, Javascript
+          <pre id="035d5a98-3587-45ff-9875-fce4639c4f05"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Page, Javascript
 
 my_page = Page(
     ...
@@ -5272,28 +5272,28 @@ my_page = Page(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="08eedd93-23ec-4c0a-a118-1be35278dae0">
-        <div class="mt-3" id="e495a00b-5d9a-4ed4-93d0-ea3ec599386a">
-         <div id="08bd1e86-8ad2-4263-b15e-7ffeaa77c9fe">
+       <div class="tab-pane fade" id="8a5fa478-8277-42c7-a44c-c701dfbb4a36">
+        <div class="mt-3" id="3870642f-c40b-4332-847e-998c4dcc769b">
+         <div id="0a089ed2-bba3-4aa2-ab43-2a3f875eb2dd">
           <div class="row">
            <div class="col-md">
-            <div id="872e99dd-4b23-480c-8c82-5b5c6d4c9986">
-             <h1 id="0cdbf791-7704-4ff7-8837-c649d770d1fa">
+            <div id="88efb69a-c31a-4fde-9713-ac2b06c5d754">
+             <h1 id="2ab03474-6ec3-43a3-9fde-4ade6662354f">
               jQuery
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="1bb9df33-087b-418e-b8d6-163c005cdbda">
+            <div id="baf9b4f5-8c1e-435f-9501-8f23a7cd92d5">
             </div>
            </div>
           </div>
          </div>
-         <div id="e36f824f-58bd-4ff6-8fe5-64076df17680">
+         <div id="17cfde17-1346-41c8-8598-c2ac2ced24e5">
           <div class="row">
            <div class="col-md">
-            <div id="e49a0d0b-b5b1-4365-87a1-b44f468e6956">
-             <p id="85c8ad3a-f497-4d0f-a798-96a8e90fc983">
+            <div id="19c6eaad-9bb3-4927-b965-5e2fceac4587">
+             <p id="ec422637-7d21-4e9a-a26e-f86314619c65">
               Use
               <code>
                Javascript
@@ -5303,8 +5303,8 @@ my_page = Page(
             </div>
            </div>
            <div class="col-md">
-            <div id="6a2473c1-b322-417b-a572-644e829f203b">
-             <pre id="ee7f2732-128e-4937-8f14-ed0452479fde"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Javascript, Button, Text
+            <div id="51b3039a-063b-49c3-b78e-476c09b42573">
+             <pre id="f99d4500-24bf-4fda-9958-8af08f3bae73"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Javascript, Button, Text
 
 label = Text("Answer:").as_strong()
 answer = Text("unknown").add_classes("mr-2 ml-2")
@@ -5330,27 +5330,27 @@ action = Javascript(
 Panel(
   label, answer, btn_yes, btn_no, action
 )</code></pre>
-             <div id="b3c443eb-e26e-4a82-b1e9-2745a3846e46">
-              <span id="39b78c7c-1fb2-45dd-98e1-efdb812b8fd1">
+             <div id="0f42d048-8ee0-4a15-a272-7c00299e40fd">
+              <span id="d1916630-7bf0-44a7-be5d-4668cf4b2962">
                <strong>
                 Answer:
                </strong>
               </span>
-              <span class="mr-2 ml-2" id="602984ad-cda0-42e2-9c49-8637e3552f4a">
+              <span class="mr-2 ml-2" id="5f2817a8-44cf-46f8-9052-d62662246e00">
                unknown
               </span>
-              <button class="btn btn-success" id="aa5c8a3c-33d9-4424-8f04-5ece13331813" onclick="return false;">
+              <button class="btn btn-success" id="2a37e3f1-accf-4684-937a-0d2d75904570" onclick="return false;">
                Yes
               </button>
-              <button class="btn btn-danger" id="04184bdc-6647-4650-9dc8-924031b28a05" onclick="return false;">
+              <button class="btn btn-danger" id="5ea676de-a4ec-4691-982b-b658c49d207d" onclick="return false;">
                No
               </button>
               <script type="application/javascript">
-               $("#aa5c8a3c-33d9-4424-8f04-5ece13331813").on("click",function(){
-      $("#602984ad-cda0-42e2-9c49-8637e3552f4a").text("Yes");
+               $("#2a37e3f1-accf-4684-937a-0d2d75904570").on("click",function(){
+      $("#5f2817a8-44cf-46f8-9052-d62662246e00").text("Yes");
     });
-    $("#04184bdc-6647-4650-9dc8-924031b28a05").on("click",function(){
-      $("#602984ad-cda0-42e2-9c49-8637e3552f4a").text("No");
+    $("#5ea676de-a4ec-4691-982b-b658c49d207d").on("click",function(){
+      $("#5f2817a8-44cf-46f8-9052-d62662246e00").text("No");
     });
               </script>
              </div>
@@ -5363,34 +5363,34 @@ Panel(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="eae4bd11-0862-48c8-87b7-2020db885395">
-     <div class="mt-5" id="6493bcc7-3849-46cd-9814-ce8363aa0357">
-      <div class="d-flex justify-content-between" id="17c3347e-ce62-45c3-a9dc-e4ee60a5c6da">
-       <h1 id="f9c9aafa-ec56-4905-ba10-aa99f8e95c19">
+    <div class="tab-pane fade" id="9526c010-0ec6-4f50-b47f-6b1ecf04e926">
+     <div class="mt-5" id="d7f4f2e5-2940-48a5-b53b-badb787be101">
+      <div class="d-flex justify-content-between" id="ad67c56e-cb76-4d89-a3c1-20cb1f78f31c">
+       <h1 id="807b4acd-f978-429e-b203-413d9e9b44a2">
         Class
-        <span class="text-primary" id="2221a1a6-f925-4b06-a150-1e67bde3770c">
-         <span id="a6cc2720-f109-4616-9925-28cef3f61db6">
+        <span class="text-primary" id="9c753b4e-cb28-4a19-87bf-5244e114e20b">
+         <span id="505caa7b-dd1b-450a-9093-b5875a28222b">
           Link
          </span>
         </span>
        </h1>
-       <div id="382f1861-9662-4409-9124-fe7fc9f7ae07">
-        <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#00b0d86f-489b-4108-9ff3-1ad6cd3b246c" data-toggle="collapse" id="bf3d6620-6f76-4651-88f3-ccba38eefd7e" onclick="return false;" type="button">
+       <div id="8db8e961-7343-491f-87aa-1f3606865931">
+        <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#208b2028-e4e6-4b45-b567-41dd20560cfc" data-toggle="collapse" id="c34be3ad-d8d9-4399-a8f7-4551695f3871" onclick="return false;" type="button">
          Argument
         </button>
        </div>
       </div>
-      <span class="text-muted" id="c7c98a64-4bad-4c76-b9a8-1aa04332e96e">
+      <span class="text-muted" id="11487ac0-d984-42c8-874d-48acce2ecf97">
        A web component for an external resource link.
       </span>
-      <pre id="dd0a4069-08a9-4675-9d98-4374638148bb"><code a="" c="" l="" s=" p y t h o n ">Link(href, rel='stylesheet', ctype='text/css')</code></pre>
-      <div class="ml-3 collapse" id="00b0d86f-489b-4108-9ff3-1ad6cd3b246c">
-       <h6 id="1707221b-5fd5-4acf-a1d7-eaa4f6aa103d">
+      <pre id="10bd2dff-ca99-4fe0-9312-3d0972e20dcc"><code a="" c="" l="" s=" p y t h o n ">Link(href, rel='stylesheet', ctype='text/css')</code></pre>
+      <div class="ml-3 collapse" id="208b2028-e4e6-4b45-b567-41dd20560cfc">
+       <h6 id="63735a51-8451-4558-8a58-a416c2f06c16">
         <strong>
          Arguments
         </strong>
        </h6>
-       <table class="table table-sm bg-light" id="04977ff7-ea84-4faf-81b6-69a6f5b8a19a">
+       <table class="table table-sm bg-light" id="d2dd3463-4487-435d-ba5c-8a4e5f449811">
         <thead>
          <tr>
           <th scope="col">
@@ -5456,17 +5456,17 @@ Panel(
         </tbody>
        </table>
       </div>
-      <p id="7f166c7a-5345-45f2-b928-c4ddee7ce2e4">
+      <p id="fe707660-62bf-4e7e-a229-d9171b8a6780">
        See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link
     for more information.
       </p>
-      <div class="ml-3" id="62ed3f67-29db-467d-8bc5-d7a13cd6e6d9">
-       <h6 id="a38cc24f-bb73-4c2e-8cc6-64f297748178">
+      <div class="ml-3" id="5d00f003-980e-40b8-86b5-7295fe5733d6">
+       <h6 id="1a5b22c2-6bd5-44b7-89ff-a55566e5f2f8">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="58ffef35-5a4a-4394-8e1f-658ade257f53"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Page, Link
+       <pre id="ba0b0821-97eb-46e7-9a5c-96cf3b296dcd"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Page, Link
 
 my_page = Page(
     ...
@@ -5478,23 +5478,23 @@ my_page = Page(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="2f69716b-6e13-424e-add4-d7ab65656a80">
-     <div id="aa489c71-8f54-47fa-8b1f-7178d3476e94">
+    <div class="tab-pane fade" id="f1170b57-8079-4b86-99d0-5c0a57d14b63">
+     <div id="38ea60da-9c6e-4a03-9888-ebcbd28bc4e8">
       <hr/>
-      <ul class="nav" id="dd13141c-7847-4160-b2dd-e7e4e328b018" role="tablist">
+      <ul class="nav" id="3741c501-0699-4374-9c10-2cc03e98d91c" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-target="#ce61d109-4d62-4a6c-a288-b0029e3bdf3c" data-toggle="tab" href="#ce61d109-4d62-4a6c-a288-b0029e3bdf3c" id="d3453324-db01-4679-9161-a5c1d77070db">
-         <span class="text-secondary" id="3559fdda-e81b-4479-aad5-6f76440b0784">
-          <span id="d016397e-f35d-445d-aa15-e0d95dc8531a">
+        <a class="nav-link active" data-target="#a0502242-5a88-4a5b-b06f-c45c57a76cdc" data-toggle="tab" href="#a0502242-5a88-4a5b-b06f-c45c57a76cdc" id="e485ae2e-3102-4df8-ac6f-21df02e10c28">
+         <span class="text-secondary" id="f54b04cc-6cd9-4584-a082-4721334bb4b7">
+          <span id="a4ced351-1f3a-4035-adc4-58600f51806a">
            Navigation
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#6075e1d2-d469-422a-b1a3-f2cc4ca2e885" data-toggle="tab" href="#6075e1d2-d469-422a-b1a3-f2cc4ca2e885" id="c049e826-65ff-4eea-bdbf-9dca63043766">
-         <span class="text-secondary" id="8fd88c5b-a169-4d35-84c7-88258c084e54">
-          <span id="244286cd-e088-46ef-aa8b-6b944eb55b43">
+        <a class="nav-link" data-target="#392a50e6-0447-4f51-9bef-0276e278e25c" data-toggle="tab" href="#392a50e6-0447-4f51-9bef-0276e278e25c" id="77a6e5c7-f72f-4fec-afc8-6f1ee4081f31">
+         <span class="text-secondary" id="a3f44084-ace2-4767-8401-a2eefa614ea2">
+          <span id="e3e04be6-7c74-4292-813d-812f19f4d75e">
            Navigation.Item
           </span>
          </span>
@@ -5502,34 +5502,34 @@ my_page = Page(
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="ce61d109-4d62-4a6c-a288-b0029e3bdf3c">
-        <div class="mt-5" id="f98a48ca-62cb-4996-869f-d9f8a1f01d13">
-         <div class="d-flex justify-content-between" id="99a64832-3d0b-42fa-ad1d-3088d0b19bd3">
-          <h1 id="5e226229-5212-45f6-99ae-b87110bd35e2">
+       <div class="tab-pane fade active show" id="a0502242-5a88-4a5b-b06f-c45c57a76cdc">
+        <div class="mt-5" id="fdf7c1bb-823e-4297-9b8b-257d7c745924">
+         <div class="d-flex justify-content-between" id="9840f258-bd28-4ca7-ad5e-d90a4e9c79bf">
+          <h1 id="c265658e-1d7b-469d-840b-2459d7907c7b">
            Class
-           <span class="text-primary" id="65a2cc9b-31fd-4d27-b546-bf9ab7dd1fda">
-            <span id="d016397e-f35d-445d-aa15-e0d95dc8531a">
+           <span class="text-primary" id="e1c4cd26-05da-4d62-ad2d-04b4e510ccf4">
+            <span id="a4ced351-1f3a-4035-adc4-58600f51806a">
              Navigation
             </span>
            </span>
           </h1>
-          <div id="9446a13a-618f-4a02-a08f-4db35ef9bb0e">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#452b9fe3-acec-4ba7-bdd3-9dd030abcbff" data-toggle="collapse" id="7af19a2f-c08e-48aa-b17d-1d2f009c238a" onclick="return false;" type="button">
+          <div id="77e2b5b4-8430-47f9-af2e-c3ca9b1883a1">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#25740e0d-53ca-4bef-9ece-2de3ec2c231f" data-toggle="collapse" id="237a9f9e-92a1-4054-91fd-e0e1ebc1eab3" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="6fd26d27-bdcd-4eaa-b960-3ce527733b07">
+         <span class="text-muted" id="e53ec281-0107-4808-845a-a90109e2ad47">
           A web component for navigation.
          </span>
-         <pre id="b7048586-4ce6-4dcf-9ea8-6e74b30711ba"><code a="" c="" l="" s=" p y t h o n ">Navigation(*items)</code></pre>
-         <div class="ml-3 collapse" id="452b9fe3-acec-4ba7-bdd3-9dd030abcbff">
-          <h6 id="8b687436-53eb-427a-a1b8-fc1c0f84d7ff">
+         <pre id="9a14ad22-3e1b-4fa8-9d5b-1c4fdd967568"><code a="" c="" l="" s=" p y t h o n ">Navigation(*items)</code></pre>
+         <div class="ml-3 collapse" id="25740e0d-53ca-4bef-9ece-2de3ec2c231f">
+          <h6 id="7f8ac743-16d3-4ffb-912a-b6194594fe07">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="ec4e39ea-449e-44e3-9123-b1fbe6de175d">
+          <table class="table table-sm bg-light" id="48617296-2a2f-4f42-93c0-f329c9b0deb4">
            <thead>
             <tr>
              <th scope="col">
@@ -5566,13 +5566,13 @@ my_page = Page(
            </tbody>
           </table>
          </div>
-         <div class="ml-3" id="9818a663-0668-45ba-92e2-1ef8d54636c4">
-          <h6 id="517a3fe4-2c32-4d9a-bb01-bfcefd04c51a">
+         <div class="ml-3" id="60611c51-dde5-4071-995f-0d7944b0e816">
+          <h6 id="85692087-23bf-41e9-b8b1-00a919d0a1f5">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="5d3bf185-9dcd-41d2-aab0-d10330d2c583"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Navigation
+          <pre id="636ca1b1-9ada-424a-86df-17f41e133a4d"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Navigation
 
 Navigation(
     Navigation.Item('Chapter 1', 'Text 1', True),
@@ -5580,61 +5580,61 @@ Navigation(
     Navigation.Item('Chapter 3', 'Text 3')
 )</code></pre>
          </div>
-         <div class="ml-3" id="3066c7c4-cb00-433f-a7db-f94e94547c62">
-          <ul class="nav" id="b17bd829-4544-49d9-93a7-33c0f4b6a0ee" role="tablist">
+         <div class="ml-3" id="b9f1ea24-a0d9-4b30-9aef-39f3e5164ff0">
+          <ul class="nav" id="9b494c09-ca55-4dbd-a0d0-9db7e44d7d61" role="tablist">
            <li class="nav-item">
-            <a class="nav-link active" data-target="#c4ba331e-3e13-41ac-a70a-e2d983fdbd86" data-toggle="tab" href="#c4ba331e-3e13-41ac-a70a-e2d983fdbd86" id="386151a0-c620-456b-b799-7dd07757746f">
+            <a class="nav-link active" data-target="#50277a6f-98d2-4792-8768-b630deae74db" data-toggle="tab" href="#50277a6f-98d2-4792-8768-b630deae74db" id="14a75d90-4373-4e57-9344-5e095d9726d6">
              Chapter 1
             </a>
            </li>
            <li class="nav-item">
-            <a class="nav-link" data-target="#b22b87bf-42a6-471a-a1e5-066a27baf1f5" data-toggle="tab" href="#b22b87bf-42a6-471a-a1e5-066a27baf1f5" id="16cffc1d-035e-4b67-a3d6-7561c982094c">
+            <a class="nav-link" data-target="#efb6fdf7-a091-422e-b290-d408f07660ce" data-toggle="tab" href="#efb6fdf7-a091-422e-b290-d408f07660ce" id="61744153-f6c3-47dd-a42b-c6c7da975e0a">
              Chapter 2
             </a>
            </li>
            <li class="nav-item">
-            <a class="nav-link" data-target="#39166cd8-af6b-4f68-8d83-5021b410fa6e" data-toggle="tab" href="#39166cd8-af6b-4f68-8d83-5021b410fa6e" id="19d7f5ea-4ff8-4b6a-bba2-4bf5e18ad59b">
+            <a class="nav-link" data-target="#53b4c407-d4a6-47b3-b9d7-1d59428a33a6" data-toggle="tab" href="#53b4c407-d4a6-47b3-b9d7-1d59428a33a6" id="a7748fd5-193b-49f1-afa4-bf7d102270c2">
              Chapter 3
             </a>
            </li>
           </ul>
           <div class="tab-content">
-           <div class="tab-pane fade active show" id="c4ba331e-3e13-41ac-a70a-e2d983fdbd86">
+           <div class="tab-pane fade active show" id="50277a6f-98d2-4792-8768-b630deae74db">
             Text 1
            </div>
-           <div class="tab-pane fade" id="b22b87bf-42a6-471a-a1e5-066a27baf1f5">
+           <div class="tab-pane fade" id="efb6fdf7-a091-422e-b290-d408f07660ce">
             Text 2
            </div>
-           <div class="tab-pane fade" id="39166cd8-af6b-4f68-8d83-5021b410fa6e">
+           <div class="tab-pane fade" id="53b4c407-d4a6-47b3-b9d7-1d59428a33a6">
             Text 3
            </div>
           </div>
          </div>
-         <div class="mt-5" id="3a8ffc16-ed76-4592-93e1-6fce3a3dde81">
-          <div class="d-flex justify-content-between" id="a6d0d2dc-3569-446e-a3c7-af2fa8acc004">
-           <h4 id="50363990-67ae-4fb0-b455-1ac5550e9bab">
+         <div class="mt-5" id="1f7d5efc-73fd-40ed-8b1e-390cdf6bcf33">
+          <div class="d-flex justify-content-between" id="0b2518cd-5875-4642-b544-2879210f8706">
+           <h4 id="8d7d1111-3d34-40fe-9afb-d9fe6f1f310b">
             Method
-            <span class="text-primary" id="a6f586a1-ff08-495c-842f-4ee0aacf606d">
+            <span class="text-primary" id="9f447bcb-d3d7-4b43-9b25-5284ff5595ad">
              as_pills
             </span>
            </h4>
-           <div id="ab4cf492-c497-46c5-a204-b25364913da6">
-            <button class="btn-sm btn btn-outline-primary" data-target="#af54e7f0-9028-40d6-9481-49844c97a623" data-toggle="collapse" id="9beb02b6-5828-4517-bcd3-bf35f6293580" onclick="return false;" type="button">
+           <div id="8e8e037e-1b75-4367-ad54-0805ad5bdda4">
+            <button class="btn-sm btn btn-outline-primary" data-target="#f23338fc-eeee-4d3f-8daf-745442320e5d" data-toggle="collapse" id="d8d98ca9-8036-4297-9fc6-1b82ad7fd6af" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="d07f7c0e-8303-4278-9b74-a0823586439b">
+          <span class="text-muted" id="1339758a-3f81-494e-bb01-faf45463a0de">
            Makes the navigation controls looks like buttons.
           </span>
-          <pre id="658b4194-b2c6-4290-9c04-a33602b166f9"><code a="" c="" l="" s=" p y t h o n ">as_pills()</code></pre>
-          <div class="ml-3 collapse" id="af54e7f0-9028-40d6-9481-49844c97a623">
-           <h6 id="dda85c5e-1b73-4300-9a8e-81faeed644e8">
+          <pre id="dd8a0f9b-185a-451c-becc-29c15c0da920"><code a="" c="" l="" s=" p y t h o n ">as_pills()</code></pre>
+          <div class="ml-3 collapse" id="f23338fc-eeee-4d3f-8daf-745442320e5d">
+           <h6 id="341263e1-0825-4a10-9e49-2b3c43a087a5">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="05d30177-f694-43ea-87e9-0d7c09975205">
+           <table class="table table-sm bg-light" id="8afecce9-ee1a-47d0-86ba-8a13887d39fa">
             <thead>
              <tr>
               <th scope="col">
@@ -5667,13 +5667,13 @@ Navigation(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="875a9fee-442f-4f1e-8f58-c499feb549a4">
-           <h6 id="c0a9710f-8c81-4f54-9ccb-1eacf4e1eba3">
+          <div class="ml-3" id="b9b0229f-b058-4ede-997f-5e56450fcf64">
+           <h6 id="09df0ad8-f1fc-466b-923d-c33cae29b3a0">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="ac1016ec-dd0b-40f5-a941-b9eaa503cd93"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Navigation
+           <pre id="0317e83a-9f61-4c7b-a56a-71d7abdb7c4c"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Navigation
 
 Navigation(
     Navigation.Item('Chapter 1', 'Text 1', True),
@@ -5681,62 +5681,62 @@ Navigation(
     Navigation.Item('Chapter 3', 'Text 3')
 ).as_pills()</code></pre>
           </div>
-          <div class="ml-3" id="0b38ef8c-8bb9-4595-8639-da7c4ccd6d08">
-           <ul class="nav nav-pills" id="0294e629-3c0e-4ad1-bac9-73f418b37524" role="tablist">
+          <div class="ml-3" id="b7cc06b1-03e6-4c85-b1a7-e42ac4a3081e">
+           <ul class="nav nav-pills" id="48141769-1b2c-4441-b96c-4182e3e06de9" role="tablist">
             <li class="nav-item">
-             <a class="nav-link active" data-target="#4cbf4b58-6994-42ea-aacd-f49a773af974" data-toggle="tab" href="#4cbf4b58-6994-42ea-aacd-f49a773af974" id="fad4f287-c9eb-4cf9-964b-fc0334c43ce7">
+             <a class="nav-link active" data-target="#6fd6cfbe-bbb1-4766-a809-b2caa1e92db9" data-toggle="tab" href="#6fd6cfbe-bbb1-4766-a809-b2caa1e92db9" id="a54e5522-cd12-4060-adc6-cf065bdf612d">
               Chapter 1
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-target="#e6b9ab75-1108-4870-b5ef-b35cc59f285b" data-toggle="tab" href="#e6b9ab75-1108-4870-b5ef-b35cc59f285b" id="d842adda-d4a5-48c5-be85-722af2d9168e">
+             <a class="nav-link" data-target="#8eefe25e-7dfc-4842-bc72-33e28333c540" data-toggle="tab" href="#8eefe25e-7dfc-4842-bc72-33e28333c540" id="9eea315e-a7fb-4c55-bd7d-d50b54c752a2">
               Chapter 2
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-target="#bed4b21a-113a-43bf-8ea2-dd09c40ddd6f" data-toggle="tab" href="#bed4b21a-113a-43bf-8ea2-dd09c40ddd6f" id="d9c0c5cb-ecaf-42cc-9cad-30da6e4d5b46">
+             <a class="nav-link" data-target="#23ffa56e-d4bc-4a6c-8348-878ae3497ccd" data-toggle="tab" href="#23ffa56e-d4bc-4a6c-8348-878ae3497ccd" id="ab99e0d7-044d-4c44-8441-bc855f2f5d75">
               Chapter 3
              </a>
             </li>
            </ul>
            <div class="tab-content">
-            <div class="tab-pane fade active show" id="4cbf4b58-6994-42ea-aacd-f49a773af974">
+            <div class="tab-pane fade active show" id="6fd6cfbe-bbb1-4766-a809-b2caa1e92db9">
              Text 1
             </div>
-            <div class="tab-pane fade" id="e6b9ab75-1108-4870-b5ef-b35cc59f285b">
+            <div class="tab-pane fade" id="8eefe25e-7dfc-4842-bc72-33e28333c540">
              Text 2
             </div>
-            <div class="tab-pane fade" id="bed4b21a-113a-43bf-8ea2-dd09c40ddd6f">
+            <div class="tab-pane fade" id="23ffa56e-d4bc-4a6c-8348-878ae3497ccd">
              Text 3
             </div>
            </div>
           </div>
          </div>
-         <div class="mt-5" id="17fae34d-be68-45eb-b5e8-a2af80d1b9de">
-          <div class="d-flex justify-content-between" id="36880a08-e366-4b44-89c9-72e8448ed7a7">
-           <h4 id="84ae63fc-f2fc-4911-a544-74c13c543ed4">
+         <div class="mt-5" id="f575a870-9ed0-4b50-ba85-57b6b3a7649c">
+          <div class="d-flex justify-content-between" id="c48db376-5dc6-46dc-9df3-5296bd7288ab">
+           <h4 id="4bd0f566-d296-43d2-96a9-1f1801ab9d5f">
             Method
-            <span class="text-primary" id="e62597df-9879-4759-875d-a28c08accde1">
+            <span class="text-primary" id="6c68e696-f3c4-4c27-bc26-0d33b384246d">
              as_tabs
             </span>
            </h4>
-           <div id="e0e6af19-b06b-49f7-8378-fc3f3fdf0e7c">
-            <button class="btn-sm btn btn-outline-primary" data-target="#0f5264d8-19c9-4a07-9d71-7a98724b67da" data-toggle="collapse" id="9d7deeae-421d-4da0-83e1-367f150a6dcc" onclick="return false;" type="button">
+           <div id="12ce8059-140a-449a-beba-5e0b3a402ea4">
+            <button class="btn-sm btn btn-outline-primary" data-target="#bd49fb07-e9a1-4f0b-9ed4-c29461c04869" data-toggle="collapse" id="5ec51620-1f3d-4cba-b6f0-f00913d4c8ac" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="76dbc642-926e-4ec0-85b5-35bec9e6a826">
+          <span class="text-muted" id="f5896f9e-88a5-4f03-876d-b82dccbd10c9">
            Makes the navigation controls looks like buttons.
           </span>
-          <pre id="46e32111-86a2-4bfb-912d-67ced8f149b8"><code a="" c="" l="" s=" p y t h o n ">as_tabs()</code></pre>
-          <div class="ml-3 collapse" id="0f5264d8-19c9-4a07-9d71-7a98724b67da">
-           <h6 id="adfe8a56-8686-44ca-8282-fdf8fff0fe20">
+          <pre id="ca7cab55-ae37-425e-9c63-876eb9f35cdc"><code a="" c="" l="" s=" p y t h o n ">as_tabs()</code></pre>
+          <div class="ml-3 collapse" id="bd49fb07-e9a1-4f0b-9ed4-c29461c04869">
+           <h6 id="e72c51da-0283-4345-9abb-246f8cccb2a2">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="d155bb51-267e-47e5-a4d2-ab3b333fd9f7">
+           <table class="table table-sm bg-light" id="6787bc2d-152a-4c0c-bf8f-416ab80c1106">
             <thead>
              <tr>
               <th scope="col">
@@ -5769,13 +5769,13 @@ Navigation(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="817e92f6-b3fe-41ea-b7c0-940fa665db38">
-           <h6 id="1441c8e1-5afb-47a8-a7c5-3890ee3076ee">
+          <div class="ml-3" id="fa576fc5-9655-4c5f-8393-95858830d78d">
+           <h6 id="ef7c8cf8-2604-4d75-a437-9c1a1dcfc001">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="83d7feff-5068-404f-ad2b-6ecdf5187c43"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Navigation
+           <pre id="635ee6e3-afe2-4025-b2e2-68c38f6d32e1"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Navigation
 
 Navigation(
     Navigation.Item('Chapter 1', 'Text 1', True),
@@ -5783,62 +5783,62 @@ Navigation(
     Navigation.Item('Chapter 3', 'Text 3')
 ).as_tabs()</code></pre>
           </div>
-          <div class="ml-3" id="b7f43324-b454-4f19-bf8e-35149f6c34ad">
-           <ul class="nav nav-tabs" id="22bc39f4-0c7a-423d-a6ae-4a4d488c8d51" role="tablist">
+          <div class="ml-3" id="eee191f4-0c3c-477a-b3d9-e5c41be57945">
+           <ul class="nav nav-tabs" id="92525e3d-6df2-4d48-9704-23bcd1aed3b3" role="tablist">
             <li class="nav-item">
-             <a class="nav-link active" data-target="#296a86f5-f572-4810-976d-aacea7cb2a20" data-toggle="tab" href="#296a86f5-f572-4810-976d-aacea7cb2a20" id="50d7a644-aaa8-4225-8cf7-f457311cf49e">
+             <a class="nav-link active" data-target="#a5f0ec56-cde4-446e-8101-db3c971f4a5d" data-toggle="tab" href="#a5f0ec56-cde4-446e-8101-db3c971f4a5d" id="ed6a9dda-1867-471d-b8d5-87f71d6f4cb1">
               Chapter 1
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-target="#0058275d-d95a-42a0-9344-6208700d8119" data-toggle="tab" href="#0058275d-d95a-42a0-9344-6208700d8119" id="32ca0871-d43d-47fd-8705-29d8d1b91441">
+             <a class="nav-link" data-target="#3824b160-5363-467d-b25c-94dfc1190568" data-toggle="tab" href="#3824b160-5363-467d-b25c-94dfc1190568" id="0c57e9ec-e236-406e-8cfe-97f2c4b171e7">
               Chapter 2
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-target="#3d18966d-fe51-4894-9cfa-c47f3deca258" data-toggle="tab" href="#3d18966d-fe51-4894-9cfa-c47f3deca258" id="6989ea41-ee95-4013-ae94-2fdf9f97d8a9">
+             <a class="nav-link" data-target="#2f10b175-3c8c-44c1-b2a7-caf866c718e9" data-toggle="tab" href="#2f10b175-3c8c-44c1-b2a7-caf866c718e9" id="c7eefbf6-b292-4da6-b7c7-72436355c08d">
               Chapter 3
              </a>
             </li>
            </ul>
            <div class="tab-content">
-            <div class="tab-pane fade active show" id="296a86f5-f572-4810-976d-aacea7cb2a20">
+            <div class="tab-pane fade active show" id="a5f0ec56-cde4-446e-8101-db3c971f4a5d">
              Text 1
             </div>
-            <div class="tab-pane fade" id="0058275d-d95a-42a0-9344-6208700d8119">
+            <div class="tab-pane fade" id="3824b160-5363-467d-b25c-94dfc1190568">
              Text 2
             </div>
-            <div class="tab-pane fade" id="3d18966d-fe51-4894-9cfa-c47f3deca258">
+            <div class="tab-pane fade" id="2f10b175-3c8c-44c1-b2a7-caf866c718e9">
              Text 3
             </div>
            </div>
           </div>
          </div>
-         <div class="mt-5" id="76adc4a4-72bb-4b3c-918f-ad53ef80e454">
-          <div class="d-flex justify-content-between" id="e540ef44-9a8d-4a38-b729-bc91d331aaac">
-           <h4 id="54a92937-3116-4f6c-84cf-28fc2bce4548">
+         <div class="mt-5" id="05d191ba-be36-43be-852a-a1ea3c35ca42">
+          <div class="d-flex justify-content-between" id="dcf91eda-1dfc-428c-be15-b8ce52861470">
+           <h4 id="48cbcdac-4d79-427c-a6ad-5ced3aafc40e">
             Method
-            <span class="text-primary" id="eab58633-45f4-465d-97f9-748a53995ef2">
+            <span class="text-primary" id="944ab329-e99d-4a05-ba1a-0fde3e2122c1">
              as_vertical
             </span>
            </h4>
-           <div id="5da822e8-7a78-45ec-b8c3-aa7561b99c3e">
-            <button class="btn-sm btn btn-outline-primary" data-target="#e8ef0652-9c58-4f34-8f11-ccc6c78158af" data-toggle="collapse" id="018e23b5-74d8-4dde-84be-081d392e0628" onclick="return false;" type="button">
+           <div id="d229672f-b39d-48e2-a23e-37abb6c279ec">
+            <button class="btn-sm btn btn-outline-primary" data-target="#88172127-c1d4-4c15-9e73-23e89bf9f9ed" data-toggle="collapse" id="102cd752-e66f-4993-990f-f1d0007fe000" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="71c993ca-e494-4853-9004-365fa01ef04d">
+          <span class="text-muted" id="cfbfe500-1bec-43cd-9323-a4815ea8c656">
            Makes the navigation vertical.
           </span>
-          <pre id="7a513f1c-8c2d-4bfc-bccc-650490e2e5ea"><code a="" c="" l="" s=" p y t h o n ">as_vertical()</code></pre>
-          <div class="ml-3 collapse" id="e8ef0652-9c58-4f34-8f11-ccc6c78158af">
-           <h6 id="1c38f791-7f1f-460e-b2f4-b5ba72952ede">
+          <pre id="bb895bed-9584-423d-a45d-ec9dada9c40d"><code a="" c="" l="" s=" p y t h o n ">as_vertical()</code></pre>
+          <div class="ml-3 collapse" id="88172127-c1d4-4c15-9e73-23e89bf9f9ed">
+           <h6 id="3b5d2a23-d035-45ad-a217-5195cf8a351a">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="b060f80b-8e9a-4e20-a4b8-e2db17d6e2dc">
+           <table class="table table-sm bg-light" id="4690096d-0338-43ef-afae-0a106908d92a">
             <thead>
              <tr>
               <th scope="col">
@@ -5871,13 +5871,13 @@ Navigation(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="fc19e9c8-43da-4984-abda-8ab61c8c057d">
-           <h6 id="a24a6dd1-b748-4076-94c6-8cb661546289">
+          <div class="ml-3" id="0fca5200-6602-4363-ae4f-7a408ab983fa">
+           <h6 id="56926a26-e8dc-4d6f-863d-2b8fd54d8442">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="00bf4d5c-b792-4f27-a921-047144894cc7"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Navigation
+           <pre id="7b5c189f-16b4-4687-9484-37a8a0605bd3"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Navigation
 
 Navigation(
     Navigation.Item('Chapter 1', 'Text 1', True),
@@ -5885,33 +5885,33 @@ Navigation(
     Navigation.Item('Chapter 3', 'Text 3')
 ).as_vertical()</code></pre>
           </div>
-          <div class="ml-3" id="85bb1674-8476-44a4-8609-12a1edd83b23">
+          <div class="ml-3" id="bcbe4acc-a8df-4355-b650-ca192aaffd67">
            <div class="d-flex">
-            <ul class="nav flex-column" id="3e569503-250b-4070-9367-f2adaffeb935" role="tablist">
+            <ul class="nav flex-column" id="3395d8f7-708e-401e-a1e0-c88176affbff" role="tablist">
              <li class="nav-item">
-              <a class="nav-link active" data-target="#14085eea-266b-4b5b-80c0-e80780a094aa" data-toggle="tab" href="#14085eea-266b-4b5b-80c0-e80780a094aa" id="3fdf24bf-0a83-4ba5-8075-58488da23203">
+              <a class="nav-link active" data-target="#bff75a4d-5f1e-4616-84eb-397676e1a76e" data-toggle="tab" href="#bff75a4d-5f1e-4616-84eb-397676e1a76e" id="ef0ccdd1-ffcf-4cec-aa25-836be37994ae">
                Chapter 1
               </a>
              </li>
              <li class="nav-item">
-              <a class="nav-link" data-target="#de5c20cd-25d5-4cc6-811a-0823c5c5160a" data-toggle="tab" href="#de5c20cd-25d5-4cc6-811a-0823c5c5160a" id="7be75efd-2872-447d-a0ba-565dd8b566cd">
+              <a class="nav-link" data-target="#718b656c-0693-4166-b7f0-2a31c7aca20d" data-toggle="tab" href="#718b656c-0693-4166-b7f0-2a31c7aca20d" id="f975e0d3-3b91-4f67-bf0a-ea06cb8ecf2a">
                Chapter 2
               </a>
              </li>
              <li class="nav-item">
-              <a class="nav-link" data-target="#fb28c0fe-b336-43ef-a689-61f474ee32ed" data-toggle="tab" href="#fb28c0fe-b336-43ef-a689-61f474ee32ed" id="2f73d226-7ec0-4fdd-a797-2fb36bb1cd34">
+              <a class="nav-link" data-target="#0de2525a-4307-4b7f-87cf-f6b39ffd16f1" data-toggle="tab" href="#0de2525a-4307-4b7f-87cf-f6b39ffd16f1" id="ee7d73f7-f6a0-483d-a857-912c6deff59a">
                Chapter 3
               </a>
              </li>
             </ul>
             <div class="tab-content">
-             <div class="tab-pane fade active show" id="14085eea-266b-4b5b-80c0-e80780a094aa">
+             <div class="tab-pane fade active show" id="bff75a4d-5f1e-4616-84eb-397676e1a76e">
               Text 1
              </div>
-             <div class="tab-pane fade" id="de5c20cd-25d5-4cc6-811a-0823c5c5160a">
+             <div class="tab-pane fade" id="718b656c-0693-4166-b7f0-2a31c7aca20d">
               Text 2
              </div>
-             <div class="tab-pane fade" id="fb28c0fe-b336-43ef-a689-61f474ee32ed">
+             <div class="tab-pane fade" id="0de2525a-4307-4b7f-87cf-f6b39ffd16f1">
               Text 3
              </div>
             </div>
@@ -5920,54 +5920,54 @@ Navigation(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="6075e1d2-d469-422a-b1a3-f2cc4ca2e885">
-        <div class="mt-5" id="51db2311-46a7-4bd9-be17-0ceae2de0595">
-         <div class="d-flex justify-content-between" id="9075d54c-7316-4801-a4a3-9af5d415136c">
-          <h1 id="78172667-c769-48dd-ad67-aa5d9bf969df">
+       <div class="tab-pane fade" id="392a50e6-0447-4f51-9bef-0276e278e25c">
+        <div class="mt-5" id="5202dffa-60ef-433d-b735-6652c2a8d596">
+         <div class="d-flex justify-content-between" id="a64cc597-aa67-4955-9078-2e98eb5fdacd">
+          <h1 id="03bd2b90-f2cb-4819-9390-ba3b5d281225">
            Class
-           <span class="text-primary" id="3c9f166b-eb8e-49dd-b3b1-9ed4bcb39be6">
-            <span id="244286cd-e088-46ef-aa8b-6b944eb55b43">
+           <span class="text-primary" id="8e7349c8-00d4-4bca-9dde-f848ce130558">
+            <span id="e3e04be6-7c74-4292-813d-812f19f4d75e">
              Navigation.Item
             </span>
            </span>
           </h1>
-          <div id="59f446bb-6f43-4db7-a2e5-e966faf3b59b">
+          <div id="2e1a6d3f-189a-41e9-89c8-62773c47deba">
           </div>
          </div>
-         <span class="text-muted" id="2ad51aed-8288-4c90-8b5a-4f7bfb188ad8">
+         <span class="text-muted" id="419de2fa-74ab-449f-99bc-44bf7374b3a8">
           None
          </span>
-         <pre id="5ca601d0-1e87-4ad5-b889-6c5655b218d6"><code a="" c="" l="" s=" p y t h o n ">Navigation.Item(name, content, active=False)</code></pre>
-         <div class="mt-5" id="1f41007d-4634-4650-b79a-bab2a82fdbad">
-          <h4 id="cf9bd6ec-4573-453f-815a-dcb2475dc946">
+         <pre id="075e77eb-2fce-46a7-85e9-e1576372de02"><code a="" c="" l="" s=" p y t h o n ">Navigation.Item(name, content, active=False)</code></pre>
+         <div class="mt-5" id="a216924e-6a1b-4cbf-be12-9c1997bcfc97">
+          <h4 id="89d830c7-0fb7-4b40-a901-5c417e3c75b3">
            Property
-           <span class="text-primary" id="2d05e1ec-fb41-4ad5-9230-7544855801e5">
+           <span class="text-primary" id="bb37d953-9fd9-4765-ad3e-447f51d28f62">
             active
            </span>
           </h4>
-          <span class="text-muted" id="292f6b75-9622-408e-9388-fc4378b8245a">
+          <span class="text-muted" id="8946910e-08b3-40fd-9eab-26d59900a50e">
            None
           </span>
          </div>
-         <div class="mt-5" id="e71524a4-f732-4c9c-a209-063fb2f19f83">
-          <h4 id="2dcc804f-5953-4a5c-a4a4-0901ed84b88c">
+         <div class="mt-5" id="1de5663e-b72d-4798-b5fb-4844c1a0c6a2">
+          <h4 id="ca9cffef-9302-4cb4-85d1-00dcad95c9c7">
            Property
-           <span class="text-primary" id="e1903337-a771-4667-839e-9db31d884814">
+           <span class="text-primary" id="8b55c8bc-d118-4007-92d9-4d08d57c1120">
             content
            </span>
           </h4>
-          <span class="text-muted" id="af61e97f-4a7c-43d2-b533-e4543570cd20">
+          <span class="text-muted" id="67653a55-b674-4f18-81fe-6eb3a86fc3aa">
            None
           </span>
          </div>
-         <div class="mt-5" id="3332dd55-b503-4adc-9886-652ca4a8773f">
-          <h4 id="c575d8f9-6429-4110-b99d-81002b4177a0">
+         <div class="mt-5" id="68fefddd-5305-47c4-bba5-69732f9896d7">
+          <h4 id="ae589e1f-1e97-4670-a366-e64ae1600e82">
            Property
-           <span class="text-primary" id="56db1b66-600d-4df7-95d9-681f404727e4">
+           <span class="text-primary" id="c563cdcd-1e9e-4c08-95b4-82f1f7a2a43d">
             name
            </span>
           </h4>
-          <span class="text-muted" id="21fa5db9-2917-4be5-ad18-021700006110">
+          <span class="text-muted" id="70bfeb97-b28b-4bd6-9bea-0bb947058036">
            None
           </span>
          </div>
@@ -5976,34 +5976,34 @@ Navigation(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="6bc9d09c-e03b-4b21-854c-3de3aeef7491">
-     <div class="mt-5" id="f0f9dbc7-9ef9-43d3-b400-15b0febcf404">
-      <div class="d-flex justify-content-between" id="73c5fbf3-6510-4704-ba9d-d88e82d09a86">
-       <h1 id="d70c09fa-8c29-477b-8df2-2ffb0b0fea49">
+    <div class="tab-pane fade" id="b5e604eb-e381-4bed-a332-3082aef48481">
+     <div class="mt-5" id="97f9c530-f788-435b-bf46-25dec6e5a815">
+      <div class="d-flex justify-content-between" id="b21b80e0-6fac-40e7-a573-4af2fff550a9">
+       <h1 id="828d335d-4b3b-4fa4-a00d-1138dc1562a5">
         Class
-        <span class="text-primary" id="729dda69-e1fd-4d00-aad6-f0cb763bd1c7">
-         <span id="232a36f2-71a0-4f61-9e99-c732108a9839">
+        <span class="text-primary" id="af054ac7-df62-47bb-9160-2a26f0f750fd">
+         <span id="74497755-ec32-4196-8498-24425ec13644">
           Panel
          </span>
         </span>
        </h1>
-       <div id="6e8b521b-6703-44e4-a2ea-6c6dd90d87d2">
-        <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#3c682019-bfdd-434c-a26a-7fd4c41dd0c9" data-toggle="collapse" id="b5b6395e-ed5d-4b84-91cd-245b560286af" onclick="return false;" type="button">
+       <div id="da83e6d8-b52e-4383-9555-33956008234d">
+        <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#52052591-32df-4796-ba73-e4392c602fda" data-toggle="collapse" id="39c97cfa-1a33-4eed-97c9-b7a3bc1a4a19" onclick="return false;" type="button">
          Argument
         </button>
        </div>
       </div>
-      <span class="text-muted" id="c179fa7a-92a6-47b2-85cb-263bb87f5ebb">
+      <span class="text-muted" id="3fa6cf76-3bfd-477e-840d-ba78bd4c2d00">
        A web component for a panel.
       </span>
-      <pre id="e50ba546-457c-4712-97cc-bbc0bb2ebf8f"><code a="" c="" l="" s=" p y t h o n ">Panel(*components)</code></pre>
-      <div class="ml-3 collapse" id="3c682019-bfdd-434c-a26a-7fd4c41dd0c9">
-       <h6 id="056df4aa-944e-41e9-be81-2a26f4ec3b8a">
+      <pre id="d89c3684-a296-4e97-8904-05332b2dc4b3"><code a="" c="" l="" s=" p y t h o n ">Panel(*components)</code></pre>
+      <div class="ml-3 collapse" id="52052591-32df-4796-ba73-e4392c602fda">
+       <h6 id="8f7aacce-1dae-4cce-b8e6-8864ac661dd2">
         <strong>
          Arguments
         </strong>
        </h6>
-       <table class="table table-sm bg-light" id="43be98d3-543e-4758-bebb-03b920ac74bd">
+       <table class="table table-sm bg-light" id="ca52791e-5b12-400a-ad65-573cf2671399">
         <thead>
          <tr>
           <th scope="col">
@@ -6040,13 +6040,13 @@ Navigation(
         </tbody>
        </table>
       </div>
-      <div class="ml-3" id="bd581486-64a4-4d05-b07c-c00de16a5a5a">
-       <h6 id="071aeffd-cb58-4a37-b419-357e10eaa0ee">
+      <div class="ml-3" id="ce0abc69-b2e6-4efc-a0c1-e064b4b81e15">
+       <h6 id="500a14dc-f27f-4aba-ba0f-464f250b9160">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="a85f45dc-da41-499d-b637-840f939940f3"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text, Panel
+       <pre id="8b8da278-fef7-4d4f-8a17-0d981c431992"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text, Panel
 
 comp1 = Text("Component 1")
 comp2 = Text("Component 2")
@@ -6054,44 +6054,44 @@ comp3 = Text("Component 3")
 
 Panel(comp1, comp2, comp3)</code></pre>
       </div>
-      <div class="ml-3" id="c2aa66b6-3055-4f7d-9bcf-4785e9228ac2">
-       <div id="ba54583c-e610-4472-ab79-264391f50eb3">
-        <span class="border ml-1" id="911365ff-6c5a-4435-8aab-28aec6941513">
+      <div class="ml-3" id="65f80931-60aa-454c-b46a-4f661b3a8a9b">
+       <div id="8d3ef5ec-e0c0-46a1-abcb-6901ec050c27">
+        <span class="border ml-1" id="1b0513d5-9c99-4b31-b6ad-eea6532258b1">
          Component 1
         </span>
-        <span class="border ml-1" id="017cb8d1-9317-42ee-9089-db15bd090ca5">
+        <span class="border ml-1" id="75b5bcf5-9d5b-4a29-a638-0537e5ff7c79">
          Component 2
         </span>
-        <span class="border ml-1" id="f99b79ae-5e23-49cc-8c8e-02c9c9f3bea5">
+        <span class="border ml-1" id="6cf5f3f7-0905-415f-975c-4b75d43578c6">
          Component 3
         </span>
        </div>
       </div>
-      <div class="mt-5" id="9a2507d7-3908-4219-a364-6785e5eee07f">
-       <div class="d-flex justify-content-between" id="657ea1dc-45ca-40d1-91e3-2cb4ab1add05">
-        <h4 id="6f801e32-fd30-4bb4-a654-a4ed0cd21d0e">
+      <div class="mt-5" id="18a06bb7-d395-463d-92f6-506609a4deeb">
+       <div class="d-flex justify-content-between" id="f2aeaee8-b7d7-43bf-9535-0975cc1bcb6d">
+        <h4 id="ea875329-bd13-4f91-8177-fc293929caaf">
          Method
-         <span class="text-primary" id="8b4d6007-5a5b-4bd8-9ec2-0d3387e35e52">
+         <span class="text-primary" id="ddf369ec-d583-497d-a65d-70f4a96a63f7">
           as_collapse
          </span>
         </h4>
-        <div id="4e2fcc83-8b15-424b-94f7-9535bdb1fe16">
-         <button class="btn-sm btn btn-outline-primary" data-target="#65f710fe-31e6-4426-bdaf-233e8513e438" data-toggle="collapse" id="602ae6e4-5d67-4cef-bdea-12827a204175" onclick="return false;" type="button">
+        <div id="4edeb9a7-f481-4206-bae6-0b516d5df60c">
+         <button class="btn-sm btn btn-outline-primary" data-target="#950367dd-252d-40a2-84ee-eaf390377c4b" data-toggle="collapse" id="5755047e-eee9-4ac0-aac5-be31ef091669" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="d33740ec-5d95-4849-afc8-f8d41294b298">
+       <span class="text-muted" id="f5f1e8c6-7bfc-4465-9096-1a78d57049ae">
         Makes the panel collapsed.
        </span>
-       <pre id="3a83e777-138a-471b-b1ce-6b87fd153f58"><code a="" c="" l="" s=" p y t h o n ">as_collapse()</code></pre>
-       <div class="ml-3 collapse" id="65f710fe-31e6-4426-bdaf-233e8513e438">
-        <h6 id="dbf34b57-4855-4703-94e4-78d9fd7bd446">
+       <pre id="3cc62946-5d2a-49b4-bf5c-19a1c63faf1f"><code a="" c="" l="" s=" p y t h o n ">as_collapse()</code></pre>
+       <div class="ml-3 collapse" id="950367dd-252d-40a2-84ee-eaf390377c4b">
+        <h6 id="414d73d5-a737-43af-b2e3-be51ddf2c272">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="dc671d01-4ead-4303-a2f8-adb2ed805e46">
+        <table class="table table-sm bg-light" id="76f3ed64-3370-43dc-a39c-fc2b53a2ae63">
          <thead>
           <tr>
            <th scope="col">
@@ -6125,32 +6125,32 @@ Panel(comp1, comp2, comp3)</code></pre>
         </table>
        </div>
       </div>
-      <div class="mt-5" id="71c719eb-30f7-44d4-be26-59c87a399e39">
-       <div class="d-flex justify-content-between" id="c61cad7e-ff5a-4c4c-b21d-ca3bc9d3bc84">
-        <h4 id="69fe4d58-417f-43e7-9af6-42d3346ef6b6">
+      <div class="mt-5" id="1fd2b7f1-16c9-4ce5-b476-a41328c82700">
+       <div class="d-flex justify-content-between" id="34778c3f-31d7-4d2f-a391-549649e8c1ba">
+        <h4 id="aa6e15c6-dd27-4fa0-8c0e-9d3414c707d7">
          Method
-         <span class="text-primary" id="d7210149-3501-4b56-8197-21a94c41d845">
+         <span class="text-primary" id="333c8851-2f0f-40a3-9a52-d2272fbf4a57">
           horizontal
          </span>
         </h4>
-        <div id="5c23351a-1e03-4ff1-a985-2d689cabe2a6">
-         <button class="btn-sm btn btn-outline-primary" data-target="#826014f7-dde3-4dc9-b129-354a13ac4787" data-toggle="collapse" id="dc866b02-db4c-4e30-8090-9269f9d37d5c" onclick="return false;" type="button">
+        <div id="a5584b5e-96e0-4ffe-a993-f9dc6fb7d3d7">
+         <button class="btn-sm btn btn-outline-primary" data-target="#badb0054-6bad-435e-84f2-428bc3a2452d" data-toggle="collapse" id="56da271d-e8d8-413c-be55-2693a1574c77" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="7c64c037-009e-4f61-8a0e-df594ceb07fa">
+       <span class="text-muted" id="a6831b62-d52e-4c07-986d-708256b24240">
         Makes the panel with the horizontal arrangement of encapsulating
         elements
        </span>
-       <pre id="5a50c485-c400-413d-85ee-739218424a3d"><code a="" c="" l="" s=" p y t h o n ">horizontal()</code></pre>
-       <div class="ml-3 collapse" id="826014f7-dde3-4dc9-b129-354a13ac4787">
-        <h6 id="e2d47e4e-5c2a-47ac-9298-7b1e52864f45">
+       <pre id="eb9955e7-b506-44b9-9faf-a0817d992f6f"><code a="" c="" l="" s=" p y t h o n ">horizontal()</code></pre>
+       <div class="ml-3 collapse" id="badb0054-6bad-435e-84f2-428bc3a2452d">
+        <h6 id="f59fb48b-c1ad-453e-9c64-9bb3289bb3b2">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="8477ce35-84f3-49ac-9e0e-7ed7c4aa3b3e">
+        <table class="table table-sm bg-light" id="f1803755-79fc-4739-964a-91e26d195a37">
          <thead>
           <tr>
            <th scope="col">
@@ -6183,13 +6183,13 @@ Panel(comp1, comp2, comp3)</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="e04012a1-8ce4-445f-bfe6-bf1da97967b1">
-        <h6 id="69575537-c890-4f30-9bcc-1bd93358e21a">
+       <div class="ml-3" id="a59ab0a0-c546-401b-80df-e3503a5415dc">
+        <h6 id="a13655c6-f043-4fbb-8ba2-ed2cbd0a2cb3">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="4911d6db-a5d6-4c0a-85af-fe6033a98e3e"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text, Panel
+        <pre id="523789fd-b0fc-4cb0-8595-505cc6bd4112"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text, Panel
 
 comp1 = Text("Component 1")
 comp2 = Text("Component 2")
@@ -6197,21 +6197,21 @@ comp3 = Text("Component 3")
 
 Panel(comp1, comp2, comp3).horizontal()</code></pre>
        </div>
-       <div class="ml-3" id="9d968ae3-6739-4bda-af4d-b168107e76ae">
-        <div id="3b90c811-80d9-4516-a5f8-f222918fb3ff">
+       <div class="ml-3" id="6fdf4d9f-e3dc-4352-ab7d-d7c392b02c35">
+        <div id="425b4b30-d196-40e2-b68d-7df993f117a7">
          <div class="row">
           <div class="col-md">
-           <span class="border" id="347ea09d-f303-4bb7-9034-21cd229c4927">
+           <span class="border" id="0c467d1c-cb95-4431-a494-fa87737e9d5e">
             Component 1
            </span>
           </div>
           <div class="col-md">
-           <span class="border" id="79fd731e-5bd6-48d2-b9a3-eeefc29a220f">
+           <span class="border" id="a1baa9f2-3223-4f57-9b3f-6bef80faa067">
             Component 2
            </span>
           </div>
           <div class="col-md">
-           <span class="border" id="0b5b7266-5a92-4237-b7a4-069958e1aeb1">
+           <span class="border" id="05f6f8b8-023d-45f7-b50e-e53cc6c14fda">
             Component 3
            </span>
           </div>
@@ -6219,32 +6219,32 @@ Panel(comp1, comp2, comp3).horizontal()</code></pre>
         </div>
        </div>
       </div>
-      <div class="mt-5" id="9e07445f-745d-4ef5-9ad0-fb755aecdc3d">
-       <div class="d-flex justify-content-between" id="a23d9681-aa23-4a29-b888-c377eb10d9bb">
-        <h4 id="7c48f35a-5521-4b16-bd54-6e51fd3d3987">
+      <div class="mt-5" id="c16ca5bf-be67-44c9-ad2a-5aafa36b7ba0">
+       <div class="d-flex justify-content-between" id="1b6b3ceb-f9b0-4796-a4f4-f43bd6b3dcda">
+        <h4 id="90a91691-e2ea-4eb8-85fd-5a748b61f5ee">
          Method
-         <span class="text-primary" id="5f940c49-cc3d-4343-b0c4-edec75edab0c">
+         <span class="text-primary" id="e25f3816-193d-492e-bea5-251f526cf0cc">
           vertical
          </span>
         </h4>
-        <div id="36485046-bac0-4b69-8020-d180e6a2abd7">
-         <button class="btn-sm btn btn-outline-primary" data-target="#4c601d61-4101-4fef-a415-bc9550afcc75" data-toggle="collapse" id="9473c02d-0b11-4435-a53c-f5613bce4115" onclick="return false;" type="button">
+        <div id="1ba77822-7ef0-43de-9fa0-c095c6678368">
+         <button class="btn-sm btn btn-outline-primary" data-target="#c661e0a8-ce33-46db-a539-5d19c0ccf1dc" data-toggle="collapse" id="88d74ec5-d134-4044-808c-ce43bbac7544" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="a4f55ba8-4e3f-4c08-b9cb-116839b2e6d4">
+       <span class="text-muted" id="3bc1124d-419c-4a3f-b73b-83610c96de5a">
         Makes the panel with the vertical arrangement of encapsulating
         elements
        </span>
-       <pre id="073f2ad2-62d8-4581-bdfd-792665f7f1f6"><code a="" c="" l="" s=" p y t h o n ">vertical()</code></pre>
-       <div class="ml-3 collapse" id="4c601d61-4101-4fef-a415-bc9550afcc75">
-        <h6 id="cafcc8f1-9a47-47d9-965b-7689f125f93f">
+       <pre id="43da2e5c-37b3-40a8-b413-2e91ae1e6039"><code a="" c="" l="" s=" p y t h o n ">vertical()</code></pre>
+       <div class="ml-3 collapse" id="c661e0a8-ce33-46db-a539-5d19c0ccf1dc">
+        <h6 id="825dd5c9-476e-4f75-9508-d50f612ef593">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="bc52c056-dc08-4911-bbcf-5c0ce1df26dc">
+        <table class="table table-sm bg-light" id="2e697993-e68c-44a5-8ad6-7f4af5a8402d">
          <thead>
           <tr>
            <th scope="col">
@@ -6277,13 +6277,13 @@ Panel(comp1, comp2, comp3).horizontal()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="7e445532-5986-4992-a786-3871dff5cecb">
-        <h6 id="44c5bae6-7426-44fb-8187-c5735d838dfa">
+       <div class="ml-3" id="aa04f1b1-0f6b-479b-a682-e721c8523bbf">
+        <h6 id="61ef89b9-49ea-4d3d-8a3a-a39000f420e5">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="336782ce-0d31-4857-82e6-13ef3fe6acf6"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text, Panel
+        <pre id="96e6aba0-1d23-4635-824c-ccb9d8413fd6"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text, Panel
 
 comp1 = Text("Component 1")
 comp2 = Text("Component 2")
@@ -6291,25 +6291,25 @@ comp3 = Text("Component 3")
 
 Panel(comp1, comp2, comp3).vertical()</code></pre>
        </div>
-       <div class="ml-3" id="1c54eb3f-2e0c-4454-ab0b-0245aaa0e52b">
-        <div id="c77f544a-9d35-4c6b-bfdc-5ce6ea2b03a0">
+       <div class="ml-3" id="e0f7e47a-e833-4e20-9ffc-30672ab891a5">
+        <div id="fce44251-79ee-4fd0-b3b4-bd12f9c77a9b">
          <div class="row">
           <div class="col-md">
-           <span class="border" id="adb26186-9b89-49e4-9510-03e15126df26">
+           <span class="border" id="0019619c-d354-4fa7-b6f5-46a4bc47e3b9">
             Component 1
            </span>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <span class="border" id="e42107c4-d92c-4cda-a538-471aecb959ad">
+           <span class="border" id="b4296d1f-d996-45a9-bf76-08bcef415fde">
             Component 2
            </span>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <span class="border" id="10c2a0f9-a231-450c-b8fa-5e4c28c2aa53">
+           <span class="border" id="05191cf2-8ddf-4d2e-b5df-e65c1f2d6b47">
             Component 3
            </span>
           </div>
@@ -6319,75 +6319,75 @@ Panel(comp1, comp2, comp3).vertical()</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="1e68b373-0b60-4d00-be9a-18aded4cdc15">
-     <div class="mt-5" id="b5fbe931-edbf-4ced-83a1-437a1bfbbb38">
-      <div class="d-flex justify-content-between" id="52ba41fc-6c4b-4d00-a42f-e222ed0c52bc">
-       <h1 id="856f49bc-7973-488b-8f0c-256f563c2cfc">
+    <div class="tab-pane fade" id="4c59ffd5-47d6-4d50-a931-c0f29a2de26e">
+     <div class="mt-5" id="4e3a5848-376a-45e3-a254-367869cd39b7">
+      <div class="d-flex justify-content-between" id="59c8f39d-cf11-4779-a104-089621cc4059">
+       <h1 id="bb939102-9b21-468e-9b8f-1fc154257446">
         Class
-        <span class="text-primary" id="81db49df-f58b-4dbd-8087-05454930e99e">
-         <span id="36db6a05-4c32-4fd2-89a7-ed1c6c0bccc5">
+        <span class="text-primary" id="2fd6de33-6ce7-4daa-a078-842227f1adc0">
+         <span id="e47a02bd-d506-4658-be10-6821068cc242">
           Separator
          </span>
         </span>
        </h1>
-       <div id="21d5f4dc-572b-48b5-ab6e-39e34ce4bc0b">
+       <div id="2a011220-8c71-4c72-a3a7-078d93066d5c">
        </div>
       </div>
-      <span class="text-muted" id="0d9ffaf8-9e56-4a41-aecf-8f9ba2af1630">
+      <span class="text-muted" id="15b60cde-5910-4db7-8968-bb6aa9dba119">
        A horizontal line separator.
       </span>
-      <pre id="fc8fa763-53f7-4e54-99f5-cbf547487f97"><code a="" c="" l="" s=" p y t h o n ">Separator()</code></pre>
-      <div class="ml-3" id="76940db5-f5fe-40eb-b686-331e6056c479">
-       <h6 id="accaeda0-6383-4e89-b312-c076f41aab56">
+      <pre id="4579044b-1c24-4bfa-bb1e-33fd19543550"><code a="" c="" l="" s=" p y t h o n ">Separator()</code></pre>
+      <div class="ml-3" id="d3f3b226-61c5-490c-a8c9-f763b280afdc">
+       <h6 id="846c0b59-22a3-47ea-8011-3cf085da0b13">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="16c0bae2-aee3-4348-b4f1-64ca72f1066f"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Separator, Text
+       <pre id="3c3cc8fc-b349-4659-ae09-f4768a455af6"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Separator, Text
 
 Text("Top Text")
 Separator()
 Text("Bottom Text")</code></pre>
       </div>
-      <div class="ml-3" id="2851382b-87e8-4b75-b125-84ff899b7c62">
-       <div id="f5e1854f-df9f-4aa7-84b9-b0c85a55b69c">
-        <span id="6e757cde-ca95-4de1-b71b-64ce45660c2c">
+      <div class="ml-3" id="caae3d61-2b9f-481c-8c7e-2de66ce7de7b">
+       <div id="1ce7e2bd-149f-4c8a-95f3-c5fe32691c2a">
+        <span id="8dd3770b-19ef-4a22-adbd-c8714fcacaa3">
          Top Text
         </span>
         <hr/>
-        <span id="3febaf6b-eaef-4d34-9bc0-573e64753b65">
+        <span id="99811fea-d010-4845-bef1-041be7afe10e">
          Bottom Text
         </span>
        </div>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="a1a2e1b4-cec7-4218-b4e4-c75ac5f6aad0">
-     <div id="21bb412b-7758-42a4-bf79-f74217c95cf8">
+    <div class="tab-pane fade" id="dc89c8ac-0d68-466b-b79a-95499060fccf">
+     <div id="e8099b73-92f7-4317-ada6-907dbb22ac72">
       <hr/>
-      <ul class="nav" id="387934a0-71b5-42bb-bab7-ecf2540d9b0a" role="tablist">
+      <ul class="nav" id="06a163c1-b8db-4775-bd10-160e9d372308" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-target="#b8672300-2794-4a86-a2c1-f7c3b5a9586e" data-toggle="tab" href="#b8672300-2794-4a86-a2c1-f7c3b5a9586e" id="884d2dc3-f23c-4dd2-8b6c-7040e8f6177f">
-         <span class="text-secondary" id="a8b1c09a-653c-40fc-b793-d1757566d666">
-          <span id="584377d9-9c9b-4518-ad43-de530d634f73">
+        <a class="nav-link active" data-target="#fef5ba32-2091-4d1c-94a3-904ebc133b9d" data-toggle="tab" href="#fef5ba32-2091-4d1c-94a3-904ebc133b9d" id="3090830b-6ba0-4880-8a47-b8ada243b8cf">
+         <span class="text-secondary" id="d05e61ef-3cae-45a8-9336-8b74c41c80e6">
+          <span id="3cf62e45-376c-45d8-aa77-c4617758d9b7">
            Table
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#7551e04e-79c5-45fe-a8b1-e9dc3d81e451" data-toggle="tab" href="#7551e04e-79c5-45fe-a8b1-e9dc3d81e451" id="1017d1ef-9d06-4f26-94f8-09bbc487c7a5">
-         <span class="text-secondary" id="f8fb6ee1-2aee-4351-9b10-a4455c71b88a">
-          <span id="4ea35966-d6f6-4899-805d-298075de09b5">
+        <a class="nav-link" data-target="#164bcd7c-6460-4b58-8530-8e9ab78c151c" data-toggle="tab" href="#164bcd7c-6460-4b58-8530-8e9ab78c151c" id="f0aef289-e09e-444c-ad69-65b88ba65d38">
+         <span class="text-secondary" id="96384f36-d25c-4be6-a062-8ea0f706b9bc">
+          <span id="1082a15a-f0f0-4390-bd9e-006eb7a39eff">
            Table.Head
           </span>
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-target="#9b5cf3a3-51c9-4d5e-9bb0-b952e3a13ac6" data-toggle="tab" href="#9b5cf3a3-51c9-4d5e-9bb0-b952e3a13ac6" id="57a562e0-f245-4a30-8302-7d3d8de20f99">
-         <span class="text-secondary" id="49296ca9-cbf4-41ab-9a25-2bba2a8b45d8">
-          <span id="30110650-81d9-4620-bd72-ad6b7bbc7c1c">
+        <a class="nav-link" data-target="#1e8e9199-bcde-41cb-84ad-cab45e65446f" data-toggle="tab" href="#1e8e9199-bcde-41cb-84ad-cab45e65446f" id="08c72baf-d46f-4598-8801-00cfb2cabeb9">
+         <span class="text-secondary" id="22b2ab0b-2a6a-4cc7-b221-27a6235ad98b">
+          <span id="c45cf173-0180-494d-9b1a-9a73b6e94287">
            Table.Body
           </span>
          </span>
@@ -6395,34 +6395,34 @@ Text("Bottom Text")</code></pre>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="b8672300-2794-4a86-a2c1-f7c3b5a9586e">
-        <div class="mt-5" id="f313d3ec-0b38-4be8-a5d7-6805b8806b31">
-         <div class="d-flex justify-content-between" id="15b13a1d-f450-46aa-b352-03f7107a7bed">
-          <h1 id="ce475370-4e3e-486e-b30d-dfa5adec1eec">
+       <div class="tab-pane fade active show" id="fef5ba32-2091-4d1c-94a3-904ebc133b9d">
+        <div class="mt-5" id="65a69cd2-d0d3-4479-9d6b-39cf3e0e1c2e">
+         <div class="d-flex justify-content-between" id="7d8dc40a-e65b-498c-b1ba-7bd34cf1f8b6">
+          <h1 id="34ec232b-7a44-464c-a47f-4fd6f8ea3d1b">
            Class
-           <span class="text-primary" id="de57eae2-6e54-4468-9c60-537d09adafeb">
-            <span id="584377d9-9c9b-4518-ad43-de530d634f73">
+           <span class="text-primary" id="46b1d87c-5a8e-4a09-8ff6-8ab640a7a889">
+            <span id="3cf62e45-376c-45d8-aa77-c4617758d9b7">
              Table
             </span>
            </span>
           </h1>
-          <div id="bc8fd0d8-7bda-4332-9be5-9518226667c4">
-           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#0a118c35-a68a-492b-9c86-966e29697b20" data-toggle="collapse" id="d07eae52-cadc-4a14-ab7c-3927224ee800" onclick="return false;" type="button">
+          <div id="a17d4da9-c35e-4470-b973-0a1c0ae8ee43">
+           <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#e210349f-b6d6-4e72-8d4a-57b30a0e4959" data-toggle="collapse" id="10bc40d2-8e87-4b41-8300-193f08d7b2ba" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="a26b5f6f-5426-43c7-9463-0216217f1893">
+         <span class="text-muted" id="ed19f0cf-aa10-43f8-b07d-c6ed7e11624b">
           A web component for a table.
          </span>
-         <pre id="285dabb2-6969-47a7-942f-0e3837427f4c"><code a="" c="" l="" s=" p y t h o n ">Table(head, body)</code></pre>
-         <div class="ml-3 collapse" id="0a118c35-a68a-492b-9c86-966e29697b20">
-          <h6 id="ab1e9da4-02d4-4ed0-82f7-e112eb8f31d5">
+         <pre id="c62b858c-b5f7-43b2-b9af-192aa6119787"><code a="" c="" l="" s=" p y t h o n ">Table(head, body)</code></pre>
+         <div class="ml-3 collapse" id="e210349f-b6d6-4e72-8d4a-57b30a0e4959">
+          <h6 id="78051582-662a-48be-8b9d-77b93df0f787">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="d78cca89-8c9c-4b65-aa77-52a901663910">
+          <table class="table table-sm bg-light" id="957fcd00-ddd8-454b-a36b-088d71c56e72">
            <thead>
             <tr>
              <th scope="col">
@@ -6470,13 +6470,13 @@ Text("Bottom Text")</code></pre>
            </tbody>
           </table>
          </div>
-         <div class="ml-3" id="9fc938b8-3837-4ef3-a32f-a64de080ca83">
-          <h6 id="f6c30d53-68c4-4772-a2cc-87be3c26895d">
+         <div class="ml-3" id="7f5cd2c5-fee8-46fd-a70b-66de34a9d4fe">
+          <h6 id="7b675b64-ab27-4b84-860c-3e0130cd380b">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="fbbcd603-8eaa-43b8-af4f-6cc649c0736f"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
+          <pre id="8071637b-f255-4779-8e4d-83fa105369e2"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -6487,8 +6487,8 @@ Table(
     ]
 )</code></pre>
          </div>
-         <div class="ml-3" id="8446cd10-69d7-48ee-96fa-e90f98bc1fad">
-          <table class="table" id="db2ba3f1-b625-4563-a69b-1cf86227b3c5">
+         <div class="ml-3" id="374cc6ee-1a45-4fcd-9540-a948290eb8be">
+          <table class="table" id="8ab3c23b-d93a-4190-933b-751e54f1f196">
            <thead>
             <tr>
              <th scope="col">
@@ -6539,53 +6539,53 @@ Table(
            </tbody>
           </table>
          </div>
-         <div class="mt-5" id="46692484-910c-4569-80d9-f47321d974cd">
-          <h4 id="4724ed77-5c9b-4991-b628-a0e6541e9cae">
+         <div class="mt-5" id="505d6318-7f1c-4a68-af26-300dc4c262d5">
+          <h4 id="59eb9eed-67fe-4f30-a5a8-5915689691b6">
            Property
-           <span class="text-primary" id="8cabdaf1-f1f0-4167-9f08-eb5ee62f9b1d">
+           <span class="text-primary" id="124a5a12-a989-4004-a7ad-015596cf311a">
             body
            </span>
           </h4>
-          <span class="text-muted" id="b9492f26-8411-42eb-82c8-00c3c5770746">
+          <span class="text-muted" id="73fbba08-c41f-453d-9966-2ac0fc413a72">
            The table body.
           </span>
          </div>
-         <div class="mt-5" id="b8515e94-6784-44d8-a47c-ae41750247f5">
-          <h4 id="1c29e623-6c10-4215-8bcc-b1941b922df7">
+         <div class="mt-5" id="f4884b5f-46a9-4e64-9d18-beb8822fa860">
+          <h4 id="e44d2fcf-8f36-4e20-9635-012c76ec0ed3">
            Property
-           <span class="text-primary" id="b7f85f1b-5ba0-46f0-86ac-16f7f856c20a">
+           <span class="text-primary" id="a6049036-802e-4b0b-8a9d-c100e4361d71">
             head
            </span>
           </h4>
-          <span class="text-muted" id="c109f86e-fcd8-48e4-94ee-cf77928cbe91">
+          <span class="text-muted" id="b677b9aa-62b0-4812-bd5c-59a2b91362cc">
            The table head.
           </span>
          </div>
-         <div class="mt-5" id="223dc531-1647-4b2e-bd04-1a970e2a49e9">
-          <div class="d-flex justify-content-between" id="1a86f7d9-b7b4-4415-b87e-da8827ebb1e4">
-           <h4 id="8d339266-fd9a-45cd-bf4d-66cdc6389b6c">
+         <div class="mt-5" id="994d067f-d8ee-448a-a6a6-ad8c14fa8777">
+          <div class="d-flex justify-content-between" id="a437fd2f-2932-4837-a687-5ebff19c7aa5">
+           <h4 id="b2f0a1b9-a864-40cc-a245-788694cfeb9b">
             Method
-            <span class="text-primary" id="44f99c11-3b3a-4ba7-9156-c5c16ad91363">
+            <span class="text-primary" id="561387a7-ddea-478f-b8a5-7b155e7d37ce">
              as_bordered
             </span>
            </h4>
-           <div id="eb80e052-34c7-4220-8d86-e65e377a0307">
-            <button class="btn-sm btn btn-outline-primary" data-target="#e0f1ac81-f2ad-4fba-bd78-bf302239df57" data-toggle="collapse" id="df6a69bb-ba9c-4845-9e6f-77a6dcd5c9b8" onclick="return false;" type="button">
+           <div id="25a5e723-c8e6-4c2a-8db1-15018f748cc9">
+            <button class="btn-sm btn btn-outline-primary" data-target="#88db113e-2932-4e5d-be87-0cb5de88b838" data-toggle="collapse" id="34a49aa3-4734-4545-be74-41af224fb732" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="1b74265f-0776-41c9-96b3-43ab771fedf6">
+          <span class="text-muted" id="ded2d947-02e9-4bfe-a0cc-3f537ef11a8e">
            Adds borders on all sides of the table and cells.
           </span>
-          <pre id="6f4c51dc-bbd2-41d8-bd7f-696adb00b304"><code a="" c="" l="" s=" p y t h o n ">as_bordered()</code></pre>
-          <div class="ml-3 collapse" id="e0f1ac81-f2ad-4fba-bd78-bf302239df57">
-           <h6 id="8de7f14f-733d-4ca7-b74e-c4cbfacc12d5">
+          <pre id="8521580f-35c0-474d-b26b-ef63e8062dc9"><code a="" c="" l="" s=" p y t h o n ">as_bordered()</code></pre>
+          <div class="ml-3 collapse" id="88db113e-2932-4e5d-be87-0cb5de88b838">
+           <h6 id="90c8c478-5a72-4fff-8d45-8f6b9f872554">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="bba3ef53-4f4e-4c5e-913f-f816196cf104">
+           <table class="table table-sm bg-light" id="02c7d3de-314c-470d-93bc-610e97c483dd">
             <thead>
              <tr>
               <th scope="col">
@@ -6618,13 +6618,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="000c6be8-0df9-41d0-af0a-f4441a7b3a78">
-           <h6 id="045b83b2-2120-45c5-bebd-e91fbacc188c">
+          <div class="ml-3" id="db96ce0b-f754-41fc-8d07-b61061fb3b67">
+           <h6 id="796b9059-0ead-4ab6-9c23-b33854d3ac53">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="c595415c-dd84-40a6-ab78-cc3d8c8df319"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
+           <pre id="bbe297cc-2548-4d5e-95dc-7e5682fecb9e"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -6635,8 +6635,8 @@ Table(
     ]
 ).as_bordered()</code></pre>
           </div>
-          <div class="ml-3" id="04aeb0e5-0aab-406b-8824-547beb4dd7fb">
-           <table class="table table-bordered" id="c9cecf17-e44f-446e-93f9-0f3ff86e8b31">
+          <div class="ml-3" id="12cce833-f98e-4a0f-8647-e5a1285c7886">
+           <table class="table table-bordered" id="467f8ed5-6281-4d8e-8a58-615aa1300b13">
             <thead>
              <tr>
               <th scope="col">
@@ -6688,31 +6688,31 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="87928462-cd7a-4358-b67d-27646403c69d">
-          <div class="d-flex justify-content-between" id="82401335-e444-4ed6-a8e7-3cff3aca080c">
-           <h4 id="f8fe3cc4-41df-4e43-ac41-72fd52119efe">
+         <div class="mt-5" id="467db69b-2e8b-4263-83a0-6deba32b96a2">
+          <div class="d-flex justify-content-between" id="97a745b4-0265-4953-8517-cffe7e4131ea">
+           <h4 id="07c675b5-ea6f-4539-b287-d2ee4b335f79">
             Method
-            <span class="text-primary" id="2495b9e6-b4a6-422f-bb4f-d409cec28398">
+            <span class="text-primary" id="a862ff42-690b-4813-90db-e33e4d9f7d38">
              as_dark
             </span>
            </h4>
-           <div id="9d1878d9-ab16-4190-a40b-2731916c7047">
-            <button class="btn-sm btn btn-outline-primary" data-target="#2a1d1145-c5b7-4fb9-9566-11409ddba7d5" data-toggle="collapse" id="ceb5464d-3916-438d-af76-510b076b787d" onclick="return false;" type="button">
+           <div id="3535ba21-baf8-496d-bf53-bf065a2c72bd">
+            <button class="btn-sm btn btn-outline-primary" data-target="#7cc7e8d1-0eb3-4b8e-b94b-765db2767153" data-toggle="collapse" id="86e020e7-cd59-4607-ba32-7cd391d2edbd" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="2e424a54-a32c-4892-a181-c73c031dce25">
+          <span class="text-muted" id="fad6987a-cbdb-48e9-af77-8c05dddec208">
            Inverts the colors—with light text on dark backgrounds.
           </span>
-          <pre id="6b3f428b-9d7b-47c5-b784-6dd20ab8fb4f"><code a="" c="" l="" s=" p y t h o n ">as_dark()</code></pre>
-          <div class="ml-3 collapse" id="2a1d1145-c5b7-4fb9-9566-11409ddba7d5">
-           <h6 id="208c934f-f879-45c8-baf3-f310f57ebdfa">
+          <pre id="d5284708-3559-4b4d-9623-a8abc1a14546"><code a="" c="" l="" s=" p y t h o n ">as_dark()</code></pre>
+          <div class="ml-3 collapse" id="7cc7e8d1-0eb3-4b8e-b94b-765db2767153">
+           <h6 id="f077cce6-99a9-4755-a7e2-b8e55db6b486">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="cd352584-4663-492d-a257-54d9d06fcbf9">
+           <table class="table table-sm bg-light" id="af9c0569-04e4-4b04-a006-9839b2cbbf43">
             <thead>
              <tr>
               <th scope="col">
@@ -6745,13 +6745,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="8ef0711b-b8a5-4401-9e57-17b809b55f02">
-           <h6 id="16a2290a-3216-4efe-9421-96b725d498c2">
+          <div class="ml-3" id="ca1de746-f939-40db-bcde-ef885179ad64">
+           <h6 id="ba81ab4c-07b2-4f05-8f1f-23d6a674464c">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="a0a95907-20cc-4a8a-9383-273323b4c2cc"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
+           <pre id="31d15036-cb85-40aa-87ee-794a9b73cfbb"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -6762,8 +6762,8 @@ Table(
     ]
 ).as_dark()</code></pre>
           </div>
-          <div class="ml-3" id="61e72a07-0445-4b6e-b712-f5ce197ddba9">
-           <table class="table table-dark" id="e7974e97-2470-40ad-97c5-43510924e21f">
+          <div class="ml-3" id="0951ad9c-704c-42de-83c0-6cea4a213197">
+           <table class="table table-dark" id="4f0db0a6-2f5f-4c6d-8016-6542ad78f6d3">
             <thead>
              <tr>
               <th scope="col">
@@ -6815,34 +6815,34 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="8a08218e-7dd1-4462-86fe-17b545e1170d">
-          <div class="d-flex justify-content-between" id="01af2733-3769-4fc0-8ff4-2f262a896daf">
-           <h4 id="2f22521b-6ecf-4f14-830c-9c4bcd37841a">
+         <div class="mt-5" id="d579c0cd-7611-4891-b9be-fd6391ec6e5d">
+          <div class="d-flex justify-content-between" id="8d10123e-49af-4623-a39d-27f6715bf71a">
+           <h4 id="7faf0690-0113-4d2d-936c-d5daf608621a">
             Method
-            <span class="text-primary" id="233364bc-0ec4-4c98-9246-38502cf4d273">
+            <span class="text-primary" id="d83fc0a4-6811-4ce3-a69c-148b264647c2">
              as_responsive
             </span>
            </h4>
-           <div id="d076ef2a-74e0-4b0a-a929-9eb9b2350d9e">
-            <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#261ef4d1-69e0-4478-9245-1633b7999baf" data-toggle="collapse" id="9de30385-1ca3-44ad-a03d-bd9966206c53" onclick="return false;" type="button">
+           <div id="1294f32a-4e8d-44c8-8b33-7b040c664976">
+            <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#4e841e7b-109e-41f5-8714-41711a159566" data-toggle="collapse" id="887b575a-91f7-4487-8a74-fc7df7e4b785" onclick="return false;" type="button">
              Argument
             </button>
-            <button class="btn-sm btn btn-outline-primary" data-target="#a1c1c735-eb29-4575-b35c-14b46ccddc8b" data-toggle="collapse" id="c9217868-e1e5-4214-bf1b-21d860a6672b" onclick="return false;" type="button">
+            <button class="btn-sm btn btn-outline-primary" data-target="#a096a9c4-125b-485f-8f59-5ac8b1dfbfed" data-toggle="collapse" id="4dc41a1f-e961-4431-9d4b-5152f009adb2" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="358a442a-f7af-4cdd-a355-8ad55926475a">
+          <span class="text-muted" id="ac3cfd6b-acf3-4940-a7f3-685b55b6be3f">
            Create responsive tables.
           </span>
-          <pre id="50475183-68d2-4136-9a0d-b6a0128eaf08"><code a="" c="" l="" s=" p y t h o n ">as_responsive(breakpoint=<breakpoint.sm: 'sm'="">)</breakpoint.sm:></code></pre>
-          <div class="ml-3 collapse" id="261ef4d1-69e0-4478-9245-1633b7999baf">
-           <h6 id="dae6f53b-d3c7-4a1b-b932-042c91296275">
+          <pre id="f8ae1e06-b756-44ef-8f6e-28fa57a7dc1e"><code a="" c="" l="" s=" p y t h o n ">as_responsive(breakpoint=<breakpoint.sm: 'sm'="">)</breakpoint.sm:></code></pre>
+          <div class="ml-3 collapse" id="4e841e7b-109e-41f5-8714-41711a159566">
+           <h6 id="2916a6af-9f4a-4bfa-b755-24b44acc0ebd">
             <strong>
              Arguments
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="52ea79fd-cf35-45a9-b3de-3cbec2a60dd6">
+           <table class="table table-sm bg-light" id="be7fcbcc-65da-43e5-aee8-b5389d38c566">
             <thead>
              <tr>
               <th scope="col">
@@ -6875,13 +6875,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ml-3 collapse" id="a1c1c735-eb29-4575-b35c-14b46ccddc8b">
-           <h6 id="d61208d6-1385-42ee-9da0-f537f712f3df">
+          <div class="ml-3 collapse" id="a096a9c4-125b-485f-8f59-5ac8b1dfbfed">
+           <h6 id="2f35c52c-9b8e-4bc9-a4c3-3828691df179">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="a48f50cc-15ec-4b91-a38e-89d642bc4093">
+           <table class="table table-sm bg-light" id="bdc5e578-11fe-4669-83d0-cbdf746959e1">
             <thead>
              <tr>
               <th scope="col">
@@ -6914,13 +6914,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="2f9b2c61-3acf-43d4-a139-3af4924282ac">
-           <h6 id="b562674a-e1c2-4396-ad57-bbeded6c2480">
+          <div class="ml-3" id="31845176-312b-4f9d-840d-1422b8ec08eb">
+           <h6 id="28a1812a-3383-4d04-afeb-72e8ce6a20cf">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="baf62ddf-de3d-4f9a-8610-9d265677bba5"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
+           <pre id="18e1ce10-6ffb-4ad0-a051-8851f48d7dbf"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -6931,8 +6931,8 @@ Table(
     ]
 ).as_responsive()</code></pre>
           </div>
-          <div class="ml-3" id="2a9a82a9-13c6-4413-8282-0f6cbebba930">
-           <table class="table table-responsive-sm" id="3894f8a4-5a9d-4816-922d-2173eb953208">
+          <div class="ml-3" id="72f5d81b-afb4-41c7-9933-c22c9a2b6f3b">
+           <table class="table table-responsive-sm" id="2dfc80c5-e6a3-43c8-9e34-ab8543dd2ddd">
             <thead>
              <tr>
               <th scope="col">
@@ -6984,31 +6984,31 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="d411098a-091d-4b39-8351-819295a608e5">
-          <div class="d-flex justify-content-between" id="eec66289-2c17-4121-bd89-4e28932967ff">
-           <h4 id="7deec970-1e03-430f-bd03-dc28c38bb01a">
+         <div class="mt-5" id="5cae0efc-c7aa-4248-a5d6-8bfcfdf887fe">
+          <div class="d-flex justify-content-between" id="4a392065-d666-4719-8e3e-6ce9d9691232">
+           <h4 id="c43b2c27-3fc6-407e-94c8-b24195fd1f6a">
             Method
-            <span class="text-primary" id="28fcb94b-7e47-4e29-b6a4-792f448e292a">
+            <span class="text-primary" id="ffdc1210-9de9-443a-9033-d7690378563a">
              as_small
             </span>
            </h4>
-           <div id="8173b42e-0351-498e-b5e2-d384a2659fbd">
-            <button class="btn-sm btn btn-outline-primary" data-target="#83baf0a9-4f8a-4fdb-a535-fe009298630a" data-toggle="collapse" id="785202b3-a469-425d-b979-314e0b1325ce" onclick="return false;" type="button">
+           <div id="ec00e3a1-3017-420a-ba89-b3859ffa3e72">
+            <button class="btn-sm btn btn-outline-primary" data-target="#1f231e93-c8ca-44cb-92c1-32da31b9ab2d" data-toggle="collapse" id="d74d3186-b4db-4c36-8499-d7d142944354" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="98dc34c2-8d0b-491f-946f-07ef4bea99ba">
+          <span class="text-muted" id="acb26d12-7b91-4e5e-a4f9-a70001929abb">
            Make tables more compact by cutting cell padding in half.
           </span>
-          <pre id="de57d69d-5fcf-4fd1-a953-bf1ec130b4b5"><code a="" c="" l="" s=" p y t h o n ">as_small()</code></pre>
-          <div class="ml-3 collapse" id="83baf0a9-4f8a-4fdb-a535-fe009298630a">
-           <h6 id="ad25cf17-6224-4024-9f65-63ec35db5d08">
+          <pre id="7644e212-e3fc-489e-a1fe-3bf093620ef0"><code a="" c="" l="" s=" p y t h o n ">as_small()</code></pre>
+          <div class="ml-3 collapse" id="1f231e93-c8ca-44cb-92c1-32da31b9ab2d">
+           <h6 id="5715eba7-df52-48e3-9f6b-b317ebec7727">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="969dd87b-dea4-4033-8b70-3deea1d30e45">
+           <table class="table table-sm bg-light" id="b7273e5f-5b4d-4bbf-ae4b-4ab5b228a460">
             <thead>
              <tr>
               <th scope="col">
@@ -7041,13 +7041,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="9f5c5326-fac1-4a00-9fe0-99c966beee9f">
-           <h6 id="936fd448-6f80-43e1-93b0-c141ab358e8e">
+          <div class="ml-3" id="7fac9e76-f9e5-458b-91c0-59ca221e4cb2">
+           <h6 id="0e869e83-b4a3-41eb-91a7-e89b46842f20">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="b5947422-3449-4cf3-90a5-1e5daafb0f91"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
+           <pre id="80a09315-bf71-4125-9219-387ec9b07365"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7058,8 +7058,8 @@ Table(
     ]
 ).as_small()</code></pre>
           </div>
-          <div class="ml-3" id="5ea002d6-360a-4a18-a112-76ff5a1bedf1">
-           <table class="table table-sm" id="ccdfd4a9-dabf-4307-ad54-5606c7c5c386">
+          <div class="ml-3" id="05d0f919-f6ac-4887-b092-cab61f98ddbc">
+           <table class="table table-sm" id="ec16b268-a9ef-4f65-9f11-4cebdef85ac0">
             <thead>
              <tr>
               <th scope="col">
@@ -7111,31 +7111,31 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="db316635-87aa-4232-baae-cf2caf528fb9">
-          <div class="d-flex justify-content-between" id="bed4c2ca-bf2d-4484-9407-0ed43e6b4ea2">
-           <h4 id="633338a4-15c3-464f-9f90-cc7868516bfe">
+         <div class="mt-5" id="5501cd4c-1c3f-4f03-a148-fbaa158c41c0">
+          <div class="d-flex justify-content-between" id="e2cd412d-93c6-408b-b50e-dc47057d3bfa">
+           <h4 id="5182082c-a62b-46ba-928f-4a3996fdb4d4">
             Method
-            <span class="text-primary" id="6d9c2fe6-784e-4288-887f-fd9d6512bcdd">
+            <span class="text-primary" id="ba6053dc-f115-4338-a6f6-f8c1655cb42f">
              as_striped
             </span>
            </h4>
-           <div id="7c2737f0-d912-4023-8a9f-edee9f827bd4">
-            <button class="btn-sm btn btn-outline-primary" data-target="#a421b418-2601-4c69-9667-efc8db17dc91" data-toggle="collapse" id="edb15669-012b-453b-8ada-a8da9ab52d8e" onclick="return false;" type="button">
+           <div id="408dc986-4336-4e21-9ada-f37e9da5404c">
+            <button class="btn-sm btn btn-outline-primary" data-target="#aefd7036-2e81-4ea9-9df3-33fa7cfdd003" data-toggle="collapse" id="1c1eafef-87ae-489e-be3b-019816f34664" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="f4c4cad7-851a-4ef6-9a70-14b14e676219">
+          <span class="text-muted" id="5939f7f8-cf80-4df9-8935-81b08c19fa89">
            Adds zebra-striping to any table row within the table body.
           </span>
-          <pre id="8a292b72-9105-4b63-9a43-131a9076ad79"><code a="" c="" l="" s=" p y t h o n ">as_striped()</code></pre>
-          <div class="ml-3 collapse" id="a421b418-2601-4c69-9667-efc8db17dc91">
-           <h6 id="84d230d2-9dec-4cc1-8fa7-81d9d483d842">
+          <pre id="8b6daa1b-a750-4e2f-bf10-f3946aef641f"><code a="" c="" l="" s=" p y t h o n ">as_striped()</code></pre>
+          <div class="ml-3 collapse" id="aefd7036-2e81-4ea9-9df3-33fa7cfdd003">
+           <h6 id="1f107208-931f-4a07-887d-c4698cdf8b3b">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="eae55fb3-1274-44f8-9a1f-db0a972be46e">
+           <table class="table table-sm bg-light" id="634ab72b-8a3c-4a6c-9840-740fda76dec7">
             <thead>
              <tr>
               <th scope="col">
@@ -7168,13 +7168,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="ee33ceca-603c-46af-a6a6-b1fcb0819aa5">
-           <h6 id="d0e778dd-f860-4554-ab26-4a5fa87f0ca9">
+          <div class="ml-3" id="9956059f-cbfd-4a40-b770-2e8dfb38093c">
+           <h6 id="3cfbea52-20c7-488f-b1b6-ae4188719aa0">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="5c7a5cf2-e504-40ae-9e55-a2bf64109da0"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
+           <pre id="b66e7dd2-3291-40b0-9967-ba02ef6a6a31"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7185,8 +7185,8 @@ Table(
     ]
 ).as_striped()</code></pre>
           </div>
-          <div class="ml-3" id="75bb9659-3eee-4933-85df-4a87b003b3f6">
-           <table class="table table-striped" id="610b24f1-a770-4ae1-9ab8-f5c1865462fc">
+          <div class="ml-3" id="68ab858e-5bfa-4b6d-9009-1ad48198fa66">
+           <table class="table table-striped" id="aa2cf423-3a07-42ed-b2b6-ec3dfa032be0">
             <thead>
              <tr>
               <th scope="col">
@@ -7240,46 +7240,46 @@ Table(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="7551e04e-79c5-45fe-a8b1-e9dc3d81e451">
-        <div class="mt-5" id="98fec8b4-16b6-48d9-9b33-2e59d3b4d12a">
-         <div class="d-flex justify-content-between" id="a4ecfa6a-0b6a-4863-89b1-178cc1baf0d2">
-          <h1 id="e60a90a4-2b4d-4675-aa21-7f5d4c3a66e1">
+       <div class="tab-pane fade" id="164bcd7c-6460-4b58-8530-8e9ab78c151c">
+        <div class="mt-5" id="2676be9b-d769-401f-a8cd-6721215bb0a9">
+         <div class="d-flex justify-content-between" id="a2e59383-52a0-4b76-9189-675c3dddf09a">
+          <h1 id="cf804992-5a91-4a53-93c9-be683a5e8ec2">
            Class
-           <span class="text-primary" id="d9cd4f8b-5b3e-4aa5-a5d6-7231c739f0cc">
-            <span id="4ea35966-d6f6-4899-805d-298075de09b5">
+           <span class="text-primary" id="ad9fa136-366c-4002-b91b-861e06c89cbf">
+            <span id="1082a15a-f0f0-4390-bd9e-006eb7a39eff">
              Table.Head
             </span>
            </span>
           </h1>
-          <div id="220bbc39-187b-4dbc-9835-4e38f7aa4efe">
+          <div id="ff5ef154-0a76-4d8d-bf18-df046abc1164">
           </div>
          </div>
-         <span class="text-muted" id="9541f40a-0cd3-4398-9ca3-b81069b653da">
+         <span class="text-muted" id="9d7fcdb6-56a1-4b59-91b8-60282176e1c9">
           The table head.
          </span>
-         <pre id="207078b5-b417-4b8f-b0c6-f81d57af6dc2"><code a="" c="" l="" s=" p y t h o n ">Table.Head(head)</code></pre>
-         <div class="mt-5" id="6f2ecb20-bee9-443c-b60b-305356e9b924">
-          <div class="d-flex justify-content-between" id="685351c0-f6e7-4566-bedd-9dc6ecc1ff0d">
-           <h4 id="af079de5-cb9d-4340-ae6a-b3e0fec63bf7">
+         <pre id="ebc1b2b5-9c7a-46b7-bfeb-1e6f7136bcf4"><code a="" c="" l="" s=" p y t h o n ">Table.Head(head)</code></pre>
+         <div class="mt-5" id="74ccaeba-c97c-4269-a206-04d59b44c6f8">
+          <div class="d-flex justify-content-between" id="b4129a7f-a47d-40fb-9822-faa88b9364da">
+           <h4 id="4ef80b2c-242d-4a85-bdcf-5a25ff296425">
             Method
-            <span class="text-primary" id="d3cf5618-1282-42bc-a2f3-bcab98c4ade2">
+            <span class="text-primary" id="cd822865-f9e6-4b8c-ac68-b9de7d303b8a">
              as_dark
             </span>
            </h4>
-           <div id="949acc1d-0f60-4f94-aeee-76e236abc7dc">
+           <div id="c30348c6-ee95-4bcb-b83e-482f75cacb4a">
            </div>
           </div>
-          <span class="text-muted" id="cf9e3d26-2923-43e9-9b9c-f097ee814c23">
+          <span class="text-muted" id="2520d4ef-15fb-48cc-9f10-fda8f58957fc">
            Makes the table head appears as dark gray.
           </span>
-          <pre id="66ac785e-19e8-4da7-ad9f-a33fd47748d6"><code a="" c="" l="" s=" p y t h o n ">as_dark()</code></pre>
-          <div class="ml-3" id="1017e03d-bc60-46ac-b7c5-e84aeb1f54a7">
-           <h6 id="3d62d2c6-4be7-4865-8541-4d4b15ac2845">
+          <pre id="dc261e74-1fe1-47e6-8b29-eb87926422be"><code a="" c="" l="" s=" p y t h o n ">as_dark()</code></pre>
+          <div class="ml-3" id="30dbda99-c694-4c24-b014-d0e929cbd66a">
+           <h6 id="05720e14-23a3-4a2b-8659-5557734e120f">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="284767fb-0886-4750-8134-932d3494d746"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
+           <pre id="1d9fc764-2295-4f5b-b0eb-f2ea89e43a22"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
 
 table = Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7291,8 +7291,8 @@ table = Table(
 )
 table.head.as_dark()</code></pre>
           </div>
-          <div class="ml-3" id="3a5633e5-dbd6-458b-8944-aca31f34a50b">
-           <table class="table" id="cfad38f9-6bb9-442a-832e-b5c8ba28d751">
+          <div class="ml-3" id="ca2e8b35-988e-418e-ae49-fc9ebbc7bd66">
+           <table class="table" id="c3e71cbc-8a1d-4050-9cf2-1c7059c96226">
             <thead class="thead-dark">
              <tr>
               <th scope="col">
@@ -7344,28 +7344,28 @@ table.head.as_dark()</code></pre>
            </table>
           </div>
          </div>
-         <div class="mt-5" id="139ddf10-56dd-4ebb-91e8-e4458773a081">
-          <div class="d-flex justify-content-between" id="a0c0bacf-3f43-4721-b57c-2ed9df6f18da">
-           <h4 id="5f4fdb59-928e-40e8-a98c-f21e432bb1a9">
+         <div class="mt-5" id="4b483db6-ec35-4ab3-b758-717cfc792839">
+          <div class="d-flex justify-content-between" id="476d85ff-cb43-4504-ba16-59bee6ef80a7">
+           <h4 id="efadc2b8-bab7-4a73-a6c4-39fc3c7286b1">
             Method
-            <span class="text-primary" id="b979a6ce-64d3-4fe5-ae06-e68743090b8a">
+            <span class="text-primary" id="1cf9415f-643e-423a-861b-727cbce1c0ea">
              as_light
             </span>
            </h4>
-           <div id="1de62364-d38d-472e-a812-08cc916ae4fe">
+           <div id="a5f4e1ce-4691-45e3-b6c9-26093e449c99">
            </div>
           </div>
-          <span class="text-muted" id="cf965008-16f7-47e9-b7a2-d8ac7fe0603c">
+          <span class="text-muted" id="134528a5-8d05-4476-875b-8bd463a42132">
            Makes the table head appears as light gray.
           </span>
-          <pre id="8222a883-9779-4ce1-81a7-206303bfd988"><code a="" c="" l="" s=" p y t h o n ">as_light()</code></pre>
-          <div class="ml-3" id="1274a050-22b4-4f1c-8f60-76b0c57f671a">
-           <h6 id="d75e130b-4d7e-4679-b2be-9b27b087a46c">
+          <pre id="3a4ac84a-c33e-4e27-8404-f0c36c0ac48e"><code a="" c="" l="" s=" p y t h o n ">as_light()</code></pre>
+          <div class="ml-3" id="907563ac-fb13-42e2-a1ae-b46111dc5829">
+           <h6 id="d1e2b2e7-1e15-4efb-ad6c-bdad57087089">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="24e6550e-f14c-40b1-8fb0-fd9d4470af8d"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
+           <pre id="0819d4b8-bb84-41a2-b63d-a93a4ede7fd3"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table
 
 table = Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7377,8 +7377,8 @@ table = Table(
 )
 table.head.as_light()</code></pre>
           </div>
-          <div class="ml-3" id="d1a2ae8f-76b8-4e1d-8899-f0e2febad33f">
-           <table class="table" id="f2997ad7-7be6-4598-bb24-11ec0e3163fe">
+          <div class="ml-3" id="ab2b5f5e-b6fe-4733-b2af-75b703fe6c78">
+           <table class="table" id="2b90136a-e79a-4230-841d-4ea2ce6fa2fd">
             <thead class="thead-light">
              <tr>
               <th scope="col">
@@ -7432,49 +7432,49 @@ table.head.as_light()</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="9b5cf3a3-51c9-4d5e-9bb0-b952e3a13ac6">
-        <div class="mt-5" id="e38d08f7-13cb-4b7f-b931-544278f75ab5">
-         <div class="d-flex justify-content-between" id="96939a80-0a2e-4d16-aa29-0cf413125c58">
-          <h1 id="154f63a9-fbca-4628-b08f-f47e0eb87e2a">
+       <div class="tab-pane fade" id="1e8e9199-bcde-41cb-84ad-cab45e65446f">
+        <div class="mt-5" id="cd903a1c-493e-47f2-bde6-a0c520f583ba">
+         <div class="d-flex justify-content-between" id="8c40bb76-cbef-42ed-bcd6-e4c4b2defa29">
+          <h1 id="340389a9-7e03-45f3-99f2-a60a706c19c6">
            Class
-           <span class="text-primary" id="fbfe555f-0840-4bc0-b4a9-ffc447a852f2">
-            <span id="30110650-81d9-4620-bd72-ad6b7bbc7c1c">
+           <span class="text-primary" id="bad38b9b-5437-4b79-84e2-7e6f721be16e">
+            <span id="c45cf173-0180-494d-9b1a-9a73b6e94287">
              Table.Body
             </span>
            </span>
           </h1>
-          <div id="cadc74eb-d9bd-45e7-9fea-3215d0e087db">
+          <div id="9a58a090-55ab-495d-82d2-60b10c80e1a1">
           </div>
          </div>
-         <span class="text-muted" id="9c5a4215-8f3a-4cad-a4cc-4397b765ac17">
+         <span class="text-muted" id="6ad83c57-1da1-4307-ba76-262b37683d73">
           The table body.
          </span>
-         <pre id="e4a3d642-e186-4347-82d6-759f1b6afe6a"><code a="" c="" l="" s=" p y t h o n ">Table.Body(body)</code></pre>
-         <div class="mt-5" id="646144f3-227a-46e1-aaa3-92cea0f6b01e">
-          <div class="d-flex justify-content-between" id="ddee2d11-46cf-4572-967d-b87a266c878a">
-           <h4 id="df6e6e1d-6ed9-4d74-8151-c81ee06150ba">
+         <pre id="0b569eb6-3cf5-474a-8b96-b5191d273c3c"><code a="" c="" l="" s=" p y t h o n ">Table.Body(body)</code></pre>
+         <div class="mt-5" id="b072be7b-cabe-4ddf-8b46-5f66e619001e">
+          <div class="d-flex justify-content-between" id="0479faf7-f727-46b9-9705-59e253f5d951">
+           <h4 id="b4d12239-432f-4f47-8cb8-5605ee984bfd">
             Method
-            <span class="text-primary" id="bbd7e758-452a-45d5-92d6-bea3f0629f65">
+            <span class="text-primary" id="0d76061b-15f7-4b06-9415-5639ced0cd3c">
              transform
             </span>
            </h4>
-           <div id="9f9cde3a-e0f3-4f2c-b28a-b91bdb7e75b7">
-            <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#fcd9bba0-1e16-45f6-8878-1bd7a4aae53c" data-toggle="collapse" id="2b92b9ac-13ab-49dc-86f1-6b598916fb2b" onclick="return false;" type="button">
+           <div id="a5421ed3-4a11-46e0-904c-0caea72b9746">
+            <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#e3f170dc-2534-469a-b0ee-bf3674f5900f" data-toggle="collapse" id="106b383d-5ffe-4a95-b793-e99f4a17cb80" onclick="return false;" type="button">
              Argument
             </button>
            </div>
           </div>
-          <span class="text-muted" id="bc9a8e80-c2e2-4296-b1b0-e6c0ff26a3a0">
+          <span class="text-muted" id="a9192fb7-4e9c-44d8-b7e1-75c75e840d1c">
            Defines a function to transform a cell value
           </span>
-          <pre id="9218350e-3dd5-414e-a734-8970f21f846d"><code a="" c="" l="" s=" p y t h o n ">transform(index, entity, fn)</code></pre>
-          <div class="ml-3 collapse" id="fcd9bba0-1e16-45f6-8878-1bd7a4aae53c">
-           <h6 id="24af8df8-21bf-4b28-b34f-a847e02d3e63">
+          <pre id="e867d6b0-1280-410e-8e08-b1d613264bbe"><code a="" c="" l="" s=" p y t h o n ">transform(index, entity, fn)</code></pre>
+          <div class="ml-3 collapse" id="e3f170dc-2534-469a-b0ee-bf3674f5900f">
+           <h6 id="5646c14c-ece2-41a4-931b-7b6fa25a391c">
             <strong>
              Arguments
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="8ab16bb5-eb1d-4298-af14-5729eefb4e52">
+           <table class="table table-sm bg-light" id="224de2ad-06af-4bb7-8ede-21edf800bac1">
             <thead>
              <tr>
               <th scope="col">
@@ -7539,13 +7539,13 @@ table.head.as_light()</code></pre>
             </tbody>
            </table>
           </div>
-          <div class="ml-3" id="0435203a-e4cb-4e22-8481-dc8a72bf7423">
-           <h6 id="35410711-ca19-486e-bc98-d9b10ee6e94c">
+          <div class="ml-3" id="8cde1e37-c8e3-4944-9957-a669aa0ede48">
+           <h6 id="de5f3390-296b-4b10-b8d8-ea095dd1c21e">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="6b5abf3c-052f-4a15-bc8b-484b6407347f"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table, TableEntity, Text
+           <pre id="731188ef-1162-48f0-a620-18944c8e4216"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Table, TableEntity, Text
 
 table = Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7573,8 +7573,8 @@ table.body.transform(
     TableEntity.VALUE,
     lambda v: f"<code>{v}</code>"</code></pre>
           </div>
-          <div class="ml-3" id="d55e1ec5-014e-47b1-83b4-fb8570bf06ca">
-           <table class="table" id="899adfdd-ea34-4faa-b9d1-8447b139caf6">
+          <div class="ml-3" id="234341dc-dfb5-475c-8de8-49a4f630da6a">
+           <table class="table" id="18f1d25f-4a9f-43eb-abc8-96f72116738c">
             <thead>
              <tr>
               <th scope="col">
@@ -7637,34 +7637,34 @@ table.body.transform(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="1e8a28bc-e53f-488f-8c70-6348c869cb06">
-     <div class="mt-5" id="0cea924a-00a4-46f9-abfe-e762eb6d2e95">
-      <div class="d-flex justify-content-between" id="105d8517-f0e2-4985-ba42-7c96edbdd566">
-       <h1 id="1280b50b-c652-447b-baff-56bf0c9d67b3">
+    <div class="tab-pane fade" id="498c37cf-78e8-4f92-bb6e-31636bd255dc">
+     <div class="mt-5" id="1b53dc1c-82c4-431d-9eb1-12740e134f19">
+      <div class="d-flex justify-content-between" id="b2e217b1-b2c6-4812-af55-3e6864c1be0b">
+       <h1 id="c8a403a0-d500-4fc8-9965-74bd7982ae91">
         Class
-        <span class="text-primary" id="7d18f0a7-b851-4752-9292-cb791d8bf113">
-         <span id="fa5b47fa-bdb0-4d84-b22b-12566abde956">
+        <span class="text-primary" id="94a9ecea-0149-4b28-bc2e-21d1bc17c704">
+         <span id="1c9ef853-d600-4c4d-8777-053f1d72675a">
           Text
          </span>
         </span>
        </h1>
-       <div id="d49012e5-785b-4e38-b812-4155668596bc">
-        <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#2e0ded31-ebe0-470a-add0-7cb3ff65db96" data-toggle="collapse" id="d501e83e-da1d-4a48-96cb-a4b9b5202da3" onclick="return false;" type="button">
+       <div id="4068fee7-3adf-4c57-9782-767b913c3da6">
+        <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#eeea1abb-c54c-4f37-98b7-e60786c2c339" data-toggle="collapse" id="693c1582-bd94-4315-8f19-b56192401930" onclick="return false;" type="button">
          Argument
         </button>
        </div>
       </div>
-      <span class="text-muted" id="ba311143-5cdc-49d3-ae10-b2818646d8e9">
+      <span class="text-muted" id="2590951b-23f3-426c-863a-20ec926447ed">
        A web component for a text.
       </span>
-      <pre id="5c5eaed9-4de3-4e6b-9591-33079776c3b6"><code a="" c="" l="" s=" p y t h o n ">Text(content)</code></pre>
-      <div class="ml-3 collapse" id="2e0ded31-ebe0-470a-add0-7cb3ff65db96">
-       <h6 id="e557dc04-a961-4375-93fe-943042a440c6">
+      <pre id="e2afd09d-67ca-4c53-b30b-6c01aeefee06"><code a="" c="" l="" s=" p y t h o n ">Text(content)</code></pre>
+      <div class="ml-3 collapse" id="eeea1abb-c54c-4f37-98b7-e60786c2c339">
+       <h6 id="e119cb2e-2b46-4077-8683-53b0555109a6">
         <strong>
          Arguments
         </strong>
        </h6>
-       <table class="table table-sm bg-light" id="c36b06b8-fb6c-4b05-b1de-a007bc844390">
+       <table class="table table-sm bg-light" id="681d5421-2137-493f-888e-7087a1c05926">
         <thead>
          <tr>
           <th scope="col">
@@ -7697,46 +7697,46 @@ table.body.transform(
         </tbody>
        </table>
       </div>
-      <div class="ml-3" id="81c8f130-4bc0-40a0-b2d6-327ef762fee3">
-       <h6 id="293fac2a-2405-462d-b3cc-4513c40a425a">
+      <div class="ml-3" id="3fce6845-05dd-447a-b2cc-918d542259d5">
+       <h6 id="d3506df9-fb6f-4ec7-b11c-61d87812c46a">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="57776601-ae03-4cd1-8de7-7013128ad092"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
+       <pre id="dec96257-9fba-4b29-b48a-fa249bbc0ad3"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
 
 Text("Normal text")</code></pre>
       </div>
-      <div class="ml-3" id="79d4d697-78af-4770-b86d-d67817422a44">
-       <span id="80ecb159-f802-417f-a27f-199ae642b358">
+      <div class="ml-3" id="373fba0b-5021-4d97-8d6e-48eb42666511">
+       <span id="28d361cb-3893-4394-a16d-71e1fc64e0ca">
         Normal text
        </span>
       </div>
-      <div class="mt-5" id="f1e56b11-941d-49cb-aafa-7a532f63883e">
-       <div class="d-flex justify-content-between" id="c88ce052-6547-4fc7-9112-57b40c9d1270">
-        <h4 id="7bdc6a6c-ba83-452c-b3ec-441dd5dcaa11">
+      <div class="mt-5" id="4d698a3d-5511-4ed3-adbf-faeb4b0d5283">
+       <div class="d-flex justify-content-between" id="195e42b2-5661-481b-ae09-3208d9cc8c7d">
+        <h4 id="f65510b8-a969-4427-9c80-f2fd302d5308">
          Method
-         <span class="text-primary" id="e1af8eb5-e50b-4e19-8103-da671ab47d6a">
+         <span class="text-primary" id="db2bc29b-8f2e-488e-9e43-36746bec7fd7">
           as_code
          </span>
         </h4>
-        <div id="f68b9c50-b8c9-4f91-bc84-64c595cf78e8">
-         <button class="btn-sm btn btn-outline-primary" data-target="#624a8548-c21e-48d1-8fa9-b03c93c91a2d" data-toggle="collapse" id="7e1583e2-8cf3-4af3-9461-6bc225c1edeb" onclick="return false;" type="button">
+        <div id="16e91e92-d3e7-4b33-b02e-9bc40d764b45">
+         <button class="btn-sm btn btn-outline-primary" data-target="#5afe5a7c-2f4e-46ab-8e16-297dca4729c5" data-toggle="collapse" id="4867ade0-4579-406d-b103-0f88b5c56b0a" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="62de7bd0-e6f8-4781-930c-96d8e5c15b8a">
+       <span class="text-muted" id="61f58e46-8220-4202-836d-4e844950d8dd">
         Makes the text wrap as a code snippet.
        </span>
-       <pre id="e1c21aae-536e-4278-8f16-753734a74456"><code a="" c="" l="" s=" p y t h o n ">as_code()</code></pre>
-       <div class="ml-3 collapse" id="624a8548-c21e-48d1-8fa9-b03c93c91a2d">
-        <h6 id="1b27748c-97c2-4eb7-aebf-a260fa3b9666">
+       <pre id="c01cf185-59bc-4603-b247-865fe5dbdfa3"><code a="" c="" l="" s=" p y t h o n ">as_code()</code></pre>
+       <div class="ml-3 collapse" id="5afe5a7c-2f4e-46ab-8e16-297dca4729c5">
+        <h6 id="91aac0ba-0150-49a7-9d02-66798a3a8ba0">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="0d428b15-256c-4dfa-9472-49d3bbe3747a">
+        <table class="table table-sm bg-light" id="983304cb-f20f-4363-9274-2b1cd8f99551">
          <thead>
           <tr>
            <th scope="col">
@@ -7769,48 +7769,48 @@ Text("Normal text")</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="5e28effd-e8e3-4fc8-8dae-9843e85b4b50">
-        <h6 id="69894e44-bd05-42a5-8ec7-31d89761d12b">
+       <div class="ml-3" id="fa06a992-269d-4f97-8375-3509ca0ec74d">
+        <h6 id="4c18ca46-9ea1-409c-a179-9a174534cb17">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="6936a794-565e-4d75-88c6-fa7d20facd94"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
+        <pre id="5b2b3241-5bbe-4e75-9f0c-eead1c937d47"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
 
 Text("print('Hello world!')").as_code()</code></pre>
        </div>
-       <div class="ml-3" id="42594431-b873-4a72-b238-4206efc98c56">
-        <pre id="7c01e69a-74c0-4e00-b511-374a278152be"><code a="" c="" l="" s=" p y t h o n ">print('Hello world!')</code></pre>
+       <div class="ml-3" id="291c656d-cd00-42cb-9555-36828b516824">
+        <pre id="d992ecc3-7bec-48a1-9884-c68674943419"><code a="" c="" l="" s=" p y t h o n ">print('Hello world!')</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="7624cf14-4a37-4248-91d7-13951619e35f">
-       <div class="d-flex justify-content-between" id="9521e79c-341f-4453-813c-a76e31c9019e">
-        <h4 id="13ff750d-ee95-455c-981d-3152d86d1db0">
+      <div class="mt-5" id="427ad043-ee95-4c70-b244-e09276492535">
+       <div class="d-flex justify-content-between" id="7c20be20-4fc1-455a-9d07-9a084839836b">
+        <h4 id="313cb5a4-41df-4b91-87bf-7d4f7244e3ae">
          Method
-         <span class="text-primary" id="88c00b21-236c-4ec4-973e-b1024af7c219">
+         <span class="text-primary" id="d3b31fd2-7f34-4da0-a2c1-99d31bb8fce9">
           as_heading
          </span>
         </h4>
-        <div id="c6701ebc-3e10-48fe-894d-e97b3cd9df93">
-         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#d5aa52d7-aa5e-485c-99b5-f68f3a4571d7" data-toggle="collapse" id="dc4fffea-a33b-4f6c-b4ec-3e8a06e959b2" onclick="return false;" type="button">
+        <div id="091082ff-b5de-4d31-a552-29b863448b3c">
+         <button class="ml-1 mr-1 btn-sm btn btn-outline-primary" data-target="#1ea4813c-1b36-4177-a818-b18d8c74c6b0" data-toggle="collapse" id="8f0501ea-f033-4b6b-90e6-0c6d70f3dd48" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-target="#f68ab0f0-c7e6-419c-b710-e9bb72be6ab6" data-toggle="collapse" id="66a7cb2c-4052-46d5-a6f6-74249e997e09" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-target="#548464cb-8e20-4655-a8d9-a4bab83aff14" data-toggle="collapse" id="ec85c2c7-367f-40c2-939b-256b327fdb9f" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="30e1aa51-9ea7-4e5f-b83e-02adb98c7098">
+       <span class="text-muted" id="c7e55131-5b03-480f-a31c-be7346f76832">
         Makes the text as heading.
        </span>
-       <pre id="55fe6656-bd7d-4d1d-9d0a-3edf193f3867"><code a="" c="" l="" s=" p y t h o n ">as_heading(level)</code></pre>
-       <div class="ml-3 collapse" id="d5aa52d7-aa5e-485c-99b5-f68f3a4571d7">
-        <h6 id="566ebb82-61f7-4b06-b78d-8216bc095410">
+       <pre id="883be783-5e16-4b9b-aa97-8a753d8e51d5"><code a="" c="" l="" s=" p y t h o n ">as_heading(level)</code></pre>
+       <div class="ml-3 collapse" id="1ea4813c-1b36-4177-a818-b18d8c74c6b0">
+        <h6 id="d751837a-522b-4d4c-a8e8-63c89161b2f9">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="52e4e61b-fa78-4cd7-bfa1-f52d650694d1">
+        <table class="table table-sm bg-light" id="c9eb4da6-ddb5-4add-b758-ec87812f3904">
          <thead>
           <tr>
            <th scope="col">
@@ -7843,13 +7843,13 @@ Text("print('Hello world!')").as_code()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3 collapse" id="f68ab0f0-c7e6-419c-b710-e9bb72be6ab6">
-        <h6 id="909a149e-9c50-4661-b091-6c4d7633f6b4">
+       <div class="ml-3 collapse" id="548464cb-8e20-4655-a8d9-a4bab83aff14">
+        <h6 id="ae10ca72-405a-4079-85e4-c9c568922717">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="94ca7391-06da-49da-b2fd-77cd3cb7bf05">
+        <table class="table table-sm bg-light" id="61aff750-cfd9-4e5c-a488-da967c98355f">
          <thead>
           <tr>
            <th scope="col">
@@ -7882,13 +7882,13 @@ Text("print('Hello world!')").as_code()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="fbd9c445-3440-49bf-8aef-d59255e4919a">
-        <h6 id="4a1d0cd5-c333-40ef-8ed3-f4a4d23555e6">
+       <div class="ml-3" id="57b9b725-cff4-4b2a-9b56-d10d55a5dcfd">
+        <h6 id="049ba178-94dc-43b7-9161-0f7af8662fc3">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="07acaca0-8af1-42aa-8bb2-c7ff28c82e91"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
+        <pre id="a5e82dc8-2387-4a44-865c-905ada57abaa"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
 
 Text("Header text 1").as_heading(1)
 Text("Header text 2").as_heading(2)
@@ -7897,54 +7897,54 @@ Text("Header text 4").as_heading(4)
 Text("Header text 5").as_heading(5)
 Text("Header text 6").as_heading(6)</code></pre>
        </div>
-       <div class="ml-3" id="b407c8a9-9d8e-4d2a-ba0f-6852b753d416">
-        <div id="82502066-9f50-409b-a77f-7b85d7f4360e">
-         <h1 id="748ee844-2662-4129-9d15-0d650b18a47b">
+       <div class="ml-3" id="a5aa2662-c6bb-47bd-bf13-44386144f18f">
+        <div id="82f9cb42-830d-47dc-9579-879e32f03071">
+         <h1 id="7f111dd0-709e-4592-8e0b-0245df036546">
           Header text 1
          </h1>
-         <h2 id="4f3b5696-4553-4a0a-ad01-b522cd610271">
+         <h2 id="0f939b0c-1f94-474f-ad81-51ce6823da2f">
           Header text 2
          </h2>
-         <h3 id="35ac6650-40f4-401b-b991-4a38d102b5cf">
+         <h3 id="9ea86a68-fad2-4b3f-8e5d-44d0eaae95e9">
           Header text 3
          </h3>
-         <h4 id="33521d98-76d6-44a3-8a59-ec911e9d77b1">
+         <h4 id="b99cf036-1129-41a5-8940-acc5fb94f9a5">
           Header text 4
          </h4>
-         <h5 id="f8860b44-607e-4e6a-abe3-ba33741e3fb8">
+         <h5 id="af78a916-614e-4bd5-a3ad-fa6f44c932a8">
           Header text 5
          </h5>
-         <h6 id="03129924-9f23-4600-a106-a3b82e2576b0">
+         <h6 id="4d1050ff-2b58-421d-806c-f2d5f8795aae">
           Header text 6
          </h6>
         </div>
        </div>
       </div>
-      <div class="mt-5" id="665856a6-c6c1-414a-9fe1-fc9c5bb69718">
-       <div class="d-flex justify-content-between" id="8d67f6ce-cb28-4f82-bbd7-655fef378b03">
-        <h4 id="6a297a86-5ce9-4a5b-a5ad-0519a65275c2">
+      <div class="mt-5" id="9561cb01-87bc-4d29-bcf1-148b8987a570">
+       <div class="d-flex justify-content-between" id="253295dc-a211-4555-9bdd-29ded3afa819">
+        <h4 id="fd7efa83-eab8-422a-8110-f82c8d45a026">
          Method
-         <span class="text-primary" id="3fe0d62b-c4c9-4458-8c69-83b6751fb7bd">
+         <span class="text-primary" id="98c5c8fe-df98-45b2-9378-9f8f45877c24">
           as_muted
          </span>
         </h4>
-        <div id="45d6b444-a4c0-47a1-ad82-461b9c614223">
-         <button class="btn-sm btn btn-outline-primary" data-target="#9815fefc-b96e-4b2c-b1bc-33b80cbce75d" data-toggle="collapse" id="f120089a-07dd-4b92-9279-86992206c99b" onclick="return false;" type="button">
+        <div id="32b953da-4e2a-4e1a-9f28-1659a3c3cdca">
+         <button class="btn-sm btn btn-outline-primary" data-target="#172c61ab-5e0d-422f-9d63-f7035ae1fa9b" data-toggle="collapse" id="0eb39973-79f2-4cca-bc9d-73897350c818" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="c33e2ece-c7b4-42c7-890a-4cf2164ab278">
+       <span class="text-muted" id="461858a5-3ffe-4c9c-80bf-9205ae10ea88">
         Makes the text muted.
        </span>
-       <pre id="b2ca34dd-1035-4bf1-ab15-4b4926dbd7ab"><code a="" c="" l="" s=" p y t h o n ">as_muted()</code></pre>
-       <div class="ml-3 collapse" id="9815fefc-b96e-4b2c-b1bc-33b80cbce75d">
-        <h6 id="d9f2cf68-0c94-4ceb-89c7-cc3270fbfb03">
+       <pre id="a5ab99e2-db9d-4bca-a440-c24188431f9a"><code a="" c="" l="" s=" p y t h o n ">as_muted()</code></pre>
+       <div class="ml-3 collapse" id="172c61ab-5e0d-422f-9d63-f7035ae1fa9b">
+        <h6 id="ba32cfb9-0836-47b1-9436-1793a5e4a9ef">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="f7fcba87-5350-4314-8e93-afbcf66245ed">
+        <table class="table table-sm bg-light" id="134e5e7a-e29e-40d3-9588-54862b5fe3c9">
          <thead>
           <tr>
            <th scope="col">
@@ -7977,47 +7977,47 @@ Text("Header text 6").as_heading(6)</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="6fc837cd-2191-4f8b-ac71-5cb62c9f398d">
-        <h6 id="3a9ab4eb-9f9e-42ca-a94d-176497e39a0c">
+       <div class="ml-3" id="8a349931-b970-4ee3-abc7-ad366cebe1ce">
+        <h6 id="00f1d743-bc2b-47f0-9a19-542d4a23b008">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="de71b91a-dbf7-4878-ae91-e3b110bcad43"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
+        <pre id="5b93ad14-7720-4be9-b62c-a9e707d76db9"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
 
 Text("Muted text").as_muted()</code></pre>
        </div>
-       <div class="ml-3" id="8550b378-9091-4c6f-ae3a-869860e2d300">
-        <span class="text-muted" id="fbbc8ff7-a8ea-4367-ad79-8aa38aebd020">
+       <div class="ml-3" id="f545a4bf-b961-4cde-b5a1-5c5d902f3a6a">
+        <span class="text-muted" id="1fe4d0d0-e9ae-4913-bfe2-fb2e3315f541">
          Muted text
         </span>
        </div>
       </div>
-      <div class="mt-5" id="135a4588-2684-4564-910f-0d113e177f78">
-       <div class="d-flex justify-content-between" id="4b2a7dca-13d7-4568-9cab-87f9fbedb654">
-        <h4 id="3a3a3f1f-a1f7-4e18-b463-58de885fa0bb">
+      <div class="mt-5" id="02eeecf3-5049-4743-aee8-9872f6fbcf29">
+       <div class="d-flex justify-content-between" id="a6258edd-967c-449d-9a9a-32654bda30cb">
+        <h4 id="99f66d97-e700-41e5-b10c-c982ab4c7699">
          Method
-         <span class="text-primary" id="b21acca9-ecef-4151-98fa-b4d1d7ed10b6">
+         <span class="text-primary" id="f581642c-7c84-4c17-aed4-d2613a706877">
           as_paragraph
          </span>
         </h4>
-        <div id="287543c2-adcf-4454-b58c-52610705c048">
-         <button class="btn-sm btn btn-outline-primary" data-target="#a86038c0-3e73-4743-8c91-cab2caec4084" data-toggle="collapse" id="a39e175e-a795-4eec-905c-f4a21b11e54e" onclick="return false;" type="button">
+        <div id="3c394537-e1c5-440c-abe6-c1edab8ce8bc">
+         <button class="btn-sm btn btn-outline-primary" data-target="#62919fc0-79e0-4b34-9820-2091751b24ce" data-toggle="collapse" id="adc848fa-6c72-4d2b-b3d9-55428b9e6ac4" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="ffb8b98e-35ac-4250-9590-3abc7f5d0a9d">
+       <span class="text-muted" id="692bbc88-11e3-4f7d-abe3-f9e35870aa36">
         Makes the text wrap in a paragraph.
        </span>
-       <pre id="c84fd1d4-e22b-44dd-b503-7c99ff629a1d"><code a="" c="" l="" s=" p y t h o n ">as_paragraph()</code></pre>
-       <div class="ml-3 collapse" id="a86038c0-3e73-4743-8c91-cab2caec4084">
-        <h6 id="ccaf266a-3b90-4457-9921-3a2a8344e84d">
+       <pre id="25f3ec55-ad87-4eef-b010-1fa00f3af8a4"><code a="" c="" l="" s=" p y t h o n ">as_paragraph()</code></pre>
+       <div class="ml-3 collapse" id="62919fc0-79e0-4b34-9820-2091751b24ce">
+        <h6 id="ee4e0dea-287a-4246-a7a0-8ce37a599ca3">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="85af9854-ac3a-44a1-bd67-6a259d512ccd">
+        <table class="table table-sm bg-light" id="d0d83933-4358-4fe5-9f88-24c7bfe1920c">
          <thead>
           <tr>
            <th scope="col">
@@ -8050,57 +8050,57 @@ Text("Muted text").as_muted()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="731bd7c0-f159-4df6-8d68-9e0c1b9a9e66">
-        <h6 id="346e9f39-570b-4b63-8669-43dc5fccedc0">
+       <div class="ml-3" id="860185b5-cc85-4852-b58f-3854371de90d">
+        <h6 id="6735fddc-678b-4feb-91b3-a65e39917847">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="d74edd2c-674f-4049-b8c1-dcd754d3728c"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
+        <pre id="a5848edd-ac38-4471-a1e3-6f70a9b5eb87"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
 
 Text("Paragraph 1").as_paragraph()
 Text("Paragraph 2").as_paragraph()
 Text("Paragraph 3").as_paragraph()</code></pre>
        </div>
-       <div class="ml-3" id="f24be3ac-0d9d-42be-804e-08c20689065e">
-        <div id="e3cfbb4c-f16d-4f60-9495-953fe09e3b52">
-         <p id="8706b0b8-f23a-4c8d-bdef-70ad2856471f">
+       <div class="ml-3" id="84a19de0-f661-4c88-bcf8-fbd41a4633d6">
+        <div id="17167d42-baba-4ac6-b5f7-5694e93600f5">
+         <p id="884b627a-553e-4888-9e51-a8740b42367f">
           Paragraph 1
          </p>
-         <p id="44921407-88eb-42f4-a012-84ed287f307e">
+         <p id="5b6730ca-c7eb-4708-8234-031a310462ee">
           Paragraph 2
          </p>
-         <p id="53b21f23-8ab2-4e4d-9f1f-dc8e125426fa">
+         <p id="82d31b01-f83e-4dee-934a-1c16f5a59f14">
           Paragraph 3
          </p>
         </div>
        </div>
       </div>
-      <div class="mt-5" id="9d2c981b-bae1-415f-8742-8d3f9d775eac">
-       <div class="d-flex justify-content-between" id="8d705d45-3dca-4ec9-a234-e11ad9a54950">
-        <h4 id="bb69d78a-8dd6-4b7c-ab73-03d35aec6a12">
+      <div class="mt-5" id="fb948dc2-01bd-4fb1-abbb-83e87c19b9c0">
+       <div class="d-flex justify-content-between" id="a01b7046-75fc-4289-b7b7-72b7162df1ef">
+        <h4 id="6aa360c8-01d6-4f7c-b644-b5b4bfacb25e">
          Method
-         <span class="text-primary" id="e59fbd94-3892-447c-a59c-252494069ea5">
+         <span class="text-primary" id="e4af74ae-6741-4617-9632-afd2269147ef">
           as_small
          </span>
         </h4>
-        <div id="a8b3404d-222b-4063-9a79-096de5b14087">
-         <button class="btn-sm btn btn-outline-primary" data-target="#3e8ebc87-eed9-4e5a-ab30-97cff9dcbfcf" data-toggle="collapse" id="de170e33-48b8-4aea-b9df-af9044e8456a" onclick="return false;" type="button">
+        <div id="29984103-db9a-4e6a-b1b0-354fee9c09d4">
+         <button class="btn-sm btn btn-outline-primary" data-target="#5ccbfeec-23eb-40b3-a630-853277fc15ae" data-toggle="collapse" id="2cd74106-59eb-4e75-98cb-ba0229af39c0" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="a10eaa60-8323-4491-8712-48e79c08f7da">
+       <span class="text-muted" id="9b4a1e25-8f6c-4939-a6c3-276a28fd42e7">
         Makes the text as small.
        </span>
-       <pre id="6b5b12af-3f0c-437f-8a87-0c7c58abc3a6"><code a="" c="" l="" s=" p y t h o n ">as_small()</code></pre>
-       <div class="ml-3 collapse" id="3e8ebc87-eed9-4e5a-ab30-97cff9dcbfcf">
-        <h6 id="f6b3ff04-8368-4cd9-8ffb-e8a6f8eae1ec">
+       <pre id="d7b1f57b-205f-4dc8-abbe-7785d6d74877"><code a="" c="" l="" s=" p y t h o n ">as_small()</code></pre>
+       <div class="ml-3 collapse" id="5ccbfeec-23eb-40b3-a630-853277fc15ae">
+        <h6 id="5b410d32-4589-4d59-8f70-117f98e90e9b">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="7f52c88c-00ba-4549-b646-7c1b42363c10">
+        <table class="table table-sm bg-light" id="dff23ae4-a642-4a52-8966-fb2394066a30">
          <thead>
           <tr>
            <th scope="col">
@@ -8133,49 +8133,49 @@ Text("Paragraph 3").as_paragraph()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="662d6581-0c74-49e5-872f-086d43355f95">
-        <h6 id="b3825e39-39cc-4c32-b7b0-9e768c0648d3">
+       <div class="ml-3" id="2f4febb6-76fd-4971-a5f6-b1ff210dab51">
+        <h6 id="9b01d5a6-a1cf-4c5d-ac66-702d53b073ea">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="e6c00119-6b46-4f2c-8889-d68f7ac25cc8"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
+        <pre id="88ee129d-0fc2-4d52-91b4-7376f019fa3c"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
 
 Text("Small text").as_small()</code></pre>
        </div>
-       <div class="ml-3" id="46e92e5b-c975-42cc-99dd-7e25ac5b830b">
-        <span id="64e688e0-be95-47a1-bd75-ebde5869140c">
+       <div class="ml-3" id="c13dae29-8194-4232-b31b-52f39b422e88">
+        <span id="6037e99b-1406-4d24-b34b-2333225d5301">
          <small>
           Small text
          </small>
         </span>
        </div>
       </div>
-      <div class="mt-5" id="13ba3ffe-ef76-4474-85c4-88c5de311bad">
-       <div class="d-flex justify-content-between" id="e8a40a6e-e312-49a9-8c3b-a2368c7c383e">
-        <h4 id="a6f016bf-0f11-4b7d-ac3f-dec335f5baad">
+      <div class="mt-5" id="42a37bec-6e50-48f8-88da-dbe8883ce8ef">
+       <div class="d-flex justify-content-between" id="a4ce58ab-05b7-4c6e-a818-3152c974b806">
+        <h4 id="44a239c9-8914-4a05-918d-91fb89beac7f">
          Method
-         <span class="text-primary" id="f722d678-10e5-4d60-a1fc-c061cbcc22c3">
+         <span class="text-primary" id="cd02e130-a777-4007-8cb9-62f21b8fc9c5">
           as_strong
          </span>
         </h4>
-        <div id="adc15a5c-d222-4f17-95de-5df094fb8c5f">
-         <button class="btn-sm btn btn-outline-primary" data-target="#6e84ae9b-1fb6-4e62-bf9a-2e45b4c3a09e" data-toggle="collapse" id="4ce1c41b-1612-4968-a5f7-59da7a4bff24" onclick="return false;" type="button">
+        <div id="08777e83-9eac-4630-86f1-a1b120809626">
+         <button class="btn-sm btn btn-outline-primary" data-target="#10cbf631-5025-436d-af24-849bc86155f7" data-toggle="collapse" id="49e83957-a665-42e5-9c72-078c1a0863d3" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="9bba4ebe-5ce0-4003-88c9-5cdb52529e53">
+       <span class="text-muted" id="fb4edfd7-0e6e-4505-a8e3-c596896c8125">
         Makes the text as strong.
        </span>
-       <pre id="08d690bf-5956-40d9-977e-f36c591e186a"><code a="" c="" l="" s=" p y t h o n ">as_strong()</code></pre>
-       <div class="ml-3 collapse" id="6e84ae9b-1fb6-4e62-bf9a-2e45b4c3a09e">
-        <h6 id="30330fe1-0ac6-4a32-9b22-470746a4574a">
+       <pre id="5c1905d0-9f68-4534-a7c3-a585a0ceabcb"><code a="" c="" l="" s=" p y t h o n ">as_strong()</code></pre>
+       <div class="ml-3 collapse" id="10cbf631-5025-436d-af24-849bc86155f7">
+        <h6 id="173f22ef-ce89-4055-b55c-f1fb2e7fced0">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="29ca5a05-4ff9-4265-82f2-d820f02c23d0">
+        <table class="table table-sm bg-light" id="4d44fde6-1aa0-4e38-b613-6a2e627952ab">
          <thead>
           <tr>
            <th scope="col">
@@ -8208,18 +8208,18 @@ Text("Small text").as_small()</code></pre>
          </tbody>
         </table>
        </div>
-       <div class="ml-3" id="3fe7358b-4078-4e25-b1b9-83bec4865dd7">
-        <h6 id="4ad68433-d9b4-481f-b482-929adb3aa1d6">
+       <div class="ml-3" id="2aaf5ae9-3db2-4194-b813-bb74410a8471">
+        <h6 id="bfcce022-3fad-485c-b3d8-1de711433b1c">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="e626d351-ee29-4355-94ba-17769548afa2"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
+        <pre id="d4ab1bba-5603-4dbe-98f1-e2b8d243d981"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Text
 
 Text("Strong text").as_strong()</code></pre>
        </div>
-       <div class="ml-3" id="3b4f26c0-1bf7-4065-a0d5-317c612a744c">
-        <span id="51807dbe-1b79-4687-b609-8a15c511641a">
+       <div class="ml-3" id="4800924f-bffc-40ba-9ea5-83bfb2e631fc">
+        <span id="5cf8f51e-89a5-49f3-8c67-4d966ba2abde">
          <strong>
           Strong text
          </strong>
diff --git a/docs/index.html b/docs/index.html
index 8ee0db3..d27bb2d 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -21,8 +21,8 @@
  </head>
  <body>
   <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
-   <img alt="Bootwrap Logo" id="bf81b050-95da-4fd5-9967-1827e7de117a" src="logo.png" width="32"/>
-   <span class="text-light" id="421afc24-2fde-4c60-b1c0-226442e4f210">
+   <img alt="Bootwrap Logo" id="df7bead9-8a34-4305-8051-8f12684c4cc8" src="logo.png" width="32"/>
+   <span class="text-light" id="01566b95-af41-479a-a5f5-5d2ad86104f0">
     <strong>
      Bootwrap
     </strong>
@@ -34,39 +34,39 @@
    <div class="collapse navbar-collapse" id="menu">
     <ul class="navbar-nav mr-auto">
      <li class="nav-item">
-      <a class="nav-link ml-2" href="index.html" id="cf8f51d8-bc8d-4e71-80bc-7d276fb4a5d3">
+      <a class="nav-link ml-2" href="index.html" id="7c94537a-d77a-414a-9cb2-1ad5087fe5ab">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="layout.html" id="488ab3eb-89fc-431e-85ed-94028cf6b40e">
+      <a class="nav-link ml-2" href="layout.html" id="ac2493d4-76a2-42b7-92ec-29c61a06f3c5">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="base.html" id="d823eae9-f785-4ca0-a0c8-9f1ff5f4cf05">
+      <a class="nav-link ml-2" href="base.html" id="e308b333-222a-4044-a50d-0ee4829c9758">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="components.html" id="a33dc838-504f-45d0-b4ef-02bae4420ca9">
+      <a class="nav-link ml-2" href="components.html" id="8f193e90-5013-488d-97d7-9fac28a75fa7">
        Components
       </a>
      </li>
     </ul>
-    <a class="ml-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="0174f9d2-417a-47ef-86b1-b7d7ded867cd" role="button">
+    <a class="ml-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="0a2fcd59-8a51-473b-94e5-8089ac686871" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container" style="margin-top: 90px;">
-   <div id="2581b0ac-fe4d-4fa4-9ac0-6f942dd95a97">
-    <div class="mt-3" id="d403d5c9-5e3f-44e6-9a39-316813fe3d85">
-     <div id="e6f2e64e-8ed7-4237-94b9-c76d84196cd7">
+   <div id="f27c8d65-fc3d-4cef-b633-114380b43511">
+    <div class="mt-3" id="13bdf4b7-69af-4ad3-a2a3-3067a2f81d68">
+     <div id="32f1ce5d-5252-4cef-9f2c-59889a54715f">
       <div class="row">
        <div class="col-md">
-        <div id="c19fa423-f708-4e6c-abf8-111b97f87669">
-         <h1 id="ba37695a-6c2e-44e7-9297-c54057ab30e4">
+        <div id="bb8ad7a2-93da-4f88-8eec-73c15fc1b802">
+         <h1 id="5a9ace64-e5b6-4c4d-bfad-c3b99c709dfb">
           <span class="display-4">
            Bootwrap
           </span>
@@ -74,16 +74,16 @@
         </div>
        </div>
        <div class="col-md">
-        <div id="90f94f94-513e-4ed0-ab9d-0b9f1c40a116">
+        <div id="9b8b83ec-eaaf-477d-b80b-cdda682c2c1f">
         </div>
        </div>
       </div>
      </div>
-     <div id="5d08439d-10b9-4086-a090-fe01411df99e">
+     <div id="eb6d11fe-c210-4ef1-8c6f-613a8b25dac5">
       <div class="row">
        <div class="col-md">
-        <div id="f0fdc605-95c1-4f3c-886a-afb4ce6801ee">
-         <p id="870bd5b7-ba34-46a1-b068-204acd53533e">
+        <div id="9e39a4ab-e23c-4432-8cf0-3284efd7c0de">
+         <p id="06caad67-57ee-4d41-adf4-9c898c740de9">
           <h2 class="text-muted">
            Pure Python wrapper for one of the most popular front-end toolkit Bootstrap, allowing quick and easy prototyping of web-based user interfaces
           </h2>
@@ -91,76 +91,76 @@
         </div>
        </div>
        <div class="col-md">
-        <div id="bbd856b5-f676-4f17-a034-7aa3af5e0736">
-         <div class="text-center" id="85d7e3b2-1716-4957-95de-6dbf24f5d83e">
-          <img height="300" id="92e98ebf-2f8e-4879-81cd-78f7629f9b43" src="flash.png"/>
+        <div id="061592f3-9155-44bb-98ab-5efe310e329b">
+         <div class="text-center" id="1dc5f9cb-28c0-493b-a0bc-face6d772952">
+          <img height="300" id="e3f9699c-265b-47e7-9cbe-5e443981e65f" src="flash.png"/>
          </div>
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="97a6353f-d24c-4632-b0aa-8288da60e2fb">
-     <div id="80dd6b04-ec0d-4671-8810-28c42641e83b">
+    <div class="mt-3" id="81fac3d5-a782-4ec1-82f6-154af44ad205">
+     <div id="dad3873d-2bb6-43e6-8a3e-edc4209555f2">
       <div class="row">
        <div class="col-md">
-        <div id="6975de22-bb3a-4fc0-a0c2-8f34fceb4e32">
-         <h1 id="8434476d-dd85-4b8e-ab81-e6e49f4d182c">
+        <div id="804fc26e-a47e-4bd0-8d79-c5c859521b90">
+         <h1 id="cf4b215b-b9b6-4983-97ad-489f9d3c3da6">
           Installation
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="e9d9b3be-f891-42b8-9d0c-00c01e32bab8">
+        <div id="3d8e32b2-ca4d-42d6-a025-9be998a20dc2">
         </div>
        </div>
       </div>
      </div>
-     <div id="463611af-934e-4c37-953c-b567d984eca8">
+     <div id="70f97a87-ffe8-442c-9d5a-172372275acf">
       <div class="row">
        <div class="col-md">
-        <div id="56aefb38-390b-453a-a63a-337ef8bcf158">
-         <p id="14a11595-8185-4288-81af-67fd30e99406">
+        <div id="98e30a49-5288-4303-a9de-3e79d322be3c">
+         <p id="730bf1c5-7cc9-4947-9597-ff818e3ce6fb">
           Use the following command to install Python Bootwrap (
           <span class="text-danger">
            Please note, the PIP install is currently unavailable. The first version of Python Bootstrap should be released toward the end of March 2021.
           </span>
           )
          </p>
-         <pre id="affddf68-8637-401a-ae30-3d8fd95fea81"><code a="" c="" l="" s=" p y t h o n ">~$ pip install bootwrap</code></pre>
+         <pre id="72e8c09e-395e-4761-b4c2-8c484c58a42f"><code a="" c="" l="" s=" p y t h o n ">~$ pip install bootwrap</code></pre>
         </div>
        </div>
        <div class="col-md">
-        <div id="3aa9eed2-d553-496c-aa56-6631dd8d3fb4">
+        <div id="70fee3f5-6d8d-45c5-b4b0-6b2991db296f">
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="253f8dbc-f5b1-46af-9424-819e11839b0e">
-     <div id="d2aa05c3-6b96-4aeb-aff7-26ddb551245a">
+    <div class="mt-3" id="9f914db5-956e-46a4-acd7-b4cccd4e98c3">
+     <div id="7945627a-f40a-4d9b-a3d3-5b7e46394047">
       <div class="row">
        <div class="col-md">
-        <div id="a8237a5e-6d2a-4313-a860-10cc59063883">
-         <h1 id="671dde72-63ac-49f9-9278-00105949918f">
+        <div id="1aab32ec-c6c0-468b-b2ce-b55e3273a195">
+         <h1 id="8861253f-97af-4f79-98d1-d76643effde3">
           Single-Page Application
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="b73429ae-7234-40f2-9f87-e3ebaf0fd3f8">
+        <div id="00349a94-87b6-499f-b377-999138e9d09c">
         </div>
        </div>
       </div>
      </div>
-     <div id="45718445-2c92-46f9-bac6-033dbfaf7752">
+     <div id="7c72e4f8-16f2-4328-bb50-5fedcb13dfb5">
       <div class="row">
        <div class="col-md">
-        <div id="fec7c146-b214-49e4-8e57-95be64cc5bce">
-         <p id="3e5b0d8d-cda0-4d02-acc0-1c1223cdb4de">
+        <div id="a0275b31-70e4-4ffa-9d88-b2323354659e">
+         <p id="2d69d750-d85d-41bb-847d-453b62109b4f">
           A single-page Bootwrap application looks something like this:
          </p>
-         <pre id="fda9c945-25f6-426b-8fb6-0ee364bfae68"><code a="" c="" l="" s=" p y t h o n ">from flask import Flask, Markup
+         <pre id="b2fda4b7-747e-4b3c-b0ed-456528457a01"><code a="" c="" l="" s=" p y t h o n ">from flask import Flask, Markup
 from bootwrap import Page, Text
 
 app = Flask(__name__)
@@ -176,39 +176,39 @@ if __name__ == '__main__':
         </div>
        </div>
        <div class="col-md">
-        <div id="e6b118b5-a253-4ca2-81dd-306fe938cb93">
-         <div class="text-center" id="9f950437-1b78-40e1-9c2d-9a055c720f53">
-          <img height="200" id="08aba020-4c74-4c1f-85fd-d645faed6809" src="single-page-app.png"/>
+        <div id="38b30c52-2bee-422d-92f6-36c14c3cf62d">
+         <div class="text-center" id="b40742e2-9f5a-4897-868c-0dc84f0fe715">
+          <img height="200" id="49892bf6-90fd-4aec-aaec-bdd3b7ce1aaa" src="single-page-app.png"/>
          </div>
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="3ddb6919-8fba-4483-a626-ed38982dd057">
-     <div id="7967530a-eb8c-47c5-83c3-456a054d8116">
+    <div class="mt-3" id="99db194e-9385-4cf8-9149-5028444f88c0">
+     <div id="4fe16094-e513-4b3c-a7e9-05b74951e727">
       <div class="row">
        <div class="col-md">
-        <div id="8e9df02e-b38d-4fa2-b8a5-2cde504ff082">
-         <h1 id="43ed9d9d-7b09-4d0b-a347-4fa3c7c0544c">
+        <div id="7e83a4ca-9a13-4889-a64b-3eb25f5aafee">
+         <h1 id="27a43f95-02e6-4a13-9ddf-fe41e48a7834">
           Multi-Pages Application
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="7de3dd7d-a768-45b1-8e87-94413f657aa4">
+        <div id="4b754d7a-a118-4e5a-a6a1-0542ff615a0b">
         </div>
        </div>
       </div>
      </div>
-     <div id="862e433a-5b12-436a-bb77-0e57e1f2499f">
+     <div id="feb84091-44f3-44f7-8c84-1db874d12361">
       <div class="row">
        <div class="col-md">
-        <div id="c901ee5e-7ac6-4624-beea-e0d2c2e1268f">
-         <p id="949ae894-1c9f-4d25-b82c-950f4dc51fcf">
+        <div id="09be0e35-fc04-41f1-a20d-2372798c143a">
+         <p id="49998a79-79b3-4a8d-820a-686335f14829">
           A multi-pages Bootwrap application looks something like this:
          </p>
-         <pre id="019d073b-8222-4177-a2ae-999a5c7cf13f"><code a="" c="" l="" s=" p y t h o n ">from flask import Flask, Markup
+         <pre id="cfa5b2f2-5387-41cd-822c-d13ce300a8e7"><code a="" c="" l="" s=" p y t h o n ">from flask import Flask, Markup
 from bootwrap import (
   Page, Menu, Image, Anchor, Button, Text
 )
@@ -288,9 +288,9 @@ if __name__ == '__main__':
         </div>
        </div>
        <div class="col-md">
-        <div id="5091a753-0e46-4f05-810e-09e0e178f293">
-         <div class="text-center" id="65ef3eb5-2b4f-41b9-8893-6b6cb9c2a404">
-          <img height="200" id="a3d35f94-7b78-47be-8eca-89f3ef55fc1f" src="multi-pages-app.png"/>
+        <div id="10ea6ae5-39a8-452b-ab2d-b9e773bc6aec">
+         <div class="text-center" id="c992d79d-7184-4e10-b0fb-1be3f3e265d2">
+          <img height="200" id="256749fe-985d-4ca4-90bf-653a31d965e6" src="multi-pages-app.png"/>
          </div>
         </div>
        </div>
diff --git a/docs/layout.html b/docs/layout.html
index a60ad33..fee41cf 100644
--- a/docs/layout.html
+++ b/docs/layout.html
@@ -21,8 +21,8 @@
  </head>
  <body>
   <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
-   <img alt="Bootwrap Logo" id="0fc9f9a6-2f35-4f7c-aa89-1a080c5f0f3f" src="logo.png" width="32"/>
-   <span class="text-light" id="5acdecd4-4157-4c92-9abc-020997dc7733">
+   <img alt="Bootwrap Logo" id="d3f647ce-d956-46b1-9abc-b2c437983d9e" src="logo.png" width="32"/>
+   <span class="text-light" id="803e163d-4cec-4c75-b430-b5f6bd193351">
     <strong>
      Bootwrap
     </strong>
@@ -34,54 +34,54 @@
    <div class="collapse navbar-collapse" id="menu">
     <ul class="navbar-nav mr-auto">
      <li class="nav-item">
-      <a class="nav-link ml-2" href="index.html" id="b775449c-8051-4e94-b7d2-9f3f836aa5df">
+      <a class="nav-link ml-2" href="index.html" id="3c54624f-92c3-4c86-95bb-4098c8d0d8a7">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="layout.html" id="49c9734c-8fa4-4ffa-8886-2c58b2ec80b6">
+      <a class="nav-link ml-2" href="layout.html" id="a9c826ed-8dfe-4e7f-86d3-a8b9413cefb4">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="base.html" id="b8d9b6b1-4699-407c-b568-95890011f28a">
+      <a class="nav-link ml-2" href="base.html" id="32b1c44e-8c3f-4d83-b8a8-1e8c0c126c48">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="nav-link ml-2" href="components.html" id="0efba83c-f8ed-4cec-9f51-1b588afe09fc">
+      <a class="nav-link ml-2" href="components.html" id="1ae8db70-eb24-4764-8816-cec1325bf2c5">
        Components
       </a>
      </li>
     </ul>
-    <a class="ml-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="9575cb59-bda5-46dd-845b-2d970003eef7" role="button">
+    <a class="ml-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="278ae06b-5237-44e8-867d-2082205884c7" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container" style="margin-top: 90px;">
-   <div id="d43d9028-8b4f-4f6d-a3a0-d186a9bee98d">
-    <div class="mt-3" id="0a14d01e-3612-48bd-8253-767914d6c6f0">
-     <div id="fbf88724-dd9c-4822-8056-49c14bf9e2a9">
+   <div id="c2468101-eb4f-4f6f-9566-1e1cf465b172">
+    <div class="mt-3" id="7d88fbbc-df32-4967-9cfe-e331eddbaa2f">
+     <div id="a0e21842-5b7f-43da-b6b4-0ae1f2481861">
       <div class="row">
        <div class="col-md">
-        <div id="93735c69-cf05-4a80-a183-c9126c69eeb0">
-         <h1 id="3878fc0f-78dc-4243-9874-d17c88c0785b">
+        <div id="fa6f4a6c-a34d-460a-928c-8bc6bc3c5e00">
+         <h1 id="b188fd8c-e0dd-4d28-af3a-45ba73f4bdb8">
           Layout
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="b945c1a8-b8f7-421c-b85a-01c0c81e558a">
+        <div id="42364425-4e97-4814-8b25-90976ca9e089">
         </div>
        </div>
       </div>
      </div>
-     <div id="9948fdd9-efab-44b4-abe2-bb72227d1f61">
+     <div id="00bd5e5e-22ac-4adc-baee-eb37b7e6728b">
       <div class="row">
        <div class="col-md">
-        <div id="5179708a-0b9f-49a8-9dca-0d77d4fd2b73">
-         <p id="64ad39b5-bc3a-4488-a01b-3d59b5b0c638">
+        <div id="6dbee300-e1a5-42b0-bfa1-fb1d41d818ef">
+         <p id="a37c6c9d-ec60-4161-8590-b38588e92c64">
           To simplify the process of developing Web UI, Bootwrap uses the predefined layout which consists  of two elements
           <code>
            Page
@@ -92,7 +92,7 @@
           </code>
           .
          </p>
-         <p id="17cb28c4-7d01-4b4d-bf61-acbca60e2a39">
+         <p id="3c169724-747d-4208-a576-7667b35ff215">
           <strong>
            Note:
           </strong>
@@ -101,36 +101,36 @@
         </div>
        </div>
        <div class="col-md">
-        <div id="7e1f5a87-2d8f-4ebb-9e77-80c54ab06869">
-         <div class="text-center" id="21da3b13-61a5-4142-91e6-5000a5b89fe6">
-          <img height="200" id="5ce62ccc-d034-4957-8707-1ed2a130bf72" src="layout.png"/>
+        <div id="04cc8d38-fd6a-460a-b7aa-7d42222f754e">
+         <div class="text-center" id="956c194a-adcf-4174-a413-0b621cb0cb2b">
+          <img height="200" id="f775826e-954b-4e5b-860a-a5aeb3c57a9a" src="layout.png"/>
          </div>
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="6e66e12f-48ce-46da-9e9b-6a4d4ee88714">
-     <div id="7923669e-5336-451d-84eb-ab5416773f98">
+    <div class="mt-3" id="49945634-a07a-459c-965d-6be28fad225c">
+     <div id="0147c1e9-c73d-4cba-8b2f-cbf6648fec53">
       <div class="row">
        <div class="col-md">
-        <div id="70dfdc44-6022-484b-9145-57530e84cb43">
-         <h1 id="06a0f178-b27c-4d2c-bb56-59302ee412d3">
+        <div id="7f706e1b-b5a7-4677-8df9-f9053ede2476">
+         <h1 id="bdfc1b1b-3a43-46b4-8911-5f4089dc065e">
           Page
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="0ce72b89-da59-461e-b6e1-bbde98373c54">
+        <div id="7b98bb4e-b0ad-4943-99b7-65e1a76af028">
         </div>
        </div>
       </div>
      </div>
-     <div id="38e6ef77-0b30-468a-932f-28f6f94251d8">
+     <div id="86eff95c-e18d-44a1-bd8b-76ea8d53866b">
       <div class="row">
        <div class="col-md">
-        <div id="b17e89d0-a5ec-46ad-8759-fac9e211baa2">
-         <p id="57a8a900-a173-4e6d-9fb4-c34f660fc6a0">
+        <div id="e38b3f80-dbc6-4285-9289-f7cfb44240ca">
+         <p id="d7e96739-3ea2-4f58-9e38-d47bbc072b6f">
           The container could be any element inheriting
           <code>
            WebComponent
@@ -144,11 +144,11 @@
         </div>
        </div>
        <div class="col-md">
-        <div id="546dc7f0-976a-4630-87c9-a9e0a410dd0f">
-         <div class="text-center" id="cffbc1b0-744e-4f0f-84bd-d0d565f794d0">
-          <img height="250" id="56fa7f81-da5f-4a11-9330-017dc06ea9cc" src="page.png"/>
+        <div id="496b19a9-b34d-4977-ac2f-2ee35a76cd46">
+         <div class="text-center" id="556a6fc8-74dc-4b7e-9f8d-991d8e691045">
+          <img height="250" id="22a3b64a-ecac-4cd3-ab0c-8fe4ca4b5fc1" src="page.png"/>
          </div>
-         <pre id="58a26eed-c07c-47c3-b113-1ba749409632"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Page
+         <pre id="d66a02ed-7b30-4017-a498-c6b67139fed6"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Page
 
 page = Page(
   favicon=..., title=..., resources=..., menu=...,
@@ -159,27 +159,27 @@ page = Page(
       </div>
      </div>
     </div>
-    <div class="mt-3" id="e0b79156-e3ed-467e-befe-e185cbe7ccd5">
-     <div id="4e54daad-e4a7-4a6e-a5e1-3210067a7b78">
+    <div class="mt-3" id="04633f20-4bf7-427b-88b9-097fa91ee6e0">
+     <div id="b991f709-1726-41ae-abc7-42a4dc0c3345">
       <div class="row">
        <div class="col-md">
-        <div id="6bc351b7-1c7b-46e1-8294-91102173a857">
-         <h1 id="1f5291b7-3320-49f4-a458-77fee030ed95">
+        <div id="868bb2a6-803a-4283-bec5-bb51e6c7b2b6">
+         <h1 id="d84c4ad1-9693-494e-b88b-9d3d63dab0de">
           Menu
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="94c21f35-e9c5-4b2a-83db-23811b5e4f7d">
+        <div id="ea431298-0c3d-4774-84c5-185d594a48dc">
         </div>
        </div>
       </div>
      </div>
-     <div id="5f340244-20d4-4afd-b338-76cd6d3c289f">
+     <div id="c19aa080-a6c4-4a28-93e0-b56a3bd30204">
       <div class="row">
        <div class="col-md">
-        <div id="4b88d914-97a1-4c65-8da7-904e21144897">
-         <p id="39adc127-a372-477e-91f8-e25dab642b35">
+        <div id="b7d6d4a7-e480-4d53-afe0-8e5965640566">
+         <p id="cab20bd6-7bac-4f02-b741-6fb4fd9b7db2">
           The menu represents the top-level navigation bar containing anchors and actions allowing to switch between different application
           <code>
            Page
@@ -189,11 +189,11 @@ page = Page(
         </div>
        </div>
        <div class="col-md">
-        <div id="1436a0aa-6984-4c8f-bdcc-d30cb2c37362">
-         <div class="text-center" id="9ddc1c5d-debd-420a-b2e0-10a186d1df3b">
-          <img height="100" id="dd3a44b7-255a-43d4-9ee9-cdf5f27b20ca" src="menu.png"/>
+        <div id="abb8cd74-599e-46ec-bbb8-16f4557a473a">
+         <div class="text-center" id="5d849a5e-bdee-41e7-bfce-f2f64825ffbd">
+          <img height="100" id="2c86ef19-ebc2-4d32-96da-f21dc0a63014" src="menu.png"/>
          </div>
-         <pre id="f30f82e0-e9fb-4e8c-a378-c01cfd860a30"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Menu
+         <pre id="7aadd5ea-c58d-43c8-84a6-7436affdee97"><code a="" c="" l="" s=" p y t h o n ">from bootwrap import Menu
 
 menu = Menu(
   logo=..., brand=..., anchors=...,  actions=...


Test patch:
diff --git a/tests/test_base.py b/tests/test_base.py
index 79c3771..4c00f23 100644
--- a/tests/test_base.py
+++ b/tests/test_base.py
@@ -11,7 +11,8 @@ from bootwrap import (
     AppearanceMixin,
     OutlineMixin,
     AvailabilityMixin,
-    Action
+    Action,
+    ClassMixin
 )
 
 
@@ -103,3 +104,27 @@ def tests_availability_mixin():
             return 'disabled' if self._disabled else 'enabled'
     assert str(TestAvailabilityMixin()) == 'enabled'
     assert str(TestAvailabilityMixin().as_disabled()) == 'disabled'
+
+
+@pytest.mark.base
+def tests_class_mixin():
+    assert ClassMixin().classes == None
+    assert "test" in ClassMixin().add_classes("test").classes
+
+    # margin shorthand methods
+    assert "m-2" in ClassMixin().m(2).classes
+    assert "mt-2" in ClassMixin().mt(2).classes
+    assert "mb-2" in ClassMixin().mb(2).classes
+    assert "ml-2" in ClassMixin().ml(2).classes
+    assert "mr-2" in ClassMixin().mr(2).classes
+    assert "mx-2" in ClassMixin().mx(2).classes
+    assert "my-2" in ClassMixin().my(2).classes
+
+    # padding shorthand methods
+    assert "p-2" in ClassMixin().p(2).classes
+    assert "pt-2" in ClassMixin().pt(2).classes
+    assert "pb-2" in ClassMixin().pb(2).classes
+    assert "pl-2" in ClassMixin().pl(2).classes
+    assert "pr-2" in ClassMixin().pr(2).classes
+    assert "px-2" in ClassMixin().px(2).classes
+    assert "py-2" in ClassMixin().py(2).classes