Repository: mmgalushka/bootwrap

Issue:
Add icon to button
Add icon beside the button name (on the left or right side).

Discussion:

Patch:
diff --git a/bootwrap/components/button.py b/bootwrap/components/button.py
index d76cb57..c0fd902 100644
--- a/bootwrap/components/button.py
+++ b/bootwrap/components/button.py
@@ -13,6 +13,7 @@ from .base import (
 )
 from .panel import Panel
 from .dialog import Dialog
+from .icon import Icon
 from .utils import attr, inject
 
 
@@ -34,6 +35,34 @@ class Button(WebComponent, ClassMixin, ActionMixin, AppearanceMixin,
     def __init__(self, name):
         super().__init__()
         self.__name = name
+        self.__icon = None
+        self.__right_side = None
+
+    def with_icon(self, icon, right_side = False):
+        """Makes button with icon.
+
+        Args:
+            icon (Icon):
+                The icon to add on button.
+            right_side (bool):
+                If `True` the icon is placed on the right side of the button
+                name and `False` on the right side accordingly. 
+
+        Returns:
+            self
+        
+        Example:
+            from bootwrap import Button, Icon, Panel
+            ico_left = Icon("fa-solid fa-arrow-left")
+            btn_left = Button("Left").with_icon(ico_left).as_primary()
+            ico_right = Icon("fa-solid fa-arrow-right")
+            btn_right = Button("Right").with_icon(ico_right, True).as_primary()
+            output = Panel(btn_left, btn_right)
+        """
+        self.__icon = icon
+        self.__right_side = right_side
+        return self
+
 
     def __str__(self):
         self.add_classes('btn')
@@ -44,6 +73,14 @@ class Button(WebComponent, ClassMixin, ActionMixin, AppearanceMixin,
             else:
                 self.add_classes(f'btn-{self._category}')
 
+        button_name = self.__name
+        if self.__icon:
+            if self.__right_side:
+                button_name = f"{self.__name}{inject(self.__icon)}"
+            else:
+                button_name = f"{inject(self.__icon)}{self.__name}"   
+        
+
         if self._menu:
             for item in self._menu:
                 item.add_classes('dropdown-item')
@@ -68,7 +105,7 @@ class Button(WebComponent, ClassMixin, ActionMixin, AppearanceMixin,
                         aria-haspopup="true"
                         aria-expanded="false"
                         onclick="return false;">
-                        {self.__name}
+                        {button_name}
                     </button>
                 '''
             return f'''
@@ -96,7 +133,7 @@ class Button(WebComponent, ClassMixin, ActionMixin, AppearanceMixin,
                     {attr('class', self.classes)}
                     {attr('href', href)}
                     role="button">
-                    {self.__name}
+                    {button_name}
                 </a>
             '''
         elif self._action == Action.TOGGLE:
@@ -114,7 +151,7 @@ class Button(WebComponent, ClassMixin, ActionMixin, AppearanceMixin,
                         data-bs-target="#{self._target.identifier}"
                         onclick="return false;"
                         {attr('disabled', self._disabled)}>
-                        {self.__name}
+                        {button_name}
                     </button>
                 '''
             elif isinstance(self._target, Dialog):
@@ -126,7 +163,7 @@ class Button(WebComponent, ClassMixin, ActionMixin, AppearanceMixin,
                         data-bs-target="#{self._target.identifier}"
                         onclick="return false;"
                         {attr('disabled', self._disabled)}>
-                        {self.__name}
+                        {button_name}
                     </button>
                 '''
             raise TypeError(
@@ -141,7 +178,7 @@ class Button(WebComponent, ClassMixin, ActionMixin, AppearanceMixin,
                     data-bs-dismiss="modal"
                     onclick="return false;"
                     {attr('disabled', self._disabled)}>
-                    {self.__name}
+                    {button_name}
                 </button>
             '''
         elif self._action == Action.SUBMIT:
@@ -150,7 +187,7 @@ class Button(WebComponent, ClassMixin, ActionMixin, AppearanceMixin,
                     {attr('class', self.classes)}
                     type="submit"
                     {attr('disabled', self._disabled)}>
-                    {self.__name}
+                    {button_name}
                 </button>
             '''
         else:
@@ -159,7 +196,7 @@ class Button(WebComponent, ClassMixin, ActionMixin, AppearanceMixin,
                     {attr('class', self.classes)}
                     onclick="return false;"
                     {attr('disabled', self._disabled)}>
-                    {self.__name}
+                    {button_name}
                 </button>
             '''
 
diff --git a/docs/base.html b/docs/base.html
index 27c8b2b..c57f17f 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="c7c26f48-bb73-4ccc-a7b6-98d0415c028c" src="logo.png" width="32"/>
-   <span class="text-light" id="2cc0e6b6-7c9b-40ff-a250-e0f07cc6e45e">
+   <img alt="Bootwrap Logo" id="b215f7f6-5fe2-4c67-b492-5587bbc7bb2c" src="logo.png" width="32"/>
+   <span class="text-light" id="8ddfa762-a510-4214-bf01-e0b5070e1dcc">
     <strong>
      Bootwrap
     </strong>
@@ -34,90 +34,90 @@
    <div class="collapse navbar-collapse" id="menu">
     <ul class="navbar-nav me-auto">
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="index.html" id="17e9e2fc-c3fe-4c5c-9bc3-a105f8603476">
+      <a class="ms-2 nav-link" href="index.html" id="82e63fa9-8603-451d-ab12-fbb942e881ff">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="layout.html" id="b3baffdc-df6b-4c74-b8fe-7da5d5f7cec3">
+      <a class="ms-2 nav-link" href="layout.html" id="dda6333e-35ca-4f11-b0bb-1534bb7055d9">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="base.html" id="abfb8c86-39c9-4173-84d7-00d43edfab2b">
+      <a class="ms-2 nav-link" href="base.html" id="e7b24121-03c5-45cf-b78f-775e96b948b7">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="components.html" id="e24fc008-70d9-4b38-be98-6967bde43f2e">
+      <a class="ms-2 nav-link" href="components.html" id="74787afa-8a23-4139-88c3-f036ec1fc3c4">
        Components
       </a>
      </li>
     </ul>
-    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="adb00c62-619d-4ee3-b17c-c11e23b03efc" role="button">
+    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="9d9b82f2-18e3-4217-b9cc-88c4f1d914c6" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container-fluid">
-   <ul class="nav nav-pills" id="8871ff36-4b87-475e-ac89-bd13e1800ef5" role="tablist">
+   <ul class="nav nav-pills" id="cf38c9a0-5822-4c14-901a-081009aeedbc" role="tablist">
     <li class="nav-item">
-     <a class="nav-link active" data-bs-target="#78dd23cc-7b5c-4e41-b935-cb83cd4da88b" data-bs-toggle="tab" href="#78dd23cc-7b5c-4e41-b935-cb83cd4da88b" id="6f12b147-e8e3-4ccd-91ad-d40ff2bb0aad" role="tab">
+     <a class="nav-link active" data-bs-target="#f7c31e00-cef9-4143-b607-7e159ce77713" data-bs-toggle="tab" href="#f7c31e00-cef9-4143-b607-7e159ce77713" id="0508817b-8077-4f72-8f7d-d30da27d567a" role="tab">
       WebComponent
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#604addb5-49ec-471f-9683-065fe1ff5239" data-bs-toggle="tab" href="#604addb5-49ec-471f-9683-065fe1ff5239" id="3bd8f7c0-531c-4cba-9ee0-9470c0b66a20" role="tab">
+     <a class="nav-link" data-bs-target="#79d91021-45c0-4b2c-b5f7-cc1194c92469" data-bs-toggle="tab" href="#79d91021-45c0-4b2c-b5f7-cc1194c92469" id="826eaab4-fba8-460a-93ad-b11a0a64ef8a" role="tab">
       ClassMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#97412126-efe1-482f-8cf5-745732a365d9" data-bs-toggle="tab" href="#97412126-efe1-482f-8cf5-745732a365d9" id="a0ce9373-6f46-46ba-9bf9-a75035ff6434" role="tab">
+     <a class="nav-link" data-bs-target="#3965c300-c736-44e0-be83-f2a599a5a053" data-bs-toggle="tab" href="#3965c300-c736-44e0-be83-f2a599a5a053" id="58b701aa-ed73-4023-9868-3f6c4411f8a4" role="tab">
       ActionMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#3b45aaeb-bf64-485d-bed2-d8ac513966e2" data-bs-toggle="tab" href="#3b45aaeb-bf64-485d-bed2-d8ac513966e2" id="8d47138c-91be-437a-9923-c0f37fca308a" role="tab">
+     <a class="nav-link" data-bs-target="#8b1eeddd-ab32-43c1-b1fd-b4fd96cb3d99" data-bs-toggle="tab" href="#8b1eeddd-ab32-43c1-b1fd-b4fd96cb3d99" id="de0cb423-a337-4532-a7bc-59e0177be0c6" role="tab">
       AppearanceMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#b3b387e8-208f-4588-a761-d58410f6dca1" data-bs-toggle="tab" href="#b3b387e8-208f-4588-a761-d58410f6dca1" id="3c80de9a-4b77-4979-83f3-608aedbe7826" role="tab">
+     <a class="nav-link" data-bs-target="#aa2dc850-6e0b-4e67-96f1-36a71e85093c" data-bs-toggle="tab" href="#aa2dc850-6e0b-4e67-96f1-36a71e85093c" id="d5134312-b891-4dfa-902c-b296d122810a" role="tab">
       OutlineMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#acce1950-4cb5-4ed8-9a25-ea580b37b9fc" data-bs-toggle="tab" href="#acce1950-4cb5-4ed8-9a25-ea580b37b9fc" id="d3932a37-7793-403c-97f6-fe24659c902c" role="tab">
+     <a class="nav-link" data-bs-target="#4fe56b45-f950-4879-9536-d39f6eea7657" data-bs-toggle="tab" href="#4fe56b45-f950-4879-9536-d39f6eea7657" id="154e39f3-6cf2-484a-82aa-1de35dfe654b" role="tab">
       AvailabilityMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#1d419346-48ea-4be1-ac9a-4743be5d4ab0" data-bs-toggle="tab" href="#1d419346-48ea-4be1-ac9a-4743be5d4ab0" id="9c352a75-8991-4960-be2c-ecb56879e777" role="tab">
+     <a class="nav-link" data-bs-target="#36feaa40-9b69-48d6-a2df-facea739c464" data-bs-toggle="tab" href="#36feaa40-9b69-48d6-a2df-facea739c464" id="d4e455f2-e63e-4d1d-a4a1-91c50f8e62ab" role="tab">
       Constants
      </a>
     </li>
    </ul>
    <div class="tab-content">
-    <div class="tab-pane fade active show" id="78dd23cc-7b5c-4e41-b935-cb83cd4da88b">
-     <div class="mt-5" id="7f74e461-7f0f-4a1a-b280-696d7a92f4d9">
-      <div class="d-flex justify-content-between" id="53e984d3-b4df-4dc7-b421-727407f0e139">
-       <h1 id="98464354-c314-4bb4-b10e-ce0fb2c4850a">
+    <div class="tab-pane fade active show" id="f7c31e00-cef9-4143-b607-7e159ce77713">
+     <div class="mt-5" id="fc8a9eec-40ab-47df-9395-af2eceff38ee">
+      <div class="d-flex justify-content-between" id="ff48a1cb-7fae-4c53-b31b-ae411fc9f500">
+       <h1 id="229d91e5-c39e-4c4f-8535-27ad07349ea4">
         Class
-        <span class="text-primary" id="8399f148-5663-49a6-86ed-007e2d1f10c2">
+        <span class="text-primary" id="00a9c4bb-b9c3-4333-95bf-25552a0e6618">
          WebComponent
         </span>
        </h1>
-       <div id="e3ec137d-0980-4978-b689-8e4af7148d86">
+       <div id="1a66129e-e3f4-4709-b433-820a3e822026">
        </div>
       </div>
-      <span class="text-muted" id="d8d0fbfb-422d-4494-a41e-12b57b1db3a5">
+      <span class="text-muted" id="db7bfe22-6a94-412b-b682-0cbc82ad105a">
        A web component base class.
       </span>
-      <pre id="e0a0c2c4-0a81-4fdb-b31b-38228ab1923d"><code class="python">WebComponent()</code></pre>
-      <p id="0be8a621-cbbe-4d11-8910-14e27ef2c71c">
+      <pre id="372a4cd3-c15e-47ff-bd62-a563b8826dad"><code class="python">WebComponent()</code></pre>
+      <p id="df8f7630-4f00-47f7-a7aa-4a299c866232">
        This class must be inherited by all web components.
       </p>
-      <p id="097d1c2a-104c-4163-92c1-bed7f6008ef9">
+      <p id="5e26dcde-0d7b-415f-9f4f-9c30f58dd1a2">
        In many operations where one web component encapsulates another one has
     implemented a type check. If the received element is not
        <code>
@@ -134,13 +134,13 @@
        </code>
        class.
       </p>
-      <div class="ms-3" id="263e83ed-0c43-4509-afe7-6c76ca46c424">
-       <h6 id="0e7253e0-3324-49b1-810c-005589c0049b">
+      <div class="ms-3" id="f1a7e4f1-a831-4e2e-9dbf-049734b01712">
+       <h6 id="c531b64c-9c2e-4907-8742-8da1f056b918">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="a3c0938e-995f-40ef-9ac5-e24f68230cc5"><code class="python">from bootwrap import WebComponent
+       <pre id="5a3fb18e-01a1-4a59-97dd-db2680adead4"><code class="python">from bootwrap import WebComponent
 
 class CustomHeader(WebComponent):
     def __init__(self, title):
@@ -154,17 +154,17 @@ class CustomHeader(WebComponent):
         '''
 </code></pre>
       </div>
-      <div class="mt-5" id="448e8e27-7881-4f7f-8bd8-87b16233e643">
-       <h4 id="510d711d-d899-4b18-9b12-49993cf8e69c">
+      <div class="mt-5" id="c5725e36-82a4-43bd-a54c-534638cb884b">
+       <h4 id="aa52719d-d76d-4fab-95dd-e85c76b3fee6">
         Property
-        <span class="text-primary" id="0fab76d9-d495-469c-9af5-5d1acfed03e1">
+        <span class="text-primary" id="fe3dd7c2-763e-4a86-bd41-e0a0ccd7445b">
          identifier
         </span>
        </h4>
-       <span class="text-muted" id="b694541f-c114-43e3-b49d-40ddb737f300">
+       <span class="text-muted" id="4e113591-25a3-4ebb-a338-8dedb41b04cc">
         A unique web component identifier.
        </span>
-       <p id="219c702f-d348-4252-9409-8ea619270b32">
+       <p id="a481eeef-981f-4033-84c3-b42ff6ff3571">
         Every
         <code>
          WebComponent
@@ -177,7 +177,7 @@ class CustomHeader(WebComponent):
         </code>
         .
        </p>
-       <p id="6dd62d2a-d2ee-4a85-8f6c-8fe527262c4b">
+       <p id="7c30bded-8668-43c1-92f5-fbc5f2ca150a">
         When you create a custom
         <code>
          WebComponent
@@ -193,13 +193,13 @@ class CustomHeader(WebComponent):
         </code>
         .
        </p>
-       <div class="ms-3" id="27f221ec-b380-4a3a-8838-aa47f68cb285">
-        <h6 id="0f28db93-92b8-4155-855e-b77aee50e19f">
+       <div class="ms-3" id="b1c82f1c-7680-41cb-8171-c3866503e8af">
+        <h6 id="d7257f46-aa17-4ffa-b2d6-0a647b0d5603">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="239cddf6-56c9-4864-8b99-3c2693e8634a"><code class="python">header = CustomHeader('Hello World")
+        <pre id="e0f64120-50fb-4754-bb17-f522151f802e"><code class="python">header = CustomHeader('Hello World")
 print(header.classes)
 
 # Result: cfe040e6-df5f-4a3a-b96e-b0cefc31bbd9
@@ -208,43 +208,43 @@ print(header.classes)
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="604addb5-49ec-471f-9683-065fe1ff5239">
-     <div class="mt-5" id="192a477b-9cc8-4b71-99b5-a5d1e55a8edc">
-      <div class="d-flex justify-content-between" id="7faec27b-dee1-4f45-a388-74c0625eee14">
-       <h1 id="91442d1c-b978-4bd1-bfac-18353b0c9d55">
+    <div class="tab-pane fade" id="79d91021-45c0-4b2c-b5f7-cc1194c92469">
+     <div class="mt-5" id="9b16e61c-87d8-4e11-9cc9-e86713bd8e73">
+      <div class="d-flex justify-content-between" id="a7ff7e41-0f38-43f4-a182-606fabc60bf7">
+       <h1 id="ee076ccf-0f48-4ea9-b5fc-72258f0a998d">
         Class
-        <span class="text-primary" id="b233d946-3bbc-4d18-ab97-14c29eb11792">
+        <span class="text-primary" id="6e08e337-322f-4c79-a618-5338f78938c1">
          ClassMixin
         </span>
        </h1>
-       <div id="46544c0f-dd18-41bc-bc57-fdcedc9d1a54">
+       <div id="ff2936e0-79cd-4b3c-aaac-268c0dbfe4d2">
        </div>
       </div>
-      <span class="text-muted" id="8f3432cb-30a0-4e62-b51d-24256ec8b4d1">
+      <span class="text-muted" id="f6d28919-76b9-4c15-90c7-98ea2780e626">
        Mixin for a web component which class can be amended.
       </span>
-      <pre id="cfd1720e-d135-48c7-b263-09f11a0f8869"><code class="python">ClassMixin()</code></pre>
-      <p id="272c0b5e-aa37-4ffd-9c57-f3e1d683385f">
+      <pre id="951d73bf-4022-40a2-a0a0-ee63700902f9"><code class="python">ClassMixin()</code></pre>
+      <p id="8b092d50-2fd8-4b00-b2bb-ee99f4a63145">
        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="5f3729bc-15fc-4152-a70f-61336c9ec4c9">
-       <h4 id="3e33b855-97b3-44d0-ae17-2ab185ef2c48">
+      <div class="mt-5" id="89a62f6d-2779-43e3-a7b8-a8f6bea98db2">
+       <h4 id="dd9a93ec-ee91-469e-bd1f-871a00b46fc6">
         Property
-        <span class="text-primary" id="cbd4aa8e-3f84-4197-b3c2-328a526da9df">
+        <span class="text-primary" id="8448929a-49fc-4c93-8343-c06fc12cd7e7">
          classes
         </span>
        </h4>
-       <span class="text-muted" id="35564f51-7040-4f76-b3a2-cff9e9ef3eb4">
+       <span class="text-muted" id="7f14a02a-88a0-458b-94db-a1bf79a8f525">
         The web component classes.
        </span>
-       <div class="ms-3" id="644ff3d1-ed06-4a32-9eee-be1010287c9d">
-        <h6 id="f1039270-d7a6-40e9-9418-714b28eb755f">
+       <div class="ms-3" id="a253e765-0119-4467-bae0-206bb108919c">
+        <h6 id="07adfda4-cf97-49a2-a757-18f5fa4161a6">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="15281181-a699-40f7-8e07-0a0c3b552db9"><code class="python">from bootwrap import Button
+        <pre id="89f0efab-2e75-422f-bc3e-03540d7f4469"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").add_classes("ms-1 me-1")
@@ -254,34 +254,34 @@ print(button.classes)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="fd81179e-6445-4fad-bf0c-bbde3dda4055">
-       <div class="d-flex justify-content-between" id="6e4200b8-d1f7-492a-a811-0423e222ee88">
-        <h4 id="516ccd0a-22a0-40d7-b6c8-4d6348ce7282">
+      <div class="mt-5" id="7512f557-f6f4-4db3-963c-9fed5e89e633">
+       <div class="d-flex justify-content-between" id="c33e25b0-cb77-4536-abdb-9d30e6b9b15a">
+        <h4 id="e3e5b58a-cfb3-4e84-a0bf-f15bae6c362a">
          Method
-         <span class="text-primary" id="0466f797-665b-4857-9d0f-60689a398835">
+         <span class="text-primary" id="c89a55e2-9079-4961-ba84-19a9fcfc1f96">
           add_classes
          </span>
         </h4>
-        <div id="2213b906-d40c-4e31-8d3c-9a6649397dec">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#a128b3bc-aa90-4945-918d-326bbc84be17" data-bs-toggle="collapse" id="4cdd2dad-3d41-4f5e-85ce-309801838059" onclick="return false;" type="button">
+        <div id="35f99ed4-81a3-418c-9efb-d88fbbe242f1">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#4d0fdcdd-5041-498f-a9d1-f62fe1c4cd34" data-bs-toggle="collapse" id="5e0364f2-a0a3-4b38-b530-0968492e1732" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#f829f5f2-2213-4ddd-98c3-2fb74d978ac1" data-bs-toggle="collapse" id="203ed4c6-d572-4063-a84c-25da32c90335" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#3ec009ae-9d89-49c6-87e3-821b242feae6" data-bs-toggle="collapse" id="e9fb2f7c-a5d7-4473-bee8-4465efbc53e1" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="2166307e-e9e8-4660-aefa-75fce833f613">
+       <span class="text-muted" id="a1d1cc29-07a7-44fc-80f6-43fa9121b2e2">
         Adds other classes.
        </span>
-       <pre id="e439caba-a1e2-4457-b52f-a7126ceb2f2e"><code class="python">add_classes(classes)</code></pre>
-       <div class="ms-3 collapse" id="a128b3bc-aa90-4945-918d-326bbc84be17">
-        <h6 id="4f6c1624-5ac9-4a58-9c20-d92eef8b8d73">
+       <pre id="ece26d13-c9db-48a2-99a9-2fec6b19ec3a"><code class="python">add_classes(classes)</code></pre>
+       <div class="ms-3 collapse" id="4d0fdcdd-5041-498f-a9d1-f62fe1c4cd34">
+        <h6 id="92f4db02-514d-41be-a52e-5315b9d31fab">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="363ee6eb-ada7-499c-8c80-8d1e933f7b7e">
+        <table class="table table-sm bg-light" id="53837b8a-514f-46ae-932d-84250bac63ab">
          <thead>
           <tr>
            <th scope="col">
@@ -315,13 +315,13 @@ print(button.classes)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="f829f5f2-2213-4ddd-98c3-2fb74d978ac1">
-        <h6 id="2f185228-b29d-43f1-a0c8-acfe4db8852c">
+       <div class="ms-3 collapse" id="3ec009ae-9d89-49c6-87e3-821b242feae6">
+        <h6 id="76939b89-a11a-42d6-8009-11db6ecf1829">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="694deff5-856b-45d6-a5a4-2c480fe140be">
+        <table class="table table-sm bg-light" id="9cbf8ee0-90e3-41f8-b2bf-640559220109">
          <thead>
           <tr>
            <th scope="col">
@@ -354,51 +354,51 @@ print(button.classes)
          </tbody>
         </table>
        </div>
-       <p id="97b1209f-e46a-4bd6-9f00-25fb0f2cf2ba">
+       <p id="f56828e3-5799-42a6-9568-baba5f66a6fa">
         Note, the order of specified classes will be preserved during the
         component rendering.
        </p>
-       <div class="ms-3" id="ba463241-0990-4413-a5ca-a4465a024b62">
-        <h6 id="f458637d-33a9-4f1b-b09c-aa53f59207e8">
+       <div class="ms-3" id="8845e293-ff7e-4dae-aa30-fda1dc676a2c">
+        <h6 id="0dbe7aa6-780c-40a6-8a0c-ae44833e7543">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="5b15a553-d50f-4703-9c24-90a97ae42999"><code class="python">from bootwrap import Button
+        <pre id="5d081282-9fab-43a4-99ac-9214b4de21f4"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").add_classes("ms-1 me-1")
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="246af724-6034-437a-9457-dfb4cb177340">
-       <div class="d-flex justify-content-between" id="984b3edb-86c8-430c-b8db-fa1c199b8358">
-        <h4 id="c40f3466-9eb7-42d3-8a62-998c0bd23d8b">
+      <div class="mt-5" id="852d81da-6ea0-467a-9dbe-d1884d655cdb">
+       <div class="d-flex justify-content-between" id="b01bd85f-e78c-45f8-ba34-231df42141ed">
+        <h4 id="51bfb72c-a5ee-44a1-a04b-ad863f281e9a">
          Method
-         <span class="text-primary" id="055c35a9-94f7-46af-9ffb-20058bdf1b39">
+         <span class="text-primary" id="223e5911-dfac-4d0e-94b3-0a0cb929514b">
           m
          </span>
         </h4>
-        <div id="55d18a2b-763f-4576-8280-c1705f099694">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#88bb12b1-da01-489e-90bb-03b1e9cfa671" data-bs-toggle="collapse" id="c417cf8e-a248-4661-a381-9249570b9757" onclick="return false;" type="button">
+        <div id="99eb616f-83ae-45f6-984f-70e2c539aedd">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#ae90a74d-5833-4571-b549-5006e9d5e4f7" data-bs-toggle="collapse" id="8ca2ac2c-22d1-410b-a433-b37f8f52be59" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#879bca1d-c671-4c57-bca3-bf1029ea9d87" data-bs-toggle="collapse" id="bcceb77a-0cdc-4af3-9dd1-67c50e9f79f4" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#cecf15d3-f4f9-4304-acc4-f9d2e8aa5dac" data-bs-toggle="collapse" id="aa1295f3-0a57-4e0a-a5ab-d6ce4f18394f" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="2e49376b-ad22-4f66-85c0-b27830ac8a94">
+       <span class="text-muted" id="36cf863b-cf99-4105-8a4f-4e651ff2e04f">
         Sets margin for all four sides to the specified size.
        </span>
-       <pre id="96b5a06d-19ef-4c4c-98a7-9b7b25c0a99c"><code class="python">m(size)</code></pre>
-       <div class="ms-3 collapse" id="88bb12b1-da01-489e-90bb-03b1e9cfa671">
-        <h6 id="65771490-7a4e-4520-bd24-38dbd850a36f">
+       <pre id="337c4b90-b1fc-493c-ad2c-8b2a734fad36"><code class="python">m(size)</code></pre>
+       <div class="ms-3 collapse" id="ae90a74d-5833-4571-b549-5006e9d5e4f7">
+        <h6 id="e3b27502-2d28-498c-a389-23e916992e91">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="1ff0d7d0-9d59-45f9-8276-a9ef829e5c3d">
+        <table class="table table-sm bg-light" id="76586b4a-e76a-413c-9909-5553bacf8454">
          <thead>
           <tr>
            <th scope="col">
@@ -431,13 +431,13 @@ button = Button("Hello").add_classes("ms-1 me-1")
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="879bca1d-c671-4c57-bca3-bf1029ea9d87">
-        <h6 id="ca22a5da-4f0e-4926-85c9-68df0bbfdd22">
+       <div class="ms-3 collapse" id="cecf15d3-f4f9-4304-acc4-f9d2e8aa5dac">
+        <h6 id="51563b71-5f70-4f4b-ada7-9d32231ad201">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="e1b96ad2-13ce-40ee-91ae-13cef64870e3">
+        <table class="table table-sm bg-light" id="4900c16a-d1fb-4963-834a-f910b892ca52">
          <thead>
           <tr>
            <th scope="col">
@@ -470,47 +470,47 @@ button = Button("Hello").add_classes("ms-1 me-1")
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="864a3308-b8f7-4314-8cec-c7c60c0f03b8">
-        <h6 id="1acf949d-6fb6-42b1-81c0-a47b86b92d8f">
+       <div class="ms-3" id="2d3b7855-36b9-4938-83b5-96f28e9ef2fd">
+        <h6 id="81dc030b-17d1-4481-a81e-31a6c86111e6">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="4e23571e-2782-4216-9863-f3edb58acd68"><code class="python">from bootwrap import Button
+        <pre id="736dec73-a2ef-45fc-a9a2-90b01454fc69"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").m(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="fcea30bc-a7d0-444f-9226-1ef4338c55f2">
-       <div class="d-flex justify-content-between" id="aea31619-fb0e-474c-b9ea-a1b4385dbb0d">
-        <h4 id="861891bd-6888-4fe2-8bcf-74f8d10584b6">
+      <div class="mt-5" id="40bcf6b8-9014-4ef7-9472-01a0275a0e38">
+       <div class="d-flex justify-content-between" id="83217547-dd41-4488-9751-9d5dde4bbd69">
+        <h4 id="8047d9a3-17ca-44fd-963d-9de62e73c97c">
          Method
-         <span class="text-primary" id="fb5e66ac-aa70-4c51-b3eb-4e3f306c12c7">
+         <span class="text-primary" id="cf2a085a-3b73-4214-82ed-83f2bad62c74">
           mb
          </span>
         </h4>
-        <div id="76990296-b6e4-4485-a591-4570c16f2f2c">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#21bf6368-4a01-430e-adee-828d6f18ee33" data-bs-toggle="collapse" id="0834567d-2778-4949-bd60-cfa9fc100490" onclick="return false;" type="button">
+        <div id="2bce2da2-8302-44b9-9395-4c38c4ae9253">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#726be835-23dc-4bd0-8f95-5c3d02f31d44" data-bs-toggle="collapse" id="dadaeb64-c14e-4e8f-a056-ea39c09e121c" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#2b600c21-6cf0-49ed-b495-8da8836c0d00" data-bs-toggle="collapse" id="7909ac47-5ad3-4c73-aba6-38c7f6e379e1" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#ea2d4299-1c24-4d23-93b4-8ea97d7d8b4f" data-bs-toggle="collapse" id="76a5411d-cfc9-469d-a18c-83cf2ed99ec0" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="6c6bec20-a5cd-421f-a309-ce0800a0b132">
+       <span class="text-muted" id="d2bd871b-52c8-4891-aeec-7b5cc0cd7745">
         Sets margin for the bottom side the specified size.
        </span>
-       <pre id="ea7b12b6-0eac-4d14-a734-bed605acb682"><code class="python">mb(size)</code></pre>
-       <div class="ms-3 collapse" id="21bf6368-4a01-430e-adee-828d6f18ee33">
-        <h6 id="efc2a1e3-e570-4017-a1cb-3dd16858fece">
+       <pre id="dbd44a2e-6190-47e2-87eb-892768aaf82c"><code class="python">mb(size)</code></pre>
+       <div class="ms-3 collapse" id="726be835-23dc-4bd0-8f95-5c3d02f31d44">
+        <h6 id="409e6ae7-8cdd-4694-8265-53f8d698f487">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="6d3f44b1-b8ce-4067-8f99-ed6313ba8fde">
+        <table class="table table-sm bg-light" id="60f5ed49-e2fd-4e83-afaa-44f45382ed69">
          <thead>
           <tr>
            <th scope="col">
@@ -543,13 +543,13 @@ button = Button("Hello").m(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="2b600c21-6cf0-49ed-b495-8da8836c0d00">
-        <h6 id="14e2600f-d72b-4bd0-93aa-c9948b174087">
+       <div class="ms-3 collapse" id="ea2d4299-1c24-4d23-93b4-8ea97d7d8b4f">
+        <h6 id="17b0407d-741c-4be9-b74a-461a1818309e">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="e710d65f-2cf3-4bf7-8511-328ba36c87f0">
+        <table class="table table-sm bg-light" id="bb5fa39c-afd3-43ca-bf2c-ee856c2879c2">
          <thead>
           <tr>
            <th scope="col">
@@ -582,47 +582,47 @@ button = Button("Hello").m(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="19bbe6a0-10b6-4bae-8cf9-5ecccc1f074d">
-        <h6 id="8954bfd6-5722-4379-a876-c069def46c62">
+       <div class="ms-3" id="8573798d-b583-4e4b-b191-c72da0d9d1fd">
+        <h6 id="58c1aeb9-2fd4-40aa-b2cd-7c7951c3362d">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="a1769278-b31f-4546-8971-b17639893543"><code class="python">from bootwrap import Button
+        <pre id="9d8db499-04ee-4572-8fbc-a847d9dee41b"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").mb(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="a2e04421-dd89-4f02-9a2c-135f68aaa799">
-       <div class="d-flex justify-content-between" id="ffdf724a-f7d2-4298-bbf2-629d62de1ab6">
-        <h4 id="3da7c73e-faee-4a4b-abaa-7f1552f5ccdb">
+      <div class="mt-5" id="9cb9f2c6-958b-438e-969d-b1926191c0a9">
+       <div class="d-flex justify-content-between" id="e74e538c-80f3-45a0-8106-22364e55da81">
+        <h4 id="950c2f7d-f09b-42e2-bcf8-1fa5ab7037d1">
          Method
-         <span class="text-primary" id="ef66046c-fbf2-422e-be60-67e5c446ed35">
+         <span class="text-primary" id="321551c4-3d2c-435f-a4ed-bc5a01a4eec4">
           me
          </span>
         </h4>
-        <div id="cd2d3bb4-6994-457b-ad3a-2f0d2da03cbe">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f33dfaeb-5a41-4892-bf8c-a5585cb54b7f" data-bs-toggle="collapse" id="c6fec6de-ec47-4e45-b950-5ddb21ed3099" onclick="return false;" type="button">
+        <div id="fee6b2c9-aa54-40bc-9c72-f8bcf0c42e4b">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#8393aa39-a0d2-453b-a104-83fc1f83e92a" data-bs-toggle="collapse" id="e46708be-73c6-4f9c-bf9d-3ff2f0f07dc8" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#89906a20-4ded-4ce5-b375-9f1c15ff4406" data-bs-toggle="collapse" id="9d7af6c2-822b-4095-bb00-0c92fb8e75e2" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#2c6d08b9-4c6e-4132-a882-3b7d37095058" data-bs-toggle="collapse" id="cf15c9bf-cf83-4635-8f9c-951f1e205607" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="a574f53e-8007-4ac6-93a5-f0b00e6d6ee6">
+       <span class="text-muted" id="2c6645e9-e312-4305-8f63-fbf17713c108">
         Sets margin for the end(right-side) to the specified size.
        </span>
-       <pre id="9223a914-8d21-4ede-96e8-35d4065b3fce"><code class="python">me(size)</code></pre>
-       <div class="ms-3 collapse" id="f33dfaeb-5a41-4892-bf8c-a5585cb54b7f">
-        <h6 id="1eb31464-b007-403e-8da4-ce112ebbd13d">
+       <pre id="8a78e5ba-e0c7-4205-9c85-2bc5cc5cda68"><code class="python">me(size)</code></pre>
+       <div class="ms-3 collapse" id="8393aa39-a0d2-453b-a104-83fc1f83e92a">
+        <h6 id="ef46a516-278f-4c43-b424-ccd0dc606b3f">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="b8b1d870-5d7e-4467-a3e4-d39ae9b019b3">
+        <table class="table table-sm bg-light" id="488a0bad-27e8-4b5b-852d-3a9f705c4b84">
          <thead>
           <tr>
            <th scope="col">
@@ -655,13 +655,13 @@ button = Button("Hello").mb(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="89906a20-4ded-4ce5-b375-9f1c15ff4406">
-        <h6 id="5e6f36f7-d775-44d2-aaf4-49d928350602">
+       <div class="ms-3 collapse" id="2c6d08b9-4c6e-4132-a882-3b7d37095058">
+        <h6 id="8c0ff32f-6dab-4162-b793-7120169d0d29">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="e7da307b-b261-4279-81f7-1c220eb700ac">
+        <table class="table table-sm bg-light" id="69c85402-932d-4fe7-baea-8d0c7a813e3b">
          <thead>
           <tr>
            <th scope="col">
@@ -694,47 +694,47 @@ button = Button("Hello").mb(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="d2551c5b-a2f0-454c-a770-53c11243e20e">
-        <h6 id="413681f9-5891-442f-8d85-091f88396aa4">
+       <div class="ms-3" id="fb7fada8-40dc-49f0-9715-fa52ae6888e9">
+        <h6 id="d4ec7be0-edca-4e3c-a68f-4323225e34cd">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="9bcadb5f-ac1f-456c-b77f-e5167581733d"><code class="python">from bootwrap import Button
+        <pre id="c68d9338-3e57-43ca-a305-63034f050c19"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").me(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="e653ee35-99aa-40de-8c59-e0ae5adf7edb">
-       <div class="d-flex justify-content-between" id="69dd184b-82cb-4a8e-bfd3-ae6891ceddbb">
-        <h4 id="ad498c5c-f7ac-4047-852a-93f184c80986">
+      <div class="mt-5" id="9f727c54-76fd-4d3f-9b8e-a022ae5228cd">
+       <div class="d-flex justify-content-between" id="c048888b-3c08-498d-82b6-226362e7bfcd">
+        <h4 id="ad041a60-6f2a-4632-9daf-814be2d958c2">
          Method
-         <span class="text-primary" id="ff39b16b-653a-438e-a12c-712e613d6fac">
+         <span class="text-primary" id="51de2e97-f099-4fd2-bd30-97ec0d71d4b7">
           ms
          </span>
         </h4>
-        <div id="cc04646d-721a-4d59-a786-431db8389f83">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#7a5d1796-86d5-45f8-960a-e26e478efc5f" data-bs-toggle="collapse" id="f6426da0-345b-4a91-a08b-92a9a0eeb9c5" onclick="return false;" type="button">
+        <div id="8db29c54-cb9c-4f72-83ba-ded5fa433a7f">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#93cbcf74-f61c-4049-a671-416b83be754d" data-bs-toggle="collapse" id="f394cabe-56ba-4312-babf-07a540a575c7" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#be8ef596-d242-4bd1-b921-19ff0cf74b0a" data-bs-toggle="collapse" id="eb0c6dd2-353c-4877-b272-ef76ee9abb7f" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#46f8c704-e76b-4776-b111-17af1d5292e1" data-bs-toggle="collapse" id="3ad435b1-cd13-4787-be09-084e60637df7" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="b0de61db-32d6-408c-be3b-9518d1bd41b6">
+       <span class="text-muted" id="0cc832f3-1d22-48d3-9a8b-91744a14b96b">
         Sets margin for the start(left-side) to the specified size.
        </span>
-       <pre id="4587cdd3-d7f6-49e6-835a-76e230875632"><code class="python">ms(size)</code></pre>
-       <div class="ms-3 collapse" id="7a5d1796-86d5-45f8-960a-e26e478efc5f">
-        <h6 id="74bcb450-1c78-43ba-a09f-ae643c6481ba">
+       <pre id="1fe51319-2dc9-49de-8314-4626495b8074"><code class="python">ms(size)</code></pre>
+       <div class="ms-3 collapse" id="93cbcf74-f61c-4049-a671-416b83be754d">
+        <h6 id="37f9b0e6-a422-467a-9870-b183d29043ad">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="b898ea4d-f67a-4362-beb4-cf53ed104dcb">
+        <table class="table table-sm bg-light" id="9e81a003-4324-4a4c-8cd6-5d713f999280">
          <thead>
           <tr>
            <th scope="col">
@@ -767,13 +767,13 @@ button = Button("Hello").me(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="be8ef596-d242-4bd1-b921-19ff0cf74b0a">
-        <h6 id="0caf0d26-16b9-4a0e-97ab-1141d15a9380">
+       <div class="ms-3 collapse" id="46f8c704-e76b-4776-b111-17af1d5292e1">
+        <h6 id="467cd27c-73f0-405d-9720-15e62281b973">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="f30da344-e8e3-4217-bbac-0a96ed56a9e4">
+        <table class="table table-sm bg-light" id="4bea1c59-761b-485f-8f93-fcc7ae351174">
          <thead>
           <tr>
            <th scope="col">
@@ -806,47 +806,47 @@ button = Button("Hello").me(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="a45ac5b4-409e-4dc8-afc0-603e79afe3a0">
-        <h6 id="14386c7d-7179-427c-b0c5-243977de68df">
+       <div class="ms-3" id="870ce8ea-330c-4a1b-bb48-ea96a68e16bf">
+        <h6 id="a3976f09-6d99-4801-8d12-57e023e3d4af">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="7c792fd1-f6f2-4379-9b57-21408e7ae22a"><code class="python">from bootwrap import Button
+        <pre id="1f772e35-ecde-4445-990e-5a3e9298983c"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").ms(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="8cf3b2db-a49c-446b-8d3e-cf3e98895079">
-       <div class="d-flex justify-content-between" id="7e6ba040-21cb-4fc0-baba-416aebb4096b">
-        <h4 id="ea2f5f90-f59b-4c7b-bd5f-d1c41ace2e76">
+      <div class="mt-5" id="3d4276cd-eedb-4748-8169-00d491c1dea7">
+       <div class="d-flex justify-content-between" id="e394d1e5-ec80-4e95-b87c-5cd59fab595c">
+        <h4 id="ce357a55-b1e2-4fa3-8f2a-3e6c7f3f1a5a">
          Method
-         <span class="text-primary" id="db21dd7e-8f30-4d6d-aed9-30c594bdbf54">
+         <span class="text-primary" id="389b39bc-2e95-452f-8d0b-ecf27b0e68f6">
           mt
          </span>
         </h4>
-        <div id="043fe5dd-51e8-4b34-968c-172eddbc48a2">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#3de1f21d-5610-451a-87c9-39a70db37c8c" data-bs-toggle="collapse" id="c72f1257-acfe-4682-8de4-0b6274f6f28f" onclick="return false;" type="button">
+        <div id="a605b8c4-3a17-4f31-bacd-5ec520029296">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f915f907-9592-45ce-85de-21350a1b764d" data-bs-toggle="collapse" id="df4a0e8c-7390-490d-a7fd-e00f2aefca04" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#94d4818c-6c48-429f-9302-7b958241e830" data-bs-toggle="collapse" id="2f638c73-b518-4f68-ab92-0a8c56e23552" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#ab0cd06a-f705-46de-a340-204096fc7729" data-bs-toggle="collapse" id="cc44f984-6dbb-48b7-abbd-dff70025c6b2" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="7efa2d77-42f9-4699-8650-1d43b76567c0">
+       <span class="text-muted" id="de7c1b2e-b688-43f3-938a-a18661c3c523">
         Sets margin for the top side to the specified size.
        </span>
-       <pre id="00b4133b-48fb-49b0-9950-615b8d23092a"><code class="python">mt(size)</code></pre>
-       <div class="ms-3 collapse" id="3de1f21d-5610-451a-87c9-39a70db37c8c">
-        <h6 id="5c6a83b8-0f7b-46cb-9af2-b006ebd170b0">
+       <pre id="1a06b7b8-5148-4fbd-a961-685d730d48fc"><code class="python">mt(size)</code></pre>
+       <div class="ms-3 collapse" id="f915f907-9592-45ce-85de-21350a1b764d">
+        <h6 id="8ac5f940-b3a7-4e2c-a8bd-333e538de02a">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="57ea5ce3-d9a5-4c74-8308-49b211213a11">
+        <table class="table table-sm bg-light" id="67f88577-edba-4228-bee7-9c81d5e254ff">
          <thead>
           <tr>
            <th scope="col">
@@ -879,13 +879,13 @@ button = Button("Hello").ms(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="94d4818c-6c48-429f-9302-7b958241e830">
-        <h6 id="805e4e3c-c0aa-4769-97ca-3f929d3f2ae5">
+       <div class="ms-3 collapse" id="ab0cd06a-f705-46de-a340-204096fc7729">
+        <h6 id="9fae59c5-be29-4473-838f-e58e57b10f5f">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="ff7d79a8-7abf-4568-a141-42dc120cfcce">
+        <table class="table table-sm bg-light" id="e3b4f562-de94-4c02-b69d-7b0fe50727bf">
          <thead>
           <tr>
            <th scope="col">
@@ -918,47 +918,47 @@ button = Button("Hello").ms(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="a613496c-900e-4508-8f2a-371bb9037054">
-        <h6 id="fabe414e-9f5d-4106-938c-890312659b3f">
+       <div class="ms-3" id="f6068d1e-9c94-437d-954d-09dc6afb39e5">
+        <h6 id="a5989ef8-83b8-4f3c-ad7c-9c6354f62c01">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="987b5a05-226c-4a67-b60c-2980e363d89b"><code class="python">from bootwrap import Button
+        <pre id="bda0f397-651e-4f4c-80c2-c15f8293baea"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").mt(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="b713414a-5c30-47a7-a642-8d2b551c13da">
-       <div class="d-flex justify-content-between" id="7b2d14ca-81ee-4a08-b388-fd91d4b9c18a">
-        <h4 id="e75e718b-8698-44e1-9170-851b22b8cf9b">
+      <div class="mt-5" id="bdd089a6-66d4-4694-ba26-202a2e6e0d63">
+       <div class="d-flex justify-content-between" id="3d9ab2e1-d62d-4254-9a83-4aa40bc90c9b">
+        <h4 id="382205c2-f54c-49ba-9f98-fca8416225c7">
          Method
-         <span class="text-primary" id="bd57d0eb-cc0e-41e8-8631-b8f9bfcf804a">
+         <span class="text-primary" id="0989ca24-b946-4da3-8cb7-92e4ee13aaee">
           mx
          </span>
         </h4>
-        <div id="e1512f02-3d9d-4bfe-88e6-62c278de7282">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#96c4360e-9af6-4fea-9d2d-4da2514a5ca9" data-bs-toggle="collapse" id="2117fe6d-2048-4d7a-aea5-6e5b1eb7dcc8" onclick="return false;" type="button">
+        <div id="b26d9bf5-47b7-4aee-b33c-1154f01dedca">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#780e8c93-105e-44c3-8c74-b23c58ff66b0" data-bs-toggle="collapse" id="49c59031-1f31-4314-b385-fd2ebd708d6f" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#6f6a1fe9-2308-4e84-b0a1-c5fbbf86c1cd" data-bs-toggle="collapse" id="fa101af4-07b9-48ad-b30d-7420296779e2" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#43071fe5-f273-457f-8bb7-0eb2ad732af1" data-bs-toggle="collapse" id="2c18c8b9-9e8a-4503-a7bc-d116e6d81102" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="6c85ab05-e213-4c1c-8d02-a6ed40ad24b5">
+       <span class="text-muted" id="245b8818-9c4a-459c-a97a-63c70f4cb6b3">
         Sets margin for left and right sides to the specified size.
        </span>
-       <pre id="ea48b390-eac8-42e3-be23-fd4b31c3b91a"><code class="python">mx(size)</code></pre>
-       <div class="ms-3 collapse" id="96c4360e-9af6-4fea-9d2d-4da2514a5ca9">
-        <h6 id="1c44dd1a-bcf3-4b60-a42c-5ffa21b2e6ec">
+       <pre id="44855436-b584-47f9-a493-aafbae2029d9"><code class="python">mx(size)</code></pre>
+       <div class="ms-3 collapse" id="780e8c93-105e-44c3-8c74-b23c58ff66b0">
+        <h6 id="66142cb8-bcb4-43ad-859b-b8fef0659e29">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="0aa2d106-c933-467d-b0fb-680fdf5ce314">
+        <table class="table table-sm bg-light" id="732603dc-2b7d-46e9-8da6-170512b35152">
          <thead>
           <tr>
            <th scope="col">
@@ -991,13 +991,13 @@ button = Button("Hello").mt(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="6f6a1fe9-2308-4e84-b0a1-c5fbbf86c1cd">
-        <h6 id="de037a5d-1a30-4a4c-a69c-346b5fdc009d">
+       <div class="ms-3 collapse" id="43071fe5-f273-457f-8bb7-0eb2ad732af1">
+        <h6 id="6cac3398-8531-4117-a6bc-38ab0f1500b4">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="ae39d8a7-1a22-4a10-a41e-094b2c9711c6">
+        <table class="table table-sm bg-light" id="5d34caff-145b-4f0d-8ef5-60cb7efa95e1">
          <thead>
           <tr>
            <th scope="col">
@@ -1030,47 +1030,47 @@ button = Button("Hello").mt(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="ac135a0e-499e-451c-a640-685687803d57">
-        <h6 id="207e42f7-783f-4574-ba23-fb155144b662">
+       <div class="ms-3" id="ab643319-1345-4541-9edc-4c43be9dface">
+        <h6 id="5febf45d-1cb4-4cfa-8a7e-b50443ae56fe">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="4ae49456-5526-42d4-ae0d-bc6dbf1461f7"><code class="python">from bootwrap import Button
+        <pre id="130944f0-3158-4041-9a2a-a0fe436e128a"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").mx(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="13b6f6c3-e821-4322-bb46-015956badb9e">
-       <div class="d-flex justify-content-between" id="4392608b-fcd2-45e9-bc94-0089abe338f9">
-        <h4 id="3f51563e-a03e-47ee-b9da-5a175ca0925c">
+      <div class="mt-5" id="17d34e2c-329c-4dd6-a5b4-f471c87b20c3">
+       <div class="d-flex justify-content-between" id="179f6162-f4f6-4623-aaae-ec679d78d455">
+        <h4 id="e452f092-0e6b-4c6f-a1d8-de5177bd60f5">
          Method
-         <span class="text-primary" id="2576923d-e152-4494-a706-5b93e7296d56">
+         <span class="text-primary" id="0eff2c6f-512b-44a3-9e1c-5f3b9989b6e7">
           my
          </span>
         </h4>
-        <div id="3a8bdbdf-ad4f-4599-9a70-0db8a8ab6b96">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#88cc91b5-cbf1-4d5e-b9d9-bc9160047d88" data-bs-toggle="collapse" id="74fecdc2-38ab-40da-ad51-5975fd047c4e" onclick="return false;" type="button">
+        <div id="5f073662-3e3e-447c-820a-d443741061be">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#bde8800a-aa3f-4855-9476-0ca89409b7f0" data-bs-toggle="collapse" id="6e3dfc8f-e610-43b0-b866-b8bbadf3a9a8" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#428cf170-887b-43c8-850f-2c8ff10fd2f0" data-bs-toggle="collapse" id="805eb5d7-55a5-4f25-bcfc-86d6e460ca69" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#a3a14dd7-b7cc-4346-9e01-602d226be3fb" data-bs-toggle="collapse" id="c3503aff-9020-49da-b9c1-79a6d0f25ca3" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="abddbe32-e583-436b-8821-2d616320c74e">
+       <span class="text-muted" id="d2029465-ccc3-4b3d-a629-d4d7835662f3">
         Sets margin for top and bottom sides to the specified size.
        </span>
-       <pre id="00140f3c-bba0-4849-a5a8-d5a5545d3936"><code class="python">my(size)</code></pre>
-       <div class="ms-3 collapse" id="88cc91b5-cbf1-4d5e-b9d9-bc9160047d88">
-        <h6 id="13eb3ca9-33ff-40df-8ba2-e92f9c540d40">
+       <pre id="ca18c9b2-4468-4d5e-8ff5-6bad29ddc739"><code class="python">my(size)</code></pre>
+       <div class="ms-3 collapse" id="bde8800a-aa3f-4855-9476-0ca89409b7f0">
+        <h6 id="de9a7d78-539b-4838-aba3-9575b575744d">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="65aeeef4-23dd-4cd0-87e5-b4620ed6cbda">
+        <table class="table table-sm bg-light" id="cb22d46d-b710-4bbe-a57c-2defbdc6db3f">
          <thead>
           <tr>
            <th scope="col">
@@ -1103,13 +1103,13 @@ button = Button("Hello").mx(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="428cf170-887b-43c8-850f-2c8ff10fd2f0">
-        <h6 id="e02fc3cd-4191-4724-924b-a8125da17905">
+       <div class="ms-3 collapse" id="a3a14dd7-b7cc-4346-9e01-602d226be3fb">
+        <h6 id="84e3a171-aaed-4d66-b336-36d67025d059">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="7bc520ba-ebb2-45f0-96bf-c8cedb404d41">
+        <table class="table table-sm bg-light" id="e451bdcc-c9f1-4101-8aea-cbbf49ece8f4">
          <thead>
           <tr>
            <th scope="col">
@@ -1142,47 +1142,47 @@ button = Button("Hello").mx(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="05c1959e-cd16-4170-b794-ac5937f7a58a">
-        <h6 id="6bff3091-a326-4188-9241-8de85ea39156">
+       <div class="ms-3" id="ac7cb543-1be9-4625-92a5-630d9663f4c7">
+        <h6 id="83656536-cc06-4ae4-a0b0-7b3d8d2899eb">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="fa11c5ec-d6dc-40b5-9f63-eaab3d3f2a9d"><code class="python">from bootwrap import Button
+        <pre id="7a1cebcc-6a2e-472e-8e2e-58a003fee8de"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").my(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="0d309495-3fee-4f59-b239-f6312d1518fd">
-       <div class="d-flex justify-content-between" id="3edede07-c947-4c47-9873-8c706362e29b">
-        <h4 id="a4bd85d1-c495-4f56-be1d-9e294b4b74b7">
+      <div class="mt-5" id="4699c9ac-99c5-4ae7-b8b4-9d36bb8acd56">
+       <div class="d-flex justify-content-between" id="8568bd55-7168-44e4-8da6-0485fcadc7e8">
+        <h4 id="9441ff8d-1d1b-4fb7-8e01-1416f0376236">
          Method
-         <span class="text-primary" id="f7e0efca-9728-4d2d-9119-aadb026e4c6c">
+         <span class="text-primary" id="2fb0b424-ce30-4df3-b810-d4175b9a6ce7">
           p
          </span>
         </h4>
-        <div id="d8afffa4-5f30-42ea-ac80-4ca19b401a69">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#8de9195b-928d-4229-bf0e-326b3c0f22fb" data-bs-toggle="collapse" id="2f7b0176-ac78-4307-a6ce-b7fcb5b4ce2d" onclick="return false;" type="button">
+        <div id="2b3367be-b41e-4fb2-ae73-222cdb6b715f">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#473bf9b7-c848-4073-8bc3-4883730bef46" data-bs-toggle="collapse" id="524086df-44b9-420d-be90-ca0b6743a4f4" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#e2d8dead-9a3d-49db-8506-c51393522744" data-bs-toggle="collapse" id="57a6b1ee-396a-41f4-9497-603136f4f46f" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#ca981648-fc7e-4e60-b3f2-a3500174df3b" data-bs-toggle="collapse" id="2c508222-a764-4a7f-b806-180543824e63" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="3d0217a8-7124-4939-824e-c7b967e2920e">
+       <span class="text-muted" id="ecd7e51b-65df-4f82-b578-6a2f46821ae6">
         Sets padding for all four sides to the specified size.
        </span>
-       <pre id="d8b2eaaa-e16e-4a3d-87de-2bff0767fc0f"><code class="python">p(size)</code></pre>
-       <div class="ms-3 collapse" id="8de9195b-928d-4229-bf0e-326b3c0f22fb">
-        <h6 id="15a99d65-e690-4f49-96aa-eccab410bf6d">
+       <pre id="eb62db9a-10a9-42e5-83f7-3531f4d2270f"><code class="python">p(size)</code></pre>
+       <div class="ms-3 collapse" id="473bf9b7-c848-4073-8bc3-4883730bef46">
+        <h6 id="1545245f-59b6-4e31-a80a-b7444c048528">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="8950ce25-7816-4703-b7bb-e0f0900282ed">
+        <table class="table table-sm bg-light" id="d014f9c1-07ed-46c2-8132-4e2e60754694">
          <thead>
           <tr>
            <th scope="col">
@@ -1215,13 +1215,13 @@ button = Button("Hello").my(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="e2d8dead-9a3d-49db-8506-c51393522744">
-        <h6 id="191490a0-6023-4fac-abee-3c166437ebc2">
+       <div class="ms-3 collapse" id="ca981648-fc7e-4e60-b3f2-a3500174df3b">
+        <h6 id="7fc7e6f7-8bf9-4f35-823f-956e76209dd3">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="bcd6b8b6-798f-432f-90e2-a62b052a1b21">
+        <table class="table table-sm bg-light" id="c2fe0115-bc17-4fea-a220-2c7b0dea9c8d">
          <thead>
           <tr>
            <th scope="col">
@@ -1254,47 +1254,47 @@ button = Button("Hello").my(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="58e4c162-44cb-4314-9c10-95efb18245ef">
-        <h6 id="dc7bcd08-43f0-4a6e-afb7-b1c0d094c119">
+       <div class="ms-3" id="bf07ff57-46af-4a2e-8d65-96bd7a782900">
+        <h6 id="5eb861c1-f0de-4683-b4b3-c89e71d8a1bf">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="41970f80-69d0-4c0c-89dc-6dc55a549d76"><code class="python">from bootwrap import Button
+        <pre id="a925621b-15e8-4fc5-aee4-704473a66f97"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").p(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="775d9ca7-4bbe-438a-8d9a-47fd06a41780">
-       <div class="d-flex justify-content-between" id="3197753c-0072-4e3e-a5bc-b97ba74edac7">
-        <h4 id="adf29b2e-85c7-454d-9d87-c0c8694c641f">
+      <div class="mt-5" id="94f890e7-340c-4fd2-8205-4e9c8d152adf">
+       <div class="d-flex justify-content-between" id="985d64a0-93f0-4645-9727-1314277976f2">
+        <h4 id="cd3cf6f2-bf33-428d-8b45-5d194ad96d75">
          Method
-         <span class="text-primary" id="9614631e-28a7-4f11-8caa-eef6fac42665">
+         <span class="text-primary" id="ffeea402-0d09-42e5-ab60-e61e9d5904cf">
           pb
          </span>
         </h4>
-        <div id="e6416506-5ec8-4539-abce-d42657d130fe">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#fdf74c7c-ca75-4f0a-a518-8a3529f0ff71" data-bs-toggle="collapse" id="7e57cf2d-b21f-46af-b137-6fa3ad72d19a" onclick="return false;" type="button">
+        <div id="fbe608d0-ea12-458e-936f-765a534680e4">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#7fee2ef6-5c7a-42b4-8a19-eaa1c4c38538" data-bs-toggle="collapse" id="3dbffd5c-a351-4060-937b-aa8d6446d275" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#c7f97f33-fa53-47d7-9e72-a958939c2f13" data-bs-toggle="collapse" id="fecb9a76-af8e-48e0-81fb-4575529597f4" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#e48662d4-f4dd-4550-b5a8-bc41425bde00" data-bs-toggle="collapse" id="b303e46c-9b1e-495d-ad3a-b68f7196bc9c" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="4a858cbc-167b-447b-9e01-449bc08dbb61">
+       <span class="text-muted" id="6387ef8a-c83f-4b93-aa70-d84dd58e8921">
         Sets padding for the bottom side the specified size.
        </span>
-       <pre id="89f3d639-785d-4f04-810f-a7106a076d13"><code class="python">pb(size)</code></pre>
-       <div class="ms-3 collapse" id="fdf74c7c-ca75-4f0a-a518-8a3529f0ff71">
-        <h6 id="dd589a54-7af4-48a0-a572-5d13367be72c">
+       <pre id="949cf6cb-878e-4fc0-a120-ae51b2c7c809"><code class="python">pb(size)</code></pre>
+       <div class="ms-3 collapse" id="7fee2ef6-5c7a-42b4-8a19-eaa1c4c38538">
+        <h6 id="b6f8de78-4baf-4d7a-aff7-e982900f1213">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="760a3001-4f16-4f65-8971-da8b556d8f52">
+        <table class="table table-sm bg-light" id="e144e34b-c05a-4336-b117-fecba5fd87f1">
          <thead>
           <tr>
            <th scope="col">
@@ -1327,13 +1327,13 @@ button = Button("Hello").p(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="c7f97f33-fa53-47d7-9e72-a958939c2f13">
-        <h6 id="af19d780-80ed-4fb5-9a17-13df6132abcd">
+       <div class="ms-3 collapse" id="e48662d4-f4dd-4550-b5a8-bc41425bde00">
+        <h6 id="7a14219f-209d-44ba-9119-1cf3290e451f">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="3fabf944-882b-49e0-8542-f34b266c0b22">
+        <table class="table table-sm bg-light" id="1afbfa95-fe5f-4a01-b2dc-276c1f370412">
          <thead>
           <tr>
            <th scope="col">
@@ -1366,47 +1366,47 @@ button = Button("Hello").p(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="f5b375e0-47d6-4aa8-a46d-02aaee02c258">
-        <h6 id="cbd31f81-7e52-45d3-a6e2-18d3cbf9134f">
+       <div class="ms-3" id="707a5472-5129-4049-a91d-39d091e96de8">
+        <h6 id="2197cac6-96ac-45e5-b5f4-77ce6d2fb202">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="3af27444-f5ad-4b8f-9748-751f81dd60fd"><code class="python">from bootwrap import Button
+        <pre id="9bb0c6a3-be2d-4e0b-b7f6-252029eb9ff0"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").pb(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="60a1a486-f87b-440f-906a-f4ba1d1b4b37">
-       <div class="d-flex justify-content-between" id="f84d377c-59a1-4852-abb7-59ababb2d6a1">
-        <h4 id="0a8848d9-fc67-4b60-bad6-99f7b4b33d8f">
+      <div class="mt-5" id="1551493c-9c40-4d30-baaa-0102bfe7dc64">
+       <div class="d-flex justify-content-between" id="378a2574-5f0f-4df4-b810-19b32e107095">
+        <h4 id="dbe7dc58-ad78-427c-a1e4-a8d3ca5e3195">
          Method
-         <span class="text-primary" id="691a16ec-44dc-4cf8-817f-ebd0e0d9f971">
+         <span class="text-primary" id="4a336342-b06a-4c0e-aa5d-3f7c60a6e535">
           pe
          </span>
         </h4>
-        <div id="b9e1975d-62d0-4857-a5ec-0bc3912de3b3">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#105a4017-bc5c-4035-b145-402aacc112fc" data-bs-toggle="collapse" id="e33c9bba-e8e7-4c65-9829-599f94491656" onclick="return false;" type="button">
+        <div id="b6aaa678-15f8-4466-ad96-20a561bb270c">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#cf0d4718-20d9-4fe9-aeca-83ff4725902c" data-bs-toggle="collapse" id="3a79e0df-ce10-4b6b-84f2-7b166cb890ae" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#b2952206-9840-485d-9d27-be8605e91b4f" data-bs-toggle="collapse" id="7774b38a-09c6-4f83-9971-47e607ebd005" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#7934b4f4-69c5-4bd6-84a7-1c7ca21baddc" data-bs-toggle="collapse" id="b80d825c-8fc2-4b5f-b8a1-f8fe44207830" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="84064476-4cbd-4d62-9d81-b0f11023a3c6">
+       <span class="text-muted" id="65a327a9-27c9-4f4e-8d31-74cce06d7b05">
         Sets padding for the end(right-side) to the specified size.
        </span>
-       <pre id="ef5c4c95-6a40-4739-9615-6c26606e388a"><code class="python">pe(size)</code></pre>
-       <div class="ms-3 collapse" id="105a4017-bc5c-4035-b145-402aacc112fc">
-        <h6 id="c4c0a920-dd35-403f-b9b3-ca9ae5493304">
+       <pre id="ac2d9084-699c-4972-b2bc-b0d7f566b591"><code class="python">pe(size)</code></pre>
+       <div class="ms-3 collapse" id="cf0d4718-20d9-4fe9-aeca-83ff4725902c">
+        <h6 id="939fe5b7-452a-4076-b219-f244187397be">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="9c89f822-26a0-4218-8917-e933fae21e3c">
+        <table class="table table-sm bg-light" id="3ec8f663-d42f-46b0-a639-0d7d8314e486">
          <thead>
           <tr>
            <th scope="col">
@@ -1439,13 +1439,13 @@ button = Button("Hello").pb(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="b2952206-9840-485d-9d27-be8605e91b4f">
-        <h6 id="a3058223-ef70-44c0-a3a6-961b606ed38a">
+       <div class="ms-3 collapse" id="7934b4f4-69c5-4bd6-84a7-1c7ca21baddc">
+        <h6 id="39839cdb-a0e3-42c9-aa25-252c31b35c58">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="3aa012b1-d874-4407-9f3b-958bb1e173a9">
+        <table class="table table-sm bg-light" id="63e493a4-a280-42c2-ac74-1df76a0f3091">
          <thead>
           <tr>
            <th scope="col">
@@ -1478,47 +1478,47 @@ button = Button("Hello").pb(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="10088a9c-ccfa-4615-b410-d336920b7a0f">
-        <h6 id="33696a79-fe6b-4733-b0d7-0be6c8a4a5a8">
+       <div class="ms-3" id="9499917a-b98e-4b53-80db-4c03e10cbabb">
+        <h6 id="2579a9ff-1359-46ea-ba5a-91475e22c734">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="d3645721-1008-49ca-8512-466f37261fae"><code class="python">from bootwrap import Button
+        <pre id="845895b0-b1c9-4cda-a4dc-6019dd39dd78"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").pe(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="faceffc9-7b98-4735-80b8-2193d6c3a739">
-       <div class="d-flex justify-content-between" id="6a0eebc9-b5f9-4e1d-8a0d-a7e56ac432f8">
-        <h4 id="815f7674-8a6d-41cd-addf-4137a740dc6d">
+      <div class="mt-5" id="c22edb6b-832b-4d56-a65c-c90f31c163a3">
+       <div class="d-flex justify-content-between" id="f6960dbb-1fd9-4755-8452-877d7ed5580d">
+        <h4 id="16c05238-9197-47d4-9c05-c30585b7d646">
          Method
-         <span class="text-primary" id="5b04fba2-c9d0-40c5-bdb4-8a7a33d9730e">
+         <span class="text-primary" id="77277f49-0f28-49f3-b3e8-dee12ad1c172">
           ps
          </span>
         </h4>
-        <div id="ab6593c5-5560-408d-9985-2055953fd890">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#b0a728eb-a93a-4b90-86db-6792cdafa4e3" data-bs-toggle="collapse" id="96e064d6-60de-4077-b3d6-65109a61ca20" onclick="return false;" type="button">
+        <div id="2863eb9e-f2b5-4dab-b4e8-99dc75391da7">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#dad55c1e-e017-47e9-8757-18ca9298242d" data-bs-toggle="collapse" id="f01063ff-b3c8-4032-a299-6a56490b636b" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#3cc53e4f-54c5-441e-a623-dca667c06bd7" data-bs-toggle="collapse" id="8b4d5e03-4f0d-4762-bc25-f1e41be2f273" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#03041bdd-0619-46e3-b200-1f8b1648b800" data-bs-toggle="collapse" id="6992d71b-627a-40de-a1d6-014a0a3ca750" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="ef35ccc2-c664-4dbb-b13e-635ad1f8a1aa">
+       <span class="text-muted" id="25de8a0c-929f-451d-918f-a7fdb75f56a7">
         Sets padding for the start(left-side) to the specified size.
        </span>
-       <pre id="015b5269-18c2-4be9-9641-4f1a1842ba1d"><code class="python">ps(size)</code></pre>
-       <div class="ms-3 collapse" id="b0a728eb-a93a-4b90-86db-6792cdafa4e3">
-        <h6 id="17a61665-4138-4b21-b972-5e264d2abbf7">
+       <pre id="16b23fc3-3fee-43dd-942d-f8897fc09ae9"><code class="python">ps(size)</code></pre>
+       <div class="ms-3 collapse" id="dad55c1e-e017-47e9-8757-18ca9298242d">
+        <h6 id="54e92026-6e57-4b70-b78d-863b4320f8b3">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="d0b0b8d8-9ea5-41b0-a0ca-1f6dbabd1f7d">
+        <table class="table table-sm bg-light" id="8c10f938-e4b7-4eb3-9d32-ad31c6c9a611">
          <thead>
           <tr>
            <th scope="col">
@@ -1551,13 +1551,13 @@ button = Button("Hello").pe(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="3cc53e4f-54c5-441e-a623-dca667c06bd7">
-        <h6 id="079b0bdf-99a0-41b7-a7c6-09fe7d3a6a85">
+       <div class="ms-3 collapse" id="03041bdd-0619-46e3-b200-1f8b1648b800">
+        <h6 id="c2c45fd2-0b27-40bd-b191-debc65d37124">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="4f118f7a-ff88-4ea0-ba51-1607b63dce01">
+        <table class="table table-sm bg-light" id="1da9ca3b-df54-4d0c-8333-8405c85ae4ee">
          <thead>
           <tr>
            <th scope="col">
@@ -1590,47 +1590,47 @@ button = Button("Hello").pe(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="cd3bdf9d-d47a-4947-8086-a2d6ef1e0927">
-        <h6 id="67fcdfd4-d249-4f2f-8827-de79253a4ccc">
+       <div class="ms-3" id="461cc5ee-91b5-4358-8904-2a29f0006213">
+        <h6 id="70a3b018-0f3a-49df-b973-411e915d1ecc">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="bb22e909-5b07-421b-ad17-28958ad9b5d2"><code class="python">from bootwrap import Button
+        <pre id="f15ca4e7-751a-4564-ac18-e0b351ecd181"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").ps(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="b222d50b-aa24-4136-ab29-f1398e12902a">
-       <div class="d-flex justify-content-between" id="fabfa6b0-23d8-4549-a67f-7483b387ba60">
-        <h4 id="00bedea2-5ca3-4cfe-a494-7984f5e16738">
+      <div class="mt-5" id="48fb231f-2ef9-47f6-b8dd-0f3c55310d3e">
+       <div class="d-flex justify-content-between" id="95a5097d-b656-4825-a44d-2525768ff24c">
+        <h4 id="39688202-5647-4b7b-8947-9995dedb78cb">
          Method
-         <span class="text-primary" id="765c17fb-329a-442f-8600-de6998944885">
+         <span class="text-primary" id="375b3c5a-607c-44b3-bb71-a9bf4199af8b">
           pt
          </span>
         </h4>
-        <div id="c5e619ed-07fa-4b56-92f8-1a8a9758efb8">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#3826a48a-6eb3-4bad-828f-14c00eb2af78" data-bs-toggle="collapse" id="06541438-072c-43ce-b782-2313393b9870" onclick="return false;" type="button">
+        <div id="42ca71f2-3813-447c-acf3-dfee215b1734">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#e8dc51d0-4f55-4a9b-8ca7-550031a3167c" data-bs-toggle="collapse" id="84957019-7473-4f09-bf8c-0ffa682d32b4" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#0590a471-0d03-4c83-86db-99b2943978cb" data-bs-toggle="collapse" id="2da7109e-83ff-4caf-aaae-fc960de5a129" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#b00b7bc2-6f5a-4420-8521-e222bd3a30eb" data-bs-toggle="collapse" id="6dec7557-1d32-4dc9-8288-f94e0536a5d9" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="51e1972f-b8d5-4c7c-9e0e-389f37b304ac">
+       <span class="text-muted" id="852658ad-36c4-4b1f-9c06-4a5e244f8d28">
         Sets padding for the top side to the specified size.
        </span>
-       <pre id="db52592f-4c4c-4407-950d-ba971320b43c"><code class="python">pt(size)</code></pre>
-       <div class="ms-3 collapse" id="3826a48a-6eb3-4bad-828f-14c00eb2af78">
-        <h6 id="9a427a16-da91-438c-92d6-01107fb3f7e1">
+       <pre id="2ecfdfcd-b47b-4fab-a1dc-e40d15904567"><code class="python">pt(size)</code></pre>
+       <div class="ms-3 collapse" id="e8dc51d0-4f55-4a9b-8ca7-550031a3167c">
+        <h6 id="df1194d2-5de5-4509-9ae3-b0f3a8044c13">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="e41338a4-920e-4438-b8ac-7b5af20d7b2f">
+        <table class="table table-sm bg-light" id="7d93003c-8234-41cb-a2bc-be410c6386e2">
          <thead>
           <tr>
            <th scope="col">
@@ -1663,13 +1663,13 @@ button = Button("Hello").ps(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="0590a471-0d03-4c83-86db-99b2943978cb">
-        <h6 id="b776de92-b526-4737-b2da-e68a6b4cc2a7">
+       <div class="ms-3 collapse" id="b00b7bc2-6f5a-4420-8521-e222bd3a30eb">
+        <h6 id="818bb2e5-8dfb-4ee7-a698-55183e0e9e75">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="41442989-ba26-4550-9adc-ab7252254338">
+        <table class="table table-sm bg-light" id="ee29fa6f-0dc1-4d41-a866-88dee14a1af9">
          <thead>
           <tr>
            <th scope="col">
@@ -1702,47 +1702,47 @@ button = Button("Hello").ps(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="d9a93dc8-a34a-42b3-bddf-ff5a864f2e2c">
-        <h6 id="127c3256-6f89-4511-809e-bcda9d879688">
+       <div class="ms-3" id="842fc11e-31a8-4802-af71-b999b91ce4a6">
+        <h6 id="d1f2b702-f92c-4b95-a881-25fa08667ec2">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="c14ff23f-8789-4fc1-89a4-75dd86e96c9e"><code class="python">from bootwrap import Button
+        <pre id="5b8d6f60-965c-4e43-b6a4-85c4608c3185"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").pt(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="e8ca9244-c944-433c-9527-4605fc02fd05">
-       <div class="d-flex justify-content-between" id="acbf94f0-984d-45b1-9415-6906ab9ce439">
-        <h4 id="6ee4e633-8766-46c3-a464-16bdda67f68d">
+      <div class="mt-5" id="3d1779d5-7b4c-4103-9fa2-c807ed0dbf5a">
+       <div class="d-flex justify-content-between" id="8a19c681-8e47-4453-9831-58467d04741b">
+        <h4 id="bd2ac826-8983-484d-b887-fe6f81d5fc55">
          Method
-         <span class="text-primary" id="93eb3383-2f92-4661-80d4-cbb55013286e">
+         <span class="text-primary" id="332c2800-a7f6-48fa-af05-49f7ebf80f07">
           px
          </span>
         </h4>
-        <div id="acb602b6-415a-446f-a6d6-b4dbdff8a6c9">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f0af61a7-28cd-49b6-bcce-4859cfc36805" data-bs-toggle="collapse" id="6f3d256c-c637-4fa3-aca2-c4b8b4a00de0" onclick="return false;" type="button">
+        <div id="5fa1db4e-18b1-413b-9939-7d3d1fcbc5fd">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#444ee988-1bca-4848-a812-c598800becf1" data-bs-toggle="collapse" id="2650967d-b5c1-420a-9120-c8a39ad3c84f" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#522e74f2-df52-4fa1-b1eb-49fa0287f794" data-bs-toggle="collapse" id="2c13b630-d7b9-4325-820b-e59a0628da8d" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#6e50f079-9b7f-4f9d-bff8-727c6d4fe195" data-bs-toggle="collapse" id="bc194a2a-d313-4143-a811-6056ac7f4362" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="a01cb8c1-bc2f-48a8-8c36-cce9d9770078">
+       <span class="text-muted" id="e84068b6-9777-42f6-9bc1-daa039a6e643">
         Sets padding for left and right sides to the specified size.
        </span>
-       <pre id="93f80f60-4080-408f-b503-974ac6b1a40c"><code class="python">px(size)</code></pre>
-       <div class="ms-3 collapse" id="f0af61a7-28cd-49b6-bcce-4859cfc36805">
-        <h6 id="f08f8204-ea21-4e79-837d-1b80f136e137">
+       <pre id="470ea1ab-e678-4cfe-98ff-3fd06efbf0f1"><code class="python">px(size)</code></pre>
+       <div class="ms-3 collapse" id="444ee988-1bca-4848-a812-c598800becf1">
+        <h6 id="d824ea2d-dc9d-4d3b-9632-0c8af81d4604">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="2d4f9003-66f7-4593-ac78-cc2289f2c0f1">
+        <table class="table table-sm bg-light" id="9dda906d-253b-48e4-8df5-28a6e5cbbcd3">
          <thead>
           <tr>
            <th scope="col">
@@ -1775,13 +1775,13 @@ button = Button("Hello").pt(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="522e74f2-df52-4fa1-b1eb-49fa0287f794">
-        <h6 id="2b21c65a-3095-43ee-870a-ee6e092f4be9">
+       <div class="ms-3 collapse" id="6e50f079-9b7f-4f9d-bff8-727c6d4fe195">
+        <h6 id="e63ebaaa-1aac-4d5c-80e2-3b72e34ce127">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="082ac0f4-c117-4169-b9ea-0460813f1fe7">
+        <table class="table table-sm bg-light" id="7d89eed2-4fa9-45a4-9083-2102e8ab9301">
          <thead>
           <tr>
            <th scope="col">
@@ -1814,47 +1814,47 @@ button = Button("Hello").pt(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="5527cf53-2605-44ed-93d0-809c7dd9c8e4">
-        <h6 id="dbe0f611-11f2-487c-9f85-92cd07b33726">
+       <div class="ms-3" id="4e81159b-912f-49e4-ad80-d5dd4db3f6fc">
+        <h6 id="442f517c-e5c4-414d-9f16-d8ca8ed9cef7">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="0ea8a8df-0a38-483e-9a75-8f70cf47a786"><code class="python">from bootwrap import Button
+        <pre id="30a0e410-c15a-4775-a500-b2eb1f87965a"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").px(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="9452490e-97d8-43d3-8808-a17a826b3c1d">
-       <div class="d-flex justify-content-between" id="6f5b778a-7a9b-4718-866a-f1a879fec840">
-        <h4 id="27d0391a-dbd8-4fbc-aa86-3845e23437c4">
+      <div class="mt-5" id="fc403a24-613b-4c78-9ad3-c3758a11e285">
+       <div class="d-flex justify-content-between" id="146e0c36-8a8c-4fa8-9c9d-ce9cb3f93d4a">
+        <h4 id="c034ce1c-464c-4f59-8130-e417b19b3373">
          Method
-         <span class="text-primary" id="a677993c-900d-4dc5-960d-ef9925bfaa5b">
+         <span class="text-primary" id="9dbe4a63-981e-4332-a762-25d62538cf28">
           py
          </span>
         </h4>
-        <div id="ef75d8c2-a82b-4ce1-b9bc-4fb351fd07dd">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f30f6b3f-8ae8-4acd-95c2-f6e131618ec2" data-bs-toggle="collapse" id="a9af5a43-6648-4e5a-a925-0a751a407fcc" onclick="return false;" type="button">
+        <div id="10821865-19d7-4414-8317-9c3f570b77cf">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#9e0886ae-45f8-44e1-a382-6b81b8742412" data-bs-toggle="collapse" id="c257d1b8-6758-4acb-8dea-f3d5bca68f95" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#deeaf352-9fba-419c-b780-08673689bd98" data-bs-toggle="collapse" id="ac5fbf5a-fa51-4479-b9b7-230d3d0d2460" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#8027c3fb-4940-431a-8d76-b38db756a174" data-bs-toggle="collapse" id="63891b0b-d546-4741-bb66-4a65d3e00453" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="fc897439-f21c-4abb-a4f8-5d9901ef20c8">
+       <span class="text-muted" id="27e5611c-e913-4411-8deb-b45f27f910e6">
         Sets padding for top and bottom sides to the specified size.
        </span>
-       <pre id="81f0a5fa-c9af-4e79-90a6-d609948fff9f"><code class="python">py(size)</code></pre>
-       <div class="ms-3 collapse" id="f30f6b3f-8ae8-4acd-95c2-f6e131618ec2">
-        <h6 id="cff713e3-bb2d-40c8-b7ad-a3c31dbb9605">
+       <pre id="82e381be-006f-405b-89ff-5b55ad6291fe"><code class="python">py(size)</code></pre>
+       <div class="ms-3 collapse" id="9e0886ae-45f8-44e1-a382-6b81b8742412">
+        <h6 id="f92818d8-e6a6-4584-91b1-dbf8ddb1d6f5">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="89bd7892-920f-43a8-9494-26ecfbe45153">
+        <table class="table table-sm bg-light" id="28b53cad-46ce-4cc3-966e-506aedaab485">
          <thead>
           <tr>
            <th scope="col">
@@ -1887,13 +1887,13 @@ button = Button("Hello").px(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="deeaf352-9fba-419c-b780-08673689bd98">
-        <h6 id="3c8b13e8-23d5-415e-992f-9b3b8c12ef8a">
+       <div class="ms-3 collapse" id="8027c3fb-4940-431a-8d76-b38db756a174">
+        <h6 id="d29b829e-4ec4-483b-b203-dbc55b6f6b06">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="0d40ad7f-efea-4d54-96b0-f3d7b420a7ca">
+        <table class="table table-sm bg-light" id="e9d40fba-f1c4-4b7a-b323-74700066ae85">
          <thead>
           <tr>
            <th scope="col">
@@ -1926,13 +1926,13 @@ button = Button("Hello").px(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="c7957dec-6c85-40b7-88fd-f4d320a8d584">
-        <h6 id="2d667e43-719f-4b23-ab1d-e3a8d51c5b49">
+       <div class="ms-3" id="533064c3-586a-4003-9d32-da0f104f65d0">
+        <h6 id="6565e7fb-1b58-4c1d-97b8-9fb8c6ceca92">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="f87c6146-0776-4821-b8cb-5af69b0dcbc0"><code class="python">from bootwrap import Button
+        <pre id="5de66884-e2b5-40c3-9f61-c97e0cb1df71"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").py(3)
@@ -1941,50 +1941,50 @@ button = Button("Hello").py(3)
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="97412126-efe1-482f-8cf5-745732a365d9">
-     <div class="mt-5" id="bbe6f061-fc4c-4494-9fa1-f47e2c187ff0">
-      <div class="d-flex justify-content-between" id="75a7959d-5eca-4363-af73-050536a03097">
-       <h1 id="d1b4ace5-2954-4e80-ac3d-2d6dedb6d71f">
+    <div class="tab-pane fade" id="3965c300-c736-44e0-be83-f2a599a5a053">
+     <div class="mt-5" id="727cc449-4a87-452a-b827-986fa92a1001">
+      <div class="d-flex justify-content-between" id="34c7dad2-53a9-497b-970e-4afb54a96a40">
+       <h1 id="0339067d-1fb6-458f-b013-287d049f366a">
         Class
-        <span class="text-primary" id="20727785-7b9e-44a3-86a5-c9516efc93a1">
+        <span class="text-primary" id="de7f3f3b-2d57-43f7-ad88-88b1ede323c9">
          ActionMixin
         </span>
        </h1>
-       <div id="b2d2cd17-9c9c-416a-b83b-73c486b1b5c4">
+       <div id="ce5d39be-bf47-4be6-b5ce-816d29fb4b11">
        </div>
       </div>
-      <span class="text-muted" id="1b0c1a33-eeeb-4d4f-bd9b-f75d1da53a54">
+      <span class="text-muted" id="06d9cc5e-e26a-49ac-9f32-bc0ccd893758">
        Mixin for a web component which able to perform an action.
       </span>
-      <pre id="f917c26b-c157-42b7-8e98-13accae3024b"><code class="python">ActionMixin()</code></pre>
-      <div class="mt-5" id="d2121584-92e9-4841-b959-1af208b150a8">
-       <div class="d-flex justify-content-between" id="4ff3a2ca-2686-4bea-9186-0dfd6da618e6">
-        <h4 id="72212bdf-0fa4-4d8b-90a1-e282d65d8918">
+      <pre id="07ddf043-7cb3-4cbc-88e9-eedfcb506d88"><code class="python">ActionMixin()</code></pre>
+      <div class="mt-5" id="28b347c8-3681-4928-9d04-db685fc113c3">
+       <div class="d-flex justify-content-between" id="a0326d3c-abcd-40b7-bff5-b1e9cef93260">
+        <h4 id="57972ae1-71f9-41e3-949f-1e85c8795852">
          Method
-         <span class="text-primary" id="add65206-614e-446d-be95-40569dd343f8">
+         <span class="text-primary" id="a18bd933-e59c-4c2c-bcc9-18f2c5aa8dc6">
           add_menu
          </span>
         </h4>
-        <div id="d8ca6eec-2991-4db3-9e71-736fd324b6e3">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#a723f1e1-eafb-4b6e-a042-468b0dc9418c" data-bs-toggle="collapse" id="fe7bae17-1002-4f07-bf09-c09ecf9d5737" onclick="return false;" type="button">
+        <div id="30b58133-9a38-48d7-965c-9f3ecf1f2887">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#60cfb476-970a-4095-a730-a7e0d92116ce" data-bs-toggle="collapse" id="dd0a0518-295f-4af9-a6d3-1ada4551a43c" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#0685cdbf-1bd0-4b0e-a933-8c5467b6ed81" data-bs-toggle="collapse" id="3020923f-9272-4b91-a9b6-a7c3dac62378" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#cb023d69-afc5-481b-a5f7-a9f53121ca62" data-bs-toggle="collapse" id="5e119129-970f-4810-b067-e3dc1407cf61" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="6c90dff2-b083-41b2-b5bf-7ea708ac7740">
+       <span class="text-muted" id="5491f591-b4f8-44be-9775-209c5d9a0136">
         Adds dropdown menu.
        </span>
-       <pre id="4779eb2e-8b13-4634-aa21-4b5f1fe70918"><code class="python">add_menu(*menu)</code></pre>
-       <div class="ms-3 collapse" id="a723f1e1-eafb-4b6e-a042-468b0dc9418c">
-        <h6 id="0b4aa2e9-e735-46c0-ab06-ebddd2504346">
+       <pre id="cea61f82-6231-49d4-8c7d-b5f4656ea83a"><code class="python">add_menu(*menu)</code></pre>
+       <div class="ms-3 collapse" id="60cfb476-970a-4095-a730-a7e0d92116ce">
+        <h6 id="0b6464e2-d685-443f-be46-ec374b68e2c6">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="4d1a40ac-933c-4e0b-950a-fd9870a2d0e7">
+        <table class="table table-sm bg-light" id="cd029f76-7cec-4a5c-8748-09f9df50398a">
          <thead>
           <tr>
            <th scope="col">
@@ -2026,13 +2026,13 @@ button = Button("Hello").py(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="0685cdbf-1bd0-4b0e-a933-8c5467b6ed81">
-        <h6 id="1b9d9ebb-4b9a-4f95-9e32-62e74d005016">
+       <div class="ms-3 collapse" id="cb023d69-afc5-481b-a5f7-a9f53121ca62">
+        <h6 id="36daa379-d05c-4ff5-8851-e56fa666bbc9">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="b999d73c-b374-4f60-8fe7-5f6766313209">
+        <table class="table table-sm bg-light" id="d3eddb34-ca9e-4e0d-9081-2d3a39003858">
          <thead>
           <tr>
            <th scope="col">
@@ -2065,13 +2065,13 @@ button = Button("Hello").py(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="ace6011a-fe4d-488c-b6e1-1cf0c9d42cb7">
-        <h6 id="ccec7586-9d6f-48c4-980e-17ee72cddc34">
+       <div class="ms-3" id="30a05de4-3e60-4b0f-931e-044d65bfa3d3">
+        <h6 id="6bffde5a-ee7e-456f-9c50-015b082c92e1">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="bd9999a1-b294-4a4c-bfe6-46b410815af8"><code class="python">from bootwrap import Button
+        <pre id="0345e35a-046a-44c0-9122-b54e869e9782"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits ActionMixin.
 button = Button('Portfolio').add_menu(
@@ -2082,31 +2082,31 @@ button = Button('Portfolio').add_menu(
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="c33bb6fc-941a-41e7-ab6d-408bf5f72fdc">
-       <div class="d-flex justify-content-between" id="b11d7ffa-955e-49f8-8499-484962b618b2">
-        <h4 id="c9b5b55f-eb4e-44ba-96ec-54b30e5858e3">
+      <div class="mt-5" id="a154c91d-124b-4739-8486-9b4f54b429a7">
+       <div class="d-flex justify-content-between" id="59a01c1c-a059-4345-93b6-c4a66881e654">
+        <h4 id="d415765d-9ca9-49b4-b02f-cb94fce91b08">
          Method
-         <span class="text-primary" id="34157776-dabc-4736-a2a2-ff1045372a9e">
+         <span class="text-primary" id="570456aa-a722-4d59-9d3c-a7043dc93512">
           dismiss
          </span>
         </h4>
-        <div id="c1cd3b4f-ea87-4553-8043-44d18f94feaf">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#a289b1cd-f8d8-4d8b-a259-7b70d5f7dc96" data-bs-toggle="collapse" id="d72898a2-f675-4cb9-a80b-314b7e97a4b8" onclick="return false;" type="button">
+        <div id="62e8de9d-5529-46c0-89c9-a4d00b72f133">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#991261ee-70af-4e82-baf0-66825deea406" data-bs-toggle="collapse" id="2e6c7d9d-681d-4225-87d8-e49c61d75350" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="0d437f3c-05c1-417e-bdf4-200e5da0400a">
+       <span class="text-muted" id="85b8cba8-5601-41b9-a85c-6bbf62be5210">
         Performes a dismiss action.
        </span>
-       <pre id="34c67545-eb94-45fa-b9c2-ab0eb3e1e23f"><code class="python">dismiss()</code></pre>
-       <div class="ms-3 collapse" id="a289b1cd-f8d8-4d8b-a259-7b70d5f7dc96">
-        <h6 id="affb5fbb-0c00-439c-b25c-c550cdedc0ba">
+       <pre id="0a4c7eb5-1d81-4a31-8fff-7678438711b2"><code class="python">dismiss()</code></pre>
+       <div class="ms-3 collapse" id="991261ee-70af-4e82-baf0-66825deea406">
+        <h6 id="218320ae-8a6f-41d3-83ff-2f62de980c1e">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="111a1e1a-9e37-4958-a8fd-11cdaad0505f">
+        <table class="table table-sm bg-light" id="5ff9f682-0671-4831-8ec8-49ab625a8a19">
          <thead>
           <tr>
            <th scope="col">
@@ -2139,13 +2139,13 @@ button = Button('Portfolio').add_menu(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="ced80cc7-449d-4bae-ae24-962ba65b6f8a">
-        <h6 id="8d94090f-fa56-44c9-bff3-86b2124fc4b8">
+       <div class="ms-3" id="25119087-0d97-42cb-ad2c-c98a40407958">
+        <h6 id="033070d4-6492-4cfe-b695-04180be27dd4">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="7bc8d9d1-8d68-4ec2-afc6-3284b1cdccf8"><code class="python">from bootwrap import Dialog, Button
+        <pre id="eaab4574-9049-4f85-8594-12ba2ba92e5a"><code class="python">from bootwrap import Dialog, Button
 
 # Note, that Button inherits ActionMixin.
 dialog = Dialog(
@@ -2155,34 +2155,34 @@ dialog = Dialog(
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="7d71c026-36eb-46ec-ad2d-3c68c3504d2a">
-       <div class="d-flex justify-content-between" id="c728dfb5-a6be-444b-aa2d-c46665160667">
-        <h4 id="0348dd2d-de86-4d74-bd18-b7a351a886b9">
+      <div class="mt-5" id="1d0bf742-fc43-4382-98f7-244de30effcc">
+       <div class="d-flex justify-content-between" id="198c04da-4e16-470a-906d-1afb985cb5dd">
+        <h4 id="a18862d9-3b79-4c14-bc80-c615f59872b8">
          Method
-         <span class="text-primary" id="74185fea-8155-47c1-8b8e-a613847a15f4">
+         <span class="text-primary" id="c30847b6-906e-4d53-b39a-a3c102345bfd">
           link
          </span>
         </h4>
-        <div id="d1b5301e-5d1d-4a25-a95e-617330a79f15">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#7859e8d9-a148-4c60-ad6d-0a33cc079322" data-bs-toggle="collapse" id="a5cd4151-d64d-4805-9a87-f758147fbe4a" onclick="return false;" type="button">
+        <div id="6adb9e49-ee83-43d7-b580-181c4bee9be8">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f9ef1d9b-c57f-49c4-9868-275a95d61a2f" data-bs-toggle="collapse" id="085f53e2-f84a-416d-b498-f85e15ae06c1" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#6d37cd24-528f-4da1-b723-be1dfb525828" data-bs-toggle="collapse" id="5e56911c-e2ba-43ce-878a-5ac316c4f424" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#adf79258-e912-41ec-9e5f-09ef89f5b882" data-bs-toggle="collapse" id="32e91496-7ae8-465e-99de-ea7878820a32" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="2c545a1a-50b4-406c-a2e5-fa71ca3f937d">
+       <span class="text-muted" id="eeff67e6-c9a1-46e8-bcab-b7ab757f3b06">
         Links to the web-resource.
        </span>
-       <pre id="96a8ca9b-9b29-4bfe-9e9b-819c377e20b7"><code class="python">link(target)</code></pre>
-       <div class="ms-3 collapse" id="7859e8d9-a148-4c60-ad6d-0a33cc079322">
-        <h6 id="94d07073-22b3-4b49-a05a-ebc5d4d88ece">
+       <pre id="22956257-629c-443e-b36b-bd838b694a06"><code class="python">link(target)</code></pre>
+       <div class="ms-3 collapse" id="f9ef1d9b-c57f-49c4-9868-275a95d61a2f">
+        <h6 id="92cb767f-d529-4be6-ade4-293ea3e80468">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="4a9655ba-51d5-47aa-bab5-ef7090ed80fa">
+        <table class="table table-sm bg-light" id="5b1b96f9-4787-4108-b1c5-8f05cf478006">
          <thead>
           <tr>
            <th scope="col">
@@ -2220,13 +2220,13 @@ dialog = Dialog(
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="6d37cd24-528f-4da1-b723-be1dfb525828">
-        <h6 id="e3df26fa-90dd-4f12-96e5-b5bc5446af6d">
+       <div class="ms-3 collapse" id="adf79258-e912-41ec-9e5f-09ef89f5b882">
+        <h6 id="b4db19e3-a982-4bc7-8449-5f8aa55a92f0">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="db97cd1c-dc2e-4da6-9440-02173e0ccce5">
+        <table class="table table-sm bg-light" id="7a57a3dd-f1c8-47ae-af08-87eab6da0444">
          <thead>
           <tr>
            <th scope="col">
@@ -2259,44 +2259,44 @@ dialog = Dialog(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="e750251f-72e3-41f1-bc18-8c4fc363f65a">
-        <h6 id="11955ca8-2157-49e3-bcea-38329cd2bbe7">
+       <div class="ms-3" id="ac7fea5a-5244-49ca-8207-3569df4e3d70">
+        <h6 id="e7eb3567-fe0c-44a1-8c96-85c0f11f3240">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="5e453525-7f52-43cd-b2a3-ea059d4a39cb"><code class="python">from bootwrap import Button
+        <pre id="4a986a94-f3a7-4eca-892e-14bd55497ff3"><code class="python">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="f13ab746-0ab9-4d3b-b4f1-3ba2e96413a9">
-       <div class="d-flex justify-content-between" id="a50239d5-38d9-42da-b82b-42abcd0d44f1">
-        <h4 id="65cb1a61-4fcb-4503-8d80-2aaf8782b55e">
+      <div class="mt-5" id="a76e116e-7bd3-45e5-abfa-2725da6be622">
+       <div class="d-flex justify-content-between" id="28372a7d-7ee3-453d-8397-a18640492024">
+        <h4 id="51c20195-2588-44a8-a131-499b2705abd2">
          Method
-         <span class="text-primary" id="d4318158-7597-4883-b6e9-b8aec3f5f4bc">
+         <span class="text-primary" id="e8b8ab17-c5cd-4dc6-8fd5-58348a82a286">
           submit
          </span>
         </h4>
-        <div id="757d0fa0-c6a9-427f-bb91-4bf3f3490dab">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#bd0ef67b-5266-47a4-ae57-4578a91c58e6" data-bs-toggle="collapse" id="6f8fca4b-2ad0-4bf4-aa2a-c2d1c53dd8c6" onclick="return false;" type="button">
+        <div id="3284d8e5-2dc5-4fe8-b508-8eda51505c8e">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#c198c542-fabe-459a-9048-5887b3264e29" data-bs-toggle="collapse" id="9d94bf00-8c02-40eb-9032-682f65b13b86" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="ad0933f7-5a6c-4b06-a3ed-55348626abf5">
+       <span class="text-muted" id="090a3161-9e58-4762-85a6-e451b92fca64">
         Performes a submit action.
        </span>
-       <pre id="5bfc745a-860b-4cb2-ae9c-144c69616eab"><code class="python">submit()</code></pre>
-       <div class="ms-3 collapse" id="bd0ef67b-5266-47a4-ae57-4578a91c58e6">
-        <h6 id="89f4c7c6-7fd5-46c3-b3b5-cf511917ce0a">
+       <pre id="c4725404-ce7e-4955-97d7-31e7c6c5583b"><code class="python">submit()</code></pre>
+       <div class="ms-3 collapse" id="c198c542-fabe-459a-9048-5887b3264e29">
+        <h6 id="aeee26dc-6a13-4e0d-8ee0-49c5fb1a78ca">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="ea57e87d-2fce-45b5-b607-bbac2a726ef1">
+        <table class="table table-sm bg-light" id="9dbdfc34-315a-4a08-a8ea-9df3efea96ff">
          <thead>
           <tr>
            <th scope="col">
@@ -2329,13 +2329,13 @@ button = Button("Search").link("https://www.google.com")
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="b4367cd5-9160-423e-bd0a-45cafb703229">
-        <h6 id="c5dfc44d-713d-4f2f-bebd-13191e334b26">
+       <div class="ms-3" id="4eef9e28-9185-4e42-8be2-8e8f08c20fc8">
+        <h6 id="2f762cb4-f6c1-403e-adc0-b6526ad8eff9">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="623b859a-728f-4ddf-a184-616e1dfbbbdc"><code class="python">from bootwrap import Form, Button
+        <pre id="f100bd78-e3c2-422c-a6e7-5544b73be4f4"><code class="python">from bootwrap import Form, Button
 
 # Note, that Button inherits ActionMixin.
 form = Form(
@@ -2345,34 +2345,34 @@ form = Form(
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="d593389c-e95c-4c5e-abb2-caaf891a6455">
-       <div class="d-flex justify-content-between" id="0efec623-7c8d-4863-9d4c-d867411b07a7">
-        <h4 id="46279a32-bfc5-46a2-b535-4b07557df469">
+      <div class="mt-5" id="ccea5293-ab91-4cd6-8bab-ed24a081f677">
+       <div class="d-flex justify-content-between" id="2b8306b6-feba-467c-806f-bda24a44aece">
+        <h4 id="6266e277-3311-4135-a271-bcd16bf645e5">
          Method
-         <span class="text-primary" id="42b3a89b-09e8-4d41-86a0-3e810541d643">
+         <span class="text-primary" id="708b0d13-97b4-49c1-aa08-4d4bdda6044b">
           toggle
          </span>
         </h4>
-        <div id="7993e724-257b-45a3-91d6-e395dc589ffb">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#91466ef9-7857-49f4-bbc1-636f0a9bd546" data-bs-toggle="collapse" id="24bff637-5dd4-43b1-abb6-526714107c0b" onclick="return false;" type="button">
+        <div id="6de02981-9a2c-4fd1-b413-fc1304916a2e">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#b530cecd-38f5-49f9-afee-478cfbbed93e" data-bs-toggle="collapse" id="b782c4c4-3f96-4002-adfb-3fd474339aa9" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#bef85636-6f95-40e3-8e38-9dbe4b336cb0" data-bs-toggle="collapse" id="e306da4e-65b8-4a69-b95c-f99c2ea17ba4" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#faaac594-c466-4880-b9b0-ef8576d6f1d7" data-bs-toggle="collapse" id="7fecc459-e2ac-4f05-9790-1132a90254df" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="c2c6a250-0056-4a9f-86c5-bb5ad1e7a27b">
+       <span class="text-muted" id="514af6bc-38a4-4345-a5ed-39b8765bfc78">
         Toggles an other web component.
        </span>
-       <pre id="04b92162-cdc0-4b08-ae9c-d0a8f1f84f94"><code class="python">toggle(target)</code></pre>
-       <div class="ms-3 collapse" id="91466ef9-7857-49f4-bbc1-636f0a9bd546">
-        <h6 id="83819bae-aa28-4343-98a3-c47f32acafc9">
+       <pre id="96e9b407-0d56-45d9-a5a4-053b4b9f41bd"><code class="python">toggle(target)</code></pre>
+       <div class="ms-3 collapse" id="b530cecd-38f5-49f9-afee-478cfbbed93e">
+        <h6 id="6ef23e8c-99b4-495e-80ab-ea33325ccfa2">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="b201d431-31e0-4adc-bc7e-f3ea696daae4">
+        <table class="table table-sm bg-light" id="bfb06d08-7306-4c54-b90f-6fd98613af19">
          <thead>
           <tr>
            <th scope="col">
@@ -2405,13 +2405,13 @@ form = Form(
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="bef85636-6f95-40e3-8e38-9dbe4b336cb0">
-        <h6 id="5bba0e06-e9e6-43cd-8272-2808be94ec85">
+       <div class="ms-3 collapse" id="faaac594-c466-4880-b9b0-ef8576d6f1d7">
+        <h6 id="0af79f85-67df-496a-b02a-f26b22539ef9">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="e048ba79-add8-43df-a09a-208de6b89db2">
+        <table class="table table-sm bg-light" id="334ea8e5-a15d-40ee-939a-291fd38044a8">
          <thead>
           <tr>
            <th scope="col">
@@ -2444,13 +2444,13 @@ form = Form(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="50b5707b-5a41-4c01-986a-60b55b43ff9b">
-        <h6 id="fe398016-d75b-46f7-a1f2-729c211f4ac7">
+       <div class="ms-3" id="394c8af2-8657-43c2-87f2-934b73497ee9">
+        <h6 id="b9d08336-d614-455d-a772-1f3f257141c9">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="8b96d522-f299-42c8-be33-c3186f3f6ca4"><code class="python">from bootwrap import Button, Dialog
+        <pre id="e1a3d7a7-375f-485d-be5a-58f689d05020"><code class="python">from bootwrap import Button, Dialog
 
 # Note, that Button inherits ActionMixin.
 dialog = Dialog(...)
@@ -2460,48 +2460,48 @@ button = Button("Open").toggle(dialog)
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="3b45aaeb-bf64-485d-bed2-d8ac513966e2">
-     <div class="mt-5" id="8c06e9c0-6c72-43c9-8dd4-c48cc12d0a22">
-      <div class="d-flex justify-content-between" id="eafc28e2-84a3-4fc8-84d0-92f33aa1db59">
-       <h1 id="72979a93-90c6-48d9-bf70-ce64c13ef4e3">
+    <div class="tab-pane fade" id="8b1eeddd-ab32-43c1-b1fd-b4fd96cb3d99">
+     <div class="mt-5" id="dfac13b5-ecd8-4c49-886e-1c1b2feac649">
+      <div class="d-flex justify-content-between" id="6195d598-d3b3-471c-9b70-65e7bccb16e1">
+       <h1 id="2c73bcf9-6963-4163-830d-da5a6c77dacd">
         Class
-        <span class="text-primary" id="f9686a24-2ad2-4641-8f3d-908d907a3803">
+        <span class="text-primary" id="f731ab1a-4d81-4603-bc9e-070463a05c24">
          AppearanceMixin
         </span>
        </h1>
-       <div id="9e283f8e-8703-4e98-bf07-943b016e2f28">
+       <div id="c902a6d9-9364-4427-bc47-a71636b40e31">
        </div>
       </div>
-      <span class="text-muted" id="67c6742c-871e-4c6a-90c4-2743adbab80e">
+      <span class="text-muted" id="a7b57833-cda2-4b8d-8e4a-eeb16e683322">
        Mixin for a web component which appearance can be associated
     with predefined categories.
       </span>
-      <pre id="589dbc5d-f8ab-41df-b95a-326dc75f8716"><code class="python">AppearanceMixin()</code></pre>
-      <div class="mt-5" id="dcb9f6de-e2af-49b0-8f88-51cb8c0a11b8">
-       <div class="d-flex justify-content-between" id="4a0a1d84-8c44-47c7-82f2-460d1a139546">
-        <h4 id="80adb42b-d795-4f56-9be6-5bd44c868484">
+      <pre id="0f8baf70-d6a1-4680-8d88-9594d6a6b944"><code class="python">AppearanceMixin()</code></pre>
+      <div class="mt-5" id="2f028fcb-cae5-4f89-907b-d898be829ad6">
+       <div class="d-flex justify-content-between" id="b7201be9-82d5-48b6-a37a-0f45bc2f0211">
+        <h4 id="0dd50429-71e7-484d-b762-3b8299f8bd3d">
          Method
-         <span class="text-primary" id="a05ba258-76a8-4350-aa1f-6133029b8c66">
+         <span class="text-primary" id="9d9a028e-5765-4c6e-a8cc-971f51773764">
           as_danger
          </span>
         </h4>
-        <div id="524fb973-a18b-47f9-ae2f-a845d451338b">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#2880d572-9100-4a49-b7ee-22504a826cb8" data-bs-toggle="collapse" id="1318a126-9aa9-4963-86a7-13a37ee9fdaa" onclick="return false;" type="button">
+        <div id="fdb440e0-0dbb-4af9-8651-cb3ecfaf1c3b">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#8aeb341c-ba01-4251-a247-a143dca0363d" data-bs-toggle="collapse" id="44b723a0-5220-475a-868d-1b0f3011dc4b" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="c38c1bae-2ecc-4553-99d9-b1666432e9fc">
+       <span class="text-muted" id="db609cdf-cac4-4516-aef5-bd22b60e4a85">
         Makes the 'danger' look to a web components.
        </span>
-       <pre id="fc97f638-cbb3-4ce2-aed3-a54a2c2fb039"><code class="python">as_danger()</code></pre>
-       <div class="ms-3 collapse" id="2880d572-9100-4a49-b7ee-22504a826cb8">
-        <h6 id="aebe508d-e743-4717-8673-80deee133259">
+       <pre id="0caa00d8-e95b-421a-a8b6-80e63b8e76dc"><code class="python">as_danger()</code></pre>
+       <div class="ms-3 collapse" id="8aeb341c-ba01-4251-a247-a143dca0363d">
+        <h6 id="43018f70-2835-413b-a5e7-16074706d3fb">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="2ba23a65-39a4-45f3-a835-474b6d47e137">
+        <table class="table table-sm bg-light" id="3953b5be-5376-423a-9396-4c97d6726ff4">
          <thead>
           <tr>
            <th scope="col">
@@ -2534,44 +2534,44 @@ button = Button("Open").toggle(dialog)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="7633637c-7a77-4818-92f7-a25d52af9df3">
-        <h6 id="055bbbe8-b43b-4d0f-b25e-343e12b8b9d5">
+       <div class="ms-3" id="c52ee67d-c967-4e1b-94b7-ab5883b56d14">
+        <h6 id="20d87874-1cdd-455b-a926-1bce23f4224a">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="8ac70411-dd4c-47da-94d9-2c0069ea10b5"><code class="python">from bootwrap import Button
+        <pre id="f8234529-d7f8-4b9f-be3e-79cdc43f41c7"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Danger").as_danger()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="d8bf2ab7-9924-415f-ac96-7c4778d3fe2d">
-       <div class="d-flex justify-content-between" id="7d241be3-1e46-4a2e-8d93-56d93b1309c9">
-        <h4 id="1a56036d-a974-4786-ac0b-965d03e711cf">
+      <div class="mt-5" id="db1f7890-3a12-4f69-9ac3-abbe620241ab">
+       <div class="d-flex justify-content-between" id="ffbedcef-a425-4854-b358-a7b71e6267c3">
+        <h4 id="257c5f60-2e29-4902-8b91-529dc936c1b2">
          Method
-         <span class="text-primary" id="24a263dd-2347-42cc-baa2-c04eeb49333f">
+         <span class="text-primary" id="9ad284b3-776d-47a4-a481-ac9df692cedd">
           as_dark
          </span>
         </h4>
-        <div id="d798cab0-c860-44d0-bc41-0d227a4c50f9">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#8a89b852-495f-470f-b3ab-02c623441279" data-bs-toggle="collapse" id="d2203a1c-7cf8-4b7f-83ca-c935bb06dcd9" onclick="return false;" type="button">
+        <div id="3d97c023-e3ee-4855-abad-b0010df7a20b">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#12f19a00-f36e-4321-81fd-b532570ee61b" data-bs-toggle="collapse" id="7327444b-5eea-4790-a998-e8532c5f525c" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="86f4eeb1-59ce-471f-9ef5-12ffe86e2b8c">
+       <span class="text-muted" id="0027b604-2a66-4b64-85a3-38ca7c6e455c">
         Makes the 'dark' look to a web components.
        </span>
-       <pre id="80df37ee-b56f-4bb8-b3e2-ab1c54ca898a"><code class="python">as_dark()</code></pre>
-       <div class="ms-3 collapse" id="8a89b852-495f-470f-b3ab-02c623441279">
-        <h6 id="4f0d00a3-1f62-4a66-804c-c4538c5c8114">
+       <pre id="00fb299d-cac6-458e-a620-ed00ce7a0195"><code class="python">as_dark()</code></pre>
+       <div class="ms-3 collapse" id="12f19a00-f36e-4321-81fd-b532570ee61b">
+        <h6 id="86039c77-148c-4b02-a9ff-c08580dc6bad">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="fd97940b-1acc-48c8-9f9a-cf691dd7ed05">
+        <table class="table table-sm bg-light" id="f23c6481-632c-431c-9707-ec025edc26eb">
          <thead>
           <tr>
            <th scope="col">
@@ -2604,44 +2604,44 @@ button = ("Danger").as_danger()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="bea80859-667e-4356-a8d0-8d87a806f133">
-        <h6 id="be4f1e84-d3c4-4f0f-9f7a-f2bbbaf6c5e7">
+       <div class="ms-3" id="1558c764-fce9-4203-bef7-576b2eed0b55">
+        <h6 id="93da43ff-0433-4339-89aa-b9e1f10f4daf">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="19445ca5-bee7-4f33-ab6a-18b378ef4244"><code class="python">from bootwrap import Button
+        <pre id="b99915b9-7f98-4650-bf48-092eca88aba1"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Dark").as_dark()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="fac9ca5c-4684-49b0-9ebc-0d2d506a6cba">
-       <div class="d-flex justify-content-between" id="1842d573-1ca5-4c0f-8431-5370afc3192c">
-        <h4 id="3dfffbdc-36f0-4f15-bafa-bb1fb6293066">
+      <div class="mt-5" id="fbac4d87-2a35-43b0-844c-5ec79f7f387e">
+       <div class="d-flex justify-content-between" id="270d17ff-d4df-4294-9cb3-3e32d29bc1fb">
+        <h4 id="e0c3c561-4fb3-4651-bab5-1f39e10d5ea9">
          Method
-         <span class="text-primary" id="63a01da4-64a8-4dc2-bc8b-9866dc9bbceb">
+         <span class="text-primary" id="07460c7a-c372-47c8-ac43-0ee9a63c0ead">
           as_info
          </span>
         </h4>
-        <div id="d5b9dfd2-6c52-4bc4-8fda-78a06594c101">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#65532666-06d2-4539-a8ad-70c67e6d4c13" data-bs-toggle="collapse" id="7322fe7d-e651-4a11-95f2-4c6cbd1d4cfc" onclick="return false;" type="button">
+        <div id="7a92dc60-5b51-40a1-893d-4dd9285b5ac1">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#36762a2f-2182-416b-a3ac-5964fd9bb202" data-bs-toggle="collapse" id="09dbeb21-c701-4f9a-a572-f30fd8a21596" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="77b18983-9c6b-479b-b441-1079b7f288fb">
+       <span class="text-muted" id="76f13c9f-f7e1-44f6-9da8-35afeff9c0f4">
         Makes the 'info' look to a web components.
        </span>
-       <pre id="dd1b0c79-d3cc-47a5-b492-165dd0a592ca"><code class="python">as_info()</code></pre>
-       <div class="ms-3 collapse" id="65532666-06d2-4539-a8ad-70c67e6d4c13">
-        <h6 id="011c6a13-fc96-4492-8a6a-157964d73fc6">
+       <pre id="372ca636-99d3-4194-94fc-30c1f7d7c07d"><code class="python">as_info()</code></pre>
+       <div class="ms-3 collapse" id="36762a2f-2182-416b-a3ac-5964fd9bb202">
+        <h6 id="c7a97cf2-adb7-4ed0-a89a-4513bef73c10">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="1fb74d22-7b0f-460d-b154-1aa2cc853958">
+        <table class="table table-sm bg-light" id="336e78e6-7003-454e-a839-60e6eabf5f7f">
          <thead>
           <tr>
            <th scope="col">
@@ -2674,44 +2674,44 @@ button = ("Dark").as_dark()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="752d14d9-ae2e-42b6-9abe-4da21abba55c">
-        <h6 id="7b2d4a3c-6e02-479e-a95f-fa2bffbe672a">
+       <div class="ms-3" id="0320eb9a-6f7d-4e6b-a14a-67c9d4f2a4f7">
+        <h6 id="83a885da-8b6d-49d7-b830-bf858a9e99f7">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="ea564a6b-0232-4890-b765-8fea7648bbd9"><code class="python">from bootwrap import Button
+        <pre id="ccb0a953-1fad-488b-b71f-312acd131640"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Info").as_info()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="4669b3b2-dc6d-4a70-a956-5199ab137066">
-       <div class="d-flex justify-content-between" id="9cb9c3bb-ff23-4bd6-b18f-26b1ed089b6e">
-        <h4 id="2dfb40d0-13d4-421e-9c7b-1a599bf60b4a">
+      <div class="mt-5" id="90e56131-be8c-440f-b2b2-f4eb7f16d8dc">
+       <div class="d-flex justify-content-between" id="40552724-adca-4944-8c3f-f0ea1d810e50">
+        <h4 id="08b3d316-d610-40d7-8732-8f9b440c2f6f">
          Method
-         <span class="text-primary" id="ad17b5de-5adb-44da-a5be-e7e7847c1b9e">
+         <span class="text-primary" id="7451bdb8-ecc2-471d-9b38-049e895c37e0">
           as_light
          </span>
         </h4>
-        <div id="fb471f4f-df05-4b78-946d-0e10bab9fe9b">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#8ab519de-d097-4519-97a7-911113962bde" data-bs-toggle="collapse" id="12792e49-3f03-4e2f-ba74-915d0f7b854d" onclick="return false;" type="button">
+        <div id="54919ed2-17f4-45a1-bddf-8387f69df988">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#2a72230e-cb4e-4722-9e06-fcb21cdd87f9" data-bs-toggle="collapse" id="ca20869c-877e-4a43-bb8d-2e07bc604932" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="ea9d4671-9b91-4d00-bc67-6ca7581e1908">
+       <span class="text-muted" id="ebcc7574-f55f-4e1e-b864-77e5b67a9199">
         Makes the 'light' look to a web components.
        </span>
-       <pre id="e0acc120-2cf3-4125-8fc9-12bd758e1af4"><code class="python">as_light()</code></pre>
-       <div class="ms-3 collapse" id="8ab519de-d097-4519-97a7-911113962bde">
-        <h6 id="6a327ff8-cee4-43b6-9235-79a187fb920d">
+       <pre id="167e79c8-e4f7-454c-8529-de8011154a06"><code class="python">as_light()</code></pre>
+       <div class="ms-3 collapse" id="2a72230e-cb4e-4722-9e06-fcb21cdd87f9">
+        <h6 id="53121ea9-c4c2-4672-97eb-87b8b1745ddd">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="460e8e57-9817-42c4-bfd7-ce98648ec1fe">
+        <table class="table table-sm bg-light" id="fccfcb07-7ab1-4fef-9ebb-562742f1a4c4">
          <thead>
           <tr>
            <th scope="col">
@@ -2744,44 +2744,44 @@ button = ("Info").as_info()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="809aa701-c9a6-42b9-9001-569e99a9aeb9">
-        <h6 id="aed52daf-4774-4c88-9dd0-9138b27fac2b">
+       <div class="ms-3" id="49ed27bc-e21f-4c94-b3f8-790438b0d643">
+        <h6 id="f6f6af77-b6b8-463f-aa28-47fec879172d">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="485d5909-82ae-4673-8e3b-1f516a283b1d"><code class="python">from bootwrap import Button
+        <pre id="16a800b3-4ddd-4e47-9db1-c41a4f90e68b"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Light").as_light()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="1003ee05-a9d4-4f17-8fd0-e1b31fa472e4">
-       <div class="d-flex justify-content-between" id="b4df7868-5a36-4981-a881-3b6d4d368c22">
-        <h4 id="39edf6f7-59ef-498c-a434-da732539dbc5">
+      <div class="mt-5" id="cb570d43-6b02-46d8-9f21-138477850524">
+       <div class="d-flex justify-content-between" id="b80a0751-7c3a-42ff-b5b2-1b93efde0b95">
+        <h4 id="fe05d00e-9fb1-4732-a424-13eff91acd9c">
          Method
-         <span class="text-primary" id="7484464f-255b-427d-a917-0c11c867a4ea">
+         <span class="text-primary" id="fe9f9cb1-9ffa-423d-b0cc-454afb3bc3ef">
           as_primary
          </span>
         </h4>
-        <div id="0a879e1c-8b88-46e0-8281-6078ad0a9d9a">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#95a15d7c-8696-4089-a59e-1c75a7f8ab10" data-bs-toggle="collapse" id="73d61073-05ef-4225-8494-25984a42c183" onclick="return false;" type="button">
+        <div id="377fa6da-1406-4146-9a5e-e92546c94520">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#ef1a30d6-ae15-4d93-852b-b1ddb8a77db9" data-bs-toggle="collapse" id="a687fa64-c046-4b2b-b250-bf859da7456b" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="c121965e-3f77-4545-94dd-af5bf5db2a2b">
+       <span class="text-muted" id="fd7e0824-3fe3-420c-a025-5dd4ff54b32d">
         Makes the 'primary' look to a web components.
        </span>
-       <pre id="25feaa0b-f4e5-444a-8e2f-d841d0c7b283"><code class="python">as_primary()</code></pre>
-       <div class="ms-3 collapse" id="95a15d7c-8696-4089-a59e-1c75a7f8ab10">
-        <h6 id="0be71acd-be44-40c3-b3d2-0c3b39544273">
+       <pre id="6cec9b39-e44e-40f8-895f-821994934452"><code class="python">as_primary()</code></pre>
+       <div class="ms-3 collapse" id="ef1a30d6-ae15-4d93-852b-b1ddb8a77db9">
+        <h6 id="2c5bd8b7-3c7d-4462-a433-3449a36f6834">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="47043a06-832b-46ee-b0a6-99a45e5c2eeb">
+        <table class="table table-sm bg-light" id="01ace7d9-10ec-423c-baf3-ef39d2f13b55">
          <thead>
           <tr>
            <th scope="col">
@@ -2814,44 +2814,44 @@ button = ("Light").as_light()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="37d7e3ed-f5ee-4abf-ab09-6df8c6ef0cd9">
-        <h6 id="6d88c795-f864-4bd2-aeda-5100d4325458">
+       <div class="ms-3" id="141a3356-2550-438d-b5cb-30ddc2a7e14a">
+        <h6 id="990e3b7b-b305-4abf-a111-acbee662b47b">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="475a3cd9-194a-4acd-b0d9-8d8916d6264c"><code class="python">from bootwrap import Button
+        <pre id="7555935e-9912-4893-8b50-2b5afbe34a44"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Primary").as_primary()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="9234cdf0-57e4-435d-a888-c26c2cc16a3d">
-       <div class="d-flex justify-content-between" id="d0864ee3-6563-4241-a79d-2138c666d0e0">
-        <h4 id="756f1e9a-9c70-4ddf-a3ff-0dfdc08a3814">
+      <div class="mt-5" id="80a6341f-2817-4b52-abbe-b99d47ddde3c">
+       <div class="d-flex justify-content-between" id="76da0d1c-e799-4df1-8f5c-242e5089b1a5">
+        <h4 id="e66cfe9e-b642-4b16-b543-41c4fbb85e50">
          Method
-         <span class="text-primary" id="d5190d70-67db-4119-9526-45416ea65568">
+         <span class="text-primary" id="9f467e08-1092-4309-afcd-05e7b49ab768">
           as_secondary
          </span>
         </h4>
-        <div id="ba3dc08c-d03b-42ef-abe4-4d96f6e307b2">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#e41e745c-05a5-4908-9e0c-99a95a9209e0" data-bs-toggle="collapse" id="24bf3c8f-3693-45ec-9fd1-236baf1f92bf" onclick="return false;" type="button">
+        <div id="17a4d7f2-8e5c-4758-a8da-a88fd7318cd0">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#3ee2596f-c056-41b3-9931-18b4ca2063fe" data-bs-toggle="collapse" id="d0ad8bd8-2ae2-402f-adde-568b91e841f5" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="3fdc6ee3-93f9-4783-95ef-ea24aab8850b">
+       <span class="text-muted" id="7b49dbc0-6caf-4e74-b5f5-7f984a8a4899">
         Makes the 'secondary' look to a web components.
        </span>
-       <pre id="8fd5f22e-930e-4117-8dea-8c0b6c7eb22c"><code class="python">as_secondary()</code></pre>
-       <div class="ms-3 collapse" id="e41e745c-05a5-4908-9e0c-99a95a9209e0">
-        <h6 id="301ab7cb-08a2-4d00-a0f5-5d7fc2c9f632">
+       <pre id="2b29c96f-23fa-40a5-a2bf-2fcd0c17e76f"><code class="python">as_secondary()</code></pre>
+       <div class="ms-3 collapse" id="3ee2596f-c056-41b3-9931-18b4ca2063fe">
+        <h6 id="07b4b3c2-1492-4360-8ae8-6bdd276052ec">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="cd93e97b-a33d-4c93-becb-1edfaf6ffca3">
+        <table class="table table-sm bg-light" id="23bf68cf-5b51-4edc-a1af-4edab4c52a91">
          <thead>
           <tr>
            <th scope="col">
@@ -2884,44 +2884,44 @@ button = ("Primary").as_primary()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="5391948d-5e3e-4745-b31f-edd4ef6315fe">
-        <h6 id="11ff7704-6320-4106-bb0c-82fe1bb73132">
+       <div class="ms-3" id="3f8bf772-235d-4075-ae1b-8808d90eb92d">
+        <h6 id="bb9e54a7-d0b7-481f-8024-1ef400eecc05">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="065a31d0-0342-442e-adcc-9c5ffdca1d37"><code class="python">from bootwrap import Button
+        <pre id="ccdc1e20-5821-4c06-9945-07031091aca4"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Secondary").as_secondary()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="58f02fff-8eed-4957-9c77-8103715615eb">
-       <div class="d-flex justify-content-between" id="1293a276-6e28-44db-87b4-1b8b817d8cdd">
-        <h4 id="5d5e2635-9541-4854-a534-fef166a7f500">
+      <div class="mt-5" id="66cc1840-314d-41a4-b976-398cf3dd1c2e">
+       <div class="d-flex justify-content-between" id="0438d8fd-18bd-4ad3-8728-797ad915a82a">
+        <h4 id="9789aee4-8509-4ba2-995e-fea9763fb012">
          Method
-         <span class="text-primary" id="08e26352-11c0-40b6-9292-c19912023129">
+         <span class="text-primary" id="638b2901-d3d2-4425-96e4-37e85de7c90c">
           as_success
          </span>
         </h4>
-        <div id="a9d25571-de60-4952-90c1-eea73b870fbe">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#daab36bb-e4c8-46a5-9a37-e4fe26fb473a" data-bs-toggle="collapse" id="764d6732-c546-4f67-9c31-528c9debfc69" onclick="return false;" type="button">
+        <div id="63d22c45-7faf-4161-91a1-9d261af9034e">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#1a962153-aa0f-4e79-b6c8-6de08082634b" data-bs-toggle="collapse" id="d7766c89-585c-4835-b105-1d9f5a96f106" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="07733878-295d-46cd-a53a-fff4eb6f58dc">
+       <span class="text-muted" id="cb9a12f9-b67c-4018-9198-2700b939051f">
         Makes the 'success' look to a web components.
        </span>
-       <pre id="7a8d734f-21c3-4a2e-a7c7-116aabb772b4"><code class="python">as_success()</code></pre>
-       <div class="ms-3 collapse" id="daab36bb-e4c8-46a5-9a37-e4fe26fb473a">
-        <h6 id="7a7214e2-4bdf-4471-ac28-c74682df446d">
+       <pre id="46b82f0f-1c65-4d23-9f52-9c645c3bf6d7"><code class="python">as_success()</code></pre>
+       <div class="ms-3 collapse" id="1a962153-aa0f-4e79-b6c8-6de08082634b">
+        <h6 id="561898dd-9f0c-482e-acdd-5db3949d9574">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="8baab82b-c184-4929-bfd4-7cf9933bfcca">
+        <table class="table table-sm bg-light" id="afb9adbf-1a56-4bf2-ba0f-822b4ece7359">
          <thead>
           <tr>
            <th scope="col">
@@ -2954,44 +2954,44 @@ button = ("Secondary").as_secondary()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="ac439855-b467-4d92-a842-87ed28e1f4ae">
-        <h6 id="fa20a7ed-1112-49ca-bf5e-f7902c8766fc">
+       <div class="ms-3" id="26899926-54d5-4187-af5f-981e6a4233af">
+        <h6 id="91620756-18f7-48c6-8e1b-e5b407baef0f">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="dcdcd485-0278-4427-b659-31361801ce27"><code class="python">from bootwrap import Button
+        <pre id="c8849abf-35c7-4510-b3d9-b2bf88a84b6c"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Success").as_success()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="da771566-45c2-4877-859a-4496c5958e7e">
-       <div class="d-flex justify-content-between" id="b4ca6169-aef1-498a-b71f-57d67303afa7">
-        <h4 id="e85aa843-16ab-4188-b521-13336fd14e5f">
+      <div class="mt-5" id="7154b9f9-5254-428f-839b-b4802a9c733c">
+       <div class="d-flex justify-content-between" id="17c003d5-9b86-4ec2-9a03-3112067c1fcc">
+        <h4 id="0e5384f3-95f5-434a-8447-5ec796267fb9">
          Method
-         <span class="text-primary" id="07c36123-e73d-44cc-b21f-9d11fad21a52">
+         <span class="text-primary" id="acb2bf4e-aaaf-43a9-9240-b5a410e2caeb">
           as_warning
          </span>
         </h4>
-        <div id="2f3b5f7e-7b3e-4619-a687-d630418e9857">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#eefe2ac6-4878-4baa-999e-f244ee002400" data-bs-toggle="collapse" id="b807543b-537e-4aaf-9ecf-aba06e859eb4" onclick="return false;" type="button">
+        <div id="1eaa9b55-2cd8-4aa7-aa78-df11a908f3e8">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#dfe71a89-bcb7-433d-b070-15d8dc0a39dc" data-bs-toggle="collapse" id="4dca2ae6-52eb-41c5-b5a2-157b19eb3ec3" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="bbc12470-023b-4873-b50e-0d3a5f1ab642">
+       <span class="text-muted" id="277ae948-1479-422e-a383-76ef330beddb">
         Makes the 'warning' look to a web components.
        </span>
-       <pre id="fc293980-5f75-4470-98be-0bf3651b0456"><code class="python">as_warning()</code></pre>
-       <div class="ms-3 collapse" id="eefe2ac6-4878-4baa-999e-f244ee002400">
-        <h6 id="290a1313-c9da-4913-bdb2-9cf0a0d7b7f5">
+       <pre id="7da60668-6c5a-48ac-b6c5-aabeee9c6991"><code class="python">as_warning()</code></pre>
+       <div class="ms-3 collapse" id="dfe71a89-bcb7-433d-b070-15d8dc0a39dc">
+        <h6 id="9804a579-d4ac-4335-92e3-bc6e010e6164">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="93b53768-48fc-485b-a26e-8c8bf2da035d">
+        <table class="table table-sm bg-light" id="b1bcb88c-a5e7-4156-942d-036fc3035fe2">
          <thead>
           <tr>
            <th scope="col">
@@ -3024,13 +3024,13 @@ button = ("Success").as_success()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="ed8b22ea-623b-4361-85a7-08d38c2b6d2d">
-        <h6 id="22139b5b-e2d5-4c32-91f3-310631b6f8a8">
+       <div class="ms-3" id="19cbb7a5-afab-457d-be45-d95c5fdd951c">
+        <h6 id="11b941a1-a43d-4a15-802e-2f24e2e77ae8">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="db502016-827a-4789-b206-bd6d344265f1"><code class="python">from bootwrap import Button
+        <pre id="f3311bb1-29cb-4ccd-8290-af7d0579411d"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Warning").as_warning()
@@ -3039,23 +3039,23 @@ button = ("Warning").as_warning()
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="b3b387e8-208f-4588-a761-d58410f6dca1">
-     <div class="mt-5" id="0c7bcb4f-8017-4a19-82fb-d6faa57164dd">
-      <div class="d-flex justify-content-between" id="af8799b6-7752-4052-865d-84cc01f44bc7">
-       <h1 id="aa80ffe1-a4ce-4b46-8d72-aa9cf47791a5">
+    <div class="tab-pane fade" id="aa2dc850-6e0b-4e67-96f1-36a71e85093c">
+     <div class="mt-5" id="005a1327-78f8-41b1-899c-9aa3720139e1">
+      <div class="d-flex justify-content-between" id="098249c5-b477-4660-8c0d-5bbba47bacb8">
+       <h1 id="04760896-e017-457e-987c-cf8acaab4f8f">
         Class
-        <span class="text-primary" id="a2663000-2d70-4d3d-9476-71dd2675f7db">
+        <span class="text-primary" id="3d863e60-936f-4269-8038-b041fdcc1c07">
          OutlineMixin
         </span>
        </h1>
-       <div id="1a3a8752-8f5b-4b35-9eb7-5fb118ac6426">
+       <div id="61537ee9-6c0f-49a8-a6d2-1aea7ca18043">
        </div>
       </div>
-      <span class="text-muted" id="3165bfd2-ce43-44c7-b917-d4289921e19d">
+      <span class="text-muted" id="5ee4e66c-4a44-480c-9255-df9abf27ae2c">
        Mixin for a web component that can be surrounded by a border.
       </span>
-      <pre id="78db7fdf-a6aa-4af9-941f-475d28a39ab8"><code class="python">OutlineMixin()</code></pre>
-      <p id="52d455c7-8836-431e-b2fc-6148610d6360">
+      <pre id="59dc24c2-405f-41f2-9041-f50710c450a9"><code class="python">OutlineMixin()</code></pre>
+      <p id="5e2f4ba9-139c-418b-a45f-ceac39de745c">
        Usually
        <code>
         OutlineMixin
@@ -3067,31 +3067,31 @@ button = ("Warning").as_warning()
        to
     specify the border appearance.
       </p>
-      <div class="mt-5" id="8bb4a11e-a2e9-45f9-94ad-92f4849cf39e">
-       <div class="d-flex justify-content-between" id="87f05722-e055-487d-ae1f-fc2256a6abbc">
-        <h4 id="27fcba93-d55d-4789-b1e3-e69a1cd67092">
+      <div class="mt-5" id="6a7365cd-ab91-4423-b02e-3799778de4eb">
+       <div class="d-flex justify-content-between" id="b55d1238-e155-4f15-916f-4bd9014763b3">
+        <h4 id="2c63b971-0cf6-492a-b0a6-aef7e30c64f8">
          Method
-         <span class="text-primary" id="d6168b5a-aa94-4a83-9039-c031ae4dafba">
+         <span class="text-primary" id="88f67dbe-f9de-4a2d-b1d0-ac1f3ac7cc03">
           as_outline
          </span>
         </h4>
-        <div id="109ba2fd-9dbf-4010-8496-a0c7b9a6fdd9">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#e0bffe74-724c-49dc-a014-bcc885736dea" data-bs-toggle="collapse" id="fcd7d8f2-570f-44e6-a65f-43574eb04ff0" onclick="return false;" type="button">
+        <div id="0c500440-7a87-49f1-93fb-2b2c998e9ab9">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#c0ee9a49-9d09-40f5-93bd-f8af3c5ac94f" data-bs-toggle="collapse" id="c6a6fdf1-e454-4abf-aafe-94e68f99cbd0" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="48fbf169-bd30-4a3a-880c-9630f2d30721">
+       <span class="text-muted" id="1168b1e9-17ab-4fb2-b453-f737b6097a27">
         Makes the web component surrounded by a border.
        </span>
-       <pre id="0b92d775-7c94-4cd9-aac7-8a150e0dc7f5"><code class="python">as_outline()</code></pre>
-       <div class="ms-3 collapse" id="e0bffe74-724c-49dc-a014-bcc885736dea">
-        <h6 id="8135554c-52a8-4439-8c52-269f04da87bc">
+       <pre id="512de69f-fd0f-4b57-a1da-aabf81ed9c71"><code class="python">as_outline()</code></pre>
+       <div class="ms-3 collapse" id="c0ee9a49-9d09-40f5-93bd-f8af3c5ac94f">
+        <h6 id="1fd85dc5-4421-4024-b11f-5ceca91b1324">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="ad81de98-ad6c-4d04-b9f0-261a680fcd4e">
+        <table class="table table-sm bg-light" id="e06bc7b8-47ad-4854-9b2c-fbd57af44af0">
          <thead>
           <tr>
            <th scope="col">
@@ -3124,13 +3124,13 @@ button = ("Warning").as_warning()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="b6f484aa-2e39-4e7a-b36f-24e5b8c62803">
-        <h6 id="8e55eb26-bd35-43f1-b474-1fd2bd4c37f6">
+       <div class="ms-3" id="5fdf918e-c821-4bd9-a5d3-233711599a88">
+        <h6 id="c098e4cb-9e7a-43d6-945b-88fc51f39152">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="800d6053-f1a2-41c0-bee0-571845d6a722"><code class="python">from bootwrap import Button
+        <pre id="a57f1d50-6463-45b4-bde4-37a31287ba55"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Primary").as_primary().as_outline()
@@ -3139,51 +3139,51 @@ button = ("Primary").as_primary().as_outline()
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="acce1950-4cb5-4ed8-9a25-ea580b37b9fc">
-     <div class="mt-5" id="33019cac-7163-4c95-8fcc-0de50e789aac">
-      <div class="d-flex justify-content-between" id="947728f1-c2d5-4d57-8f8f-97a86f1a666e">
-       <h1 id="a80283c3-2b5c-4556-8352-ab2b6f631a20">
+    <div class="tab-pane fade" id="4fe56b45-f950-4879-9536-d39f6eea7657">
+     <div class="mt-5" id="10c3edbb-f8ec-413b-a906-135a08be9243">
+      <div class="d-flex justify-content-between" id="38ce9496-5209-4929-996b-324ebcfee5b5">
+       <h1 id="87440caa-af4b-46c9-b82d-9a541290d8f9">
         Class
-        <span class="text-primary" id="682d46a8-5d27-489f-8a2c-d1756eee31fe">
+        <span class="text-primary" id="f197f604-8469-4115-bde7-d7a7aab02109">
          AvailabilityMixin
         </span>
        </h1>
-       <div id="4edfaa5b-bc60-40d9-9078-4943cbdbb739">
+       <div id="fd659cae-b11a-40a8-8b26-e3f70cb1fd46">
        </div>
       </div>
-      <span class="text-muted" id="3e5d0201-d26e-4a56-8c42-6ef5a0fdb2d2">
+      <span class="text-muted" id="bdf41a9a-ee5a-40c8-8c7c-83ccc68da120">
        Mixin for a web component which can be enabled or disabled.
       </span>
-      <pre id="bae88d02-9dbf-4263-bec8-9e709d1d8eab"><code class="python">AvailabilityMixin()</code></pre>
-      <p id="0c589d0b-dc26-426c-9147-f1603f857c66">
+      <pre id="ef088163-b947-4680-a857-b50a179dd8d8"><code class="python">AvailabilityMixin()</code></pre>
+      <p id="37963c6f-c914-4ea9-8bfe-2c2a88466cf4">
        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="6818ff25-5bab-43f3-8ab5-ee934f4c913a">
-       <div class="d-flex justify-content-between" id="64d13bc1-8ff5-4e34-bc35-5941bb06f8e7">
-        <h4 id="60c2b9fe-0889-4e71-81ec-65d9e275b7a7">
+      <div class="mt-5" id="393f8556-667e-4f31-9102-bb744cd45183">
+       <div class="d-flex justify-content-between" id="d7dc3b03-58a7-4cbb-94f5-4acea0977784">
+        <h4 id="710144db-80d0-4513-9ef3-024d42d0d821">
          Method
-         <span class="text-primary" id="768341a9-eabd-4c15-bf5b-949382901273">
+         <span class="text-primary" id="c6a530ff-f5db-4325-bb40-55ae140840eb">
           as_disabled
          </span>
         </h4>
-        <div id="93f794a3-4a7a-49e8-888e-86e89880f1fb">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#3a69dc8c-a2a9-4f57-9daa-5f7cc0f3382a" data-bs-toggle="collapse" id="6c180bb6-c402-4d50-878b-2c11c09a7f3e" onclick="return false;" type="button">
+        <div id="e60666d4-9249-42e6-afa5-acccbebaab60">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#ba513e9c-9592-49a8-a4c9-208e3d6541be" data-bs-toggle="collapse" id="ef1be4eb-bb41-4fff-9ddb-a3de6d018062" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="a364de71-7d43-4e8c-9ebc-83af5032d2cf">
+       <span class="text-muted" id="ae78c46f-91e0-4106-8dff-c359d31b4f49">
         Disables a web component.
        </span>
-       <pre id="cc79fca4-2e8e-4608-8db8-f367a30c0f26"><code class="python">as_disabled()</code></pre>
-       <div class="ms-3 collapse" id="3a69dc8c-a2a9-4f57-9daa-5f7cc0f3382a">
-        <h6 id="a3333cc0-916f-49ac-a32d-7d837e44f25e">
+       <pre id="af69b126-328f-4cf7-9bc0-be709e36ceb5"><code class="python">as_disabled()</code></pre>
+       <div class="ms-3 collapse" id="ba513e9c-9592-49a8-a4c9-208e3d6541be">
+        <h6 id="955f40c7-98f8-4c30-b47e-9de0c11f576e">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="ea89cc7f-52f5-407c-9619-63e53b2d7316">
+        <table class="table table-sm bg-light" id="4aaa63c8-879c-4112-9868-1e37bf519697">
          <thead>
           <tr>
            <th scope="col">
@@ -3216,13 +3216,13 @@ button = ("Primary").as_primary().as_outline()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="4093174a-e16c-496c-930f-6a4545eb4b13">
-        <h6 id="77dfffb7-b22f-4dba-9959-1557e8d35a53">
+       <div class="ms-3" id="6db06a96-f432-410d-9953-6c3e42265ec2">
+        <h6 id="03282845-bd78-4b36-954d-480207cae080">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="bbdf7979-25d8-4f75-8b8a-6c37d41d36a6"><code class="python">from bootwrap import Button
+        <pre id="2b9e9358-b062-46f0-a20a-5c4c39c2b03b"><code class="python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Primary").as_disabled()
@@ -3231,56 +3231,56 @@ button = ("Primary").as_disabled()
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="1d419346-48ea-4be1-ac9a-4743be5d4ab0">
-     <div id="3e70be75-050e-47fc-aeab-2a4d3fb9aca4">
+    <div class="tab-pane fade" id="36feaa40-9b69-48d6-a2df-facea739c464">
+     <div id="badf0caa-1636-49c0-82de-2895247374d1">
       <hr/>
-      <ul class="nav" id="9bbac87a-39f4-48d3-b647-2149d9c6064f" role="tablist">
+      <ul class="nav" id="c96c275b-e49c-4331-84b3-7fd2010ea406" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#783068e3-0841-412b-861b-26a7a2025f7e" data-bs-toggle="tab" href="#783068e3-0841-412b-861b-26a7a2025f7e" id="e389c61e-b2aa-4c84-b319-57d94d2bde18" role="tab">
-         <span class="text-secondary" id="c8110c94-21cd-435a-87f7-f3a9010a5693">
+        <a class="nav-link active" data-bs-target="#14c252ab-af68-41ea-9f77-cacc68a9215e" data-bs-toggle="tab" href="#14c252ab-af68-41ea-9f77-cacc68a9215e" id="03e8401a-4281-4ca3-8085-69dcc89e41d0" role="tab">
+         <span class="text-secondary" id="eb0393a9-1ca0-4309-8486-810de4e7a843">
           Breakpoint
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#137ca29c-8c3c-434e-a47b-4ce600480df2" data-bs-toggle="tab" href="#137ca29c-8c3c-434e-a47b-4ce600480df2" id="37f98b9a-0705-4a07-b0c9-8d112ff827b1" role="tab">
-         <span class="text-secondary" id="28551ea5-f280-48be-a6cc-a78bcd619664">
+        <a class="nav-link" data-bs-target="#642857b3-2a89-44ec-8812-15ab8e8376f4" data-bs-toggle="tab" href="#642857b3-2a89-44ec-8812-15ab8e8376f4" id="0f3978b3-c1f8-4e96-9380-af9352197a2e" role="tab">
+         <span class="text-secondary" id="0dfba51c-59c2-4e50-b7c8-01603f09dffa">
           Action
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="783068e3-0841-412b-861b-26a7a2025f7e">
-        <div class="mt-5" id="15f57dea-4f2a-4cf4-9a96-2a5e1580ac2e">
-         <div class="d-flex justify-content-between" id="1cb6e8e8-de54-43a7-9202-e4163da4a4eb">
-          <h1 id="fb47f258-226b-4126-be62-fa7075a9f752">
+       <div class="tab-pane fade active show" id="14c252ab-af68-41ea-9f77-cacc68a9215e">
+        <div class="mt-5" id="4c81f08c-30a9-45c5-af2b-287a91025937">
+         <div class="d-flex justify-content-between" id="c0c67414-61e8-4014-ba27-ee4aaeb96980">
+          <h1 id="a4e498ce-f3ae-406e-93d2-3b925a690ca1">
            Class
-           <span class="text-primary" id="a5594971-03c5-45c4-8b0f-a2382fecf575">
+           <span class="text-primary" id="c61b5846-6845-418b-8641-89cc8deb6670">
             Breakpoint
            </span>
           </h1>
-          <div id="af4f8af8-ba3f-4d36-ac6b-45f58aac11f4">
+          <div id="71a0fd51-d93c-4108-8210-25f29b74a05e">
           </div>
          </div>
-         <span class="text-muted" id="de574325-97ac-492c-8358-59fbe510bec2">
+         <span class="text-muted" id="69525516-737e-47e9-abef-56ea6eb7c090">
           The breakpoint constants.
          </span>
-         <p id="b4be852c-3fe6-4eb0-9892-84721c9da657">
+         <p id="c116bae5-254a-4152-98d2-63678d7d1b63">
           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="6b9275f9-499a-43f8-8161-645c804cd631">
+         <p id="c9700470-bfe9-4e4f-aae6-f6733789a091">
           See
           <a href="https://getbootstrap.com/docs/4.0/layout/overview/#responsive-breakpoints">
            for more information.
           </a>
          </p>
-         <div id="1fcf38db-9eb3-488a-b117-088e972677c5">
+         <div id="72e6b201-acb8-4409-8ea4-d2f2540d6da9">
           <div class="row">
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="cd38fa5d-a83f-4b8e-93cc-c31a79f4fbef">
+            <div class="p-1 m-1 border text-center" id="eb3bf3b3-99e6-4eca-b2fa-cb67c1061dac">
              Breakpoint.
              <strong class="text-primary">
               LG
@@ -3288,7 +3288,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="118cf49e-1fbf-42da-9737-1500202f0beb">
+            <div class="p-1 m-1 border text-center" id="50ee2344-9122-45b9-a4b5-b15fe4519dbe">
              Breakpoint.
              <strong class="text-primary">
               MD
@@ -3296,7 +3296,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="1ca8a5be-378c-40ec-a076-f41850cb626b">
+            <div class="p-1 m-1 border text-center" id="072a208f-9e96-4848-9eff-ea4633803d05">
              Breakpoint.
              <strong class="text-primary">
               SM
@@ -3304,7 +3304,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="5059b4bb-faa6-490d-ab13-cf983e3c95a0">
+            <div class="p-1 m-1 border text-center" id="d30dcdb7-42cb-46ae-b365-4008c7e47787">
              Breakpoint.
              <strong class="text-primary">
               XL
@@ -3312,7 +3312,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="9dea757f-331c-4ca4-9750-0d0fbf8563e0">
+            <div class="p-1 m-1 border text-center" id="3ea6484d-8ed0-4fae-ae70-6d0a2807654c">
              Breakpoint.
              <strong class="text-primary">
               XS
@@ -3323,25 +3323,25 @@ button = ("Primary").as_disabled()
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="137ca29c-8c3c-434e-a47b-4ce600480df2">
-        <div class="mt-5" id="7c5088d6-a2e4-484d-ad91-d616c373af19">
-         <div class="d-flex justify-content-between" id="1fbdeffc-7949-426e-8b13-dc80a40f2e34">
-          <h1 id="67c19ad5-bf23-431a-9c26-0a10d7df3b0f">
+       <div class="tab-pane fade" id="642857b3-2a89-44ec-8812-15ab8e8376f4">
+        <div class="mt-5" id="de1d16d3-6dee-42b4-b0f3-3dca103493ef">
+         <div class="d-flex justify-content-between" id="25a58184-d8b1-4e62-a42c-9e51ec1ba0e6">
+          <h1 id="5f89119e-4a18-4117-bd50-64c16457df93">
            Class
-           <span class="text-primary" id="dd66cf88-03d7-489d-b021-6fd78831f9e2">
+           <span class="text-primary" id="09c5d8ba-5d87-4a30-ace5-58bd3a5aabca">
             Action
            </span>
           </h1>
-          <div id="94775cbc-9e1a-4cf1-ae64-13a94cc51693">
+          <div id="872745a9-8811-4697-9642-f08a2a62bbbb">
           </div>
          </div>
-         <span class="text-muted" id="736648c7-3b88-450a-ac6a-72405a595df9">
+         <span class="text-muted" id="2df57271-a74f-4405-97d1-00e7b17bd031">
           The action constants.
          </span>
-         <div id="0b581df2-e0ad-4ca3-8ec5-e52ea15b41e0">
+         <div id="8b82b97f-713a-4e9a-98ad-dd7b3647372b">
           <div class="row">
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="66e326fb-b2d3-4036-9742-a80b55d2812f">
+            <div class="p-1 m-1 border text-center" id="1ec4c703-ca6e-4135-91d1-821ad966726b">
              Action.
              <strong class="text-primary">
               DISMISS
@@ -3349,7 +3349,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="7007abad-bb24-4fcf-b7ca-2e22aa10a8b4">
+            <div class="p-1 m-1 border text-center" id="7a5b5086-79f2-4932-a1bc-ec8ea4dcc613">
              Action.
              <strong class="text-primary">
               LINK
@@ -3357,7 +3357,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="f0fda0ec-52b1-4c0d-a7d6-3c012a349fd8">
+            <div class="p-1 m-1 border text-center" id="2769da6c-5813-485a-abf5-81e6bc662fc4">
              Action.
              <strong class="text-primary">
               SUBMIT
@@ -3365,7 +3365,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="9f44cd09-0dc8-46f0-ba82-e637d4c8bbfc">
+            <div class="p-1 m-1 border text-center" id="36b58b78-18d1-455c-92ae-29add50f86bb">
              Action.
              <strong class="text-primary">
               TOGGLE
diff --git a/docs/components.html b/docs/components.html
index 9e66e2a..2036169 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="d7831bec-8246-4ee5-ab27-073b24885172" src="logo.png" width="32"/>
-   <span class="text-light" id="1f9452c5-90a3-49f7-af95-b5f02c2fce56">
+   <img alt="Bootwrap Logo" id="3321ed1d-e4a0-4980-a727-f7f1516c98d3" src="logo.png" width="32"/>
+   <span class="text-light" id="9ff44072-a3cf-4a3b-9cc3-c47c6b57caec">
     <strong>
      Bootwrap
     </strong>
@@ -34,194 +34,194 @@
    <div class="collapse navbar-collapse" id="menu">
     <ul class="navbar-nav me-auto">
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="index.html" id="a3303545-0526-4b84-8724-756f7fd1cea2">
+      <a class="ms-2 nav-link" href="index.html" id="d7334125-eaf8-4a69-a2ce-d0db8b81e82c">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="layout.html" id="9d11677b-492c-4ddb-a479-7060b762bb1c">
+      <a class="ms-2 nav-link" href="layout.html" id="4be8a5c6-4e48-4cec-a9b2-b4297e9651f2">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="base.html" id="faad6d87-b319-4077-b513-542899a886ab">
+      <a class="ms-2 nav-link" href="base.html" id="83e7a6ef-9a79-426e-aae7-c5b10d991723">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="components.html" id="2847206b-754c-4bdb-8e1d-974eb581b613">
+      <a class="ms-2 nav-link" href="components.html" id="fb57045b-1a1c-4b7c-9198-93e51ead6576">
        Components
       </a>
      </li>
     </ul>
-    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="d2f7a9cb-b7c0-4ef3-8bdc-665025802fdc" role="button">
+    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="725ada4a-e106-4231-8f88-cca7d32acd72" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container-fluid">
-   <ul class="nav nav-pills" id="356b0337-015f-414c-92d7-dc6c568bbef0" role="tablist">
+   <ul class="nav nav-pills" id="85a462df-7ec1-4ee2-94f9-40d1e2a09f98" role="tablist">
     <li class="nav-item">
-     <a class="nav-link active" data-bs-target="#ed628734-dae3-426a-908a-fb7c90485337" data-bs-toggle="tab" href="#ed628734-dae3-426a-908a-fb7c90485337" id="103f93d5-5047-479c-8796-2f0f4732e4d5" role="tab">
+     <a class="nav-link active" data-bs-target="#664bf6f1-3f78-4367-86f0-c65c269cc9d8" data-bs-toggle="tab" href="#664bf6f1-3f78-4367-86f0-c65c269cc9d8" id="d97fa785-9ff0-4354-a2fd-0b8e7b4cfbe3" role="tab">
       Anchor
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#13ef66e9-7b78-4224-9de6-a9ccf35fe539" data-bs-toggle="tab" href="#13ef66e9-7b78-4224-9de6-a9ccf35fe539" id="d1939ff0-47bb-4ef1-addc-b5fdbedf4d01" role="tab">
+     <a class="nav-link" data-bs-target="#d106f569-4051-48bf-9058-fce6ba43168d" data-bs-toggle="tab" href="#d106f569-4051-48bf-9058-fce6ba43168d" id="5e522b0c-22b9-4506-aea9-25894b1b9d43" role="tab">
       Badge
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#ea4485b2-4441-460f-af2f-665ed67ea37b" data-bs-toggle="tab" href="#ea4485b2-4441-460f-af2f-665ed67ea37b" id="9c6862e0-4ee9-46d1-bf08-aaa1b4eae9f3" role="tab">
+     <a class="nav-link" data-bs-target="#4ea495da-0959-4d9c-9edc-4ff7356d0f06" data-bs-toggle="tab" href="#4ea495da-0959-4d9c-9edc-4ff7356d0f06" id="af34ee6b-5148-4f70-beb7-042d893d4a6e" role="tab">
       Button
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#a7561d6b-0dbd-4ba9-bffe-cd220a3fcf10" data-bs-toggle="tab" href="#a7561d6b-0dbd-4ba9-bffe-cd220a3fcf10" id="c440605a-ad49-4eea-95ce-dd55bf26698f" role="tab">
+     <a class="nav-link" data-bs-target="#4592d56a-4ba2-4882-aaf1-4b0520e27308" data-bs-toggle="tab" href="#4592d56a-4ba2-4882-aaf1-4b0520e27308" id="63e0a9e8-0a76-4f3a-9e6b-cf28b234bfab" role="tab">
       ButtonGroup
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#b935673f-9175-423c-b57f-5c027ad3c20b" data-bs-toggle="tab" href="#b935673f-9175-423c-b57f-5c027ad3c20b" id="890583b6-d588-480b-b536-e092c472d661" role="tab">
+     <a class="nav-link" data-bs-target="#f4402903-45d7-4e3d-a187-6ebc45e41032" data-bs-toggle="tab" href="#f4402903-45d7-4e3d-a187-6ebc45e41032" id="9931668d-76b8-4e41-ae9b-cf55e3242db5" role="tab">
       Deck
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#a385e77a-87ae-4219-9b8b-8220fa363415" data-bs-toggle="tab" href="#a385e77a-87ae-4219-9b8b-8220fa363415" id="4443b227-3060-4101-9c2e-7d3ec5c683d5" role="tab">
+     <a class="nav-link" data-bs-target="#c2fc0555-0488-4c92-88e6-a93b08b7fcc6" data-bs-toggle="tab" href="#c2fc0555-0488-4c92-88e6-a93b08b7fcc6" id="2206fb6b-ea95-47ff-bbe6-e27545c3e67f" role="tab">
       Dialog
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#249bac9c-5a71-4c80-aaab-7786d21d9176" data-bs-toggle="tab" href="#249bac9c-5a71-4c80-aaab-7786d21d9176" id="12e39521-2cfa-4742-8af5-5cf57057972d" role="tab">
+     <a class="nav-link" data-bs-target="#a65518ac-93e0-443d-9b55-64b555802ad1" data-bs-toggle="tab" href="#a65518ac-93e0-443d-9b55-64b555802ad1" id="9bd822d4-db72-445f-b172-b1ea7229ff4c" role="tab">
       Form
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#35e76910-6a7e-445d-a7d5-8e07a6cb5e0a" data-bs-toggle="tab" href="#35e76910-6a7e-445d-a7d5-8e07a6cb5e0a" id="5c34c524-7a0d-42c1-8dc9-015323f69510" role="tab">
+     <a class="nav-link" data-bs-target="#fb3b094b-e2a8-4d64-9a79-a516779fb387" data-bs-toggle="tab" href="#fb3b094b-e2a8-4d64-9a79-a516779fb387" id="355d14b9-1e1a-42f6-93d3-0a44f00875a3" role="tab">
       Icon
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#1d000fe4-75d2-4540-b722-08e9bc3500c5" data-bs-toggle="tab" href="#1d000fe4-75d2-4540-b722-08e9bc3500c5" id="05d24a38-6853-4f2a-bd7b-139513992a68" role="tab">
+     <a class="nav-link" data-bs-target="#74cdc53f-1f81-469c-b04d-0dfdc417a354" data-bs-toggle="tab" href="#74cdc53f-1f81-469c-b04d-0dfdc417a354" id="c151f996-b963-4b15-b721-6efb7e7016d3" role="tab">
       Image
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#3347c54e-5bc8-4e3a-acda-76e85ab3ff37" data-bs-toggle="tab" href="#3347c54e-5bc8-4e3a-acda-76e85ab3ff37" id="f5d0c279-9850-44a2-8dd1-0d7f6220b942" role="tab">
+     <a class="nav-link" data-bs-target="#679baaa6-caf2-4758-aa56-744c2a648e96" data-bs-toggle="tab" href="#679baaa6-caf2-4758-aa56-744c2a648e96" id="b0485a0a-5e3c-4c2e-b36c-df391287a02c" role="tab">
       Javascript
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#0e002492-6dc3-42f8-b28e-adf101b012a2" data-bs-toggle="tab" href="#0e002492-6dc3-42f8-b28e-adf101b012a2" id="0028f1f0-1a2c-4879-905f-19468ded1bdd" role="tab">
+     <a class="nav-link" data-bs-target="#361fb36f-ea93-4934-aef5-0b7a783a5fb4" data-bs-toggle="tab" href="#361fb36f-ea93-4934-aef5-0b7a783a5fb4" id="3a228e1d-8397-4bef-aaba-0104387274d7" role="tab">
       Link
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#a481776f-f6cb-4630-9226-073d7a8849f5" data-bs-toggle="tab" href="#a481776f-f6cb-4630-9226-073d7a8849f5" id="ca9d7de1-9b68-46e6-818d-651102891b46" role="tab">
+     <a class="nav-link" data-bs-target="#ccb6efe0-aca5-489d-8338-f5cee6a0b8cc" data-bs-toggle="tab" href="#ccb6efe0-aca5-489d-8338-f5cee6a0b8cc" id="10d28b55-1864-494f-9412-273c2aa219e3" role="tab">
       List
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#5cd379c9-21ad-4110-9322-0cf8e1be8294" data-bs-toggle="tab" href="#5cd379c9-21ad-4110-9322-0cf8e1be8294" id="780f28b0-869d-45e7-a3df-dfa4972ea1fd" role="tab">
+     <a class="nav-link" data-bs-target="#d3fc9219-3d8f-493b-aadd-69506b0586fa" data-bs-toggle="tab" href="#d3fc9219-3d8f-493b-aadd-69506b0586fa" id="fb91f44c-dc72-4921-a737-beebc22b7a78" role="tab">
       Navigation
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#22f26453-0f63-4369-a34e-18876fd5eccf" data-bs-toggle="tab" href="#22f26453-0f63-4369-a34e-18876fd5eccf" id="8a204d9a-7663-45b8-ab0b-027530f583f1" role="tab">
+     <a class="nav-link" data-bs-target="#0b406f38-bbaa-4111-b418-37fbba3d7b05" data-bs-toggle="tab" href="#0b406f38-bbaa-4111-b418-37fbba3d7b05" id="36058e43-ba67-41fe-8d31-a91d8db43126" role="tab">
       Panel
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#d6ca5092-9d3a-4835-a152-2e91732a946f" data-bs-toggle="tab" href="#d6ca5092-9d3a-4835-a152-2e91732a946f" id="f74947c0-6f5a-4516-814c-afbfae76c4ee" role="tab">
+     <a class="nav-link" data-bs-target="#fbd691b4-ae85-4548-84a0-ae2fb7958627" data-bs-toggle="tab" href="#fbd691b4-ae85-4548-84a0-ae2fb7958627" id="fe55197d-cf7c-4278-8f4d-cf48c6b2be1a" role="tab">
       Separator
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#9e892640-a7a0-4013-b093-9dfd2f6a3a08" data-bs-toggle="tab" href="#9e892640-a7a0-4013-b093-9dfd2f6a3a08" id="bcc0f9fa-3e3c-4ef0-8a34-8194a0d9ce0a" role="tab">
+     <a class="nav-link" data-bs-target="#5857ef78-23dc-4fa4-828b-d0bf22445b4f" data-bs-toggle="tab" href="#5857ef78-23dc-4fa4-828b-d0bf22445b4f" id="8dfadfe0-346f-4247-b681-ddd16b1a0279" role="tab">
       Table
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#1d0cf74a-f71c-4f6f-b29d-8b7448af9b21" data-bs-toggle="tab" href="#1d0cf74a-f71c-4f6f-b29d-8b7448af9b21" id="c58cf44a-629e-47f4-b40c-a3cc0554fa1f" role="tab">
+     <a class="nav-link" data-bs-target="#6cb58683-b3d9-4114-b55e-188cbe220c96" data-bs-toggle="tab" href="#6cb58683-b3d9-4114-b55e-188cbe220c96" id="cc116ec0-80b6-48c2-ad8f-58d0c1eccef2" role="tab">
       Text
      </a>
     </li>
    </ul>
    <div class="tab-content">
-    <div class="tab-pane fade active show" id="ed628734-dae3-426a-908a-fb7c90485337">
-     <div id="6aaa818b-d913-4815-a648-953f143f6bc7">
+    <div class="tab-pane fade active show" id="664bf6f1-3f78-4367-86f0-c65c269cc9d8">
+     <div id="fa29bfaa-0aa8-49a9-8eae-38c2795c3598">
       <hr/>
-      <ul class="nav" id="dfe775ea-7061-4ee9-a61f-4b1b7e09cb4f" role="tablist">
+      <ul class="nav" id="34e8f36b-310e-4edd-805c-70d7b75e46ab" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#69542faf-645b-45a2-97e9-2905fdf45a60" data-bs-toggle="tab" href="#69542faf-645b-45a2-97e9-2905fdf45a60" id="8f7c121d-de33-46c8-901e-b696a6d6cbe1" role="tab">
-         <span class="text-secondary" id="c77dee73-c04a-499f-9526-b8719e74496c">
+        <a class="nav-link active" data-bs-target="#798536a0-60df-40ab-9c06-b70fbd81a47c" data-bs-toggle="tab" href="#798536a0-60df-40ab-9c06-b70fbd81a47c" id="eee21c08-ec5b-4a65-a645-c1357731861b" role="tab">
+         <span class="text-secondary" id="d6b0e83a-4e76-41ca-91e9-eadb7e1f9d33">
           Anchor
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#ec9647ac-8812-4702-bded-8b18ed525a3b" data-bs-toggle="tab" href="#ec9647ac-8812-4702-bded-8b18ed525a3b" id="a818dde2-b799-4b81-a674-7c27c881c940" role="tab">
-         <span class="text-secondary" id="cc725d76-490b-4872-9be5-8c1697a92728">
+        <a class="nav-link" data-bs-target="#e8cf47c4-5486-4c4c-aa58-57c00af88c1d" data-bs-toggle="tab" href="#e8cf47c4-5486-4c4c-aa58-57c00af88c1d" id="0b945f32-dbfc-40cc-b356-b842c2ccd9be" role="tab">
+         <span class="text-secondary" id="e0417a68-7342-4571-b884-63e24a8bff5d">
           Appearance
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#44dfa689-6190-44b1-8f44-090e4d0d363c" data-bs-toggle="tab" href="#44dfa689-6190-44b1-8f44-090e4d0d363c" id="d4e3e954-aa9c-4cb8-8ed8-b7e121b17901" role="tab">
-         <span class="text-secondary" id="4c1f18a5-6f24-436d-b4aa-ca37af7794f0">
+        <a class="nav-link" data-bs-target="#2883eb66-6fc3-44e1-ada2-dc34e4aa4ce3" data-bs-toggle="tab" href="#2883eb66-6fc3-44e1-ada2-dc34e4aa4ce3" id="268589f4-6b27-43c7-af0b-60c07050d80e" role="tab">
+         <span class="text-secondary" id="bdca23c7-69fe-4fa1-81ac-408516e9b932">
           Link Resource
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#5dad4f1f-f1b1-4638-9c89-f6e8a2b41327" data-bs-toggle="tab" href="#5dad4f1f-f1b1-4638-9c89-f6e8a2b41327" id="0985f46b-427e-4002-a8ff-2da4720a753f" role="tab">
-         <span class="text-secondary" id="9eb3b011-fa6a-46e0-9c1d-2b050fab8bc8">
+        <a class="nav-link" data-bs-target="#26815040-2bf0-409e-b6b7-6a1aeec67299" data-bs-toggle="tab" href="#26815040-2bf0-409e-b6b7-6a1aeec67299" id="59857c64-5a80-4be4-aa34-c93097ab2425" role="tab">
+         <span class="text-secondary" id="931f70d5-5df7-4983-8e47-70162e351150">
           Open Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#729dbf98-c6ce-4767-b848-5927c705164a" data-bs-toggle="tab" href="#729dbf98-c6ce-4767-b848-5927c705164a" id="a4d24156-fbc3-4cfb-a902-9bc1de3ad463" role="tab">
-         <span class="text-secondary" id="fb20b29e-c852-44a9-a381-1c09d9a232c0">
+        <a class="nav-link" data-bs-target="#c6117023-6dc4-44ad-a254-9ac35e264200" data-bs-toggle="tab" href="#c6117023-6dc4-44ad-a254-9ac35e264200" id="7bbc67b5-acd5-414f-aacc-cd17a4941881" role="tab">
+         <span class="text-secondary" id="604f69d1-d211-45a4-87be-02134582d780">
           Close Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#0e321918-1e58-4e1c-b836-6466628a7a9c" data-bs-toggle="tab" href="#0e321918-1e58-4e1c-b836-6466628a7a9c" id="3252e75e-bffb-485d-afaf-b474dead0917" role="tab">
-         <span class="text-secondary" id="b09c7d3c-8357-4e98-b3f6-58df106d4e63">
+        <a class="nav-link" data-bs-target="#20c26e57-0193-4719-a94f-8dc644eaf3f8" data-bs-toggle="tab" href="#20c26e57-0193-4719-a94f-8dc644eaf3f8" id="4d8df138-5c4f-4a15-b142-aa28f83518e4" role="tab">
+         <span class="text-secondary" id="9c82c807-d4bb-4604-8475-4fdb3e26e1c9">
           Expand/Collapse Panel
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="69542faf-645b-45a2-97e9-2905fdf45a60">
-        <div class="mt-5" id="f6dc2ad1-3a92-4034-9bfe-5d53370cb4fd">
-         <div class="d-flex justify-content-between" id="57bbcc31-b54d-47f6-934c-9d7d6459e9c4">
-          <h1 id="5e406ee1-26ae-4e0b-a698-7d7a15f12f4a">
+       <div class="tab-pane fade active show" id="798536a0-60df-40ab-9c06-b70fbd81a47c">
+        <div class="mt-5" id="606d2db5-abcc-4748-a741-8cbd8061999b">
+         <div class="d-flex justify-content-between" id="d68352cd-f0d2-4832-89af-9f9e0fa52839">
+          <h1 id="52dbd95a-c996-4b66-bf46-02de77f5b258">
            Class
-           <span class="text-primary" id="9a8806a8-2bf9-47cc-ac12-47d7cdbd4953">
+           <span class="text-primary" id="e3e01b31-5343-4760-a835-745e669e23a4">
             Anchor
            </span>
           </h1>
-          <div id="928e6a64-4331-4809-8ba2-94b30d00149f">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#3e430bbe-f8b7-4a23-b79f-840d57a526a3" data-bs-toggle="collapse" id="00fa17cc-c8ff-4c1e-b7e8-20c875d9df53" onclick="return false;" type="button">
+          <div id="a19f1ee0-b47a-4a2e-9021-ab8489f28191">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#7ec9c472-e553-477b-8fa4-9e6ee4fe1695" data-bs-toggle="collapse" id="094b963b-942b-414a-a05c-9a93d02d12d6" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="8cae641d-830d-4b2a-a3c3-dda3f1ef8db9">
+         <span class="text-muted" id="efa6ce29-2776-44a3-8b71-eff09b8e18a7">
           A web component for an anchor.
          </span>
-         <pre id="88eebd1a-1437-48ea-8cd9-15eeb36b5b07"><code class="python">Anchor(inner=None)</code></pre>
-         <div class="ms-3 collapse" id="3e430bbe-f8b7-4a23-b79f-840d57a526a3">
-          <h6 id="ffc314c8-ec7a-46fb-93c7-77ed37c1229a">
+         <pre id="6ee20a36-e826-40d1-92f1-48d60f756afc"><code class="python">Anchor(inner=None)</code></pre>
+         <div class="ms-3 collapse" id="7ec9c472-e553-477b-8fa4-9e6ee4fe1695">
+          <h6 id="972e6a9b-0fa2-4103-99cc-695895961d4b">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="0e7aa168-c4e3-41a9-92e7-dbc2bfcda3f5">
+          <table class="table table-sm bg-light" id="06808483-58db-444d-a5e4-30df59d21b1c">
            <thead>
             <tr>
              <th scope="col">
@@ -254,7 +254,7 @@
            </tbody>
           </table>
          </div>
-         <p id="d5d80438-c1e1-4014-90f4-91af4d30d450">
+         <p id="cc34d011-972c-4e65-851c-a1642878258b">
           The
           <code>
            Anchor
@@ -273,45 +273,45 @@
     conjunction with other components, for example, in creating a navigation
     menu.
          </p>
-         <div class="ms-3" id="ba1bcfdd-3cbe-46eb-95b9-6f67895a96cd">
-          <h6 id="31fa7d6a-c9e8-49fb-bdaa-5e8d896bdb84">
+         <div class="ms-3" id="94f80d51-7f08-4d34-a4ff-cfb1f3ac0492">
+          <h6 id="818388ee-e573-4668-a2f1-2e8065b815c3">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="4db90337-cb3f-4546-b045-7b8a13d99c3a"><code class="python">from bootwrap import Anchor
+          <pre id="3735f235-09ad-40f3-b2a0-7d4b1b0c06a2"><code class="python">from bootwrap import Anchor
 Anchor('Google Search').link('https://www.google.com/')
 </code></pre>
          </div>
-         <div class="ms-3" id="70f8ae07-510c-4dd6-bda0-0160e6f07dd8">
-          <a href="https://www.google.com/" id="f5b13f9d-2d48-4ac9-b8e3-96e4d10dd117">
+         <div class="ms-3" id="9947289c-e917-4e4e-8a34-99d02d0355d0">
+          <a href="https://www.google.com/" id="522d5cfc-7097-45cd-b647-9d77f1e0523c">
            Google Search
           </a>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="ec9647ac-8812-4702-bded-8b18ed525a3b">
-        <div class="mt-3" id="fc90562c-861e-4c78-8624-557bd6b078cb">
-         <div id="f2eea3dc-8d13-4fcf-8eea-6464f3fab27c">
+       <div class="tab-pane fade" id="e8cf47c4-5486-4c4c-aa58-57c00af88c1d">
+        <div class="mt-3" id="954fdc2e-3ac1-4a93-b374-ed0d6e98b97b">
+         <div id="3ddea615-751c-46aa-869a-900ced15aa4f">
           <div class="row">
            <div class="col-md">
-            <div id="1838f304-ff3f-4647-b312-eb7e5b7f3843">
-             <h1 id="34619275-c951-4cf8-87b6-197f070ed6e8">
+            <div id="b72e75ff-1ee0-4309-a20d-28b8a4f0cb11">
+             <h1 id="f126dca7-ce25-4f18-9a4f-3ff43b1aed9e">
               Appearance
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="9aec2f8a-41f4-487e-9808-9b74f04c5f96">
+            <div id="74681772-6d59-4d62-b209-641fc8cbf7cc">
             </div>
            </div>
           </div>
          </div>
-         <div id="c93d4afd-4ce9-4160-8069-45b4acdc0b05">
+         <div id="10074d3a-f8c2-48b1-ba38-cfe1c458f70c">
           <div class="row">
            <div class="col-md">
-            <div id="263a652d-1193-4820-8983-2477749b503d">
-             <p id="926a0f29-f878-4069-941e-24b662862045">
+            <div id="3c20df32-6b60-4671-9b1b-86f033cc79b9">
+             <p id="482d0d46-1d4c-424c-9150-7711dee47f6e">
               Change
               <code>
                Anchor
@@ -353,8 +353,8 @@ Anchor('Google Search').link('https://www.google.com/')
             </div>
            </div>
            <div class="col-md">
-            <div id="19cfaf55-fdae-4f41-a07f-ac46c21fe1e1">
-             <pre id="4bce144c-36f6-45e0-a91f-2b9abe19b6b7"><code class="python">from bootwrap import Panel, Anchor
+            <div id="fa50b806-ff20-4dc4-b5da-ee3fa04a7958">
+             <pre id="03c8cd9c-1f05-4f9f-ae6a-fcfeeb1c865e"><code class="python">from bootwrap import Panel, Anchor
 panel = Panel(
   Anchor("Primary").link("#").as_primary(),
   Anchor("Secondary").link("#").as_secondary(),
@@ -368,29 +368,29 @@ panel = Panel(
 for anchor in panel:
   anchor.mb(1)
 panel</code></pre>
-             <div id="e7e5d4ec-a579-4a1f-beec-8f9d2022a72c">
-              <a class="mb-1 text-primary" href="#" id="7bbaf086-3ffe-4efe-8544-b7eb4e7653d8">
+             <div id="1c0e5f7e-ec0e-48e3-8ab5-fda83689920e">
+              <a class="mb-1 text-primary" href="#" id="44d428ea-a348-4a34-a830-ca9bf21b4294">
                Primary
               </a>
-              <a class="mb-1 text-secondary" href="#" id="81829c23-430b-4817-b03d-61d7006246e7">
+              <a class="mb-1 text-secondary" href="#" id="290fc9ec-d1fe-445f-b721-8a8e5d40a600">
                Secondary
               </a>
-              <a class="mb-1 text-success" href="#" id="20f8992f-9c2c-4bb3-8440-2b069beffee2">
+              <a class="mb-1 text-success" href="#" id="342632bc-45b4-4e87-ad2b-88ae591c9908">
                Success
               </a>
-              <a class="mb-1 text-warning" href="#" id="b2cb1a56-a08e-43f5-ad62-5f52b687749a">
+              <a class="mb-1 text-warning" href="#" id="9ce0adf9-9ff1-47cb-883b-26f227b03d51">
                Warning
               </a>
-              <a class="mb-1 text-danger" href="#" id="3845740e-abd4-4677-b19a-3626ccd562e2">
+              <a class="mb-1 text-danger" href="#" id="d1a8231a-1a02-4d6a-bc0b-04db80e8bcf1">
                Danger
               </a>
-              <a class="mb-1 text-info" href="#" id="576ba4c4-62fe-4e7c-ad68-4aed46bce26b">
+              <a class="mb-1 text-info" href="#" id="1eb590eb-4ae2-4378-b603-231ee03a2def">
                Info
               </a>
-              <a class="mb-1 text-light" href="#" id="830ef899-1d77-4938-8508-b3a6c741785c">
+              <a class="mb-1 text-light" href="#" id="1894afa5-a870-4e6b-8f22-0717638ee51f">
                Light
               </a>
-              <a class="mb-1 text-dark" href="#" id="80da7aaf-28f9-48b4-bc6f-e416e8d1a689">
+              <a class="mb-1 text-dark" href="#" id="1837057c-1c5e-4796-9351-9dc2875c0aff">
                Dark
               </a>
              </div>
@@ -400,28 +400,28 @@ panel</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="44dfa689-6190-44b1-8f44-090e4d0d363c">
-        <div class="mt-3" id="4925bb2b-61d9-4ecc-92e0-87ba982c719b">
-         <div id="6ddc4a91-c812-498c-83ad-08359e542dd1">
+       <div class="tab-pane fade" id="2883eb66-6fc3-44e1-ada2-dc34e4aa4ce3">
+        <div class="mt-3" id="7e256430-b6e9-47b0-8648-df736b7cbbd9">
+         <div id="a061f808-54f2-4fe3-b8af-9c1d15968ce4">
           <div class="row">
            <div class="col-md">
-            <div id="f1f80ed7-d3e4-4964-abe0-d259054b8801">
-             <h1 id="fd97c21e-86d7-45ce-9ab0-17cd8c5a0b85">
+            <div id="69280202-e179-4cb5-8622-2ad2d04c7b8e">
+             <h1 id="033c019a-9ef4-40a4-94e2-33b7b5de27f5">
               Link Resource
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="76c08fa8-f841-4c59-acba-052415a3845f">
+            <div id="e637fed5-7d4a-4ebd-9677-5f391d31fa52">
             </div>
            </div>
           </div>
          </div>
-         <div id="9c98e559-cb75-48ad-872c-e179e8c5c4f1">
+         <div id="1f864126-ca4f-4fa2-8a07-70fe2c090e0c">
           <div class="row">
            <div class="col-md">
-            <div id="1dcce6da-a389-4c45-857d-7b60fbe657ac">
-             <p id="e4832e9a-6eec-4764-a22b-57f34e29802a">
+            <div id="27a9a9af-8827-4c07-a0c0-54315c71a855">
+             <p id="da723273-29fe-4f67-85e7-c327925d3973">
               Associate
               <code>
                Anchor
@@ -435,13 +435,13 @@ panel</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="c6923f96-1def-442c-b269-4265bdc140c5">
-             <pre id="7a8756e4-2ec4-4565-8498-50cc945a64e7"><code class="python">from bootwrap import Panel, Anchor
+            <div id="880ee291-bd50-4fbb-a51f-339d102c1cde">
+             <pre id="4d384aa6-46c2-426a-b8f1-b3471543e56b"><code class="python">from bootwrap import Panel, Anchor
 Panel(
     Anchor("Google Search").link("https://www.google.com/")
 )</code></pre>
-             <div id="c54ed47d-c809-4165-b556-62151bbf3896">
-              <a href="https://www.google.com/" id="8dae13a4-bfd7-4c2d-8187-a06eabdfa24c">
+             <div id="55c3bbc4-5b4a-4d31-95e1-c4c7ffd48e9d">
+              <a href="https://www.google.com/" id="65020b64-9ee2-43c7-9ac6-a81c0422806b">
                Google Search
               </a>
              </div>
@@ -451,28 +451,28 @@ Panel(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="5dad4f1f-f1b1-4638-9c89-f6e8a2b41327">
-        <div class="mt-3" id="b1470b6a-d15e-4b38-a6df-33b7387845ee">
-         <div id="24aa42e3-5602-4d21-9c13-55ed0ab4d3e6">
+       <div class="tab-pane fade" id="26815040-2bf0-409e-b6b7-6a1aeec67299">
+        <div class="mt-3" id="f0fdadd3-5a41-42ff-89c7-5a6fe1c3fd00">
+         <div id="409afa6d-926d-4be8-bd62-8fa271775955">
           <div class="row">
            <div class="col-md">
-            <div id="9c7ff300-f91e-4eed-9ca0-3d59e718c0b0">
-             <h1 id="77e19c3d-a78a-48f1-b8d6-e1a735ec7888">
+            <div id="fa159d3f-1a1c-4bdf-bbab-46a77bbeda2f">
+             <h1 id="ea77a1f5-3126-43cc-a16f-ea975e6e7172">
               Open Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="177ed36a-4e06-4f0b-ae4e-0b8933231f0d">
+            <div id="b62ce8ab-9b27-4aff-be89-5b461944dd7f">
             </div>
            </div>
           </div>
          </div>
-         <div id="9c63eee6-be09-4ff1-8ab3-330ab0a7ee63">
+         <div id="7e31441f-ab4f-4bf0-8b22-a694b281e16b">
           <div class="row">
            <div class="col-md">
-            <div id="c2bb6757-f519-45d2-ae2e-592859335347">
-             <p id="3ab778aa-58cf-4384-9229-d16586467733">
+            <div id="d59e1bba-6594-4f5c-8136-3e3a856f3daf">
+             <p id="16b6b067-b73b-4f71-88cc-a2a940c82548">
               Use
               <code>
                Anchor
@@ -486,16 +486,16 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="9a38bece-5167-4b4b-8e13-9a487eaf69cf">
-             <pre id="52f0c43e-f0dd-47b1-bc72-b3010ddb72b3"><code class="python">from bootwrap import Panel, Dialog, Anchor
+            <div id="46a63af9-008d-4fc3-bb9a-d659cb02846b">
+             <pre id="6b80c06d-21d2-4e8b-ae84-4e2c3fd03e2c"><code class="python">from bootwrap import Panel, Dialog, Anchor
 dialog = Dialog(
   "Greeting",
   "Hello World!"
 )
 anchor = Anchor("Say Hello").toggle(dialog)
 Panel(dialog, anchor)</code></pre>
-             <div id="884c57e9-b75a-4ea6-adee-8219489f2725">
-              <div class="modal" id="d19a54bf-147f-41ca-b0b6-0671eb77e618">
+             <div id="a2fbf3ca-6993-4468-af09-44b662872756">
+              <div class="modal" id="82d2fd27-61c6-43a7-a8d7-ddecec7112d2">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -511,7 +511,7 @@ Panel(dialog, anchor)</code></pre>
                 </div>
                </div>
               </div>
-              <a data-bs-toggle="modal" href="#d19a54bf-147f-41ca-b0b6-0671eb77e618" id="f3065b32-4c7a-4465-989e-903fbaa65758" role="modal">
+              <a data-bs-toggle="modal" href="#82d2fd27-61c6-43a7-a8d7-ddecec7112d2" id="30bfc0f2-87af-47b7-bcda-b97deae2baf2" role="modal">
                Say Hello
               </a>
              </div>
@@ -521,28 +521,28 @@ Panel(dialog, anchor)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="729dbf98-c6ce-4767-b848-5927c705164a">
-        <div class="mt-3" id="fad5ec52-e9a5-49e9-8ae4-4db8d5982648">
-         <div id="0dea80c9-d93c-475e-bb87-aeb2f3b57eea">
+       <div class="tab-pane fade" id="c6117023-6dc4-44ad-a254-9ac35e264200">
+        <div class="mt-3" id="15b59c01-c8ff-4e76-8013-c073e6edde11">
+         <div id="f357b415-4d15-4533-847c-056f50ccac59">
           <div class="row">
            <div class="col-md">
-            <div id="1287046a-d93a-4109-8cac-2bf20d3f0453">
-             <h1 id="7f1afa92-c03c-4d34-afac-ff4a420f8b4a">
+            <div id="0a0a5047-1396-49b0-83d5-2e0c9573e9d3">
+             <h1 id="2c46776f-9e32-466c-8d1e-dbbac5ec97a7">
               Close Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="231644cb-07c9-492a-8e9d-7b513fb642e6">
+            <div id="6e2cba83-a235-4bcb-8daf-e4011fadb33d">
             </div>
            </div>
           </div>
          </div>
-         <div id="4cd03f2d-1cc2-4e61-a1f9-0b2a5d076561">
+         <div id="5a0b2cad-01b3-4ab4-82a5-507f767f2654">
           <div class="row">
            <div class="col-md">
-            <div id="3c106909-716e-4cfc-867a-e1fcfd7d60a0">
-             <p id="735258b2-4043-4564-ba44-8c4c01b7f148">
+            <div id="d54737d8-e8df-4945-93f2-d58e0a17b7d3">
+             <p id="5821ba2a-7b1c-4eb7-98c5-509feb02fedd">
               Use
               <code>
                Anchor
@@ -556,8 +556,8 @@ Panel(dialog, anchor)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="92285487-9d7f-495b-bbde-a4a31684cbbb">
-             <pre id="a4dd0488-b3f8-4683-9f21-c6b7fe0dadc9"><code class="python">from bootwrap import Panel, Dialog, Anchor
+            <div id="a43708a5-6d44-461e-a1b8-c187810194ab">
+             <pre id="4cc6e676-7908-4120-a5a9-78ef7c4ae6c5"><code class="python">from bootwrap import Panel, Dialog, Anchor
 dialog = Dialog(
   "Greeting",
   "Hello World!",
@@ -565,8 +565,8 @@ dialog = Dialog(
 )
 anchor = Anchor("Say Hello").toggle(dialog)  
 Panel(dialog, anchor)</code></pre>
-             <div id="a008bba6-2034-49c5-aa35-c67878c5559a">
-              <div class="modal" id="a7ba6066-f874-4801-b3e9-4e1286b68204">
+             <div id="3b49e33f-bb6a-409b-b3dd-5d431f600628">
+              <div class="modal" id="7b771d12-b907-43f1-ae1f-1198c5beb8e6">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -580,14 +580,14 @@ Panel(dialog, anchor)</code></pre>
                   Hello World!
                  </div>
                  <div class="modal-footer">
-                  <a data-bs-dismiss="modal" href="#" id="95ec81a2-6d50-4975-a374-523bc5770bed">
+                  <a data-bs-dismiss="modal" href="#" id="839ff78f-c7ad-4543-908d-42c207b62c96">
                    Bye
                   </a>
                  </div>
                 </div>
                </div>
               </div>
-              <a data-bs-toggle="modal" href="#a7ba6066-f874-4801-b3e9-4e1286b68204" id="39bcf0aa-04fb-4cbf-9841-27ebfae9bcd0" role="modal">
+              <a data-bs-toggle="modal" href="#7b771d12-b907-43f1-ae1f-1198c5beb8e6" id="4dacd97a-dd5a-4a86-8a60-935d0301c2c7" role="modal">
                Say Hello
               </a>
              </div>
@@ -597,28 +597,28 @@ Panel(dialog, anchor)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="0e321918-1e58-4e1c-b836-6466628a7a9c">
-        <div class="mt-3" id="6e658792-989a-4b59-9c31-3b7b5fef7b13">
-         <div id="73e7882d-8498-428e-94f4-79344dc24fa4">
+       <div class="tab-pane fade" id="20c26e57-0193-4719-a94f-8dc644eaf3f8">
+        <div class="mt-3" id="425c0599-dbff-4fc6-8f37-630db06aaac2">
+         <div id="93243a82-1d1d-4087-b31c-721a89724e3f">
           <div class="row">
            <div class="col-md">
-            <div id="5e8f3706-6adc-4970-90ef-e436982265b7">
-             <h1 id="99a1fb0f-7f98-44ab-b5a5-f4c8a430192e">
+            <div id="5069d1d1-2d83-4828-b853-eff6410670ff">
+             <h1 id="cfdd03ff-cfae-466b-849a-3183343320d7">
               Expand/Collapse Panel
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="05d943ea-28fc-4c01-8eb3-27f6abe2f58b">
+            <div id="c71cccaa-12b7-4dc7-b4f0-0fb2ce08072c">
             </div>
            </div>
           </div>
          </div>
-         <div id="a8e13b6c-128d-458f-a807-ebef8eef5a02">
+         <div id="d5c0dc25-b2cd-4c75-992c-74365236f9c7">
           <div class="row">
            <div class="col-md">
-            <div id="03ed1f83-ecf1-471e-b5d2-f0593805a1de">
-             <p id="5c88dbf0-5be1-4f51-a755-8e7c2e704992">
+            <div id="48577e5d-a796-4732-a4a6-944c2c50c4af">
+             <p id="8747696c-4da5-46b0-8a16-0aae8d0bb439">
               Use
               <code>
                Anchor
@@ -632,8 +632,8 @@ Panel(dialog, anchor)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="279fd5b0-cd98-4d32-8e24-03682f622ba1">
-             <pre id="1514f2be-fe63-4c63-ae50-ccd20c6a1c1e"><code class="python">from bootwrap import Panel, Anchor
+            <div id="fc2399c7-9bd6-44e7-9f5b-e4b71340e62e">
+             <pre id="e7b5a7b4-2a6b-41cc-a9bb-3caf6704da8a"><code class="python">from bootwrap import Panel, Anchor
 quote = Panel(
   "Sometimes life is going to hit you in " +
   "the head with a brick. Don’t lose faith."
@@ -642,11 +642,11 @@ Panel(
   Anchor("Steve Jobs Quote").toggle(quote),
   quote
 )</code></pre>
-             <div id="47e007ca-b8c4-4bc2-8888-8567f5886424">
-              <a data-bs-target="#4e5c419a-e127-4398-93c8-6f99888f5ace" data-bs-toggle="collapse" href="#4e5c419a-e127-4398-93c8-6f99888f5ace" id="33f55180-a585-4813-9e22-99f64373996a" role="collapse">
+             <div id="f2db8cc8-bd91-4fad-81de-621400d38757">
+              <a data-bs-target="#e0350d8c-0254-4f76-b094-0d7744378a99" data-bs-toggle="collapse" href="#e0350d8c-0254-4f76-b094-0d7744378a99" id="db344fc9-1a3f-49e9-b429-88c18c897e00" role="collapse">
                Steve Jobs Quote
               </a>
-              <div class="collapse" id="4e5c419a-e127-4398-93c8-6f99888f5ace">
+              <div class="collapse" id="e0350d8c-0254-4f76-b094-0d7744378a99">
                Sometimes life is going to hit you in the head with a brick. Don’t lose faith.
               </div>
              </div>
@@ -659,52 +659,52 @@ Panel(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="13ef66e9-7b78-4224-9de6-a9ccf35fe539">
-     <div id="629b11d8-5fd8-4651-b325-8a5b8a65387e">
+    <div class="tab-pane fade" id="d106f569-4051-48bf-9058-fce6ba43168d">
+     <div id="b49a6267-d970-4c41-99f6-9980798bb9d9">
       <hr/>
-      <ul class="nav" id="4126f4c9-a33b-4e86-b624-b6d25affe45d" role="tablist">
+      <ul class="nav" id="a3b9d6cd-acfd-4b09-831c-b58a31e84d71" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#9391d571-a1ec-44ed-9064-5c29d2647bfd" data-bs-toggle="tab" href="#9391d571-a1ec-44ed-9064-5c29d2647bfd" id="928599d4-545d-4ecb-9cc6-bde58f4d62bc" role="tab">
-         <span class="text-secondary" id="78debd31-adf7-40c4-b8f1-7e0e9f6c5fae">
+        <a class="nav-link active" data-bs-target="#2ded3fbc-c614-4eb9-9085-f2425543a76b" data-bs-toggle="tab" href="#2ded3fbc-c614-4eb9-9085-f2425543a76b" id="1deb128c-000e-4ef2-875d-b96544915c73" role="tab">
+         <span class="text-secondary" id="19b4af70-1816-47c6-969f-87f9f88d1ea4">
           Badge
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#e79ae38c-f8ae-4fd8-b9e5-47df76fda835" data-bs-toggle="tab" href="#e79ae38c-f8ae-4fd8-b9e5-47df76fda835" id="a3edaec1-f5fa-4c05-b7f2-819ccea5f20c" role="tab">
-         <span class="text-secondary" id="62830a2b-318d-4adc-a2c3-32ca91904998">
+        <a class="nav-link" data-bs-target="#bc10985f-4685-4477-892a-a409ae1fb04e" data-bs-toggle="tab" href="#bc10985f-4685-4477-892a-a409ae1fb04e" id="b234a211-7820-4bdc-9a5b-9025e014e6be" role="tab">
+         <span class="text-secondary" id="cc7a34f4-6269-4d37-8477-3ce103665344">
           Appearance
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="9391d571-a1ec-44ed-9064-5c29d2647bfd">
-        <div class="mt-5" id="4f54ed43-a413-412d-ada7-dc8518fdd165">
-         <div class="d-flex justify-content-between" id="16b2f0ef-b46a-42fb-80d1-243305bc41a2">
-          <h1 id="3aadbaaa-a5ce-4dd6-991d-2e9a21405fd4">
+       <div class="tab-pane fade active show" id="2ded3fbc-c614-4eb9-9085-f2425543a76b">
+        <div class="mt-5" id="a51511c2-2582-47cb-831b-9accd88a4fd5">
+         <div class="d-flex justify-content-between" id="11de1d3a-cb83-451a-aa54-cef97154a998">
+          <h1 id="06bec81c-bc2d-466d-bc4e-b4fe7cc00066">
            Class
-           <span class="text-primary" id="1896f2df-d4b9-45ac-97ba-644131b3bcca">
+           <span class="text-primary" id="92c3b875-55e4-45c7-a092-c6063acd3b34">
             Badge
            </span>
           </h1>
-          <div id="642ff22a-221a-43bc-96c7-b99f93be33ee">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#eb0584f3-2076-4969-8659-cd3b0596de35" data-bs-toggle="collapse" id="4e828ad9-0beb-4755-b211-4330b335a95f" onclick="return false;" type="button">
+          <div id="c7f1049d-52e2-4096-b0ea-d6ae004001cd">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#df3db57e-81c1-48e8-993f-09e6f1a79986" data-bs-toggle="collapse" id="e5a4eb05-24a3-466e-9cd6-fad27bb84e32" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="d16e7ade-f785-4a98-b493-2e692905bdda">
+         <span class="text-muted" id="20c699f1-04ae-492b-ad4c-4d9a1f465861">
           A web component for a badge.
          </span>
-         <pre id="17d7aeaa-9313-4e20-9d3f-c6b721ddb5d0"><code class="python">Badge(label)</code></pre>
-         <div class="ms-3 collapse" id="eb0584f3-2076-4969-8659-cd3b0596de35">
-          <h6 id="a3aa04bf-1197-4897-95b3-eeb97ebcc124">
+         <pre id="ec193afb-5656-4885-b915-affe31ae89c0"><code class="python">Badge(label)</code></pre>
+         <div class="ms-3 collapse" id="df3db57e-81c1-48e8-993f-09e6f1a79986">
+          <h6 id="98dbc138-8b37-441b-8912-902289835aa1">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="2be8c282-c411-4180-b776-7cc735f34b55">
+          <table class="table table-sm bg-light" id="92ecb78e-28db-4d19-9c09-b8f0039ae5d9">
            <thead>
             <tr>
              <th scope="col">
@@ -737,45 +737,45 @@ Panel(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="9d4323f8-5e34-41ab-ab38-6ce7cdf67a32">
-          <h6 id="0b2bcdc5-e020-40c7-8014-53ba096151d9">
+         <div class="ms-3" id="c764872a-5095-46fe-b4c7-12e62ae48b07">
+          <h6 id="86413797-b83c-4cd7-be8b-307a90c035f8">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="a98e805c-bfea-4bea-a0ef-601beae540fb"><code class="python">from bootwrap import Badge
+          <pre id="d4bac985-fdf8-4595-a5c7-a6190e31af30"><code class="python">from bootwrap import Badge
 Badge('Some Badge').as_dark()
 </code></pre>
          </div>
-         <div class="ms-3" id="f4a1045f-92f0-498d-a34d-dae5b5f670d2">
-          <span class="badge text-bg-dark" id="5b4b260e-ed02-4e7a-aace-be34002cb332">
+         <div class="ms-3" id="c26e5760-ea5c-4ac0-82cd-c7288134f011">
+          <span class="badge text-bg-dark" id="de98f737-b028-4f3b-9f8d-aa96de76c9b5">
            Some Badge
           </span>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="e79ae38c-f8ae-4fd8-b9e5-47df76fda835">
-        <div class="mt-3" id="49c42056-9028-47dd-827b-fdfa67153603">
-         <div id="6ae74c40-889f-401c-b5d3-f9f556c914cd">
+       <div class="tab-pane fade" id="bc10985f-4685-4477-892a-a409ae1fb04e">
+        <div class="mt-3" id="5eebf3ec-c2bd-45d8-9b54-fe2232863068">
+         <div id="e406b1dc-28eb-4e2a-b2e3-53387cc24a3f">
           <div class="row">
            <div class="col-md">
-            <div id="6d7e42f8-b41d-4409-88da-016cf69a0cb9">
-             <h1 id="26767b58-7be1-4c52-bc2f-8f0fa6bc4a2a">
+            <div id="cee22636-ee25-4cb5-9871-125b093a7616">
+             <h1 id="5c648560-196a-4f6c-9287-dce5c844f6be">
               Appearance
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="71849551-c0f7-4693-9b2e-fc9809c59290">
+            <div id="d6b08dc6-c4e8-478b-8676-6d179ac197f5">
             </div>
            </div>
           </div>
          </div>
-         <div id="a8ad652d-9ab9-4fda-9316-4ac8eaeda577">
+         <div id="a7c43c2a-e896-4979-9cfc-0d3021cba46e">
           <div class="row">
            <div class="col-md">
-            <div id="a608357f-1cf3-4ee0-9b99-bf4daa84bf88">
-             <p id="914176f4-5aad-4f53-8230-41a127bcdea0">
+            <div id="31dddeda-f727-48cf-9004-c0c013b3cf6a">
+             <p id="cff29c8b-5620-4dca-acf9-f7de35602007">
               Change
               <code>
                Badge
@@ -817,8 +817,8 @@ Badge('Some Badge').as_dark()
             </div>
            </div>
            <div class="col-md">
-            <div id="8ef61d28-7583-48db-817c-eebc2c872af3">
-             <pre id="df9a1f1a-f653-4ec7-a847-7266c5e31b29"><code class="python">from bootwrap import Panel, Badge
+            <div id="87f1e195-ca7e-4760-aca5-533ab7c84617">
+             <pre id="bcdd5617-6d06-4640-a041-0e52ae63ddb9"><code class="python">from bootwrap import Panel, Badge
 panel = Panel(
   Badge("Primary").as_primary(),
   Badge("Secondary").as_secondary(),
@@ -832,29 +832,29 @@ panel = Panel(
 for anchor in panel:
   anchor.mb(1)
 panel</code></pre>
-             <div id="3e377ec2-4e08-4be1-b887-433cc81cb04d">
-              <span class="badge text-bg-primary mb-1" id="359a28cf-d297-45e6-bb3d-21f39764c038">
+             <div id="01d716d5-e5a5-4c0e-9f63-fca2934e0358">
+              <span class="badge text-bg-primary mb-1" id="4e332031-649f-4231-8ed7-538bbbd2fd8b">
                Primary
               </span>
-              <span class="badge text-bg-secondary mb-1" id="7178baa5-dadd-42e5-8caf-3d9603ac9bf0">
+              <span class="badge text-bg-secondary mb-1" id="16cf1a8b-b52c-48de-bb9b-f0a4b0dabcbe">
                Secondary
               </span>
-              <span class="badge text-bg-success mb-1" id="d02e5160-78b6-4cc8-aabf-3277df8a9865">
+              <span class="badge text-bg-success mb-1" id="7f24c63e-435d-4b5e-a37f-ccdd35ad4502">
                Success
               </span>
-              <span class="badge text-bg-warning mb-1" id="67e40d4e-c15b-44c4-8955-3cc9ce3e996d">
+              <span class="badge text-bg-warning mb-1" id="a1a6b7a8-064f-47ae-9da1-23d6e161aee3">
                Warning
               </span>
-              <span class="badge text-bg-danger mb-1" id="967f6105-e0e8-4fb7-828d-d739a5e919d5">
+              <span class="badge text-bg-danger mb-1" id="907c0f57-0272-477b-91a1-3652f2bc3e07">
                Danger
               </span>
-              <span class="badge text-bg-info mb-1" id="386def83-d4ae-4983-8854-24cadc3fa08b">
+              <span class="badge text-bg-info mb-1" id="13fc0d5a-44b0-4c01-98ee-88399fea6f2a">
                Info
               </span>
-              <span class="badge text-bg-light mb-1" id="841b96e8-0cbb-49f0-8e54-d7b6c356a152">
+              <span class="badge text-bg-light mb-1" id="42cad176-f3f7-4aa4-887c-b3f97b1308b8">
                Light
               </span>
-              <span class="badge text-bg-dark mb-1" id="f1b2a31d-6f8b-4be8-855d-1c9330b77a18">
+              <span class="badge text-bg-dark mb-1" id="0e774b33-1ed6-4d30-8811-a188a631124f">
                Dark
               </span>
              </div>
@@ -867,101 +867,101 @@ panel</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="ea4485b2-4441-460f-af2f-665ed67ea37b">
-     <div id="6588ad08-bbda-4750-81c1-405c60347ac8">
+    <div class="tab-pane fade" id="4ea495da-0959-4d9c-9edc-4ff7356d0f06">
+     <div id="5813f40a-934d-485e-9ac5-85dae5bf825b">
       <hr/>
-      <ul class="nav" id="afe577c5-f66c-4a08-90d9-37c121d1c749" role="tablist">
+      <ul class="nav" id="e383375d-60a9-4baa-a503-b4012dc8414f" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#f2e88580-4dd9-4a87-b57c-624d7009b0b7" data-bs-toggle="tab" href="#f2e88580-4dd9-4a87-b57c-624d7009b0b7" id="45671732-d273-4295-ace9-fcf429d2d513" role="tab">
-         <span class="text-secondary" id="00bb43ab-5d8f-4dd6-8aa3-7b7bb4fd0f86">
+        <a class="nav-link active" data-bs-target="#8b6fc692-5b5a-449d-81ef-b27f46b4f36a" data-bs-toggle="tab" href="#8b6fc692-5b5a-449d-81ef-b27f46b4f36a" id="16e5a634-ac8a-4a8e-9085-9eac481f3888" role="tab">
+         <span class="text-secondary" id="ee9f4781-99ef-4ba5-b24d-f85cf8285614">
           Button
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#08a9636f-3744-4f1b-bf0d-3e152b51fc60" data-bs-toggle="tab" href="#08a9636f-3744-4f1b-bf0d-3e152b51fc60" id="0134bc4f-8b87-49a8-a5a5-97d5c03df66c" role="tab">
-         <span class="text-secondary" id="43a69259-85bc-450b-9033-10e58748bdfa">
+        <a class="nav-link" data-bs-target="#9c3d46a0-a358-4da3-961f-8a57abc8b6e0" data-bs-toggle="tab" href="#9c3d46a0-a358-4da3-961f-8a57abc8b6e0" id="b7cc1a68-6972-445d-bf21-dffa78a6f30c" role="tab">
+         <span class="text-secondary" id="41b0a9ae-cc19-4fdf-9bb7-adafb59e8eb1">
           Appearance
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#e4f64843-36c9-4fed-91aa-b83a53d9198b" data-bs-toggle="tab" href="#e4f64843-36c9-4fed-91aa-b83a53d9198b" id="bf12fc47-4b82-4dd3-918a-b1b5f7ff317e" role="tab">
-         <span class="text-secondary" id="8fde50ac-2118-4b8d-9d8b-54ac70c16dd9">
+        <a class="nav-link" data-bs-target="#4963187a-5f50-4939-ac27-b1a4d02a9e73" data-bs-toggle="tab" href="#4963187a-5f50-4939-ac27-b1a4d02a9e73" id="ab758aeb-bf0b-45b6-bbf2-488d97cec21c" role="tab">
+         <span class="text-secondary" id="80e8a3bf-729c-4c74-82d0-072efabdf12c">
           Outline
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#c878868d-36ef-499c-b8d2-df7a8bb9b93b" data-bs-toggle="tab" href="#c878868d-36ef-499c-b8d2-df7a8bb9b93b" id="ca53e1c6-5531-43fb-9b8f-8ba57c351572" role="tab">
-         <span class="text-secondary" id="990858d9-bc21-4b23-bc43-7608c88f838f">
+        <a class="nav-link" data-bs-target="#0a1c653a-003f-4f40-b787-0f6b0ae62bee" data-bs-toggle="tab" href="#0a1c653a-003f-4f40-b787-0f6b0ae62bee" id="746744fa-b575-40ee-a013-ce1c17620e40" role="tab">
+         <span class="text-secondary" id="02e8225a-4e50-4e38-9833-6791c061d59c">
           Disable
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#2059382b-5f4c-46af-a751-c2a89cd85905" data-bs-toggle="tab" href="#2059382b-5f4c-46af-a751-c2a89cd85905" id="2ec09d36-37a0-49bc-b730-8e20b9d3ebc0" role="tab">
-         <span class="text-secondary" id="ae33a8e6-7319-4731-baf0-b229cdaedb63">
+        <a class="nav-link" data-bs-target="#dd9f144a-cc8e-4b09-9ec1-aa2932f977e9" data-bs-toggle="tab" href="#dd9f144a-cc8e-4b09-9ec1-aa2932f977e9" id="3a805262-cd66-458c-814e-24cf15e4a8b1" role="tab">
+         <span class="text-secondary" id="d1f43de4-5c75-4ea1-b3ee-34e9b23a213e">
           Link Resource
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#6e3ffbba-294f-4bae-95e4-8bfa17ece646" data-bs-toggle="tab" href="#6e3ffbba-294f-4bae-95e4-8bfa17ece646" id="56f5e452-672a-4db1-bb42-e8ef66c6a0db" role="tab">
-         <span class="text-secondary" id="27d0ea6d-f25c-4a7c-a440-8d6eb23a1a93">
+        <a class="nav-link" data-bs-target="#c58c25ca-6d34-4845-a34f-1c44da8005ad" data-bs-toggle="tab" href="#c58c25ca-6d34-4845-a34f-1c44da8005ad" id="867a884e-bac8-49b6-acc7-6c6b81718dee" role="tab">
+         <span class="text-secondary" id="d0bc9dbd-0d04-425f-9a98-d14fb190f5e0">
           Open Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#75ef3940-8f11-4f2f-ac44-0339fc866cca" data-bs-toggle="tab" href="#75ef3940-8f11-4f2f-ac44-0339fc866cca" id="89418b78-8cfe-42f5-8ead-7dc468bd1480" role="tab">
-         <span class="text-secondary" id="ea69cb55-57e0-4e4a-bd31-d99aca26d273">
+        <a class="nav-link" data-bs-target="#9ee8aeb7-2b12-473c-a5da-f2f7db034b9f" data-bs-toggle="tab" href="#9ee8aeb7-2b12-473c-a5da-f2f7db034b9f" id="10acd9dc-0d03-4cc4-a47c-f13cb2b91c17" role="tab">
+         <span class="text-secondary" id="2381db43-6b2f-48c4-9e53-14f8bce6a637">
           Close Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#efd0aae4-a181-429f-a556-4d4d3758758c" data-bs-toggle="tab" href="#efd0aae4-a181-429f-a556-4d4d3758758c" id="81cf35ec-b5ae-4e47-92b1-a8bf7070f1e0" role="tab">
-         <span class="text-secondary" id="e6aa183a-779e-431f-bb00-7313835279cd">
+        <a class="nav-link" data-bs-target="#55969ab9-a4fc-41c6-ab88-3241f559babf" data-bs-toggle="tab" href="#55969ab9-a4fc-41c6-ab88-3241f559babf" id="d3837f80-e7ac-46e4-83e9-080cefd9457e" role="tab">
+         <span class="text-secondary" id="e92c60bc-63bf-47e7-a2d6-cd6f3a312175">
           Expand/Collapse Panel
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#041b8cf7-077d-4710-9cc0-f1c26ea75b87" data-bs-toggle="tab" href="#041b8cf7-077d-4710-9cc0-f1c26ea75b87" id="428a2263-9fdf-4a86-a6cf-fb6b7f0fd473" role="tab">
-         <span class="text-secondary" id="0ba108e7-8d36-49e9-a48d-e3bfdba41e70">
+        <a class="nav-link" data-bs-target="#fe1d2934-f2ab-4189-8ec6-fe589b058b19" data-bs-toggle="tab" href="#fe1d2934-f2ab-4189-8ec6-fe589b058b19" id="f04151a9-3335-42b3-8ccc-4098dd276743" role="tab">
+         <span class="text-secondary" id="48884dc9-441a-4941-95b6-f4fa42f9c060">
           Submit Action
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="f2e88580-4dd9-4a87-b57c-624d7009b0b7">
-        <div class="mt-5" id="539c18f9-a6a2-469e-9439-c45be5b31824">
-         <div class="d-flex justify-content-between" id="6460b343-d522-40c7-902c-49e108092303">
-          <h1 id="f13723bf-0df9-4343-82c8-23e4bafa0062">
+       <div class="tab-pane fade active show" id="8b6fc692-5b5a-449d-81ef-b27f46b4f36a">
+        <div class="mt-5" id="108cd228-f4ac-46d7-b506-3f67bdf6f526">
+         <div class="d-flex justify-content-between" id="02d71051-9372-4a00-8ef2-1e8f6a5afb39">
+          <h1 id="0bea56ec-89bb-4871-8e68-a80f6029472d">
            Class
-           <span class="text-primary" id="2a079cb8-3210-4c6e-91e3-e5e6bb6a75cd">
+           <span class="text-primary" id="acabed20-45f0-470b-bb82-15c654b96c4e">
             Button
            </span>
           </h1>
-          <div id="59ca7bbf-b596-486e-8907-72df03277221">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f90360e5-24c0-4058-9e9d-706097d70d47" data-bs-toggle="collapse" id="f6ee7108-b4cb-4394-a91b-fef410fe9a9c" onclick="return false;" type="button">
+          <div id="beca049f-8114-404f-ac79-b4eafe730120">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#1b546ba8-be4a-4e6c-bff6-caf27e37e732" data-bs-toggle="collapse" id="1b83977e-945c-4807-8eb4-6ba7ace88057" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="337c45b7-6096-4fac-abee-9533a3a30635">
+         <span class="text-muted" id="f6798eb3-3a95-405e-ba47-3245c5083928">
           A web component for a button.
          </span>
-         <pre id="bac7e540-322b-4729-9cf1-115bf538115f"><code class="python">Button(name)</code></pre>
-         <div class="ms-3 collapse" id="f90360e5-24c0-4058-9e9d-706097d70d47">
-          <h6 id="cc66d201-9eb2-45d2-9ca7-9c5f8d68a035">
+         <pre id="1ba35c30-22b6-4b37-8d31-7254a76cfe4a"><code class="python">Button(name)</code></pre>
+         <div class="ms-3 collapse" id="1b546ba8-be4a-4e6c-bff6-caf27e37e732">
+          <h6 id="0f13786d-b7e7-4caa-8861-8d2f9dfb2066">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="b29ca511-66fd-4a5f-b000-663114017f92">
+          <table class="table table-sm bg-light" id="1b46abce-cbdf-4dc5-99f1-ef984826d563">
            <thead>
             <tr>
              <th scope="col">
@@ -994,7 +994,7 @@ panel</code></pre>
            </tbody>
           </table>
          </div>
-         <p id="14c73690-8338-4be2-9618-5bc4ec80ca10">
+         <p id="f41e3e88-02ba-4c91-a236-004e83befb27">
           Without applying a stylized method
           <code>
            Button
@@ -1006,45 +1006,155 @@ panel</code></pre>
           </code>
           .
          </p>
-         <div class="ms-3" id="51ff616a-f977-45c7-b67f-17e630a5d510">
-          <h6 id="d1167782-2c3a-4568-8669-c519b4197b42">
+         <div class="ms-3" id="a8ab84ad-bdda-4b1a-8a50-ca20350d9c92">
+          <h6 id="81b4ea0a-d13d-466a-ba7f-75d76eebf35a">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="cbcd63d6-fda1-483e-85bf-aa86219da45a"><code class="python">from bootwrap import Button
+          <pre id="93ebcc33-0ae7-4e23-aba2-6cb48acb1599"><code class="python">from bootwrap import Button
 Button('Google Search').link('https://www.google.com/')
 </code></pre>
          </div>
-         <div class="ms-3" id="a4406860-1e09-4fcc-9c75-fdf3b6c9a25d">
-          <a class="btn" href="https://www.google.com/" id="a39ef8f4-acaa-4828-b704-db0028872075" role="button">
+         <div class="ms-3" id="d34928fd-71e2-4664-aafa-2249d21620dd">
+          <a class="btn" href="https://www.google.com/" id="8a9512fb-a7f5-4968-80ac-df0f35077f98" role="button">
            Google Search
           </a>
          </div>
+         <div class="mt-5" id="3e931016-c54b-4804-b8c4-1f8de7081f2f">
+          <div class="d-flex justify-content-between" id="581e03da-136a-4bb5-b630-a750f9db80c9">
+           <h4 id="ddbe5f7b-2601-4ae2-82e9-8f3f4b3f5c04">
+            Method
+            <span class="text-primary" id="d34dec04-50e4-449f-b1ef-9b0cd47e2ac6">
+             with_icon
+            </span>
+           </h4>
+           <div id="78a1ba2b-0dd3-45bd-8297-d87f7962b247">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f5dfd62a-e387-47d9-9f0e-6c9af896d87f" data-bs-toggle="collapse" id="54f9ced6-48ab-41fd-b4db-7eb84a3a1a98" onclick="return false;" type="button">
+             Argument
+            </button>
+           </div>
+          </div>
+          <span class="text-muted" id="5402babf-a29a-4bca-9719-f93ddbd25ba9">
+           Makes button with icon.
+          </span>
+          <pre id="d58d065e-397f-4b8f-a4ed-14f5dded4154"><code class="python">with_icon(icon, right_side=False)</code></pre>
+          <div class="ms-3 collapse" id="f5dfd62a-e387-47d9-9f0e-6c9af896d87f">
+           <h6 id="69ac66fa-84b5-4f4c-82d0-7d8b04b49fcd">
+            <strong>
+             Arguments
+            </strong>
+           </h6>
+           <table class="table table-sm bg-light" id="129d1f12-1da9-4b92-8642-57770c7a87c0">
+            <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">
+                icon
+               </i>
+              </td>
+              <td>
+               <code style="white-space: nowrap">
+                Icon
+               </code>
+              </td>
+              <td>
+               The icon to add on button.
+              </td>
+             </tr>
+             <tr>
+              <td scope="row">
+               <i style="white-space: nowrap">
+                right_side
+               </i>
+              </td>
+              <td>
+               <code style="white-space: nowrap">
+                bool
+               </code>
+              </td>
+              <td>
+               If
+               <code>
+                True
+               </code>
+               the icon is placed on the right side of the button
+                name and
+               <code>
+                False
+               </code>
+               on the right side accordingly.
+              </td>
+             </tr>
+            </tbody>
+           </table>
+          </div>
+          <div class="ms-3" id="104e05a6-f417-4ee4-99fe-e41dfb962214">
+           <h6 id="a5d8bf22-a898-4f1d-9fbd-64498c2daf42">
+            <strong>
+             Example
+            </strong>
+           </h6>
+           <pre id="ed72ae06-0f17-4e3c-aca1-896f4518611e"><code class="python">from bootwrap import Button, Icon, Panel
+ico_left = Icon("fa-solid fa-arrow-left")
+btn_left = Button("Left").with_icon(ico_left).as_primary()
+ico_right = Icon("fa-solid fa-arrow-right")
+btn_right = Button("Right").with_icon(ico_right, True).as_primary()
+Panel(btn_left, btn_right)
+</code></pre>
+          </div>
+          <div class="ms-3" id="796d4092-41de-49cd-a17c-156975c8f777">
+           <div id="f5616579-94b7-4b48-af72-9017ca2441df">
+            <button class="btn btn-primary" id="43888257-cd0f-4bc6-a691-6b27378f7c3d" onclick="return false;">
+             <i class="fa-solid fa-arrow-left" id="48ba840b-afec-44d5-977f-744ed21bae26">
+             </i>
+             Left
+            </button>
+            <button class="btn btn-primary" id="665b37ad-dc74-473f-b4f1-39f3015a3ede" onclick="return false;">
+             Right
+             <i class="fa-solid fa-arrow-right" id="1fda157f-53b0-4a2a-8bb5-f1bb2e795842">
+             </i>
+            </button>
+           </div>
+          </div>
+         </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="08a9636f-3744-4f1b-bf0d-3e152b51fc60">
-        <div class="mt-3" id="8903e182-c6c8-4cf4-8175-2e6b4169e741">
-         <div id="d50ea6a0-daa4-4960-926d-613e1d618a22">
+       <div class="tab-pane fade" id="9c3d46a0-a358-4da3-961f-8a57abc8b6e0">
+        <div class="mt-3" id="58daab91-03ce-48d2-bbc8-d1f14254351b">
+         <div id="abb89aef-56c5-4d0c-8513-42f93733dc8f">
           <div class="row">
            <div class="col-md">
-            <div id="d1101510-758b-4ce8-9b52-c39db2148721">
-             <h1 id="ac9c6145-0ef9-4039-beec-d290768f9e12">
+            <div id="ccc5c48d-5b27-42bb-b9f4-ab4c60c35057">
+             <h1 id="841c6d4b-53bf-44ff-8c5e-0c7f2c0b75f6">
               Appearance
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="c018e4b7-4833-46f3-a99b-107e83971fb3">
+            <div id="bda6651a-822e-453f-894f-d421d41b61ea">
             </div>
            </div>
           </div>
          </div>
-         <div id="fa9c8e0b-b868-4453-9edf-5354d957fdac">
+         <div id="984363fc-4b71-4837-ae86-dde6fe70d181">
           <div class="row">
            <div class="col-md">
-            <div id="18e3afb3-d620-41cf-ae88-19a663821000">
-             <p id="06c99316-b1dc-43c6-9c9c-febe29270c79">
+            <div id="eff72ec8-ce1d-4059-93ca-25242e8b3c25">
+             <p id="51122190-4d65-43e4-be3a-1e921b655e17">
               Change
               <code>
                Button
@@ -1086,8 +1196,8 @@ Button('Google Search').link('https://www.google.com/')
             </div>
            </div>
            <div class="col-md">
-            <div id="c0db7b61-a855-48ea-98e5-39edd4ca8db1">
-             <pre id="b7b518a2-fda0-4c47-a91f-6ff34e84b2c8"><code class="python">from bootwrap import Panel, Button
+            <div id="780bac40-dba8-410c-8f32-f15df71a4687">
+             <pre id="d1846317-3a49-41b2-9056-3ef7f008b744"><code class="python">from bootwrap import Panel, Button
 panel = Panel(
   Button("Primary").link("#").as_primary(),
   Button("Secondary").link("#").as_secondary(),
@@ -1101,29 +1211,29 @@ panel = Panel(
 for anchor in panel:
   anchor.mb(1)
 panel</code></pre>
-             <div id="26b2ccb3-c05f-4b4c-bdaf-0ca3eed04a12">
-              <a class="mb-1 btn btn-primary" href="#" id="514572d0-1258-4712-8ba1-4fb4eda226cf" role="button">
+             <div id="c6fc934f-c3fc-4c4a-a9d0-6f6ff81c68e5">
+              <a class="mb-1 btn btn-primary" href="#" id="3bb32772-cfd9-4262-a6da-fc79ae59f9c4" role="button">
                Primary
               </a>
-              <a class="mb-1 btn btn-secondary" href="#" id="38e6f1ed-933c-4b15-8071-57858753a0bc" role="button">
+              <a class="mb-1 btn btn-secondary" href="#" id="546c0272-bb1d-4f63-941a-12632b40a7ee" role="button">
                Secondary
               </a>
-              <a class="mb-1 btn btn-success" href="#" id="662c5288-af9c-4412-8c5f-ed2d0166afcc" role="button">
+              <a class="mb-1 btn btn-success" href="#" id="8ee124eb-438e-4c78-b075-70ad861f4bbb" role="button">
                Success
               </a>
-              <a class="mb-1 btn btn-warning" href="#" id="3eade7b8-bd69-47bf-bd50-65a1e14cf9ee" role="button">
+              <a class="mb-1 btn btn-warning" href="#" id="b6533e77-dbe3-4aa2-8db4-693295c4cfda" role="button">
                Warning
               </a>
-              <a class="mb-1 btn btn-danger" href="#" id="cea5a52e-0a4f-4b8b-82c6-d011c60f1969" role="button">
+              <a class="mb-1 btn btn-danger" href="#" id="95d889b4-2289-4c97-8c95-85c97b848ac6" role="button">
                Danger
               </a>
-              <a class="mb-1 btn btn-info" href="#" id="2605c88b-b4ae-4456-abba-f353c05a5840" role="button">
+              <a class="mb-1 btn btn-info" href="#" id="c5bbabf8-a708-4e38-957c-bfdcdc756502" role="button">
                Info
               </a>
-              <a class="mb-1 btn btn-light" href="#" id="c8f6c47a-787f-4d3a-b916-f9b87073acf2" role="button">
+              <a class="mb-1 btn btn-light" href="#" id="48eb3038-fe75-4758-8cbd-8a1a98ab7686" role="button">
                Light
               </a>
-              <a class="mb-1 btn btn-dark" href="#" id="55e28293-467d-4df9-9386-b88c05107a96" role="button">
+              <a class="mb-1 btn btn-dark" href="#" id="09c24684-19fd-4c2e-9352-0e0970faad30" role="button">
                Dark
               </a>
              </div>
@@ -1133,28 +1243,28 @@ panel</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="e4f64843-36c9-4fed-91aa-b83a53d9198b">
-        <div class="mt-3" id="c9577a88-227d-47e9-bf36-9990ad448429">
-         <div id="f397c684-21ab-458b-b33b-9f53ebfe6efc">
+       <div class="tab-pane fade" id="4963187a-5f50-4939-ac27-b1a4d02a9e73">
+        <div class="mt-3" id="6e5cbd5f-1a30-4114-b2a1-fd20e0821fcb">
+         <div id="4704c3cd-2b35-4b9f-b840-cc6b63a09820">
           <div class="row">
            <div class="col-md">
-            <div id="23d5960e-af1c-419e-9cb1-8eaf300ab65c">
-             <h1 id="ca5c2c59-6dcc-4832-a2d6-893638403982">
+            <div id="17411e12-967e-4d47-9d2a-00ae4e402ac7">
+             <h1 id="37e13cc6-10aa-4ffa-a12c-9850722769d2">
               Outline
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="66900628-d39c-40d6-b8ee-8b4d4f1702b0">
+            <div id="8f14e8d9-75f5-442d-bb09-cd2b698c939b">
             </div>
            </div>
           </div>
          </div>
-         <div id="d3877ff3-2815-4ec3-b711-d4b3b4c9a163">
+         <div id="69fabf99-5b5c-439b-a71c-1375d33978e7">
           <div class="row">
            <div class="col-md">
-            <div id="d1a579af-1ae3-4500-a479-7aae3d717d66">
-             <p id="31955c4b-449e-4fb0-966c-ca1bacca482c">
+            <div id="5d75de91-32e7-4ebd-a233-c5bc462362c6">
+             <p id="164233a8-ec55-4b25-b4a2-044c05676e43">
               Make
               <code>
                Button
@@ -1168,8 +1278,8 @@ panel</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="72934cee-0852-4749-b2a4-570c36b49f60">
-             <pre id="c29ce850-47bd-4c05-8090-6e26d69c3aa6"><code class="python">from bootwrap import Panel, Button
+            <div id="b82d8c7e-8621-41d3-afee-35b84e38a601">
+             <pre id="d610a873-8f81-4757-a6a5-ead94095c693"><code class="python">from bootwrap import Panel, Button
 panel = Panel(
   Button("Primary").link("#").as_primary().as_outline(),
   Button("Secondary").link("#").as_secondary().as_outline(),
@@ -1183,29 +1293,29 @@ panel = Panel(
 for anchor in panel:
   anchor.mb(1)
 panel</code></pre>
-             <div id="08d799b8-00a4-4024-9719-7814840ff91b">
-              <a class="mb-1 btn btn-outline-primary" href="#" id="b1d3d246-bb53-46a3-96ee-ef1beaa7c335" role="button">
+             <div id="8d97acef-f8fc-4349-b126-ec2d9ad9912b">
+              <a class="mb-1 btn btn-outline-primary" href="#" id="8666faef-54db-4674-8629-e5de2224e61f" role="button">
                Primary
               </a>
-              <a class="mb-1 btn btn-outline-secondary" href="#" id="d3a06fa9-0807-40dc-bf38-1457fbe3ecdd" role="button">
+              <a class="mb-1 btn btn-outline-secondary" href="#" id="e8716a2b-51e8-4457-b460-6eb29a9c248d" role="button">
                Secondary
               </a>
-              <a class="mb-1 btn btn-outline-success" href="#" id="24de76c2-c75b-4af9-99d7-3634f6214455" role="button">
+              <a class="mb-1 btn btn-outline-success" href="#" id="3b4f0339-ec32-46ca-a60f-cb9f01b9ee73" role="button">
                Success
               </a>
-              <a class="mb-1 btn btn-outline-warning" href="#" id="4004c55d-6753-44d1-9146-764fe8ab47bb" role="button">
+              <a class="mb-1 btn btn-outline-warning" href="#" id="28c092f3-dfe0-49df-b405-f791a6cc384a" role="button">
                Warning
               </a>
-              <a class="mb-1 btn btn-outline-danger" href="#" id="1c3123ca-231a-4c9e-8664-effa2990d16c" role="button">
+              <a class="mb-1 btn btn-outline-danger" href="#" id="4c94c7b9-cc68-426a-a0a6-14dae109552d" role="button">
                Danger
               </a>
-              <a class="mb-1 btn btn-outline-info" href="#" id="6adea871-4c42-43e2-92d8-ac7e53bf9cc8" role="button">
+              <a class="mb-1 btn btn-outline-info" href="#" id="945a51b4-c1eb-4dd1-8d58-c998eb1d6f46" role="button">
                Info
               </a>
-              <a class="mb-1 btn btn-outline-light" href="#" id="42855bd8-1b85-4284-95b2-94e58894210e" role="button">
+              <a class="mb-1 btn btn-outline-light" href="#" id="49fb6fc4-9b6a-40b9-b527-cccd57597c3d" role="button">
                Light
               </a>
-              <a class="mb-1 btn btn-outline-dark" href="#" id="1112f4d8-a7b7-4480-9118-cab4db365af0" role="button">
+              <a class="mb-1 btn btn-outline-dark" href="#" id="8cfda709-28e5-45f8-bb00-ad1b86343865" role="button">
                Dark
               </a>
              </div>
@@ -1215,28 +1325,28 @@ panel</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="c878868d-36ef-499c-b8d2-df7a8bb9b93b">
-        <div class="mt-3" id="fe6da7f9-e245-486a-ad53-91f857acbbbb">
-         <div id="f43b082a-f0a9-4320-a858-dd8c6d79cb0b">
+       <div class="tab-pane fade" id="0a1c653a-003f-4f40-b787-0f6b0ae62bee">
+        <div class="mt-3" id="b31e9836-6ca8-405d-8625-8ed324246a3c">
+         <div id="1036b749-52b3-423d-bdf2-df46ea8a558e">
           <div class="row">
            <div class="col-md">
-            <div id="8c7c6eb6-60ea-47a5-a9ec-9accd9944af0">
-             <h1 id="0d660e47-9bc2-4015-959f-443874d563e4">
+            <div id="20afd46b-3b20-48d4-9e47-21d7dc4c1eb2">
+             <h1 id="60ffe662-b24e-4f0f-9231-a24b0b9e3f78">
               Disable
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="3da21e9f-6b38-4dd2-aeec-c1a1f06017e9">
+            <div id="1c9b3e2d-5fd0-42f0-87cc-8e79cab8aee6">
             </div>
            </div>
           </div>
          </div>
-         <div id="0184d272-609a-4c18-b664-4648ddfc16da">
+         <div id="1aafe6c5-5bb4-4c7d-87a5-97ddb8dd5307">
           <div class="row">
            <div class="col-md">
-            <div id="732defa0-da99-4d7c-9416-adbf5636cbb1">
-             <p id="02ca02b0-e7e0-4ffc-aa40-f9a1582695f3">
+            <div id="979eab6f-ead8-46ba-a860-1236d624264b">
+             <p id="d137c2b6-9f9c-4f00-845c-139677c08276">
               But default the
               <code>
                Button
@@ -1258,17 +1368,17 @@ panel</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="b9325c18-d6c0-4d50-9ad3-cda8769133c8">
-             <pre id="c88f51ea-05f2-40af-9b4a-fb48dfd2f785"><code class="python">from bootwrap import Panel, Button
+            <div id="6fe4ae82-aff1-4f91-b5c9-c683427196cd">
+             <pre id="777686ea-f88e-48df-8820-96f3e83469cd"><code class="python">from bootwrap import Panel, Button
 Panel(
   Button("Enabled").as_primary(),
   Button("Disabled").as_primary().as_disabled()
 )</code></pre>
-             <div id="0632bdea-785d-416f-b599-be45357848ea">
-              <button class="btn btn-primary" id="43527bda-e02b-4d5d-a0d8-967e3ec2d173" onclick="return false;">
+             <div id="5573aed6-70bb-4bac-91b1-ee224f390179">
+              <button class="btn btn-primary" id="73892136-55bc-43df-ac43-0f5986552ab0" onclick="return false;">
                Enabled
               </button>
-              <button class="btn btn-primary" disabled="" id="7d106ad3-d44d-409a-840a-940ea01d2a23" onclick="return false;">
+              <button class="btn btn-primary" disabled="" id="30c730d3-0b46-471f-9a66-f79095d6797d" onclick="return false;">
                Disabled
               </button>
              </div>
@@ -1278,28 +1388,28 @@ Panel(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="2059382b-5f4c-46af-a751-c2a89cd85905">
-        <div class="mt-3" id="987eec4a-6abd-4491-bffc-940e474b5029">
-         <div id="9b016cfa-20c6-4f65-90b4-10fe53bba8c5">
+       <div class="tab-pane fade" id="dd9f144a-cc8e-4b09-9ec1-aa2932f977e9">
+        <div class="mt-3" id="f6a0edd4-0f1d-4f33-a6c3-734fdead0abd">
+         <div id="21ab02fe-681e-4499-a57c-163b730c7d5a">
           <div class="row">
            <div class="col-md">
-            <div id="0a29b5df-f3dd-4154-b5bc-4547f29d8f99">
-             <h1 id="39bd5d8c-3f1b-4c88-9605-d75ede6aa980">
+            <div id="25f0a294-0369-486c-bc75-b2dbb425f5d6">
+             <h1 id="82f5c02a-6612-48cd-9427-b8a4dba71cad">
               Link Resource
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="a1970ea2-aa4f-4636-b496-9e50712decda">
+            <div id="2d6c43f3-2554-4534-8eed-a1284e25d4b4">
             </div>
            </div>
           </div>
          </div>
-         <div id="8e899ad4-0f2e-4cc9-95c4-72286e0b7bcc">
+         <div id="f4f42580-dd59-4c09-b413-144724c83c83">
           <div class="row">
            <div class="col-md">
-            <div id="ae50f3d9-d3c0-4a86-8053-9eb547bc02b0">
-             <p id="8b0a0b49-5317-439a-b97e-a36bd3b29a53">
+            <div id="e61d83c8-f149-4d28-b81c-96a98b3b46cf">
+             <p id="b7d1cefa-f36a-408c-9d74-dc416526e2ea">
               Associate
               <code>
                Button
@@ -1313,13 +1423,13 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="f58c45df-39aa-4681-9288-42645d6ada8d">
-             <pre id="5fe7bbfb-ae00-4aaf-9983-21a22ec27524"><code class="python">from bootwrap import Panel, Button
+            <div id="9f8b5ead-4116-41be-a8ac-833a96a08d5b">
+             <pre id="a52199a8-bf3a-4332-b9ef-09d0f8f4797b"><code class="python">from bootwrap import Panel, Button
 Panel(
     Button("Google Search").as_primary().link("https://www.google.com/")
 )</code></pre>
-             <div id="4b51b08a-71d1-415f-82a7-ab258c593f6a">
-              <a class="btn btn-primary" href="https://www.google.com/" id="d33bf29f-e94a-4362-a53f-514a773fe246" role="button">
+             <div id="90041df4-e0a5-424b-9e78-1c259ce57a09">
+              <a class="btn btn-primary" href="https://www.google.com/" id="da319724-95f4-47ff-9968-eb8fb0601818" role="button">
                Google Search
               </a>
              </div>
@@ -1329,28 +1439,28 @@ Panel(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="6e3ffbba-294f-4bae-95e4-8bfa17ece646">
-        <div class="mt-3" id="81db021c-7b6e-461e-9d8f-c3918171ba33">
-         <div id="ad8e0c11-25f2-489d-94bd-c48908fd12fd">
+       <div class="tab-pane fade" id="c58c25ca-6d34-4845-a34f-1c44da8005ad">
+        <div class="mt-3" id="9a092e13-0540-4a5e-b0b8-f540f20dfb34">
+         <div id="70125a4d-22bb-43ad-8c85-879037edaa74">
           <div class="row">
            <div class="col-md">
-            <div id="e1e09ca8-8d9c-4af0-88f1-372c0ba9d233">
-             <h1 id="aa8edb1c-c95c-4737-b29a-b0a5228ec174">
+            <div id="a0908bb5-fdc6-4be5-ad48-8b4c73b97d8f">
+             <h1 id="b36e296f-1f3e-4c0a-b335-b22aa6a251b2">
               Open Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="232d1e34-e2cf-4c83-a2e1-96f20a6e6a20">
+            <div id="f4406bf2-c200-4940-a0e5-376f3e4d1f99">
             </div>
            </div>
           </div>
          </div>
-         <div id="3930dd5a-a0dc-4b57-9984-958e221e70dc">
+         <div id="cf431942-19e2-4c52-8ee3-cb8eb4a7d9e3">
           <div class="row">
            <div class="col-md">
-            <div id="1a6ad96f-7bd8-494b-9d67-131a6e20c8e7">
-             <p id="8369d829-c9bc-45fe-854e-0d71c7fca1cb">
+            <div id="e5164097-30e8-4427-91e0-3b13fbf52039">
+             <p id="2cff12ad-a739-4681-ae10-de18fc411636">
               Use
               <code>
                Button
@@ -1364,16 +1474,16 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="db86e59a-b39f-4c92-8ccc-b9a438bf1a69">
-             <pre id="48402332-1837-49c1-8943-a9fb7cf3cd61"><code class="python">from bootwrap import Panel, Dialog, Button
+            <div id="b37e5b90-2c72-4dfa-82f5-d588e6bc9124">
+             <pre id="23faefee-48bb-405b-83e1-0a1b735872b8"><code class="python">from bootwrap import Panel, Dialog, Button
 dialog = Dialog(
   "Greeting",
   "Hello World!"
 )
 button = Button("Say Hello").as_primary().toggle(dialog)
 Panel(dialog, button)</code></pre>
-             <div id="6b17921d-f939-4159-b324-c4dde68e0343">
-              <div class="modal" id="763ca73c-dc37-4fdd-aff8-54fb249119d1">
+             <div id="31555341-7454-4582-8364-e65c60f9d2ec">
+              <div class="modal" id="804eae20-d16b-41ba-a62c-e7d85b940ecf">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -1389,7 +1499,7 @@ Panel(dialog, button)</code></pre>
                 </div>
                </div>
               </div>
-              <button class="btn btn-primary" data-bs-target="#763ca73c-dc37-4fdd-aff8-54fb249119d1" data-bs-toggle="modal" id="c01b5d69-0c89-4fec-9013-f0e00cc3b667" onclick="return false;" type="button">
+              <button class="btn btn-primary" data-bs-target="#804eae20-d16b-41ba-a62c-e7d85b940ecf" data-bs-toggle="modal" id="f829ab66-e44f-4192-bcc3-c6bbbb2efa80" onclick="return false;" type="button">
                Say Hello
               </button>
              </div>
@@ -1399,28 +1509,28 @@ Panel(dialog, button)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="75ef3940-8f11-4f2f-ac44-0339fc866cca">
-        <div class="mt-3" id="3f35db3b-a735-4f3f-88a1-1f7e6cf6acf4">
-         <div id="2abc1ea3-5280-4350-b413-2f87393e6abe">
+       <div class="tab-pane fade" id="9ee8aeb7-2b12-473c-a5da-f2f7db034b9f">
+        <div class="mt-3" id="32bfd0cc-255d-4d62-8780-aa8f6ac0677f">
+         <div id="5782e494-1aef-4ea0-b6e0-aed79cbe12bd">
           <div class="row">
            <div class="col-md">
-            <div id="f86762e2-b436-4876-bbb9-88c3883c1e06">
-             <h1 id="a23a9826-2bac-43b5-aa3e-4d5b115c99e4">
+            <div id="9cdd8904-47ae-4b68-b93d-e9f1e9581c3e">
+             <h1 id="b85511f0-9c33-4131-9df3-f53957d23069">
               Close Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="6ec230db-059a-45f4-85b5-4a619b5c0e53">
+            <div id="a3d644d5-dff9-4f77-bd82-888222fdb54e">
             </div>
            </div>
           </div>
          </div>
-         <div id="83ea245a-8e08-4edc-a288-990e487d26e0">
+         <div id="1364e3a4-1a86-44f8-86e5-57b910d873c5">
           <div class="row">
            <div class="col-md">
-            <div id="2f04b2af-a76c-4dce-9956-cd84e304ed46">
-             <p id="3194d7a1-68aa-4c84-bea2-d9a2ac3eaa9f">
+            <div id="5ba617f3-c14d-4788-adc6-d875ecee06d8">
+             <p id="fb6a270a-eb81-4d85-9f54-8f1fddc339f1">
               Use
               <code>
                Button
@@ -1434,8 +1544,8 @@ Panel(dialog, button)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="9bc226b5-b294-46e8-bed2-cd93431a3813">
-             <pre id="2ddbebd9-7908-4be9-9ea1-5be2067b2fb6"><code class="python">from bootwrap import Panel, Dialog, Button
+            <div id="9ac828b5-d55b-4305-bc57-f803f5984d11">
+             <pre id="537bb506-10ed-426b-9d4a-a35875700247"><code class="python">from bootwrap import Panel, Dialog, Button
 dialog = Dialog(
   "Greeting",
   "Hello World!",
@@ -1443,8 +1553,8 @@ dialog = Dialog(
 )
 button = Button("Say Hello").as_primary().toggle(dialog)  
 Panel(dialog, button)</code></pre>
-             <div id="42794102-79e4-4ccd-b73a-17b4f1f04a3c">
-              <div class="modal" id="ace4c863-ee7a-4274-8598-a4e1c932e51e">
+             <div id="be26e808-7b47-4ec7-90de-267986874fec">
+              <div class="modal" id="29b44523-0630-4780-aa84-87815517f605">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -1458,14 +1568,14 @@ Panel(dialog, button)</code></pre>
                   Hello World!
                  </div>
                  <div class="modal-footer">
-                  <button class="btn btn-primary" data-bs-dismiss="modal" id="63dd0f03-dc4f-46d2-bd94-82efccb544eb" onclick="return false;" type="button">
+                  <button class="btn btn-primary" data-bs-dismiss="modal" id="f1574926-3e55-427f-8e2e-02014fa8e4dc" onclick="return false;" type="button">
                    Bye
                   </button>
                  </div>
                 </div>
                </div>
               </div>
-              <button class="btn btn-primary" data-bs-target="#ace4c863-ee7a-4274-8598-a4e1c932e51e" data-bs-toggle="modal" id="cc6aa501-deb9-4ce0-9bbd-b08e2e6f67e3" onclick="return false;" type="button">
+              <button class="btn btn-primary" data-bs-target="#29b44523-0630-4780-aa84-87815517f605" data-bs-toggle="modal" id="0a933048-dd33-4267-8c05-8ba553811a0a" onclick="return false;" type="button">
                Say Hello
               </button>
              </div>
@@ -1475,28 +1585,28 @@ Panel(dialog, button)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="efd0aae4-a181-429f-a556-4d4d3758758c">
-        <div class="mt-3" id="a9008335-eaa2-4d06-bbdb-f3797adffaf2">
-         <div id="32d122ec-61be-40cf-b5b4-2ecad2ca9eb5">
+       <div class="tab-pane fade" id="55969ab9-a4fc-41c6-ab88-3241f559babf">
+        <div class="mt-3" id="07dfb750-1390-497d-96b9-43d20d091185">
+         <div id="6c65d932-7101-445b-bbb5-9d81a4b47773">
           <div class="row">
            <div class="col-md">
-            <div id="5e6f2654-3709-4d71-b408-eee3858305cd">
-             <h1 id="4c260621-678b-4723-9c96-0740dad8d3f5">
+            <div id="6a994f58-fc85-4ef7-8b0e-6b7946a7ba5b">
+             <h1 id="b5577b4e-125b-4bde-85fb-1cba724782ec">
               Expand/Collapse Panel
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="f7e8c8a2-2dbe-4487-8c47-1dd99e0ff5f1">
+            <div id="5ff00142-4aa4-40bc-8f51-3da07bf5eddb">
             </div>
            </div>
           </div>
          </div>
-         <div id="638b3923-0606-4b2a-93d0-15829dbd3b67">
+         <div id="7f3267cf-34c7-4007-9d2a-2002b42084ae">
           <div class="row">
            <div class="col-md">
-            <div id="63b013e5-a532-4133-887e-727c9cca459d">
-             <p id="89985dc4-29bc-4c4f-97bf-7028e7442b63">
+            <div id="d5579949-9e0a-4709-8384-34a1d86a0e4f">
+             <p id="fb069c9c-44e8-48f3-9044-239e5f0a53a0">
               Use
               <code>
                Button
@@ -1510,8 +1620,8 @@ Panel(dialog, button)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="0815d618-d844-4ae8-bad2-398091f37010">
-             <pre id="dee43f26-ba87-4daa-b7ef-dcf05e0e2203"><code class="python">from bootwrap import Panel, Button
+            <div id="338d1d54-1b60-45e9-89ca-e3a4dfa1f168">
+             <pre id="9fb7a437-a094-418d-a017-27568989aa9e"><code class="python">from bootwrap import Panel, Button
 quote = Panel(
   "Sometimes life is going to hit you in " +
   "the head with a brick. Don’t lose faith."
@@ -1520,11 +1630,11 @@ Panel(
   Button("Steve Jobs Quote").as_primary().toggle(quote),
   quote
 )</code></pre>
-             <div id="4f0f986f-d2b1-4861-b2bf-d3f0a45aff84">
-              <button class="btn btn-primary" data-bs-target="#39d32883-ffa6-40df-9fbf-9d6cadcabfc1" data-bs-toggle="collapse" id="689e440f-ab0c-4566-84a6-be470b2dfc69" onclick="return false;" type="button">
+             <div id="9607d9cb-aeaf-4f2f-aafa-12923ea5ffed">
+              <button class="btn btn-primary" data-bs-target="#5a073e32-e2c6-4f28-b022-c32fafcef6b0" data-bs-toggle="collapse" id="e4ba141c-09d4-4e11-90ce-9cb54cf1edec" onclick="return false;" type="button">
                Steve Jobs Quote
               </button>
-              <div class="collapse" id="39d32883-ffa6-40df-9fbf-9d6cadcabfc1">
+              <div class="collapse" id="5a073e32-e2c6-4f28-b022-c32fafcef6b0">
                Sometimes life is going to hit you in the head with a brick. Don’t lose faith.
               </div>
              </div>
@@ -1534,28 +1644,28 @@ Panel(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="041b8cf7-077d-4710-9cc0-f1c26ea75b87">
-        <div class="mt-3" id="3dd0dffd-aa6e-453a-b0cb-668acb767e30">
-         <div id="37dd99a5-89e1-4a85-bd1b-581cb529a7bd">
+       <div class="tab-pane fade" id="fe1d2934-f2ab-4189-8ec6-fe589b058b19">
+        <div class="mt-3" id="954631c0-87d7-43e5-bdd0-b82b2d3335c5">
+         <div id="1781be95-52aa-41dc-b6d9-e3ae21e6323a">
           <div class="row">
            <div class="col-md">
-            <div id="32890911-61bd-4d40-a2aa-8b3490b6a12f">
-             <h1 id="b7342da2-3886-438e-8954-dce8e829ee24">
+            <div id="ab818c79-7881-4028-8fd9-130ee6e590da">
+             <h1 id="a7d44c03-00f5-45d2-8079-5fb449b722fb">
               Submit Action
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="6dfe016c-02de-48ae-b7da-7c9e16e2f141">
+            <div id="b92d26ad-be7c-4126-ac62-4f3c86dcc16b">
             </div>
            </div>
           </div>
          </div>
-         <div id="bab9b7bf-02c2-451e-b0b7-59df0f100b5f">
+         <div id="ce0c5c6c-59de-4805-bd6a-eec24ba148e8">
           <div class="row">
            <div class="col-md">
-            <div id="d11cb4e6-639d-4574-8832-2b31b3fea443">
-             <p id="ba831d04-af58-443c-ab89-5a7d188114b1">
+            <div id="27ba1c68-09c7-4b59-af39-a91dac3e1f4f">
+             <p id="3cbbc881-c861-42a5-a694-ea1ecc8e13d8">
               Use
               <code>
                Button
@@ -1566,7 +1676,7 @@ Panel(
               </code>
               function.
              </p>
-             <p id="c4fa6923-f2ec-4501-a123-be7e9d39861c">
+             <p id="e13a3f5a-bf21-44af-be9a-a6580a44d90d">
               <strong>
                Note:
               </strong>
@@ -1587,22 +1697,22 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="a5e3eecf-619b-4cde-b537-0537ae2d2a49">
-             <pre id="e86fd5f9-0481-4f31-b928-080f8b574b53"><code class="python">from bootwrap import Form, TextInput, Button
+            <div id="58eb91ad-bf6e-4c93-9177-7a131e6cdf41">
+             <pre id="d4ffc983-8196-41a9-b55b-4ffb6c131e65"><code class="python">from bootwrap import Form, TextInput, Button
 Form(
   TextInput("Email", "email", "my@email.com").for_email(),
   Button("Send").as_primary().submit()
 )</code></pre>
-             <form enctype="multipart/form-data" id="c330d4a8-a867-47e3-94ab-922c958ca7f9" method="POST">
+             <form enctype="multipart/form-data" id="9917a7d5-d65c-4fec-ac7e-3a97ceabf059" method="POST">
               <div class="form-group row">
-               <label class="col-sm-4 col-form-label d-flex align-items-center" for="dad919ce-1c04-43aa-9043-18b9de97d034">
+               <label class="col-sm-4 col-form-label d-flex align-items-center" for="9555ef21-7547-4883-b973-7f01fb1bdc8d">
                 Email
                </label>
                <div class="col-sm-8 d-flex align-items-center">
-                <input class="form-control" id="dad919ce-1c04-43aa-9043-18b9de97d034" name="email" type="email" value="my@email.com"/>
+                <input class="form-control" id="9555ef21-7547-4883-b973-7f01fb1bdc8d" name="email" type="email" value="my@email.com"/>
                </div>
               </div>
-              <button class="btn btn-primary" id="dafec2ae-da92-452b-9d28-21a3778ac359" type="submit">
+              <button class="btn btn-primary" id="39f57dfa-1de6-4f33-9254-272d84ee7f17" type="submit">
                Send
               </button>
              </form>
@@ -1615,59 +1725,59 @@ Form(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="a7561d6b-0dbd-4ba9-bffe-cd220a3fcf10">
-     <div id="7bb022d6-eee7-49dc-8240-352b4018e565">
+    <div class="tab-pane fade" id="4592d56a-4ba2-4882-aaf1-4b0520e27308">
+     <div id="00cd5dbf-9077-41ca-9b27-b9e65ff9e676">
       <hr/>
-      <ul class="nav" id="feba0731-430b-4b9d-9868-0514c3869ba4" role="tablist">
+      <ul class="nav" id="3b917033-2d20-47b9-bfde-413b215ef0d8" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#5fc98093-e531-4113-ba3c-61765b6dd2b2" data-bs-toggle="tab" href="#5fc98093-e531-4113-ba3c-61765b6dd2b2" id="b1e03c69-2212-4e92-8862-7e3550e42105" role="tab">
-         <span class="text-secondary" id="fef75874-978f-4eed-ba40-b42f4dfa8c17">
+        <a class="nav-link active" data-bs-target="#26fd8466-a9e4-46b9-9093-02bceee3da20" data-bs-toggle="tab" href="#26fd8466-a9e4-46b9-9093-02bceee3da20" id="f6606e92-6846-457d-a42c-1327602f0d31" role="tab">
+         <span class="text-secondary" id="e433a57d-e82b-4398-8d6c-cc241ff20886">
           ButtonGroup
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#a5637b5c-ce3e-4937-9195-2a92d75b498a" data-bs-toggle="tab" href="#a5637b5c-ce3e-4937-9195-2a92d75b498a" id="567fd392-7ad7-45d9-be9a-e3756aba0a99" role="tab">
-         <span class="text-secondary" id="3ef9aee6-ad6d-423a-818d-921a442adca3">
+        <a class="nav-link" data-bs-target="#7b54797c-e5d4-4296-8a47-29d4039c03f6" data-bs-toggle="tab" href="#7b54797c-e5d4-4296-8a47-29d4039c03f6" id="35fc611e-34a8-4543-9640-0f81f6f8bada" role="tab">
+         <span class="text-secondary" id="425b12d1-ddfa-4fe3-8623-1e006e8fe2a6">
           As check boxes
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#e927f06f-dcbe-4ab1-bf0f-bbc5b77d6440" data-bs-toggle="tab" href="#e927f06f-dcbe-4ab1-bf0f-bbc5b77d6440" id="87a5830f-9a64-4f60-a57a-960316fca9ec" role="tab">
-         <span class="text-secondary" id="939d536b-34a4-49b1-992b-f06c59b2d877">
+        <a class="nav-link" data-bs-target="#7d5c0aa5-b3e3-494b-b5ba-e14f96d25177" data-bs-toggle="tab" href="#7d5c0aa5-b3e3-494b-b5ba-e14f96d25177" id="591b2c76-9a14-4b07-affb-a1d3adcca07d" role="tab">
+         <span class="text-secondary" id="26e4077a-5ff7-4c1e-bd7e-fe9e3be790c7">
           As radio buttons
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="5fc98093-e531-4113-ba3c-61765b6dd2b2">
-        <div class="mt-5" id="534e56d9-387e-4e20-8425-5ce0105eedc8">
-         <div class="d-flex justify-content-between" id="037a4fb2-0972-4c3f-b1c5-04a84f57757c">
-          <h1 id="57b6c1c4-9e52-4909-8740-7e834353a89e">
+       <div class="tab-pane fade active show" id="26fd8466-a9e4-46b9-9093-02bceee3da20">
+        <div class="mt-5" id="907a8d7c-b9d7-4c5f-a4d6-3c2c5f75675d">
+         <div class="d-flex justify-content-between" id="30adce36-8c53-4f6e-8bca-286c8e33b59c">
+          <h1 id="5da6f56f-acfd-4815-8341-09a1c69222d5">
            Class
-           <span class="text-primary" id="a08f0727-d83f-4fef-818e-9024d5be78f1">
+           <span class="text-primary" id="b1da38c6-bc88-4892-9805-238bedc011a5">
             ButtonGroup
            </span>
           </h1>
-          <div id="360b1be8-7bd5-48d5-a828-e3d41f5627b4">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#272d43eb-49dd-4cce-acc5-3e39189f16c8" data-bs-toggle="collapse" id="51303f3e-9ebd-4fb4-898e-d7bb1bd362d7" onclick="return false;" type="button">
+          <div id="08319100-6497-47f6-91ac-8ebcc7aa81da">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#2f8e841d-1b61-4b89-8bf7-bc2270e607b3" data-bs-toggle="collapse" id="f9bbac85-c471-46d8-9816-5c83f77fa97b" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="8ad447e3-6c85-47ed-96ed-f629a14edf9d">
+         <span class="text-muted" id="6ab62b05-17e1-4d6c-93af-cf67c6bf2301">
           A web component for a button group.
          </span>
-         <pre id="680ffc4e-cb9c-4a4c-93bf-7c4c0c40248f"><code class="python">ButtonGroup(*buttons)</code></pre>
-         <div class="ms-3 collapse" id="272d43eb-49dd-4cce-acc5-3e39189f16c8">
-          <h6 id="63fa0845-0a5e-4353-b9b2-5cf121ede7f2">
+         <pre id="6e4d3187-90ee-4ece-b5e9-200cea042948"><code class="python">ButtonGroup(*buttons)</code></pre>
+         <div class="ms-3 collapse" id="2f8e841d-1b61-4b89-8bf7-bc2270e607b3">
+          <h6 id="d678535d-2a57-4503-a052-d8fd0be5c72a">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="df8ef52c-9338-490d-b9c5-840468458128">
+          <table class="table table-sm bg-light" id="d592a20c-3aad-4ac7-89b8-a5b3cc44bb5d">
            <thead>
             <tr>
              <th scope="col">
@@ -1704,17 +1814,17 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="bab0fa3c-c0e3-4434-bbe0-a0365f13bb4c">
+         <p id="49bae047-51c8-45ca-acc3-0bb693db4dcd">
           Group a series of buttons together on a single line or stack them in
     a vertical column.
          </p>
-         <div class="ms-3" id="e4e9206b-1567-441a-baa5-fc74cf6e7404">
-          <h6 id="dbba2bfa-64d0-4f70-a3ad-403295c025ac">
+         <div class="ms-3" id="7926f139-cf2d-4eed-9261-d45ede938db1">
+          <h6 id="4965a978-8236-476f-b943-12407752b28c">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="e5292628-2abd-42a3-b963-4df7c46db5b2"><code class="python">from bootwrap import Button, ButtonGroup
+          <pre id="c263db40-d2cd-4793-989a-7c8a144f454c"><code class="python">from bootwrap import Button, ButtonGroup
 
 button1 = Button('One').as_success()
 button2 = Button('Two').as_warning()
@@ -1723,67 +1833,67 @@ button3 = Button('Three').as_danger()
 ButtonGroup(button1, button2, button3)
 </code></pre>
          </div>
-         <div class="ms-3" id="e72a15ff-1650-4b98-bdde-d6247c47cf3a">
-          <div class="btn-group" id="233103b6-70a4-45cb-812a-97b02c448740" role="group">
-           <button class="btn btn-success" id="1c62cb0e-d925-4b32-8364-af63f910edcf" onclick="return false;">
+         <div class="ms-3" id="afa25c92-576d-44df-ba19-8b7feebf566e">
+          <div class="btn-group" id="a5f97205-3d39-4f80-bd54-ea2c9f9c7838" role="group">
+           <button class="btn btn-success" id="8e365e7d-2b97-4033-92b7-da4c756300df" onclick="return false;">
             One
            </button>
-           <button class="btn btn-warning" id="9f79f94e-9cc6-4cdf-bdb5-5a3893568472" onclick="return false;">
+           <button class="btn btn-warning" id="28f82ea0-e75a-4657-ac85-3e3d09b8939b" onclick="return false;">
             Two
            </button>
-           <button class="btn btn-danger" id="d277e3f9-42dd-43ee-b5ac-86d6915c0d86" onclick="return false;">
+           <button class="btn btn-danger" id="9c449dcc-f839-4597-8cc3-b726fefa246e" onclick="return false;">
             Three
            </button>
           </div>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="a5637b5c-ce3e-4937-9195-2a92d75b498a">
-        <div class="mt-3" id="29529a24-0e98-452e-ac2d-18caadcfea6a">
-         <div id="f9443464-446a-4691-bd0f-3d361263581e">
+       <div class="tab-pane fade" id="7b54797c-e5d4-4296-8a47-29d4039c03f6">
+        <div class="mt-3" id="385f68e5-a7b0-4a96-9561-e108f100584a">
+         <div id="1ce02fcf-73d7-4782-b7cb-8d7ab0af1863">
           <div class="row">
            <div class="col-md">
-            <div id="a8b8905b-00e2-4bf6-b3d1-ae5b96e41e37">
-             <h1 id="800efc2e-7312-47cb-9096-bc890c9cf360">
+            <div id="aa56315b-461c-4180-8b40-fe9be6a6aca7">
+             <h1 id="b42f7570-94fd-437e-a7b4-0912ada60aed">
               As check boxes
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="36bcdcbb-3c76-445d-ae9b-78a90a426a8d">
+            <div id="c211aa93-432a-431c-8434-4b29e0494e5d">
             </div>
            </div>
           </div>
          </div>
-         <div id="bf756171-db13-4031-bc44-ab88060c3268">
+         <div id="f7da76c5-a759-4ec9-aa0d-a1aff6ecc0e5">
           <div class="row">
            <div class="col-md">
-            <div id="fee234fb-7d93-4dfe-a931-d86a4aa91f5f">
-             <p id="40ee1594-8c0d-4114-8b07-2b206a98ea87">
+            <div id="71db4ee7-2e86-46c9-b60a-fdd29af67306">
+             <p id="2859938b-ef26-4fff-aa3a-65966e98a6c4">
               Group a series of buttons together, which act as check boxes.
              </p>
             </div>
            </div>
            <div class="col-md">
-            <div id="10e85e6e-68e6-411b-a65b-352762edf34c">
-             <pre id="9635d8ea-6b67-430f-b3bc-1d957d11d78a"><code class="python">from bootwrap import CheckboxInput, ButtonGroup
+            <div id="a15b51ab-b7e1-4aea-ab63-9866596108eb">
+             <pre id="cd8795c3-448a-44b0-be85-4851ff8b4569"><code class="python">from bootwrap import CheckboxInput, ButtonGroup
 
 button1 = CheckboxInput('One', 'opt1').as_button().as_secondary()
 button2 = CheckboxInput('Two', 'opt2').as_button().as_secondary()
 button3 = CheckboxInput('Three', 'opt3').as_button().as_secondary()
 
 ButtonGroup(button1, button2, button3)</code></pre>
-             <div class="btn-group" id="42dc685e-085f-477e-aa17-073201c834f0" role="group">
-              <input autocomplete="off" class="btn-check" id="2d0c03e3-9d52-438a-84ab-3f661f85c3ad" name="opt1" type="checkbox"/>
-              <label class="btn btn-secondary" for="2d0c03e3-9d52-438a-84ab-3f661f85c3ad">
+             <div class="btn-group" id="a7464c82-fa42-4436-a231-b7dabacf9fe9" role="group">
+              <input autocomplete="off" class="btn-check" id="18ef30f3-99c8-4755-bcf7-2e65e04336d9" name="opt1" type="checkbox"/>
+              <label class="btn btn-secondary" for="18ef30f3-99c8-4755-bcf7-2e65e04336d9">
                One
               </label>
-              <input autocomplete="off" class="btn-check" id="a61c1baf-2473-4d03-814b-4962227ee91a" name="opt2" type="checkbox"/>
-              <label class="btn btn-secondary" for="a61c1baf-2473-4d03-814b-4962227ee91a">
+              <input autocomplete="off" class="btn-check" id="b09bc2b7-6abc-48e3-996f-2bcc91f5722a" name="opt2" type="checkbox"/>
+              <label class="btn btn-secondary" for="b09bc2b7-6abc-48e3-996f-2bcc91f5722a">
                Two
               </label>
-              <input autocomplete="off" class="btn-check" id="02c3d1b6-4b60-4657-b3be-820e4fc7d9f6" name="opt3" type="checkbox"/>
-              <label class="btn btn-secondary" for="02c3d1b6-4b60-4657-b3be-820e4fc7d9f6">
+              <input autocomplete="off" class="btn-check" id="22afd94d-59b5-4f9f-8037-318fca3c58e9" name="opt3" type="checkbox"/>
+              <label class="btn btn-secondary" for="22afd94d-59b5-4f9f-8037-318fca3c58e9">
                Three
               </label>
              </div>
@@ -1793,52 +1903,52 @@ ButtonGroup(button1, button2, button3)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="e927f06f-dcbe-4ab1-bf0f-bbc5b77d6440">
-        <div class="mt-3" id="7db34d79-ee41-440f-a840-c27ea40ef1c7">
-         <div id="92c58913-cc23-418f-9db3-847a2b06231d">
+       <div class="tab-pane fade" id="7d5c0aa5-b3e3-494b-b5ba-e14f96d25177">
+        <div class="mt-3" id="c200bec1-15d4-46ae-84d3-a3985d8f94b2">
+         <div id="c0dbe383-3bbc-42bd-9c8b-882e141930aa">
           <div class="row">
            <div class="col-md">
-            <div id="c3298d89-e65f-4a55-9ab1-c498c30019cc">
-             <h1 id="637fd98f-6ead-41bf-ba2e-6a33c7794745">
+            <div id="54c5c4f3-b7c8-4771-87a7-06716bd57a2d">
+             <h1 id="864eadb1-16dd-4b7c-864e-ea08bfee6a29">
               As radio buttons
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="0efe2ba7-811f-4d94-a4c3-d27d95e8055d">
+            <div id="f55e1885-96ad-4748-9081-2421523a04d8">
             </div>
            </div>
           </div>
          </div>
-         <div id="4267dac8-3518-4650-bdcf-3275ef60af8d">
+         <div id="d679bfe2-4b26-4ca5-9fdd-3e454ce1c5b4">
           <div class="row">
            <div class="col-md">
-            <div id="c3a36290-4b2b-4279-9220-5c31cf9b6b64">
-             <p id="1de155ec-a022-4ff9-8481-d12be8fb0b6e">
+            <div id="7725fda6-367e-4d12-9eb7-04bb8d1dcb11">
+             <p id="78d7e1ae-39f8-4300-aaf0-a2c2294f99e4">
               Group a series of buttons together, which act as radio buttons.
              </p>
             </div>
            </div>
            <div class="col-md">
-            <div id="a79b9523-abfc-458c-945d-c99e4dccc8ff">
-             <pre id="f7e3a00d-ae67-4a16-ae41-caa3ce8b6458"><code class="python">from bootwrap import CheckboxInput, ButtonGroup
+            <div id="fd23ed82-688c-4744-bdc8-6241532c2501">
+             <pre id="3ed93e6c-14c3-495f-afbf-6a4783a6c124"><code class="python">from bootwrap import CheckboxInput, ButtonGroup
 
 button1 = CheckboxInput('One', 'opt').as_radio(1).as_button().as_secondary()
 button2 = CheckboxInput('Two', 'opt').as_radio(2).as_button().as_secondary()
 button3 = CheckboxInput('Three', 'opt').as_radio(3).as_button().as_secondary()
 
 ButtonGroup(button1, button2, button3)</code></pre>
-             <div class="btn-group" id="2578d2ef-e9c7-4b9a-b209-422205d61343" role="group">
-              <input autocomplete="off" class="btn-check" id="05c104f2-3483-4032-950f-693583ec521d" name="opt" type="radio" value="1"/>
-              <label class="btn btn-secondary" for="05c104f2-3483-4032-950f-693583ec521d">
+             <div class="btn-group" id="27a2a5da-c4dd-427e-b340-cd0dc3e2571e" role="group">
+              <input autocomplete="off" class="btn-check" id="aaa5ec16-a355-4a2f-b4c1-452906e64246" name="opt" type="radio" value="1"/>
+              <label class="btn btn-secondary" for="aaa5ec16-a355-4a2f-b4c1-452906e64246">
                One
               </label>
-              <input autocomplete="off" class="btn-check" id="ebc72a61-97be-4b24-837a-06397caab8c1" name="opt" type="radio" value="2"/>
-              <label class="btn btn-secondary" for="ebc72a61-97be-4b24-837a-06397caab8c1">
+              <input autocomplete="off" class="btn-check" id="c673feda-7d36-433e-a72d-ac94d359dbb2" name="opt" type="radio" value="2"/>
+              <label class="btn btn-secondary" for="c673feda-7d36-433e-a72d-ac94d359dbb2">
                Two
               </label>
-              <input autocomplete="off" class="btn-check" id="c85c6a08-7a4b-416c-ad77-6b6b236f81c6" name="opt" type="radio" value="3"/>
-              <label class="btn btn-secondary" for="c85c6a08-7a4b-416c-ad77-6b6b236f81c6">
+              <input autocomplete="off" class="btn-check" id="f3d4f7b8-8fb6-45e6-a19b-924afab98b36" name="opt" type="radio" value="3"/>
+              <label class="btn btn-secondary" for="f3d4f7b8-8fb6-45e6-a19b-924afab98b36">
                Three
               </label>
              </div>
@@ -1851,52 +1961,52 @@ ButtonGroup(button1, button2, button3)</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="b935673f-9175-423c-b57f-5c027ad3c20b">
-     <div id="1a7c9e3d-5b01-4ff8-ba89-1a24db74812a">
+    <div class="tab-pane fade" id="f4402903-45d7-4e3d-a187-6ebc45e41032">
+     <div id="562eb8b5-802c-4925-b817-9bc249236ff8">
       <hr/>
-      <ul class="nav" id="e2c3a098-638b-4191-b728-6c44e8b4a776" role="tablist">
+      <ul class="nav" id="7b006371-e469-4db7-99eb-e74bf72a71b4" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#ce4a7b91-e50a-4764-a6da-a104fa9d941c" data-bs-toggle="tab" href="#ce4a7b91-e50a-4764-a6da-a104fa9d941c" id="a1bec126-e894-4616-86cc-b8fe0639b214" role="tab">
-         <span class="text-secondary" id="352f6fd7-434a-4b47-b610-f7702254233c">
+        <a class="nav-link active" data-bs-target="#6de23602-4aa6-4926-871d-d5ef75f28d7a" data-bs-toggle="tab" href="#6de23602-4aa6-4926-871d-d5ef75f28d7a" id="3f70d373-d8d1-4ccf-bd11-bae74b813217" role="tab">
+         <span class="text-secondary" id="5fe2ff78-131a-42d5-8593-0da8fc1530ee">
           Deck
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#65f824b3-6035-498f-a6e6-02ad5d35ba61" data-bs-toggle="tab" href="#65f824b3-6035-498f-a6e6-02ad5d35ba61" id="4681ccc4-0eee-49cb-b39c-87168f599d98" role="tab">
-         <span class="text-secondary" id="62d2cdef-4466-4ad7-adae-e9a68a4aa349">
+        <a class="nav-link" data-bs-target="#35b04b5c-17e8-4052-802e-10759436adfe" data-bs-toggle="tab" href="#35b04b5c-17e8-4052-802e-10759436adfe" id="045a21b3-e5d0-49aa-9552-7d56157cba00" role="tab">
+         <span class="text-secondary" id="633330e1-422c-4888-8f1b-3ad15d42f0c2">
           Deck.Card
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="ce4a7b91-e50a-4764-a6da-a104fa9d941c">
-        <div class="mt-5" id="5f3e206f-0cac-43d6-aad0-bbbc1cef6894">
-         <div class="d-flex justify-content-between" id="b165d270-797f-4f09-b5b2-4da48bfd057a">
-          <h1 id="1237605b-02ce-48aa-960a-3ea38796114c">
+       <div class="tab-pane fade active show" id="6de23602-4aa6-4926-871d-d5ef75f28d7a">
+        <div class="mt-5" id="555b3b3a-d054-4e98-90c6-25df7a59f9f1">
+         <div class="d-flex justify-content-between" id="281d7d16-6ef6-4386-ae9a-168ced65f07b">
+          <h1 id="b5db2193-7266-4243-a43e-b6399da739a3">
            Class
-           <span class="text-primary" id="01539493-6264-42ec-b104-83001441ede2">
+           <span class="text-primary" id="2496a77f-8256-4eda-a956-497995def336">
             Deck
            </span>
           </h1>
-          <div id="abe18f26-3c6e-4318-8ceb-41110a900f23">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#689b645e-801c-4b49-8af5-c6f627a391eb" data-bs-toggle="collapse" id="2dc493ad-dd22-45d2-97ef-4c72d320a7d5" onclick="return false;" type="button">
+          <div id="89f580bb-d22e-4df8-a967-0dd2071c4526">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#85c0c068-0b94-4b65-9f30-be52436fb737" data-bs-toggle="collapse" id="21d19de7-2ee9-491c-8572-1d1fa39833df" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="9fa5c5af-0e95-42ad-9f80-f7bd6e875092">
+         <span class="text-muted" id="35adf36d-beb3-4984-bb74-ff24671b4876">
           A web component for a deck of cards.
          </span>
-         <pre id="c869530b-a10d-4ba7-89c8-bb215b1c42d2"><code class="python">Deck(*cards)</code></pre>
-         <div class="ms-3 collapse" id="689b645e-801c-4b49-8af5-c6f627a391eb">
-          <h6 id="a8df473b-fdb3-44a0-a997-8d63ff728b1d">
+         <pre id="47ea7ecc-c1c5-4973-bcea-6de85a6b8962"><code class="python">Deck(*cards)</code></pre>
+         <div class="ms-3 collapse" id="85c0c068-0b94-4b65-9f30-be52436fb737">
+          <h6 id="202e89a2-44b0-4772-92ec-cc29995421b1">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="e382cfc6-c6f8-46fe-8333-04304d97d324">
+          <table class="table table-sm bg-light" id="e4d13a81-3187-4e9b-994c-0f9868a7e9eb">
            <thead>
             <tr>
              <th scope="col">
@@ -1937,13 +2047,13 @@ ButtonGroup(button1, button2, button3)</code></pre>
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="20abb550-3750-4e65-aaed-e2c471b0b64c">
-          <h6 id="19de7d78-8bbd-4dd6-bcdb-420c7a802530">
+         <div class="ms-3" id="4d279a88-00ba-4032-b56f-0e7fc9ed3c37">
+          <h6 id="6471fae3-4789-4d91-bc17-b2bade17abfe">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="c431af6f-4b0c-464c-8e76-fc4a5ea5f092"><code class="python">from bootwrap import Button, Deck, Image
+          <pre id="2b7d17d7-88b9-4175-97c5-246fb2c6e849"><code class="python">from bootwrap import Button, Deck, Image
 
 actions = [
     Button("Buy"),
@@ -1976,107 +2086,107 @@ Deck(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="eb0586b5-8bb1-42ce-9406-26198c2e6c84">
-          <div class="card-deck grid-container" id="22a0a82b-e6ca-4a36-aad7-3b7c4f4c1704">
-           <div class="card" id="6330d09e-f29f-4f99-b432-a3bbe90be18a">
+         <div class="ms-3" id="d3c80e69-2972-446c-b3bf-a3a1bf58a9d7">
+          <div class="card-deck grid-container" id="a493b7be-0f99-47ed-803b-16af6c4de303">
+           <div class="card" id="e7a1b991-d15b-4655-87cd-b24d97150323">
             <a onclick="location.href='https://www.google.com';">
-             <img class="mt-3 card-img-top" id="18592913-7faa-47c8-860f-08e590245c67" src="google-logo.png" width="128"/>
+             <img class="mt-3 card-img-top" id="1862eb32-6108-4565-9d67-937045b20946" src="google-logo.png" width="128"/>
             </a>
             <div class="card-body" onclick="location.href='https://www.google.com';">
              <div class="text-right mb-2">
-              <span class="text-muted" id="034c616c-cae6-4a73-80f7-2a75c62f79f0">
+              <span class="text-muted" id="8b4f7a79-c8f7-4281-a8be-4a29067dcdfc">
                <small>
                 12:04:58 12/01/2021
                </small>
               </span>
              </div>
-             <h5 class="card-title" id="0733b275-9999-401a-ab9f-f0f7b6dc287b">
+             <h5 class="card-title" id="f4355595-1106-479e-8fa3-69942eda737b">
               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-bs-toggle="dropdown" id="9ccc8c3d-dda3-4b08-8f8b-32cee3343d83" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="36deef11-8122-469b-9a93-4005858fda95" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="cb87f3bb-b7d1-46cc-bd12-ffacc87bf4e1" onclick="return false;">
+               <button class="dropdown-item btn" id="96b83019-9b81-4891-96ef-a4a376f3ffb8" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="7d8331dd-b6b4-45bf-99e9-d15109ab2949" onclick="return false;">
+               <button class="dropdown-item btn" id="ffc9bd65-ce44-4392-ac62-29096b703c50" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="b7910fe7-1081-4155-9f67-deca703ba136" onclick="return false;">
+               <button class="dropdown-item btn" id="9afef6ef-811e-4b54-896c-a8d3b4439309" onclick="return false;">
                 Transfer
                </button>
               </div>
              </div>
             </div>
            </div>
-           <div class="card" id="3196b1f0-f00f-4407-b4a0-f8a45b2da528">
+           <div class="card" id="d352caa4-41a7-445e-85e7-4b0bbe9e472a">
             <a onclick="location.href='https://www.linkedin.com';">
-             <img class="mt-3 card-img-top" id="9faaae67-c14e-4811-a424-2d7e0b564a8a" src="linkedin-logo.png" width="128"/>
+             <img class="mt-3 card-img-top" id="328432db-9fe1-4702-9f32-ab84f48746d5" src="linkedin-logo.png" width="128"/>
             </a>
             <div class="card-body" onclick="location.href='https://www.linkedin.com';">
              <div class="text-right mb-2">
-              <span class="text-muted" id="8bc617d6-5335-47df-8a1c-398a7d8685c5">
+              <span class="text-muted" id="5dded2f4-2e4c-4b47-947a-2872de5298ae">
                <small>
                 12:04:58 12/01/2021
                </small>
               </span>
              </div>
-             <h5 class="card-title" id="9fa5eb76-648a-4322-a22d-bdea3dc0ac20">
+             <h5 class="card-title" id="6a1fa0b3-d77a-4298-8f1f-d3cd3f2f8480">
               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-bs-toggle="dropdown" id="a0711d9a-a13d-4e89-b753-8bd00ff08ff4" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="37e2da7c-3956-475c-badd-1f151896af02" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="cb87f3bb-b7d1-46cc-bd12-ffacc87bf4e1" onclick="return false;">
+               <button class="dropdown-item btn" id="96b83019-9b81-4891-96ef-a4a376f3ffb8" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="7d8331dd-b6b4-45bf-99e9-d15109ab2949" onclick="return false;">
+               <button class="dropdown-item btn" id="ffc9bd65-ce44-4392-ac62-29096b703c50" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="b7910fe7-1081-4155-9f67-deca703ba136" onclick="return false;">
+               <button class="dropdown-item btn" id="9afef6ef-811e-4b54-896c-a8d3b4439309" onclick="return false;">
                 Transfer
                </button>
               </div>
              </div>
             </div>
            </div>
-           <div class="card" id="0fdafd01-edb7-4c91-b3af-84efa60c1f32">
+           <div class="card" id="8b6cf908-03ec-4d00-a510-4ad2b0f8bdbb">
             <a onclick="location.href='https://www.amazon.com';">
-             <img class="mt-3 card-img-top" id="d28761c5-dd18-4626-9c8d-62e413c337c8" src="amazon-logo.png" width="128"/>
+             <img class="mt-3 card-img-top" id="04cc5675-e6d4-4d50-9dd9-af61a4bce5ab" src="amazon-logo.png" width="128"/>
             </a>
             <div class="card-body" onclick="location.href='https://www.amazon.com';">
              <div class="text-right mb-2">
-              <span class="text-muted" id="80410ce1-6b28-479f-a78b-3043f4ab4af9">
+              <span class="text-muted" id="9b6b9697-b5be-48b6-95db-a1491b334787">
                <small>
                 12:04:58 12/01/2021
                </small>
               </span>
              </div>
-             <h5 class="card-title" id="6cfcb12b-919c-4710-9a40-e124d49e5075">
+             <h5 class="card-title" id="561a5020-bdf9-4668-8d7f-01b4d1ba02d7">
               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-bs-toggle="dropdown" id="cd230f9a-86a0-4b3f-8d9a-df260746355f" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="1ff338b0-a0bf-425a-b01f-005c024e131d" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="cb87f3bb-b7d1-46cc-bd12-ffacc87bf4e1" onclick="return false;">
+               <button class="dropdown-item btn" id="96b83019-9b81-4891-96ef-a4a376f3ffb8" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="7d8331dd-b6b4-45bf-99e9-d15109ab2949" onclick="return false;">
+               <button class="dropdown-item btn" id="ffc9bd65-ce44-4392-ac62-29096b703c50" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="b7910fe7-1081-4155-9f67-deca703ba136" onclick="return false;">
+               <button class="dropdown-item btn" id="9afef6ef-811e-4b54-896c-a8d3b4439309" onclick="return false;">
                 Transfer
                </button>
               </div>
@@ -2092,32 +2202,32 @@ Deck(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="65f824b3-6035-498f-a6e6-02ad5d35ba61">
-        <div class="mt-5" id="afef808a-c1f7-4a50-a472-3e7da91f11e0">
-         <div class="d-flex justify-content-between" id="8a9f0330-5c70-450f-b04f-8ab38cf493c6">
-          <h1 id="68fe60bf-9e5f-4c79-a0eb-5d930000af70">
+       <div class="tab-pane fade" id="35b04b5c-17e8-4052-802e-10759436adfe">
+        <div class="mt-5" id="9e765c0c-52bf-43b7-9e3a-0e3e90bd144f">
+         <div class="d-flex justify-content-between" id="da242b26-452f-4b78-9c45-e02ec89b7034">
+          <h1 id="5bc568b6-84fc-4b7c-b1ef-8c239a9b3192">
            Class
-           <span class="text-primary" id="20f6a2fb-5633-4efb-9d6c-caacf3fdbfd1">
+           <span class="text-primary" id="c0b40928-52a1-4557-9469-9f5983259afe">
             Deck.Card
            </span>
           </h1>
-          <div id="7127e8b5-6da7-41cd-9ccc-8b8b5156f38b">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#715a7f61-684f-4821-ae8b-0968ee50b7dc" data-bs-toggle="collapse" id="4413b557-ef63-40be-ae4d-7987b119cfb3" onclick="return false;" type="button">
+          <div id="ff0ca898-32b8-44ea-b2d0-152c6ff1b7ee">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#bf0161f5-0416-4d9a-be35-cb2d9f60c8ba" data-bs-toggle="collapse" id="60d34e18-08c2-418a-9613-40cb83aff6da" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="8d723947-ee14-454f-a3f0-78616e6abb9a">
+         <span class="text-muted" id="4928523f-3ac5-434e-bdea-b1d7a6b92ec5">
           A deck card.
          </span>
-         <pre id="f5ad9dda-c3fc-442d-b972-a7404010e8ae"><code class="python">Deck.Card(title, description=None, marker=None, figure=None)</code></pre>
-         <div class="ms-3 collapse" id="715a7f61-684f-4821-ae8b-0968ee50b7dc">
-          <h6 id="1985a8cd-4d27-4649-89d1-db156052ca0c">
+         <pre id="42089851-38fc-436b-af67-70bd6e3a3911"><code class="python">Deck.Card(title, description=None, marker=None, figure=None)</code></pre>
+         <div class="ms-3 collapse" id="bf0161f5-0416-4d9a-be35-cb2d9f60c8ba">
+          <h6 id="338a1dad-6140-4da6-9abb-276ec4c3174f">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="9ff815bf-c21b-4408-9c59-0cfedee1bb44">
+          <table class="table table-sm bg-light" id="54e86c26-9bfc-4ac8-a344-ee4bbdd0a377">
            <thead>
             <tr>
              <th scope="col">
@@ -2195,13 +2305,13 @@ Deck(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="ef125425-0ed6-4ad3-ae0b-431e9f17ea84">
-          <h6 id="7e139f5b-c2d5-4ebb-82a9-b83c2701f08d">
+         <div class="ms-3" id="a886b2f3-32b8-4bfd-9ec1-fdefa5406cb2">
+          <h6 id="eae6d2dc-ab08-4e9b-85cf-bae344307235">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="3ec1465b-e16c-4910-ac77-afcaec05286b"><code class="python">from bootwrap import Button, Deck, Image
+          <pre id="86ba11e6-7345-4daa-8886-7ce5aef248bb"><code class="python">from bootwrap import Button, Deck, Image
 
 actions = [
     Button("Buy"),
@@ -2218,59 +2328,59 @@ Deck.Card(
     "https://www.google.com")
 </code></pre>
          </div>
-         <div class="ms-3" id="b6465360-e8df-47e4-a915-6e5eb7e4e871">
-          <div class="card" id="80e46db1-2462-4aa8-8426-67ee65527d18">
+         <div class="ms-3" id="5f1e0d34-7410-4350-b55a-8eeac17082bc">
+          <div class="card" id="7a22ff74-13dd-4622-8576-c972456e165d">
            <a onclick="location.href='https://www.google.com';">
-            <img class="mt-3 card-img-top" id="037c37bf-2f43-40e2-a22f-b74ee4c22e1e" src="google-logo.png" width="128"/>
+            <img class="mt-3 card-img-top" id="ec3966df-8bc5-4ba1-a98b-7541a61147c2" src="google-logo.png" width="128"/>
            </a>
            <div class="card-body" onclick="location.href='https://www.google.com';">
             <div class="text-right mb-2">
-             <span class="text-muted" id="1c6ab72c-5684-4bda-8256-40b0608af8df">
+             <span class="text-muted" id="67770daa-cb2e-4788-a058-f71004b8e027">
               <small>
                12:04:58 12/01/2021
               </small>
              </span>
             </div>
-            <h5 class="card-title" id="90e40e61-1908-4000-b8f2-04fc46ad74e4">
+            <h5 class="card-title" id="925b889b-0aa4-40c8-8c39-d7a973e38710">
              Google (NASDAQ: GOOGL)
             </h5>
             Price for a single Google share
            </div>
            <div class="card-footer text-right">
-            <button class="btn" id="deb25672-adc3-478a-a9f3-13244e7bfcaa" onclick="return false;">
+            <button class="btn" id="7c356995-0637-4cb5-9c21-d8f27e32aaf6" onclick="return false;">
              Buy
             </button>
-            <button class="btn" id="869baedf-5507-4c98-be92-bc3bc11e179f" onclick="return false;">
+            <button class="btn" id="67ae896a-8f00-4345-b80d-c0be7eeba6d1" onclick="return false;">
              Sell
             </button>
-            <button class="btn" id="6fabba7e-f696-4034-9522-d2448c8b11f4" onclick="return false;">
+            <button class="btn" id="a338eef0-c689-4969-92f4-fc428c7aeb6a" onclick="return false;">
              Transfer
             </button>
            </div>
           </div>
          </div>
-         <div class="mt-5" id="54f803c1-a50b-46f3-90c5-0cd319940d75">
-          <div class="d-flex justify-content-between" id="d0d4d82b-9fb2-42cf-a6dd-788e7157f2aa">
-           <h4 id="d58b473e-af0d-451b-a95e-7e0371d689c8">
+         <div class="mt-5" id="920084bd-0054-4460-8e76-5d3691729fef">
+          <div class="d-flex justify-content-between" id="933d7e7a-afdd-43b6-b94b-55264ec01cf7">
+           <h4 id="92702532-7863-4ba7-9fee-edb9806d3b0b">
             Method
-            <span class="text-primary" id="f805d10d-d7e7-4a58-8a88-a9cc1050aee3">
+            <span class="text-primary" id="efd12d7b-ebba-4443-87bb-a730bd75ed48">
              pack_actions
             </span>
            </h4>
-           <div id="a88e4b1a-3b1e-45d0-9bd3-e2cb69d64a70">
+           <div id="5c745e00-c0ff-4ec5-acc5-c9e1934ac78a">
            </div>
           </div>
-          <span class="text-muted" id="cc136677-f75b-439a-a73f-ffdb05e4d5ed">
+          <span class="text-muted" id="fb97e185-c5da-42f2-b1c0-9ecf7019d955">
            Makes item actions packed under a drop-down menu.
           </span>
-          <pre id="84589747-2f6c-48ce-88fc-375e5c5b8a74"><code class="python">pack_actions()</code></pre>
-          <div class="ms-3" id="537b524e-cbc0-4c8a-9e79-24a09520139a">
-           <h6 id="ae6a99e8-b81c-4ab1-b513-a7d622f1f706">
+          <pre id="5453d1e5-6d38-43fe-a104-c20c2fb5d465"><code class="python">pack_actions()</code></pre>
+          <div class="ms-3" id="64b140e4-7ae9-4c4b-8533-6b4da907946e">
+           <h6 id="e4515757-658f-454a-9880-f081029b0ec9">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="6029d475-abcc-4c1f-a241-fc03443888c9"><code class="python">from bootwrap import Button, Deck, Image
+           <pre id="117cdd43-1e95-4f65-a669-22b77bc23ab8"><code class="python">from bootwrap import Button, Deck, Image
 
 actions = [
     Button("Buy"),
@@ -2287,36 +2397,36 @@ Deck.Card(
     "https://www.google.com")
 </code></pre>
           </div>
-          <div class="ms-3" id="5bed5e84-6892-4fc3-b7a2-acf860869f8f">
-           <div class="card" id="6b506485-9354-486c-8a03-ba607942a051">
+          <div class="ms-3" id="a1ca7f1e-acc7-4957-8215-31b96dd31607">
+           <div class="card" id="4af1313d-e5a0-418f-91a2-dca73169048b">
             <a onclick="location.href='https://www.google.com';">
-             <img class="mt-3 card-img-top" id="18801b7d-0d6f-4c25-be6b-7c1b60e52bc6" src="google-logo.png" width="128"/>
+             <img class="mt-3 card-img-top" id="50d16dec-3eb1-4bda-8a80-e0ba105610bd" src="google-logo.png" width="128"/>
             </a>
             <div class="card-body" onclick="location.href='https://www.google.com';">
              <div class="text-right mb-2">
-              <span class="text-muted" id="16148235-6ac5-4aac-8904-8ec4991c926e">
+              <span class="text-muted" id="12bfc2f1-938a-4b5b-a6cd-b4a233ccfab4">
                <small>
                 12:04:58 12/01/2021
                </small>
               </span>
              </div>
-             <h5 class="card-title" id="51e8cd96-6d2e-4c97-91df-e7f5aa4a9a17">
+             <h5 class="card-title" id="59117fb1-08cb-4c6f-853e-99db19d84062">
               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-bs-toggle="dropdown" id="7b826175-e56e-4bec-b754-5f4f2683481a" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="cb74e475-ca3b-42fa-968a-2cfc371bc687" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="146315b5-f192-49e4-bd33-7c0c3dda413a" onclick="return false;">
+               <button class="dropdown-item btn" id="914bc91c-7b2c-4bee-a810-b6a010cc1020" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="66246b5c-5f93-4cf1-a403-d920fda7fdd2" onclick="return false;">
+               <button class="dropdown-item btn" id="9f895c8a-0ee5-4858-ad28-447af8aaecb7" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="11016916-abc8-4573-b7f6-fe568f825bed" onclick="return false;">
+               <button class="dropdown-item btn" id="4beaa404-fab2-4c50-a55f-cd4c9c23be1f" onclick="return false;">
                 Transfer
                </button>
               </div>
@@ -2330,59 +2440,59 @@ Deck.Card(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="a385e77a-87ae-4219-9b8b-8220fa363415">
-     <div id="b1fb80ad-2ab3-48b4-9343-593425fe0c37">
+    <div class="tab-pane fade" id="c2fc0555-0488-4c92-88e6-a93b08b7fcc6">
+     <div id="f3607b06-c246-463c-9485-f2e1289eb19f">
       <hr/>
-      <ul class="nav" id="414819a5-98e8-4273-a560-a0701edf874c" role="tablist">
+      <ul class="nav" id="da8063ba-7e61-488f-8c25-d79ce8351a4f" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#1412af2d-9ec8-455c-abbb-00e018e6db97" data-bs-toggle="tab" href="#1412af2d-9ec8-455c-abbb-00e018e6db97" id="2d4c36d5-e2b5-4b8a-8300-f0595f9ee624" role="tab">
-         <span class="text-secondary" id="c14b8e75-1b73-457d-b848-1e3c692ce450">
+        <a class="nav-link active" data-bs-target="#c905f72d-13a7-415c-a9cc-0354d0f81401" data-bs-toggle="tab" href="#c905f72d-13a7-415c-a9cc-0354d0f81401" id="a2821859-6497-4e6f-9790-a99e745d58ac" role="tab">
+         <span class="text-secondary" id="57b51490-eee5-45c2-9c66-a1a687c75619">
           Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#64781c90-545d-42b0-90c3-4e2bb2f26958" data-bs-toggle="tab" href="#64781c90-545d-42b0-90c3-4e2bb2f26958" id="589c76a0-b939-4793-805f-47e1a52ef3a5" role="tab">
-         <span class="text-secondary" id="ef860f2e-99d2-4820-be33-3cbf4b7d07c2">
+        <a class="nav-link" data-bs-target="#b91259df-4ab7-48f3-bb98-61318c64b97f" data-bs-toggle="tab" href="#b91259df-4ab7-48f3-bb98-61318c64b97f" id="845345a9-b347-4437-a47d-52393ed03ceb" role="tab">
+         <span class="text-secondary" id="c4f743e6-1066-4d7b-8851-f6f2d4cbae6f">
           Question Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#27e79469-f9a6-4cf2-a5ca-db31e77dd9b3" data-bs-toggle="tab" href="#27e79469-f9a6-4cf2-a5ca-db31e77dd9b3" id="d0faeb21-e9dd-462d-8c1e-278620e85b6d" role="tab">
-         <span class="text-secondary" id="c8940daa-3b1f-4128-8686-b3a71135759f">
+        <a class="nav-link" data-bs-target="#c8d5bdce-67f4-44fa-a3f0-bc6db1a1fb64" data-bs-toggle="tab" href="#c8d5bdce-67f4-44fa-a3f0-bc6db1a1fb64" id="9a8ed598-e4a1-4505-9399-643678065479" role="tab">
+         <span class="text-secondary" id="ea197eea-5456-4f02-a568-facd2b15f8a2">
           Complex Dialog
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="1412af2d-9ec8-455c-abbb-00e018e6db97">
-        <div class="mt-5" id="2a2ff732-5f60-4872-b336-e5ed98f206b3">
-         <div class="d-flex justify-content-between" id="76dba137-8d95-432a-b2ca-71d7b4fc158d">
-          <h1 id="e15317b3-17d3-4e79-83ec-a89ef9502964">
+       <div class="tab-pane fade active show" id="c905f72d-13a7-415c-a9cc-0354d0f81401">
+        <div class="mt-5" id="30081b2f-8d6d-4ed9-9cfa-e52e6edacd8c">
+         <div class="d-flex justify-content-between" id="5be1acdd-6758-4cc4-9999-f4830946a7c0">
+          <h1 id="114b4e50-e7aa-42a9-be8a-515b48e40a89">
            Class
-           <span class="text-primary" id="31b88406-2e74-4451-8e1c-dc978fb11ac9">
+           <span class="text-primary" id="28a88188-3319-463c-8d53-ff60d3fd3196">
             Dialog
            </span>
           </h1>
-          <div id="c647ca64-2162-43cf-bb08-db3a0bdf0805">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#683c9f4c-c9af-4ee8-9138-47b732d31877" data-bs-toggle="collapse" id="32390dbf-c7e5-4c19-9c79-d6d69c6fe3c4" onclick="return false;" type="button">
+          <div id="3ff9818f-469c-466d-b814-ccdf5cddc044">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#0cf46f9e-42fb-47a3-b757-9ad64279841b" data-bs-toggle="collapse" id="b8137e7c-374a-417c-b018-18da1dbe11bf" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="f0962088-0033-41ab-a298-f6bcf0bf3667">
+         <span class="text-muted" id="e80888bc-f4e0-4c12-ae07-8431ec6a1e32">
           A dialog.
          </span>
-         <pre id="b3a0b99f-7ee4-495d-9aca-5a24d1491f1b"><code class="python">Dialog(title, content, *actions)</code></pre>
-         <div class="ms-3 collapse" id="683c9f4c-c9af-4ee8-9138-47b732d31877">
-          <h6 id="165dfa4b-b6cf-4e63-b822-fa4cfd4463f7">
+         <pre id="5cedca2b-d5c2-490f-ba3b-feabcdef6758"><code class="python">Dialog(title, content, *actions)</code></pre>
+         <div class="ms-3 collapse" id="0cf46f9e-42fb-47a3-b757-9ad64279841b">
+          <h6 id="a4608409-ec84-4329-8d25-30197707ef90">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="0e0169e3-a565-4097-9991-993d8ae2751a">
+          <table class="table table-sm bg-light" id="a6e9750d-754c-498f-97bf-341be2fe501d">
            <thead>
             <tr>
              <th scope="col">
@@ -2445,13 +2555,13 @@ Deck.Card(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="4a313b07-e0a8-4734-86e6-14d49fa7bea4">
-          <h6 id="8e87b52c-93e1-4519-8cbc-55066d65bdf4">
+         <div class="ms-3" id="183971e4-18a7-406c-85ce-eda0e29c61c3">
+          <h6 id="066130eb-c2fa-4c97-912d-1a12f6483cc5">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="193315d1-415c-4b39-8bcb-f3ddc16c2b93"><code class="python">from bootwrap import Panel, Dialog, Button
+          <pre id="38257b4d-111d-452d-875b-400b410cb9e2"><code class="python">from bootwrap import Panel, Dialog, Button
 
 dialog = Dialog(
     'Greeting',
@@ -2463,9 +2573,9 @@ button = Button('Say Hello').toggle(dialog)
 Panel(dialog, button)
 </code></pre>
          </div>
-         <div class="ms-3" id="b45d3569-7937-4de5-9303-7713cb998578">
-          <div id="0defdf26-b491-48e6-a07c-f32ddcd65c90">
-           <div class="modal" id="33238ea3-3679-4fbf-aa75-2df8f09715ab">
+         <div class="ms-3" id="47e103dc-2647-4cb7-8acd-14c48bd94fdc">
+          <div id="88503d89-ac9f-49ec-ab7e-dfc35ed30f9d">
+           <div class="modal" id="ce51e717-077b-4640-a555-2abcd078da1c">
             <div class="modal-dialog" role="document">
              <div class="modal-content">
               <div class="modal-header">
@@ -2479,42 +2589,42 @@ Panel(dialog, button)
                Hello World!
               </div>
               <div class="modal-footer">
-               <button class="btn" data-bs-dismiss="modal" id="10725044-ce89-46b5-8f5d-6bc4cf6be015" onclick="return false;" type="button">
+               <button class="btn" data-bs-dismiss="modal" id="020af4ab-2427-4754-9c3a-805f96ba1357" onclick="return false;" type="button">
                 Bye
                </button>
               </div>
              </div>
             </div>
            </div>
-           <button class="btn" data-bs-target="#33238ea3-3679-4fbf-aa75-2df8f09715ab" data-bs-toggle="modal" id="ef1a4ae3-e9dd-40d4-945c-e6ce86789807" onclick="return false;" type="button">
+           <button class="btn" data-bs-target="#ce51e717-077b-4640-a555-2abcd078da1c" data-bs-toggle="modal" id="af9163fd-c60b-4aa9-b486-24c0fa983227" onclick="return false;" type="button">
             Say Hello
            </button>
           </div>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="64781c90-545d-42b0-90c3-4e2bb2f26958">
-        <div class="mt-3" id="7dde19f4-35e3-4aba-93ef-cf7e9f982cb7">
-         <div id="65c4fad6-4224-48e9-9217-02860ee396ee">
+       <div class="tab-pane fade" id="b91259df-4ab7-48f3-bb98-61318c64b97f">
+        <div class="mt-3" id="29348c1a-8627-4a9e-8301-1f992d19ac5b">
+         <div id="c896b032-a558-49f7-b804-2a53dfa36c7f">
           <div class="row">
            <div class="col-md">
-            <div id="461c841a-00f9-441b-94ad-59f61ad1d678">
-             <h1 id="a9359167-7f1c-4387-affc-1f64e3e5ee1a">
+            <div id="cc128a5d-a2e0-4c48-9987-fc84e7444ebd">
+             <h1 id="1902e6de-aaa5-44df-897d-fb29c3b7fd71">
               Question Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="bade16c0-270d-4439-9e23-3b3e3cf37f64">
+            <div id="39b8200e-d889-4c45-8100-a8bc50fa5671">
             </div>
            </div>
           </div>
          </div>
-         <div id="6b0f73b4-23a2-426c-a627-b90d397faf9b">
+         <div id="131a01af-c704-4681-b578-42f8062f0421">
           <div class="row">
            <div class="col-md">
-            <div id="5226a333-7192-47ce-88b7-44e303c623ee">
-             <p id="94ff7471-4699-439b-ab3e-5f65176f4db5">
+            <div id="375c0c72-0033-4871-992a-3ce4c9ac6e72">
+             <p id="6f0d61f8-a83f-405a-80a8-42d756a92dad">
               An example of how
               <code>
                Dialog
@@ -2534,8 +2644,8 @@ Panel(dialog, button)
             </div>
            </div>
            <div class="col-md">
-            <div id="fa17f636-674d-453a-b052-7b5cd58f79ea">
-             <pre id="2f8f6672-0e56-453d-9688-cf47a38db99f"><code class="python">from bootwrap import Panel, Dialog, Button
+            <div id="1b31bd94-bf9a-4f82-9b74-c3ae297ea87b">
+             <pre id="f0b5f7f6-b80b-4b5e-9db4-7eb38b118dcf"><code class="python">from bootwrap import Panel, Dialog, Button
 
 dialog = Dialog(
   "Delete File",
@@ -2547,8 +2657,8 @@ dialog = Dialog(
 button = Button("Delete").as_danger().toggle(dialog)   
 
 Panel(dialog, button)</code></pre>
-             <div id="3b426921-74de-4800-bdd3-be240a87a5d1">
-              <div class="modal" id="18e6eda0-35b9-4f1b-bbc2-214717f29ad6">
+             <div id="5b0317b8-3e84-47a4-9825-2624bda37bc1">
+              <div class="modal" id="e07980d2-4c6b-4ab9-9bf4-8563508281ca">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -2562,17 +2672,17 @@ Panel(dialog, button)</code></pre>
                   Are you sure that you want to delete this file?
                  </div>
                  <div class="modal-footer">
-                  <button class="btn btn-danger" data-bs-dismiss="modal" id="d0318ea7-3d96-4ce4-b942-a27968e22fcf" onclick="return false;" type="button">
+                  <button class="btn btn-danger" data-bs-dismiss="modal" id="d227682c-a18c-451d-879c-8a9392a78cf2" onclick="return false;" type="button">
                    Confirm
                   </button>
-                  <button class="btn" data-bs-dismiss="modal" id="dfbaefb8-c042-42b1-8bad-00cbef3fcae7" onclick="return false;" type="button">
+                  <button class="btn" data-bs-dismiss="modal" id="713af428-3115-46b0-af40-322878201b71" onclick="return false;" type="button">
                    Cancel
                   </button>
                  </div>
                 </div>
                </div>
               </div>
-              <button class="btn btn-danger" data-bs-target="#18e6eda0-35b9-4f1b-bbc2-214717f29ad6" data-bs-toggle="modal" id="87f6ed5e-cc82-4413-a8db-0f26df3da8fc" onclick="return false;" type="button">
+              <button class="btn btn-danger" data-bs-target="#e07980d2-4c6b-4ab9-9bf4-8563508281ca" data-bs-toggle="modal" id="5d9e4e49-626b-47ff-892b-cf9112516a00" onclick="return false;" type="button">
                Delete
               </button>
              </div>
@@ -2582,28 +2692,28 @@ Panel(dialog, button)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="27e79469-f9a6-4cf2-a5ca-db31e77dd9b3">
-        <div class="mt-3" id="5ea021d2-dbb9-4854-a8b0-5d95d5ec044e">
-         <div id="6aa9bb3f-7ce0-4980-abf3-39c05a60f8a5">
+       <div class="tab-pane fade" id="c8d5bdce-67f4-44fa-a3f0-bc6db1a1fb64">
+        <div class="mt-3" id="3bbecc0a-d250-491f-a783-f36fb4416597">
+         <div id="3d3367e5-643f-4d34-be48-7e4a0824a2fb">
           <div class="row">
            <div class="col-md">
-            <div id="1baf79dc-9eb8-4c2d-9c29-e2f3cb8f02a9">
-             <h1 id="e4a7c7ba-c80e-427d-b1e1-da4b70dbbfa4">
+            <div id="7e649538-bef9-47c0-b18d-081d879cd402">
+             <h1 id="c9c13199-3f8b-4e40-8bad-d8035d4e109a">
               Complex Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="7b2d977f-355b-47b8-b3fa-23551a9eac98">
+            <div id="b73a7431-d161-48b7-b2de-ef4a694f332b">
             </div>
            </div>
           </div>
          </div>
-         <div id="5c411b89-d439-4e1a-9f16-a396a7855f43">
+         <div id="f0fd37f1-851f-45b8-b8b9-6845baf3ac53">
           <div class="row">
            <div class="col-md">
-            <div id="0c356b64-8ca2-4d32-ab62-66653db81479">
-             <p id="e00045b3-75a5-4319-9b02-0775cac65dae">
+            <div id="2ec45049-0bbe-4b42-bc8f-4d350d21d33e">
+             <p id="3d95a3c1-30c8-432d-a43b-0ab8fea9d6f6">
               An example of how
               <code>
                Dialog
@@ -2632,8 +2742,8 @@ Panel(dialog, button)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="aad7366a-ffe3-49b9-be25-3791901833f7">
-             <pre id="d18afa5f-1fb6-4da3-88bc-011bf7e6fffa"><code class="python">from bootwrap import Panel, Form, NumericInput, Dialog, Button
+            <div id="a8719090-005e-4509-965f-27d246d74b72">
+             <pre id="ecb74fa4-705d-4b34-a64a-b6928c2fccd8"><code class="python">from bootwrap import Panel, Form, NumericInput, Dialog, Button
 
 dialog = Dialog(
     "Buy Company Shares",
@@ -2651,8 +2761,8 @@ dialog = Dialog(
 button = Button("Buy Shares").as_primary().toggle(dialog)   
 
 Panel(dialog, button)</code></pre>
-             <div id="89bd7237-8ae6-4e57-a8e3-1b558d533aaa">
-              <div class="modal" id="d68f1fe1-14c3-4fa1-9f8e-34c776284d48">
+             <div id="871e5764-c16f-4597-a84b-f3f79d50b7cf">
+              <div class="modal" id="54212000-73d9-4bd0-84ee-26ae84c1ded5">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -2663,19 +2773,19 @@ Panel(dialog, button)</code></pre>
                   </button>
                  </div>
                  <div class="modal-body">
-                  <form enctype="multipart/form-data" id="e2c54f4c-8308-41f0-a566-49eddcb3300c" method="POST">
+                  <form enctype="multipart/form-data" id="1b605162-1934-410d-9708-e73177520452" method="POST">
                    <div class="form-group row">
-                    <label class="col-sm-4 col-form-label d-flex align-items-center" for="e8c99322-1546-4855-ba25-a0f69d42c7ef">
+                    <label class="col-sm-4 col-form-label d-flex align-items-center" for="12f2341e-f314-4d40-840d-dbe8f4b49919">
                      Amount($)
                     </label>
                     <div class="col-sm-8 d-flex align-items-center">
-                     <input class="form-control" id="e8c99322-1546-4855-ba25-a0f69d42c7ef" name="amount" placeholder="enter an amount for buying shares" type="number"/>
+                     <input class="form-control" id="12f2341e-f314-4d40-840d-dbe8f4b49919" name="amount" placeholder="enter an amount for buying shares" type="number"/>
                     </div>
                    </div>
-                   <button class="float-right btn" data-bs-dismiss="modal" id="250e4ba8-20ea-41ec-8f2e-943c919f9b9c" onclick="return false;" type="button">
+                   <button class="float-right btn" data-bs-dismiss="modal" id="30637be3-6014-458c-b5ee-c6c303642e5c" onclick="return false;" type="button">
                     Cancel
                    </button>
-                   <button class="float-right me-2 btn btn-success" data-bs-dismiss="modal" id="e8035a5e-85d3-4bf3-b487-d2fe09bc22a7" onclick="return false;" type="button">
+                   <button class="float-right me-2 btn btn-success" data-bs-dismiss="modal" id="07bd6214-eee8-4d28-9644-f0883e129e9c" onclick="return false;" type="button">
                     Buy
                    </button>
                   </form>
@@ -2683,7 +2793,7 @@ Panel(dialog, button)</code></pre>
                 </div>
                </div>
               </div>
-              <button class="btn btn-primary" data-bs-target="#d68f1fe1-14c3-4fa1-9f8e-34c776284d48" data-bs-toggle="modal" id="fac5af5c-0379-4c0f-a7b1-fcf435e8dec0" onclick="return false;" type="button">
+              <button class="btn btn-primary" data-bs-target="#54212000-73d9-4bd0-84ee-26ae84c1ded5" data-bs-toggle="modal" id="2de78383-fca8-48b5-8513-f8b4ef80373b" onclick="return false;" type="button">
                Buy Shares
               </button>
              </div>
@@ -2696,101 +2806,101 @@ Panel(dialog, button)</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="249bac9c-5a71-4c80-aaab-7786d21d9176">
-     <div id="f1dc5897-ae02-4a10-8ce0-f03f2328bfcd">
+    <div class="tab-pane fade" id="a65518ac-93e0-443d-9b55-64b555802ad1">
+     <div id="6b7c0382-c401-4372-bac4-c44225d81327">
       <hr/>
-      <ul class="nav" id="4220a8a5-db05-4fe7-acaf-b43cb65bd139" role="tablist">
+      <ul class="nav" id="e7e9d4ad-e53f-43ad-a97b-aa7a1a57023a" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#5c32eb4e-b109-4f57-bee8-257672ee468c" data-bs-toggle="tab" href="#5c32eb4e-b109-4f57-bee8-257672ee468c" id="8ae9ac0d-8c1a-40a1-8265-6a22c55ad844" role="tab">
-         <span class="text-secondary" id="7dfea332-bdb8-4b4f-a89f-d8c8082550c3">
+        <a class="nav-link active" data-bs-target="#e5e1905a-981f-43f8-932c-cc85b2a513a8" data-bs-toggle="tab" href="#e5e1905a-981f-43f8-932c-cc85b2a513a8" id="e8a71755-c8ea-4bb5-8133-502e36123c22" role="tab">
+         <span class="text-secondary" id="e186fd92-8c0e-4239-9c6b-e1805f29077d">
           Form
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#264cfff0-9225-4348-bcc7-8188d00ffcfb" data-bs-toggle="tab" href="#264cfff0-9225-4348-bcc7-8188d00ffcfb" id="ce081bb1-e883-4b00-a37b-7b9070776849" role="tab">
-         <span class="text-secondary" id="5ce38234-9801-4cb6-98bf-1dadd42e1967">
+        <a class="nav-link" data-bs-target="#151b90ce-0cf7-4227-a269-83394cf6a204" data-bs-toggle="tab" href="#151b90ce-0cf7-4227-a269-83394cf6a204" id="c050f204-5e35-49ac-9e31-bd7e654a0196" role="tab">
+         <span class="text-secondary" id="221483c5-bcc9-4d78-8d7e-23dde3743833">
           CheckboxInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#2e140b6c-ce02-4345-b1ad-565ac4375179" data-bs-toggle="tab" href="#2e140b6c-ce02-4345-b1ad-565ac4375179" id="bed9596b-1783-4382-b9dd-b2af9faa10c9" role="tab">
-         <span class="text-secondary" id="f0655f99-5681-4b58-bc2d-6af9270b1099">
+        <a class="nav-link" data-bs-target="#e2596fbc-7048-441e-a7ba-a93277c3c0f6" data-bs-toggle="tab" href="#e2596fbc-7048-441e-a7ba-a93277c3c0f6" id="9b458dfe-1570-4b35-a818-2ab1110da2ec" role="tab">
+         <span class="text-secondary" id="c495ffcb-55a5-49ff-bd37-2169d18b5fe3">
           TextInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#06eb359b-25a2-4f29-9e7f-f81d9e8ab712" data-bs-toggle="tab" href="#06eb359b-25a2-4f29-9e7f-f81d9e8ab712" id="26832351-0102-4f92-8515-e3dcd9a58a81" role="tab">
-         <span class="text-secondary" id="1c42b718-a088-45c3-8f65-7cfb1499f704">
+        <a class="nav-link" data-bs-target="#d0b2aa22-a10a-491d-b639-4544e5ebb134" data-bs-toggle="tab" href="#d0b2aa22-a10a-491d-b639-4544e5ebb134" id="3a44aed7-1bf6-4dbf-9013-3de6452b94fa" role="tab">
+         <span class="text-secondary" id="c38d842b-8738-4bdd-a8a1-241a497ca89f">
           NumericInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#8c2d1395-cc41-49e2-8a3f-aa5e681f777f" data-bs-toggle="tab" href="#8c2d1395-cc41-49e2-8a3f-aa5e681f777f" id="5a068092-fbb0-47de-9592-9849515923b6" role="tab">
-         <span class="text-secondary" id="f8024775-0d01-4e3e-ba91-95d387a6ed31">
+        <a class="nav-link" data-bs-target="#dd2b72cd-2c33-4985-849d-36e223cb3e07" data-bs-toggle="tab" href="#dd2b72cd-2c33-4985-849d-36e223cb3e07" id="d84613c1-1dc9-4e4f-a0ed-9b5448ecfb3f" role="tab">
+         <span class="text-secondary" id="bfc24027-91bf-4dc3-a44b-8e78777dcf3f">
           SelectInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#ac65fd3d-d6cb-41a1-ae69-761b6e34a996" data-bs-toggle="tab" href="#ac65fd3d-d6cb-41a1-ae69-761b6e34a996" id="a7492962-b2e8-4666-8a2f-37cc4ab286db" role="tab">
-         <span class="text-secondary" id="95c4697f-b9bf-40f5-8c83-edac63b29e15">
+        <a class="nav-link" data-bs-target="#043fd079-2c32-45cd-8f91-508b434c0f1e" data-bs-toggle="tab" href="#043fd079-2c32-45cd-8f91-508b434c0f1e" id="91b1f0d3-cb75-4042-987f-5b18f31f6975" role="tab">
+         <span class="text-secondary" id="93f7fbe0-a71e-4c70-ab5c-7e8511c720d9">
           SelectInput.Option
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#864d6b01-c169-4473-b528-bb45086bd75e" data-bs-toggle="tab" href="#864d6b01-c169-4473-b528-bb45086bd75e" id="8049d12f-728d-4107-84a1-d0afd4eaccf0" role="tab">
-         <span class="text-secondary" id="d5004625-3867-4985-8233-b663f4e21b24">
+        <a class="nav-link" data-bs-target="#ee5f82e7-bc51-4cab-8dfd-872c07d694bd" data-bs-toggle="tab" href="#ee5f82e7-bc51-4cab-8dfd-872c07d694bd" id="47be6d1c-2b83-4bbe-a6df-d5df6a2c4184" role="tab">
+         <span class="text-secondary" id="46ac4553-be5e-4970-9dad-387768c51005">
           HiddenInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#f9d2f415-1bea-4256-9524-c84b6d591176" data-bs-toggle="tab" href="#f9d2f415-1bea-4256-9524-c84b6d591176" id="ad28ea2d-06e0-4139-8aec-dbd7ffc43525" role="tab">
-         <span class="text-secondary" id="9ac41780-7acb-41e8-9836-9cd4ecef9958">
+        <a class="nav-link" data-bs-target="#09113c83-241c-4767-9e4c-ac1f4efed121" data-bs-toggle="tab" href="#09113c83-241c-4767-9e4c-ac1f4efed121" id="58a2b919-bcd4-4b99-b4c5-43eb7cbe4596" role="tab">
+         <span class="text-secondary" id="21ccec34-2ac0-4530-8e3b-2d6c9f4f7e5d">
           FileInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#6af4c4de-70cf-42d0-8d11-ae89b279deda" data-bs-toggle="tab" href="#6af4c4de-70cf-42d0-8d11-ae89b279deda" id="ad0089a6-1084-4eaf-bb12-c2f6c4042d31" role="tab">
-         <span class="text-secondary" id="fb022512-8d65-4ffb-a6fb-0570e581b7db">
+        <a class="nav-link" data-bs-target="#7c2edb6f-a46c-485c-b6f0-b972cc5dd856" data-bs-toggle="tab" href="#7c2edb6f-a46c-485c-b6f0-b972cc5dd856" id="0bc7fd4c-97b5-42fe-95a9-039060454ce1" role="tab">
+         <span class="text-secondary" id="ca884056-0773-4bfe-bda4-0e85ffaebb75">
           InputGroup
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="5c32eb4e-b109-4f57-bee8-257672ee468c">
-        <div class="mt-5" id="22e18e31-36e0-46d6-bcbc-0e66bcb3e022">
-         <div class="d-flex justify-content-between" id="2dd4a169-ad37-4f9f-b6d4-71406bd4743c">
-          <h1 id="9af7395c-d5b0-4c52-96a0-471e330284f7">
+       <div class="tab-pane fade active show" id="e5e1905a-981f-43f8-932c-cc85b2a513a8">
+        <div class="mt-5" id="52f0b7a9-0766-4661-a7a7-8e99f103476b">
+         <div class="d-flex justify-content-between" id="b87d2191-f829-4db0-b6aa-08d8e17342bf">
+          <h1 id="a70d10a7-b979-4c2e-a2ef-e8454d4efb5b">
            Class
-           <span class="text-primary" id="981c18c8-3b93-4eef-9490-d90929097927">
+           <span class="text-primary" id="104628b1-02f6-45e5-aa83-bc0089d0e566">
             Form
            </span>
           </h1>
-          <div id="a1db74f1-591b-40bd-b4ad-a8ac4504ac4e">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#896b2802-b0b5-4e0a-ac09-ce7ff1f50bfa" data-bs-toggle="collapse" id="2befd13a-fb46-48ea-80e8-1c6171843e75" onclick="return false;" type="button">
+          <div id="b5f0fd1c-5b29-4c55-945f-1e01a954f890">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#fd2acfbd-cfa0-47f5-8508-bf16872ca636" data-bs-toggle="collapse" id="6b3376f0-d92b-49f8-a4d5-4398bead4852" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="adc96793-d9e6-4300-b0fe-5357f1f0a972">
+         <span class="text-muted" id="6f6d0cb1-2738-405b-91a0-fb4b3b445ef4">
           A web component for a form.
          </span>
-         <pre id="01b1e749-6516-4eca-a174-ce645482e316"><code class="python">Form(*components)</code></pre>
-         <div class="ms-3 collapse" id="896b2802-b0b5-4e0a-ac09-ce7ff1f50bfa">
-          <h6 id="59b5b4e0-f7ab-409c-8135-d17a4f0a31ef">
+         <pre id="9f40602d-691a-4b3f-87d3-c2faeec4c63e"><code class="python">Form(*components)</code></pre>
+         <div class="ms-3 collapse" id="fd2acfbd-cfa0-47f5-8508-bf16872ca636">
+          <h6 id="df0a98cc-0712-4eb8-8ff0-08d92483a7b3">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="2c1ccb4b-0554-4696-b916-0d6f9c878068">
+          <table class="table table-sm bg-light" id="f3d35d1d-da87-4894-81f5-8e72ef9b9d30">
            <thead>
             <tr>
              <th scope="col">
@@ -2828,7 +2938,7 @@ Panel(dialog, button)</code></pre>
            </tbody>
           </table>
          </div>
-         <p id="52b82b1a-058d-4fb5-a379-789cd665d41b">
+         <p id="b25804bb-26a6-42c4-9316-f19c7d3a1ce0">
           Use the
           <code>
            on_submit(href)
@@ -2836,13 +2946,13 @@ Panel(dialog, button)</code></pre>
           function to specify URL where entered
     information should to be sent for processing.
          </p>
-         <div class="ms-3" id="27f066d8-bedc-4cb0-b051-31c080fb9381">
-          <h6 id="de252cae-a67b-406d-b5fd-5bf754ce9869">
+         <div class="ms-3" id="a444bafd-4322-468a-89ab-e43524e32a15">
+          <h6 id="a2a0f3dd-4e9b-430c-b1db-84585b5abbe4">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="3e6c5076-5a21-4e71-9a29-16daabfc7deb"><code class="python">from bootwrap import Form
+          <pre id="dba282e4-04a6-4a3f-95e3-b74c6103ea25"><code class="python">from bootwrap import Form
 
 Form(
     # here should be an enumeration  of
@@ -2851,34 +2961,34 @@ Form(
 ).on_submit('go/to/this/url')
 </code></pre>
          </div>
-         <div class="mt-5" id="52ca50f6-eb0b-4279-8df4-13747badcf8c">
-          <div class="d-flex justify-content-between" id="59596526-727c-4e42-90cb-d4ac10ad7fe0">
-           <h4 id="ea9d5d2d-f93f-452c-acb2-17f133de517a">
+         <div class="mt-5" id="c1ec2fec-1511-40fc-bc77-2eeeb10e21dd">
+          <div class="d-flex justify-content-between" id="7183eb73-6a2d-410f-88a6-723ec16dbb1e">
+           <h4 id="0a07acbf-dbe8-4518-8ca2-27957e513278">
             Method
-            <span class="text-primary" id="13ff834b-7037-4c41-ae52-a9f8ad642274">
+            <span class="text-primary" id="809b8426-ea60-4326-a80d-71845e3b7a35">
              on_submit
             </span>
            </h4>
-           <div id="026059d3-a9b6-4d45-afa7-b821b93b5435">
-            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#95f39aac-a1d3-4d33-93c6-3b897cd4598a" data-bs-toggle="collapse" id="5dab9dcf-d9cf-4298-8f8d-236ebce169c2" onclick="return false;" type="button">
+           <div id="c90f79ee-9ef5-4085-98a3-d462f7c449b7">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#8af4596b-15f5-4f24-9608-734b1cf8518e" data-bs-toggle="collapse" id="6d11d60c-9e8f-434a-a0ca-42e56b009b5c" onclick="return false;" type="button">
              Argument
             </button>
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#aa8a6011-1a8b-4c15-8438-c85e16b67504" data-bs-toggle="collapse" id="b57928ad-14ea-4eb1-bed8-e3005dc74739" onclick="return false;" type="button">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#ffc6fcdb-2dad-4e09-9697-38f65a3645d2" data-bs-toggle="collapse" id="2ba73a12-a921-444a-b271-72b7d7815e5e" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="dd06eab2-396e-43f7-8674-ff695b042236">
+          <span class="text-muted" id="6344a674-9bcc-43f2-8e45-3259965741fd">
            Sets the submit URL, for the POST request.
           </span>
-          <pre id="3c2971ee-ae0a-4244-aea4-e8315c330e9d"><code class="python">on_submit(href)</code></pre>
-          <div class="ms-3 collapse" id="95f39aac-a1d3-4d33-93c6-3b897cd4598a">
-           <h6 id="a592cf23-604c-4a6e-b747-9fdd58ea6ff6">
+          <pre id="8c70879d-9450-43a5-990a-7d3873338904"><code class="python">on_submit(href)</code></pre>
+          <div class="ms-3 collapse" id="8af4596b-15f5-4f24-9608-734b1cf8518e">
+           <h6 id="2c17b8a9-e2c2-4705-84c1-c9f851d29c31">
             <strong>
              Arguments
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="b51407e9-d98f-432c-9673-225b255406ef">
+           <table class="table table-sm bg-light" id="1b68b09b-729b-4c15-bbec-2ed8664e49d2">
             <thead>
              <tr>
               <th scope="col">
@@ -2911,13 +3021,13 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3 collapse" id="aa8a6011-1a8b-4c15-8438-c85e16b67504">
-           <h6 id="38d892be-88a9-4832-9bfc-a63411f32a6a">
+          <div class="ms-3 collapse" id="ffc6fcdb-2dad-4e09-9697-38f65a3645d2">
+           <h6 id="a3946edd-4646-4a27-9dd4-9f05b16c8b0f">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="808f8b90-b535-4841-973d-22bd26f8bc20">
+           <table class="table table-sm bg-light" id="21f188dc-fef8-425d-abcf-11e6f6dbfd19">
             <thead>
              <tr>
               <th scope="col">
@@ -2950,13 +3060,13 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="12d9e107-7bde-417e-b060-54afe5bb9248">
-           <h6 id="e513d0e3-fe50-47d6-83d1-ce988239f83d">
+          <div class="ms-3" id="4aa7055d-a0f0-4448-8460-02e5ff270c03">
+           <h6 id="96982ad0-08e1-4b1a-b25d-dfa391be2058">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="dea7f96f-9881-4120-b5bd-0df57b70984b"><code class="python">from bootwrap import Form
+           <pre id="38be01a8-c810-4ac1-a666-4160386de697"><code class="python">from bootwrap import Form
 
 Form(...).on_submit('go/to/this/url')
 </code></pre>
@@ -2964,32 +3074,32 @@ Form(...).on_submit('go/to/this/url')
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="264cfff0-9225-4348-bcc7-8188d00ffcfb">
-        <div class="mt-5" id="5d0d7316-a1e5-47b8-9529-74cf5ceb99ce">
-         <div class="d-flex justify-content-between" id="08a0295e-2083-48cd-a455-a2a19368b368">
-          <h1 id="cbdeab0f-8466-43d6-93b1-d0bfb76d3428">
+       <div class="tab-pane fade" id="151b90ce-0cf7-4227-a269-83394cf6a204">
+        <div class="mt-5" id="536c755d-6a79-4950-9f59-4343f1d72932">
+         <div class="d-flex justify-content-between" id="2d0eb8cd-9c39-419a-b2ec-34b31ff3347f">
+          <h1 id="af5f5e50-eb26-415f-86e6-44d7ef568491">
            Class
-           <span class="text-primary" id="5dde78c1-310c-483d-a475-9727561c7daf">
+           <span class="text-primary" id="360bc514-0731-4c90-8c70-3df9cda076ac">
             CheckboxInput
            </span>
           </h1>
-          <div id="9256387e-81d8-4325-b475-51a379c7285e">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#b94f3ddf-8150-418d-8eb7-adbef80eff73" data-bs-toggle="collapse" id="0261dec2-3f8a-4db3-aa82-20b453057971" onclick="return false;" type="button">
+          <div id="daf068e8-2c51-4b25-ad36-00199858fa15">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#4bffec03-4995-4cbf-85f4-90b98e5d31b3" data-bs-toggle="collapse" id="0fcc4f2b-4f03-43ec-b5c7-bb47bcf05245" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="954f3c00-50d1-4203-bc46-de6b66627d72">
+         <span class="text-muted" id="2375cad4-2309-4102-b4d6-54eec93824f7">
           A checkbox input.
          </span>
-         <pre id="441d6580-1561-495e-ab71-ac4337a24994"><code class="python">CheckboxInput(label, name, checked=False)</code></pre>
-         <div class="ms-3 collapse" id="b94f3ddf-8150-418d-8eb7-adbef80eff73">
-          <h6 id="d88a98ab-aec4-40bb-b824-b555d8e090a6">
+         <pre id="537ba9d2-24a1-41b7-939a-c39083cb9415"><code class="python">CheckboxInput(label, name, checked=False)</code></pre>
+         <div class="ms-3 collapse" id="4bffec03-4995-4cbf-85f4-90b98e5d31b3">
+          <h6 id="bd0a7dbf-9368-4ec0-a016-73bd4285239d">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="85f736c7-28a2-4e77-8c79-ba40ed31b46b">
+          <table class="table table-sm bg-light" id="e50c53c7-0c62-46f3-8e53-1470b6d4b761">
            <thead>
             <tr>
              <th scope="col">
@@ -3052,7 +3162,7 @@ Form(...).on_submit('go/to/this/url')
            </tbody>
           </table>
          </div>
-         <p id="f03422c8-56f0-44db-8a76-e9b58901db63">
+         <p id="6c18b215-0d3e-42f3-89a9-435d6c79d04b">
           Use the
           <code>
            as_disabled()
@@ -3064,13 +3174,13 @@ Form(...).on_submit('go/to/this/url')
           </code>
           component.
          </p>
-         <div class="ms-3" id="ef611c20-7276-46e6-b3b4-8ac86c46c575">
-          <h6 id="171f9461-016d-458a-8fee-d4e99561c5bd">
+         <div class="ms-3" id="bb626fab-2dcc-40d5-987d-2bad51da7704">
+          <h6 id="73715cd4-6a14-46b8-bee3-b0d7c8fcc88c">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="6d2c6c94-c68d-422d-b212-1ca7190fd42f"><code class="python">from bootwrap import Form, CheckboxInput
+          <pre id="7f42dede-3b19-4df9-ba1a-8df164debad8"><code class="python">from bootwrap import Form, CheckboxInput
 
 Form(
     CheckboxInput('One', 'opt1'),
@@ -3080,59 +3190,59 @@ Form(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="d9ed0b6d-7982-4e04-8c45-6d8caeb3004d">
-          <form enctype="multipart/form-data" id="41973b14-0647-4dc9-bd4d-6dc1a3d2e32a" method="POST">
+         <div class="ms-3" id="872b6655-de3b-41a7-9a4c-10b8ea51f719">
+          <form enctype="multipart/form-data" id="7c7e4759-9202-4d96-9c1a-78427bcbe6fc" method="POST">
            <div class="form-check">
-            <input autocomplete="off" class="form-check-input" id="952824cd-2f6b-48a6-8097-f9316f192258" name="opt1" type="checkbox"/>
-            <label class="form-check-label" for="952824cd-2f6b-48a6-8097-f9316f192258">
+            <input autocomplete="off" class="form-check-input" id="7ff28896-d451-4d96-b36d-012437eb9949" name="opt1" type="checkbox"/>
+            <label class="form-check-label" for="7ff28896-d451-4d96-b36d-012437eb9949">
              One
             </label>
            </div>
            <div class="form-check">
-            <input autocomplete="off" checked="" class="form-check-input" id="acb31ba2-f79e-4733-b6fe-e8dfe9bb2dd5" name="opt2" type="checkbox"/>
-            <label class="form-check-label" for="acb31ba2-f79e-4733-b6fe-e8dfe9bb2dd5">
+            <input autocomplete="off" checked="" class="form-check-input" id="1c1fddbd-1b1a-4738-a984-ed77dc011304" name="opt2" type="checkbox"/>
+            <label class="form-check-label" for="1c1fddbd-1b1a-4738-a984-ed77dc011304">
              Two
             </label>
            </div>
            <div class="form-check">
-            <input autocomplete="off" class="form-check-input" disabled="" id="edcae4c5-5eca-48eb-a72e-f06caa943369" name="opt3" type="checkbox"/>
-            <label class="form-check-label" for="edcae4c5-5eca-48eb-a72e-f06caa943369">
+            <input autocomplete="off" class="form-check-input" disabled="" id="e3af8040-2438-47f9-b7fb-8a55ea2a6b8d" name="opt3" type="checkbox"/>
+            <label class="form-check-label" for="e3af8040-2438-47f9-b7fb-8a55ea2a6b8d">
              Three
             </label>
            </div>
            <div class="form-check">
-            <input autocomplete="off" checked="" class="form-check-input" disabled="" id="693e805e-77f1-4a1a-ba08-63914c80bf13" name="opt4" type="checkbox"/>
-            <label class="form-check-label" for="693e805e-77f1-4a1a-ba08-63914c80bf13">
+            <input autocomplete="off" checked="" class="form-check-input" disabled="" id="e9b8266b-16e1-4081-ae15-7abf3755c41a" name="opt4" type="checkbox"/>
+            <label class="form-check-label" for="e9b8266b-16e1-4081-ae15-7abf3755c41a">
              Four
             </label>
            </div>
           </form>
          </div>
-         <div class="mt-5" id="ab731547-e4d8-4ff3-94b9-b5bc1728555b">
-          <div class="d-flex justify-content-between" id="31ab06f4-b1a7-4003-a812-198a428bdfc7">
-           <h4 id="d39782b3-d8bc-444c-9411-223656e147a3">
+         <div class="mt-5" id="92196691-c560-4bb0-adef-5d7b0d67f03d">
+          <div class="d-flex justify-content-between" id="841c0082-5424-4f43-91f2-ced18402fca5">
+           <h4 id="728e7ff6-1484-454c-a91e-bd1e6143fa1a">
             Method
-            <span class="text-primary" id="3483a782-03ce-4ac1-a068-70fcb3761890">
+            <span class="text-primary" id="4676977b-be23-46fe-a26c-1ea4f3d804b9">
              as_button
             </span>
            </h4>
-           <div id="3eeb2b21-defd-4faf-96e3-8a1ce8d28771">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#a415fcd5-bd43-4bd7-8f4b-ae540b2e2a8e" data-bs-toggle="collapse" id="f1f19f54-e4a2-4f51-81cc-4cad40887859" onclick="return false;" type="button">
+           <div id="94cd832e-61f9-4b50-a924-c2b88b35e959">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#f972c015-7611-45ec-8dad-40f62ac59cd8" data-bs-toggle="collapse" id="27b68dc2-8852-4f60-9a45-ef68fe7fb8ed" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="e70287de-d00c-488a-aa5e-7f4be07b9dfe">
+          <span class="text-muted" id="c0e6ed20-c542-4b1e-a95e-79a2f6fb309b">
            Sets the "button"-style to the check box.
           </span>
-          <pre id="218e9816-1483-4092-aeaa-5a42b1e0f961"><code class="python">as_button()</code></pre>
-          <div class="ms-3 collapse" id="a415fcd5-bd43-4bd7-8f4b-ae540b2e2a8e">
-           <h6 id="37da487b-5992-40ad-bc7a-5bbf7716d842">
+          <pre id="9ae84d2e-d173-471f-8801-998fe8253670"><code class="python">as_button()</code></pre>
+          <div class="ms-3 collapse" id="f972c015-7611-45ec-8dad-40f62ac59cd8">
+           <h6 id="4d8e4eda-ece2-417c-9008-e7acb35296cd">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="d1055fbc-911e-49f4-829c-e88d34d0194b">
+           <table class="table table-sm bg-light" id="f344a4a1-d849-4703-8422-a4562eb0e6fd">
             <thead>
              <tr>
               <th scope="col">
@@ -3165,13 +3275,13 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="9d7c4de9-dff3-46d9-b25c-2595285957be">
-           <h6 id="025914c2-5918-4f99-8089-8c18b614ed73">
+          <div class="ms-3" id="d8dcbf27-c814-4925-99aa-0eae2ea3b34f">
+           <h6 id="a47e9350-3588-4014-baca-893b5ecd1c1a">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="5d1741b4-d3fb-461c-bda6-b181e3b46000"><code class="python">from bootwrap import Form, CheckboxInput
+           <pre id="8852065b-84ac-4845-b9ee-87f268007ac5"><code class="python">from bootwrap import Form, CheckboxInput
 
 Form(
     CheckboxInput('One', 'opt1').as_button().as_primary().as_outline(),
@@ -3181,52 +3291,52 @@ Form(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="19a5b45f-7eff-40d5-8a5e-9774e82d6e8e">
-           <form enctype="multipart/form-data" id="f892e6bd-21d5-4688-a859-e3e6d2c2ab31" method="POST">
-            <input autocomplete="off" class="btn-check" id="f3a90822-ad38-46d0-b0d7-6c4c14a5d32e" name="opt1" type="checkbox"/>
-            <label class="btn btn-outline-primary" for="f3a90822-ad38-46d0-b0d7-6c4c14a5d32e">
+          <div class="ms-3" id="cce392de-9592-49c9-9325-ba0dacca8d01">
+           <form enctype="multipart/form-data" id="d7934b8d-4598-4303-9b52-6be2124afe66" method="POST">
+            <input autocomplete="off" class="btn-check" id="6dc68984-d7fc-49f4-9793-b6e78b007fd9" name="opt1" type="checkbox"/>
+            <label class="btn btn-outline-primary" for="6dc68984-d7fc-49f4-9793-b6e78b007fd9">
              One
             </label>
-            <input autocomplete="off" checked="" class="btn-check" id="d3a93ceb-b7a4-42de-b1a9-b394eebe192f" name="opt2" type="checkbox"/>
-            <label class="btn" for="d3a93ceb-b7a4-42de-b1a9-b394eebe192f">
+            <input autocomplete="off" checked="" class="btn-check" id="7c0b7572-66f9-4bad-9efc-41ac1bed6331" name="opt2" type="checkbox"/>
+            <label class="btn" for="7c0b7572-66f9-4bad-9efc-41ac1bed6331">
              Two
             </label>
-            <input autocomplete="off" class="btn-check" disabled="" id="f047dd73-66a2-4203-a602-6d325a58f18b" name="opt3" type="checkbox"/>
-            <label class="btn" for="f047dd73-66a2-4203-a602-6d325a58f18b">
+            <input autocomplete="off" class="btn-check" disabled="" id="2a25c511-4d8f-42c7-bb1d-f7a51a47ac00" name="opt3" type="checkbox"/>
+            <label class="btn" for="2a25c511-4d8f-42c7-bb1d-f7a51a47ac00">
              Three
             </label>
-            <input autocomplete="off" checked="" class="btn-check" disabled="" id="34125010-473c-4436-8981-ddc335623e61" name="opt4" type="checkbox"/>
-            <label class="btn" for="34125010-473c-4436-8981-ddc335623e61">
+            <input autocomplete="off" checked="" class="btn-check" disabled="" id="d4069274-8f40-498f-a5ae-0d3bc84cc82f" name="opt4" type="checkbox"/>
+            <label class="btn" for="d4069274-8f40-498f-a5ae-0d3bc84cc82f">
              Four
             </label>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="1a749f8f-1208-49f3-829c-ee4e61d1f46f">
-          <div class="d-flex justify-content-between" id="5755c312-8b12-4b7d-a57f-070e3253f76b">
-           <h4 id="c22e6716-6ecc-4fb7-bc7a-b0372bfbd194">
+         <div class="mt-5" id="5dd04c4d-9a56-4bbb-94f7-a16c0583b656">
+          <div class="d-flex justify-content-between" id="628cc828-2b2c-4837-897e-a9d8b11c8586">
+           <h4 id="1d2585a0-4080-4893-a47a-2b832c7f57bb">
             Method
-            <span class="text-primary" id="09ddad69-7460-4786-b063-f4854c461292">
+            <span class="text-primary" id="20f318eb-74b6-43d2-a771-e5e06f06bd33">
              as_radio
             </span>
            </h4>
-           <div id="70f95112-885b-4f32-b6ee-fbe9ad3dd68e">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#21f95053-fbc9-41cd-a25d-84b780cb6aca" data-bs-toggle="collapse" id="c0993395-fe9b-49b9-ba1d-bf502be08d41" onclick="return false;" type="button">
+           <div id="1c3cb998-6cc2-4e90-889e-2bc9513d9a2a">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#5c6db6a3-cca7-42b5-87b1-d3eff8810135" data-bs-toggle="collapse" id="144280f9-fce8-4214-9382-72144f623e1d" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="2f20f02a-683a-4dd2-a655-8d662f2f22a2">
+          <span class="text-muted" id="03130fcb-8ebb-4c3a-9691-40a231035ef5">
            Makes a chack box as radio button.
           </span>
-          <pre id="4dc5c2f3-c053-48b2-940c-df4a9d4b2156"><code class="python">as_radio(value)</code></pre>
-          <div class="ms-3 collapse" id="21f95053-fbc9-41cd-a25d-84b780cb6aca">
-           <h6 id="e73be610-58a0-40b7-87d4-af5042ba7a0f">
+          <pre id="9bcbd8fd-ab35-45d0-8dad-33fb7b0f9080"><code class="python">as_radio(value)</code></pre>
+          <div class="ms-3 collapse" id="5c6db6a3-cca7-42b5-87b1-d3eff8810135">
+           <h6 id="e4da4734-9412-4356-91bc-040efe59378e">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="5a4df118-dff7-4428-b462-70ebf5a2129b">
+           <table class="table table-sm bg-light" id="b2e8e892-04cb-4390-9a5b-8093010959aa">
             <thead>
              <tr>
               <th scope="col">
@@ -3259,13 +3369,13 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="56cb0258-d230-4962-9c3b-254bfe77f6aa">
-           <h6 id="2af7e3b1-d458-4e00-bb2f-1e2d69cb16b8">
+          <div class="ms-3" id="487fde61-3e45-4313-a7e8-d80ab7ca66a9">
+           <h6 id="e79cde6c-302f-41b6-9fe8-1defc82e5f5b">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="bc8f5065-123f-490c-890f-c4af86ac46fd"><code class="python">from bootwrap import Form, CheckboxInput
+           <pre id="ce935d2a-453a-49dd-8af0-cca0ff5bdfaa"><code class="python">from bootwrap import Form, CheckboxInput
 
 Form(
     CheckboxInput('One', 'opt').as_radio(1),
@@ -3275,60 +3385,60 @@ Form(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="457a8eb6-c830-40bd-a024-08ce74db10e8">
-           <form enctype="multipart/form-data" id="18e9b902-4b4c-4775-afc5-ae36e8dff323" method="POST">
+          <div class="ms-3" id="5f42757d-c533-47ce-b2ae-593c010a071f">
+           <form enctype="multipart/form-data" id="d8fd578a-d112-4781-99e8-9904abef7655" method="POST">
             <div class="form-check">
-             <input autocomplete="off" class="form-check-input" id="e84c7a1c-72c0-4432-bd3d-975bf287d4e6" name="opt" type="radio" value="1"/>
-             <label class="form-check-label" for="e84c7a1c-72c0-4432-bd3d-975bf287d4e6">
+             <input autocomplete="off" class="form-check-input" id="2886bc8e-d21a-424c-ae55-7da09a1dbcaf" name="opt" type="radio" value="1"/>
+             <label class="form-check-label" for="2886bc8e-d21a-424c-ae55-7da09a1dbcaf">
               One
              </label>
             </div>
             <div class="form-check">
-             <input autocomplete="off" checked="" class="form-check-input" id="51a79ccc-9827-40f7-a84f-5612f3ce3786" name="opt" type="radio" value="2"/>
-             <label class="form-check-label" for="51a79ccc-9827-40f7-a84f-5612f3ce3786">
+             <input autocomplete="off" checked="" class="form-check-input" id="fd5b8035-77ec-4afb-b8ef-58aa9401c5ff" name="opt" type="radio" value="2"/>
+             <label class="form-check-label" for="fd5b8035-77ec-4afb-b8ef-58aa9401c5ff">
               Two
              </label>
             </div>
             <div class="form-check">
-             <input autocomplete="off" class="form-check-input" disabled="" id="7d450db4-676c-46c1-a1e9-120d3171bc66" name="opt" type="radio" value="3"/>
-             <label class="form-check-label" for="7d450db4-676c-46c1-a1e9-120d3171bc66">
+             <input autocomplete="off" class="form-check-input" disabled="" id="f88312ba-50c1-4d00-8d33-e5e9c2d3c4a4" name="opt" type="radio" value="3"/>
+             <label class="form-check-label" for="f88312ba-50c1-4d00-8d33-e5e9c2d3c4a4">
               Three
              </label>
             </div>
             <div class="form-check">
-             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="f4771552-bdf6-49f7-bd83-281aaf2c1eea" name="opt" type="radio" value="4"/>
-             <label class="form-check-label" for="f4771552-bdf6-49f7-bd83-281aaf2c1eea">
+             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="ea98687a-3045-409d-817a-8fbdaf6a12a4" name="opt" type="radio" value="4"/>
+             <label class="form-check-label" for="ea98687a-3045-409d-817a-8fbdaf6a12a4">
               Four
              </label>
             </div>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="55cdcd20-24b0-4149-9287-c2d1f4dc286b">
-          <div class="d-flex justify-content-between" id="313473e7-7bd6-4e15-8d8f-fef200a86483">
-           <h4 id="1474814b-58b5-415b-a11f-be954eee82ef">
+         <div class="mt-5" id="ef556a02-538a-40c7-8361-9078adb15ad5">
+          <div class="d-flex justify-content-between" id="92850d01-a6bc-4d79-b74e-ff279a56db8c">
+           <h4 id="189de148-4a26-4263-852c-2357430f9a6e">
             Method
-            <span class="text-primary" id="1ba3d42a-03e5-4dae-8045-06185adc3371">
+            <span class="text-primary" id="eef6c4f8-e1e0-49d9-a6a3-b2c11ad85c6b">
              as_switch
             </span>
            </h4>
-           <div id="67d68554-9e77-4ac1-8be2-4e69a9dac642">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#9c040191-1623-4caa-ac43-9fdf783b016a" data-bs-toggle="collapse" id="11006fa8-8223-417e-af8c-ce09cfbaff95" onclick="return false;" type="button">
+           <div id="4266b8c8-5d30-4036-96f3-97003eb158b9">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#e660008f-ad13-4107-9d94-bd9fbe02ccb4" data-bs-toggle="collapse" id="2a1ae6f7-a1ad-4dfb-b59c-6d1b3568ff28" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="908785d2-c387-4a42-8692-fda1939a0091">
+          <span class="text-muted" id="0b0d717d-cdff-44ea-a7f0-f194393dd08b">
            Sets the "switch"-style to the check box.
           </span>
-          <pre id="fc10e735-020e-48bc-8f23-c70005908655"><code class="python">as_switch()</code></pre>
-          <div class="ms-3 collapse" id="9c040191-1623-4caa-ac43-9fdf783b016a">
-           <h6 id="b601672d-f43f-4f31-9285-59f4b951c302">
+          <pre id="e19a4796-488a-43ac-a7ef-1676a7c51a82"><code class="python">as_switch()</code></pre>
+          <div class="ms-3 collapse" id="e660008f-ad13-4107-9d94-bd9fbe02ccb4">
+           <h6 id="dfe19e70-a3db-48e3-b354-18eb3a522d52">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="ef40887a-2b37-4fb6-9aa3-9e6dd95e12e8">
+           <table class="table table-sm bg-light" id="3d23c14d-6b45-4533-8d75-f8ee37d88cdd">
             <thead>
              <tr>
               <th scope="col">
@@ -3361,13 +3471,13 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="661ec28e-cdb0-40a0-99aa-253197bcd6a1">
-           <h6 id="75edd333-f01f-4d71-85b3-c27217e14c58">
+          <div class="ms-3" id="32282837-8ae4-436b-84c5-cd709a7fdb6c">
+           <h6 id="ee6fab08-8b87-4e2e-bc34-836e05a6bf5f">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="14bbd1f8-7b9f-4ffd-a626-3c9bdfb1a3bc"><code class="python">from bootwrap import Form, CheckboxInput
+           <pre id="e6c06ad7-49bd-4535-93c5-f72700b4d6cc"><code class="python">from bootwrap import Form, CheckboxInput
 
 Form(
     CheckboxInput('One', 'opt1').as_switch(),
@@ -3377,60 +3487,60 @@ Form(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="1d89a920-4924-4f38-a6ba-f18f966bf0c4">
-           <form enctype="multipart/form-data" id="43169392-5bfa-4143-b6eb-d6958f78956d" method="POST">
+          <div class="ms-3" id="18471da3-d390-4ac6-b74e-8ade7f8cc1ce">
+           <form enctype="multipart/form-data" id="c2f56464-1d26-4863-8822-a02417e6a384" method="POST">
             <div class="form-check form-switch">
-             <input autocomplete="off" class="form-check-input" id="ff7e197f-29ff-424f-8c9f-aff03979602b" name="opt1" type="checkbox"/>
-             <label class="form-check-label" for="ff7e197f-29ff-424f-8c9f-aff03979602b">
+             <input autocomplete="off" class="form-check-input" id="6303ebef-f6e0-4c63-9014-1995519497cb" name="opt1" type="checkbox"/>
+             <label class="form-check-label" for="6303ebef-f6e0-4c63-9014-1995519497cb">
               One
              </label>
             </div>
             <div class="form-check form-switch">
-             <input autocomplete="off" checked="" class="form-check-input" id="a7714b1c-6c2c-47f9-83be-ef462fb9bff3" name="opt2" type="checkbox"/>
-             <label class="form-check-label" for="a7714b1c-6c2c-47f9-83be-ef462fb9bff3">
+             <input autocomplete="off" checked="" class="form-check-input" id="3c768927-d88d-4449-b360-56a0748cf3b6" name="opt2" type="checkbox"/>
+             <label class="form-check-label" for="3c768927-d88d-4449-b360-56a0748cf3b6">
               Two
              </label>
             </div>
             <div class="form-check form-switch">
-             <input autocomplete="off" class="form-check-input" disabled="" id="2b04e909-e731-47ba-a0a8-71836a0070f5" name="opt3" type="checkbox"/>
-             <label class="form-check-label" for="2b04e909-e731-47ba-a0a8-71836a0070f5">
+             <input autocomplete="off" class="form-check-input" disabled="" id="0227082a-e9cf-437f-8dbb-d6d7e57452e0" name="opt3" type="checkbox"/>
+             <label class="form-check-label" for="0227082a-e9cf-437f-8dbb-d6d7e57452e0">
               Three
              </label>
             </div>
             <div class="form-check form-switch">
-             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="f4cbd1de-efb8-4e13-aaa6-c3da2dbb1acc" name="opt4" type="checkbox"/>
-             <label class="form-check-label" for="f4cbd1de-efb8-4e13-aaa6-c3da2dbb1acc">
+             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="5a1b8726-d6a0-4766-8f45-c26112441072" name="opt4" type="checkbox"/>
+             <label class="form-check-label" for="5a1b8726-d6a0-4766-8f45-c26112441072">
               Four
              </label>
             </div>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="89c16fea-3dec-4efe-9733-3b8ee242356b">
-          <div class="d-flex justify-content-between" id="9a0189f0-30b3-40e8-89fc-ac2490f72265">
-           <h4 id="a48d1e4a-0d91-4e66-bfa1-6c25fdbc45c2">
+         <div class="mt-5" id="98c2b23f-a91b-4520-b0ce-b5779f3698f1">
+          <div class="d-flex justify-content-between" id="bf946c4f-85d4-44fa-9b89-8ee3e354004a">
+           <h4 id="3624ec68-e64b-4053-95a9-08164d8d8b92">
             Method
-            <span class="text-primary" id="c6e69a6d-2127-4aa5-b5a1-a35d301c2e39">
+            <span class="text-primary" id="e1b0488a-cdba-499d-84cc-4fd8afcf49b0">
              inline
             </span>
            </h4>
-           <div id="adb22da2-8769-47e8-b58b-d5e064f66fd3">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#6451d68c-f18e-43a8-8881-bffa6cc2e102" data-bs-toggle="collapse" id="d0173f1a-7280-4039-b880-2a4cad971abf" onclick="return false;" type="button">
+           <div id="e7aaa1e0-154f-4bc7-ad90-dd1d8adc4f7b">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#20cbca95-718a-4d3f-a37e-3098a269a4c5" data-bs-toggle="collapse" id="213627a1-af06-4e09-be2a-dc175580348f" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="230bce16-8433-4b9a-b0fb-ddfc2b6d78fa">
+          <span class="text-muted" id="9e1096a0-86c1-4bc6-bc5f-0905fcb88b8f">
            Sets the check box in line.
           </span>
-          <pre id="45dbf2dd-9fb8-4cb8-b76c-8ecfd84ed273"><code class="python">inline()</code></pre>
-          <div class="ms-3 collapse" id="6451d68c-f18e-43a8-8881-bffa6cc2e102">
-           <h6 id="390e92ef-b69c-4dff-9f71-11b778836cd4">
+          <pre id="aaa7e03b-8d3f-4594-892b-9a8189acb93f"><code class="python">inline()</code></pre>
+          <div class="ms-3 collapse" id="20cbca95-718a-4d3f-a37e-3098a269a4c5">
+           <h6 id="01cd7392-0377-462e-b919-1b923ce7b6f1">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="3c1bcdc0-f660-42e8-b2d6-f04050ed822b">
+           <table class="table table-sm bg-light" id="0b8555a0-babd-4a1f-9e60-d5d7c032294e">
             <thead>
              <tr>
               <th scope="col">
@@ -3463,13 +3573,13 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="5565e505-3950-4785-b5a0-1d6e3e2af0d6">
-           <h6 id="fc40f68f-a39e-46a4-8a07-c2fd82aa44b3">
+          <div class="ms-3" id="766a87d4-00b0-4601-88f5-cfd5f97bcfdc">
+           <h6 id="061d8c23-02e3-48cc-b385-bd65a52e4a81">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="b0b961cc-d6e4-40ec-a354-8ee9afc0addf"><code class="python">from bootwrap import Form, CheckboxInput
+           <pre id="af63e140-3b2a-4072-8a8d-dcd282514420"><code class="python">from bootwrap import Form, CheckboxInput
 
 Form(
     CheckboxInput('One', 'opt1').inline(),
@@ -3479,29 +3589,29 @@ Form(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="41afb378-ea8b-441d-8bd6-ffec728ce7df">
-           <form enctype="multipart/form-data" id="a12baa32-8070-4554-8497-a81298ed5b8f" method="POST">
+          <div class="ms-3" id="7e4e1be6-f31a-40f5-b9c7-eb1d193afd34">
+           <form enctype="multipart/form-data" id="0ab8580c-6f3a-42f2-bc46-dc24dbc479ff" method="POST">
             <div class="form-check form-check-inline">
-             <input autocomplete="off" class="form-check-input" id="33b174ee-2590-4162-811a-2c0536fb0be7" name="opt1" type="checkbox"/>
-             <label class="form-check-label" for="33b174ee-2590-4162-811a-2c0536fb0be7">
+             <input autocomplete="off" class="form-check-input" id="95fd066b-44eb-417f-ae15-f974ca6329ae" name="opt1" type="checkbox"/>
+             <label class="form-check-label" for="95fd066b-44eb-417f-ae15-f974ca6329ae">
               One
              </label>
             </div>
             <div class="form-check form-check-inline">
-             <input autocomplete="off" checked="" class="form-check-input" id="c7fa66e0-310c-408c-a15c-56bba03952bc" name="opt2" type="checkbox"/>
-             <label class="form-check-label" for="c7fa66e0-310c-408c-a15c-56bba03952bc">
+             <input autocomplete="off" checked="" class="form-check-input" id="f2a4c294-cfbf-49ee-be91-079e3ca7e241" name="opt2" type="checkbox"/>
+             <label class="form-check-label" for="f2a4c294-cfbf-49ee-be91-079e3ca7e241">
               Two
              </label>
             </div>
             <div class="form-check form-check-inline">
-             <input autocomplete="off" class="form-check-input" disabled="" id="b8200a3c-c70d-45e8-9f69-185f4dc56c35" name="opt3" type="checkbox"/>
-             <label class="form-check-label" for="b8200a3c-c70d-45e8-9f69-185f4dc56c35">
+             <input autocomplete="off" class="form-check-input" disabled="" id="acc1d9d5-dfda-4191-b597-a7da686d565d" name="opt3" type="checkbox"/>
+             <label class="form-check-label" for="acc1d9d5-dfda-4191-b597-a7da686d565d">
               Three
              </label>
             </div>
             <div class="form-check form-check-inline">
-             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="4ea00164-6ded-4713-a743-13349beec719" name="opt4" type="checkbox"/>
-             <label class="form-check-label" for="4ea00164-6ded-4713-a743-13349beec719">
+             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="87ba7fa0-bc7b-4a76-b2a8-463f2a3f5c84" name="opt4" type="checkbox"/>
+             <label class="form-check-label" for="87ba7fa0-bc7b-4a76-b2a8-463f2a3f5c84">
               Four
              </label>
             </div>
@@ -3510,32 +3620,32 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="2e140b6c-ce02-4345-b1ad-565ac4375179">
-        <div class="mt-5" id="da5bdc21-412a-4a17-870f-f875c58e2400">
-         <div class="d-flex justify-content-between" id="ea8751b3-c0b6-4f00-8d75-875577cc24e4">
-          <h1 id="310ea877-4aba-4e47-876d-5201e5723b2b">
+       <div class="tab-pane fade" id="e2596fbc-7048-441e-a7ba-a93277c3c0f6">
+        <div class="mt-5" id="03bb48cf-99b1-4142-a142-10cf4c99bb8f">
+         <div class="d-flex justify-content-between" id="11abf1a5-813d-44f8-88df-63d5eefca88a">
+          <h1 id="bafded3b-da96-47ce-98ae-924d0d76b40c">
            Class
-           <span class="text-primary" id="5c37a202-c8fc-4417-a5dc-5ac180b7464a">
+           <span class="text-primary" id="09a1deb5-482e-497f-a113-8a8d2d7a9ab0">
             TextInput
            </span>
           </h1>
-          <div id="3b16d235-fc74-40d4-8384-16d76543772f">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#d4fd6c7c-7beb-4cc7-ae38-0dda70bab3d0" data-bs-toggle="collapse" id="c41a9189-4114-4606-858b-72b6b1975f66" onclick="return false;" type="button">
+          <div id="c192e022-53c2-4f16-b0cf-0de372a3fbf2">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#1a5fc982-df58-4191-a42f-2e67583665f8" data-bs-toggle="collapse" id="271e85ac-e166-4107-8328-0b259dcf42fc" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="30de1e5e-3f7a-457f-ae11-fbfe55205b1b">
+         <span class="text-muted" id="508c0909-ba17-4738-a49f-edbbb9491ac0">
           A text input.
          </span>
-         <pre id="64932272-a56b-41fc-9586-ecd03a26710c"><code class="python">TextInput(label, name, value=None, placeholder=None)</code></pre>
-         <div class="ms-3 collapse" id="d4fd6c7c-7beb-4cc7-ae38-0dda70bab3d0">
-          <h6 id="d1452a5a-00ed-4732-8b78-1abe11232a64">
+         <pre id="31689428-eaad-45d0-8ec7-cae2355d72b1"><code class="python">TextInput(label, name, value=None, placeholder=None)</code></pre>
+         <div class="ms-3 collapse" id="1a5fc982-df58-4191-a42f-2e67583665f8">
+          <h6 id="af6b94ba-a73d-4bec-8418-7266933d3792">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="2d819b31-d6db-49c0-ac75-4513b7e4e13b">
+          <table class="table table-sm bg-light" id="87daa066-5d6b-4dd8-b5bc-f9348c854966">
            <thead>
             <tr>
              <th scope="col">
@@ -3613,7 +3723,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="784fea10-9608-4e19-8aea-14268703765c">
+         <p id="3864de7d-b0d4-4826-b019-65d9aa60076d">
           Use the
           <code>
            as_disabled()
@@ -3625,13 +3735,13 @@ Form(
           </code>
           component.
          </p>
-         <div class="ms-3" id="1dca0a48-cde6-474b-b993-3f89aef0c8b4">
-          <h6 id="0b4acbc2-87a3-4d8f-a0a2-33dcf59b937c">
+         <div class="ms-3" id="057fab5f-b105-4389-bad5-7a761b0043c6">
+          <h6 id="84ac9b16-3839-4914-b3ab-2e18d0186f9f">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="2abaf2d4-92a8-434d-acbe-6e3df820faa6"><code class="python">from bootwrap import Form, TextInput
+          <pre id="88d24350-1385-4630-a58d-d27b5c1c2d24"><code class="python">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Text1', 'text'),
@@ -3641,67 +3751,67 @@ Form(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="0be1f928-dc73-40c7-b753-4c968a10609e">
-          <form enctype="multipart/form-data" id="0988fa60-498b-43e7-b566-dd5f2e833943" method="POST">
+         <div class="ms-3" id="19e80c36-e1c1-4b8e-bc0f-78c0a7fcad86">
+          <form enctype="multipart/form-data" id="7f5defc0-7f36-4c00-ba9f-90f5e452ffe0" method="POST">
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="f543700d-8619-4234-ad2d-05a9e6829363">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="2a21daab-5c03-49d7-92d1-90e73f78c756">
              Text1
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="f543700d-8619-4234-ad2d-05a9e6829363" name="text" type="text"/>
+             <input class="form-control" id="2a21daab-5c03-49d7-92d1-90e73f78c756" name="text" type="text"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="a63f9b6d-dd47-48dc-bddc-095e46fd5dee">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="b2910ab6-580d-4af7-870d-7eb0f860f230">
              Text2
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="a63f9b6d-dd47-48dc-bddc-095e46fd5dee" name="text" placeholder="type here" type="text"/>
+             <input class="form-control" id="b2910ab6-580d-4af7-870d-7eb0f860f230" name="text" placeholder="type here" type="text"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="07fe2d3d-bd6c-4343-aa3f-70e6e9e34801">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="356cfea8-ffc6-410c-9f39-46865ac9e24a">
              Text3
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="07fe2d3d-bd6c-4343-aa3f-70e6e9e34801" name="text" type="text" value="Hello World!"/>
+             <input class="form-control" id="356cfea8-ffc6-410c-9f39-46865ac9e24a" name="text" type="text" value="Hello World!"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="9b2ec23f-8b54-4844-8b50-75ed2c52eace">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="7bd2fa08-5503-46a8-b21f-d07a1da747b9">
              Text4
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" disabled="" id="9b2ec23f-8b54-4844-8b50-75ed2c52eace" name="text" type="text"/>
+             <input class="form-control" disabled="" id="7bd2fa08-5503-46a8-b21f-d07a1da747b9" name="text" type="text"/>
             </div>
            </div>
           </form>
          </div>
-         <div class="mt-5" id="27496b74-577d-470c-a99a-fcefb051fda8">
-          <div class="d-flex justify-content-between" id="e4c7975f-3eb5-459c-bc0e-8b0e0fcd8a22">
-           <h4 id="91befc5f-a438-49bd-965e-1bdc7e27d5de">
+         <div class="mt-5" id="88b58a51-0b34-4278-8f9d-222394a356b0">
+          <div class="d-flex justify-content-between" id="a77f5567-0260-4f35-9293-c839ec760f96">
+           <h4 id="7349276a-dd27-47da-9b55-0bdfe8fb2be7">
             Method
-            <span class="text-primary" id="421a01f7-4df3-441a-9a52-2176a20abdec">
+            <span class="text-primary" id="1dd3efea-9fa1-44b7-addb-4a803788be12">
              for_email
             </span>
            </h4>
-           <div id="83ee61a8-8e1f-4895-8270-728220879ef7">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#40b756ff-5304-454d-8482-4eed20c00078" data-bs-toggle="collapse" id="4dcdd1db-2bdd-40ae-8764-766135e11abd" onclick="return false;" type="button">
+           <div id="7a051b4d-7cc7-440a-be94-2034c45920ff">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#b55b4135-28a3-43db-9296-4f88392d8a93" data-bs-toggle="collapse" id="8dab59cd-462b-44d6-8a7c-e369cd9fcf39" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="a390c01b-6265-4e73-a7ba-dd0c7b5cdb41">
+          <span class="text-muted" id="589636f4-a2c2-4b80-a88a-52ecd4726aec">
            Configuring input for entering email.
           </span>
-          <pre id="38292396-f617-4d41-b616-34a3099d6323"><code class="python">for_email()</code></pre>
-          <div class="ms-3 collapse" id="40b756ff-5304-454d-8482-4eed20c00078">
-           <h6 id="9b602cbb-1e84-467f-abfc-887dcc792575">
+          <pre id="8b7c39ce-79b1-402d-975e-1e273d76da07"><code class="python">for_email()</code></pre>
+          <div class="ms-3 collapse" id="b55b4135-28a3-43db-9296-4f88392d8a93">
+           <h6 id="808a4c87-dd12-455f-be86-e0d684f22254">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="3de5cefc-735e-435e-957c-57ee364b18dd">
+           <table class="table table-sm bg-light" id="ae9c5b47-2b3a-48e4-a69b-25425556b130">
             <thead>
              <tr>
               <th scope="col">
@@ -3734,57 +3844,57 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="76c2cf96-254e-46db-a9fe-785484b55cca">
-           <h6 id="29f127c0-cc69-4e4e-8a9b-cd054f5eebaf">
+          <div class="ms-3" id="216e4b72-198e-46c4-93af-d58d7b8d5f68">
+           <h6 id="ab73e140-df9a-4a7e-8ff3-889a8ffcc89b">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="62e0a37b-0bb6-4a1d-b7e9-3e67a6686ca7"><code class="python">from bootwrap import Form, TextInput
+           <pre id="918dd879-30af-4122-8022-940202b69ba4"><code class="python">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Email', 'email', 'my@email.com').for_email()
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="088db73f-3aaf-48dc-8dbc-4beba7e778ce">
-           <form enctype="multipart/form-data" id="4e8e8b02-8533-44be-b816-84407f950209" method="POST">
+          <div class="ms-3" id="ef93b2a2-2cb8-46de-b777-c8b88b87f806">
+           <form enctype="multipart/form-data" id="11ee52fd-59a7-43f9-967a-9b6f9f073b02" method="POST">
             <div class="form-group row">
-             <label class="col-sm-4 col-form-label d-flex align-items-center" for="49fd09c1-3e80-4448-8e76-49e2024cace3">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="0b44d711-aafa-4fd4-9cfc-d23915417f61">
               Email
              </label>
              <div class="col-sm-8 d-flex align-items-center">
-              <input class="form-control" id="49fd09c1-3e80-4448-8e76-49e2024cace3" name="email" type="email" value="my@email.com"/>
+              <input class="form-control" id="0b44d711-aafa-4fd4-9cfc-d23915417f61" name="email" type="email" value="my@email.com"/>
              </div>
             </div>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="e0049efa-6cd0-47bb-8587-6fc3ee1a0e3d">
-          <div class="d-flex justify-content-between" id="91fd4f22-7642-4f5f-b34f-c64c0e5ca6ad">
-           <h4 id="37812b6a-d9e5-401c-824b-aff103731767">
+         <div class="mt-5" id="3f5efd03-f3af-418b-91f2-887d6e07f05f">
+          <div class="d-flex justify-content-between" id="f00893bc-e879-4a89-9b12-51cdb220753a">
+           <h4 id="b3442c32-8d20-46c8-9873-03620a83c929">
             Method
-            <span class="text-primary" id="ad9238c0-6f0b-4cf2-a0e9-d447b5007528">
+            <span class="text-primary" id="bb4262a8-b378-419f-9c71-b7d6670da1fe">
              for_password
             </span>
            </h4>
-           <div id="e576a1d3-7e41-4bf0-b684-ff7c641e1ee1">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#58e66c91-bbb0-4799-90a7-3daaaeb5ce83" data-bs-toggle="collapse" id="540f2d49-6c52-4851-af84-6cf0edd6ecb3" onclick="return false;" type="button">
+           <div id="36a25089-1d02-44fe-b264-04f62f13e91a">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#36ae208e-eab3-480b-a8cd-8634060f6dec" data-bs-toggle="collapse" id="b1daee8b-7618-4182-8a64-1d9023e61ad6" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="e9a29e99-132a-4d67-9be3-d01e90bec512">
+          <span class="text-muted" id="c8dba15a-fb5b-4f53-b84d-264a200ee260">
            Configuring input for entering password.
           </span>
-          <pre id="4945248d-e3dd-4808-b373-415e1852761b"><code class="python">for_password()</code></pre>
-          <div class="ms-3 collapse" id="58e66c91-bbb0-4799-90a7-3daaaeb5ce83">
-           <h6 id="fb5d682a-f2a7-4b91-8dd1-e0404ce67580">
+          <pre id="a5756123-2440-4145-acce-db9938bc2a48"><code class="python">for_password()</code></pre>
+          <div class="ms-3 collapse" id="36ae208e-eab3-480b-a8cd-8634060f6dec">
+           <h6 id="5dc10747-180c-401f-8700-847a992861a7">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="24770c77-907a-4d57-901c-2089aebd54d4">
+           <table class="table table-sm bg-light" id="ebe02a9f-16ef-4284-b873-da8fc4128040">
             <thead>
              <tr>
               <th scope="col">
@@ -3817,60 +3927,60 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="43281348-51e2-42b5-a5a7-1925c2a693cc">
-           <h6 id="285473c6-5771-42c3-854c-933db3bd328b">
+          <div class="ms-3" id="9bc85c12-9766-44b1-a453-337eb80154bc">
+           <h6 id="e738c62b-a4f8-419d-bd2c-fb51ff002feb">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="3cb52b82-ea4e-4bb4-b66a-09846df7fc47"><code class="python">from bootwrap import Form, TextInput
+           <pre id="c8bd80fb-8806-46f9-b873-80bac6ce980b"><code class="python">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Password', 'password', '********').for_password()
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="59bc0475-592f-43c6-9c10-1d81d4a3f595">
-           <form enctype="multipart/form-data" id="cf9511d6-ac8f-4010-b05a-bed33c8c75a5" method="POST">
+          <div class="ms-3" id="28a91b58-2a27-41a1-81f1-0737811023a4">
+           <form enctype="multipart/form-data" id="616cfdc4-3e43-4e9a-81ff-b5024d3e0b73" method="POST">
             <div class="form-group row">
-             <label class="col-sm-4 col-form-label d-flex align-items-center" for="2a430b9c-93fa-41ae-9090-bd16108a2002">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="8111a5ab-5c65-4685-bc61-77ca696a8767">
               Password
              </label>
              <div class="col-sm-8 d-flex align-items-center">
-              <input class="form-control" id="2a430b9c-93fa-41ae-9090-bd16108a2002" name="password" type="password" value="********"/>
+              <input class="form-control" id="8111a5ab-5c65-4685-bc61-77ca696a8767" name="password" type="password" value="********"/>
              </div>
             </div>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="8e058d5b-92cc-4a70-9249-b21143d7a0f1">
-          <div class="d-flex justify-content-between" id="40c3582c-5428-4bed-9479-b18cecdde6ed">
-           <h4 id="ea816d7e-b9a4-46a1-b484-3fddeff532d6">
+         <div class="mt-5" id="7daffd6b-f88f-4528-aa7c-67fa6923f3a5">
+          <div class="d-flex justify-content-between" id="7e9a9468-e03d-4801-9ebd-a0cf9b385b48">
+           <h4 id="19e34c4f-ab10-42a1-a7b3-358fcc9bf103">
             Method
-            <span class="text-primary" id="95e02e51-984a-4a42-8f13-ee5e11090a88">
+            <span class="text-primary" id="1ff1e6f6-1d39-4eb3-b149-ca1f479f821a">
              with_multirows
             </span>
            </h4>
-           <div id="665176ca-0c47-403c-b9b6-07002cae1285">
-            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#e7481311-8c2a-4e1b-a09d-d77dd23d38c4" data-bs-toggle="collapse" id="8486f82a-7639-417c-bbc5-43358cb32dad" onclick="return false;" type="button">
+           <div id="ecbc4127-52e5-4897-badc-327dde0a7606">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#193a79f2-5988-4e69-9e4e-fb87a3e6d94a" data-bs-toggle="collapse" id="274aa249-824e-4c26-bad7-4794efe225c6" onclick="return false;" type="button">
              Argument
             </button>
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#cf8c75ee-ccc2-412e-9087-7147a22bd60f" data-bs-toggle="collapse" id="97cfc54e-dfac-4d59-b104-49030019bbff" onclick="return false;" type="button">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#6b6640d8-11c7-421b-9e0e-bd287e755d8a" data-bs-toggle="collapse" id="17687032-7be2-4cfb-a7dd-39fc339e3544" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="66b13160-1a01-4b2f-8088-92d93724ecde">
+          <span class="text-muted" id="ed397acd-66fa-45f1-aa19-c5df9ffccb5e">
            Sets the number of rows.
           </span>
-          <pre id="ed23c172-e801-49d8-a7eb-7f9e47b879e6"><code class="python">with_multirows(n)</code></pre>
-          <div class="ms-3 collapse" id="e7481311-8c2a-4e1b-a09d-d77dd23d38c4">
-           <h6 id="bb9c8a5e-9f7a-45d7-bd6c-0108d5d3d5b7">
+          <pre id="f2c18ef4-6691-455d-9701-ab98ecd4d421"><code class="python">with_multirows(n)</code></pre>
+          <div class="ms-3 collapse" id="193a79f2-5988-4e69-9e4e-fb87a3e6d94a">
+           <h6 id="c8f569be-c16f-484a-a9c8-d480fc82307d">
             <strong>
              Arguments
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="b085fab0-41e0-4811-83b4-59d3a1a6d5b0">
+           <table class="table table-sm bg-light" id="85fd6bcf-6741-438d-a8cb-14dac97088fe">
             <thead>
              <tr>
               <th scope="col">
@@ -3903,13 +4013,13 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3 collapse" id="cf8c75ee-ccc2-412e-9087-7147a22bd60f">
-           <h6 id="95f19042-5bda-4f8b-8253-678b55d124bb">
+          <div class="ms-3 collapse" id="6b6640d8-11c7-421b-9e0e-bd287e755d8a">
+           <h6 id="88a462a1-353c-4b5c-abf2-b818d282d51f">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="0a745b49-3317-4428-8920-e1d0a89f874f">
+           <table class="table table-sm bg-light" id="a45ef1ce-bc66-4943-9c49-cd61a2119869">
             <thead>
              <tr>
               <th scope="col">
@@ -3942,27 +4052,27 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="7bd5bf2f-6f44-417f-b511-b25a1f3f6890">
-           <h6 id="e7aa1deb-1756-4bf4-b0e8-f99a31a24d67">
+          <div class="ms-3" id="d66a808f-e1e2-4233-9a1c-eb90f089746b">
+           <h6 id="c0b5f3a7-10af-4707-bd63-56e00b4b9f15">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="8b2af484-d850-4bb9-81ad-4a7dfd58f772"><code class="python">from bootwrap import Form, TextInput
+           <pre id="ed4c8936-09ba-46ab-8d50-ea8fc5b6c014"><code class="python">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Text', 'text').with_multirows(3)
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="95d874de-e47f-48f5-83c5-5b564baaf896">
-           <form enctype="multipart/form-data" id="18c9525d-9727-4db9-94f4-58a149534c95" method="POST">
+          <div class="ms-3" id="79e35d5e-3a94-404b-a052-1b42f550d33a">
+           <form enctype="multipart/form-data" id="648a0446-1d95-48fb-9f46-15c95ce5002e" method="POST">
             <div class="form-group row">
-             <label class="col-sm-4 col-form-label d-flex align-items-center" for="bf8c79a3-2b08-43f4-b952-21373e1c2e8d">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="661431f3-b6d9-43e8-bbae-c4816b605170">
               Text
              </label>
              <div class="col-sm-8 d-flex align-items-center">
-              <textarea class="form-control" id="bf8c79a3-2b08-43f4-b952-21373e1c2e8d" name="text" rows="3">
+              <textarea class="form-control" id="661431f3-b6d9-43e8-bbae-c4816b605170" name="text" rows="3">
                     
                 </textarea>
              </div>
@@ -3972,32 +4082,32 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="06eb359b-25a2-4f29-9e7f-f81d9e8ab712">
-        <div class="mt-5" id="71be9f25-6f4e-4452-9e1d-10b954b5cb5b">
-         <div class="d-flex justify-content-between" id="b82db7c4-82a3-46ea-be6e-f357aec8b7a7">
-          <h1 id="a5668d7f-d764-4903-9af7-135dc0781f41">
+       <div class="tab-pane fade" id="d0b2aa22-a10a-491d-b639-4544e5ebb134">
+        <div class="mt-5" id="2a72ef97-b4b7-42e8-a2a5-0c9827bccb80">
+         <div class="d-flex justify-content-between" id="6db767d3-dc6e-46ec-8d79-90d1a64cd7bd">
+          <h1 id="c804291c-894b-4010-af0d-9e97136806e1">
            Class
-           <span class="text-primary" id="f783d13b-46a9-467d-846d-d2babf0ec2f7">
+           <span class="text-primary" id="56b1e007-f86c-4124-b88f-d195f1101556">
             NumericInput
            </span>
           </h1>
-          <div id="9daaa47e-718b-47fe-b068-39451b972e8e">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#64bffd65-f133-43bf-b1e1-abc2c4f9e7eb" data-bs-toggle="collapse" id="672de64c-4e14-48c4-b4ac-b4d50ae73e6a" onclick="return false;" type="button">
+          <div id="3fcf88c9-f007-432a-9214-65fec03cd15a">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#294f7ce4-52e7-4d77-a593-f74664b012ad" data-bs-toggle="collapse" id="91dcaffc-0b62-4998-8560-35761fdcc75d" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="69c5c925-1bb9-49d7-a5f6-f4f4c46b119c">
+         <span class="text-muted" id="8eb22efc-e0e7-48ca-b19a-b05fa8b1ddde">
           A numeric input.
          </span>
-         <pre id="757de0b1-1185-41f0-a2bd-54c95ecc656a"><code class="python">NumericInput(label, name, value=None, placeholder=None)</code></pre>
-         <div class="ms-3 collapse" id="64bffd65-f133-43bf-b1e1-abc2c4f9e7eb">
-          <h6 id="60a23523-9903-4236-ab3d-0776e98f82eb">
+         <pre id="18e6fd4c-f00f-4d5b-9565-2267f1e4f1ae"><code class="python">NumericInput(label, name, value=None, placeholder=None)</code></pre>
+         <div class="ms-3 collapse" id="294f7ce4-52e7-4d77-a593-f74664b012ad">
+          <h6 id="5d18233f-9db0-4d3e-ab18-9ddd0c084339">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="facaea00-5006-4ebc-8c4e-9097cf11a28a">
+          <table class="table table-sm bg-light" id="3931688a-6f1b-412b-8cea-031c53838ad2">
            <thead>
             <tr>
              <th scope="col">
@@ -4075,7 +4185,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="af8245c7-c35d-427d-8b2f-c9a42f1356ce">
+         <p id="193a8fa9-1cc7-4765-ab56-3eac4563df0e">
           Use the
           <code>
            as_disabled()
@@ -4087,13 +4197,13 @@ Form(
           </code>
           component.
          </p>
-         <div class="ms-3" id="74b19e6a-3ddf-4684-ad4e-86fea16bdb04">
-          <h6 id="ed94e7a9-9eaa-4c7f-9c80-c080cad4d6bf">
+         <div class="ms-3" id="4bbfca69-507d-426e-b2c2-3bac46e7eb19">
+          <h6 id="4f834f84-d221-44a7-ab1a-d7f5430a0baf">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="a1b3c60e-c633-44f3-8b86-30db4ec419b4"><code class="python">from bootwrap import Form, NumericInput
+          <pre id="28ab0514-96a0-4257-a03f-242ebc63dadb"><code class="python">from bootwrap import Form, NumericInput
 
 Form(
     NumericInput('Number1', 'number'),
@@ -4103,70 +4213,70 @@ Form(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="c0d02d96-042e-4896-a021-dcbebfc37c64">
-          <form enctype="multipart/form-data" id="2db11285-5aa3-4b44-acb7-858ebdb9d5bb" method="POST">
+         <div class="ms-3" id="e0004c34-afd8-4468-b518-bba73ab3d572">
+          <form enctype="multipart/form-data" id="3872dda6-131b-4744-a39d-448f124ffc7a" method="POST">
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="41eed0c6-bcb5-4cde-bfd9-d43115fa6573">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="c82e808d-55b8-46cb-ad98-26959072bbeb">
              Number1
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="41eed0c6-bcb5-4cde-bfd9-d43115fa6573" name="number" type="number"/>
+             <input class="form-control" id="c82e808d-55b8-46cb-ad98-26959072bbeb" name="number" type="number"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="974df273-ad68-491f-9465-134e715c1d21">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="85611b76-216e-44e4-82c1-72e4e2251073">
              Number2
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="974df273-ad68-491f-9465-134e715c1d21" name="number" placeholder="type here" type="number"/>
+             <input class="form-control" id="85611b76-216e-44e4-82c1-72e4e2251073" name="number" placeholder="type here" type="number"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="9a7b38da-5139-448b-bf41-75d2d242a57c">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="7784df10-ae27-4aa4-91ff-2b63a632f7f1">
              Number3
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="9a7b38da-5139-448b-bf41-75d2d242a57c" name="number" type="number" value="123"/>
+             <input class="form-control" id="7784df10-ae27-4aa4-91ff-2b63a632f7f1" name="number" type="number" value="123"/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="9a83fe29-7953-4b9f-a351-703d3cd42d92">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="cbeb4915-65f6-4454-89e0-bde7fdee24dc">
              Number4
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" disabled="" id="9a83fe29-7953-4b9f-a351-703d3cd42d92" name="number" type="number"/>
+             <input class="form-control" disabled="" id="cbeb4915-65f6-4454-89e0-bde7fdee24dc" name="number" type="number"/>
             </div>
            </div>
           </form>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="8c2d1395-cc41-49e2-8a3f-aa5e681f777f">
-        <div class="mt-5" id="2ef31d9c-8f84-49c5-a733-b8eb4cac9396">
-         <div class="d-flex justify-content-between" id="84c2783b-fbf5-489a-8c65-45fe7a0c9010">
-          <h1 id="1a160cfb-b20e-43d9-9694-19708332db08">
+       <div class="tab-pane fade" id="dd2b72cd-2c33-4985-849d-36e223cb3e07">
+        <div class="mt-5" id="09d32e27-0740-4c13-b4ad-f9c02a9a0536">
+         <div class="d-flex justify-content-between" id="6c8a9390-20cc-458d-a2e9-8694b1c3414a">
+          <h1 id="24161aac-2d33-454f-aa36-2d77f50a807e">
            Class
-           <span class="text-primary" id="79d658bd-c3cb-4057-8ab2-087522a1c946">
+           <span class="text-primary" id="2bc1ea82-a5db-4d73-bbb0-160b62f2c83d">
             SelectInput
            </span>
           </h1>
-          <div id="e78fb441-0816-4094-b1f5-648f28a58539">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#9bfe8f22-f5fa-4d8d-89e5-d398de611ff3" data-bs-toggle="collapse" id="2432b858-fdf5-4653-b93b-230796da262c" onclick="return false;" type="button">
+          <div id="9987d46c-8393-45bf-94ae-1d23d888c78a">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#65f9e63e-2876-48bc-807f-6efdfd50a6c4" data-bs-toggle="collapse" id="e903b68f-a501-4556-b50a-426ba324ca27" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="488e9319-dbd9-4b83-9234-35a5fa60670f">
+         <span class="text-muted" id="a4ea9ca0-80bc-44c2-88d3-46406099a06b">
           A select input.
          </span>
-         <pre id="0576d09e-950b-48dc-bfdd-2edf484fd462"><code class="python">SelectInput(label, name, value=None, options=None)</code></pre>
-         <div class="ms-3 collapse" id="9bfe8f22-f5fa-4d8d-89e5-d398de611ff3">
-          <h6 id="61ef3758-d449-49ec-9679-53f9f572ffcc">
+         <pre id="c7551653-c27b-42b6-9823-ed973ac5b081"><code class="python">SelectInput(label, name, value=None, options=None)</code></pre>
+         <div class="ms-3 collapse" id="65f9e63e-2876-48bc-807f-6efdfd50a6c4">
+          <h6 id="caf8ec1d-9bcc-4d44-bfc3-baaee00a07d1">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="22190a26-a86d-471b-83d9-92336361d064">
+          <table class="table table-sm bg-light" id="725257b7-f827-4462-bdbe-533b82cb6395">
            <thead>
             <tr>
              <th scope="col">
@@ -4244,7 +4354,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="a0e6642c-e3a5-4af3-8457-c6f6f48ba198">
+         <p id="116baa40-ed42-4e8a-8fbd-29d565f365c3">
           Use the
           <code>
            as_disabled()
@@ -4256,13 +4366,13 @@ Form(
           </code>
           component.
          </p>
-         <div class="ms-3" id="da2b7758-d88c-459c-8bd8-f37d866ec449">
-          <h6 id="fbee8cc6-2b18-4827-a6c5-a486960f7a20">
+         <div class="ms-3" id="ac5d3c74-a73b-425d-94b1-2aeeb580b4f3">
+          <h6 id="675993aa-a9a5-4368-bdf1-fda4deec0c05">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="d347641b-25b3-45fb-92f0-fa277b72e29e"><code class="python">from bootwrap import Form, SelectInput
+          <pre id="123cdfd5-6edf-4510-a2d9-e2c643998419"><code class="python">from bootwrap import Form, SelectInput
 
 options = [
     SelectInput.Option('One', 1),
@@ -4276,39 +4386,39 @@ Form(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="07f2f2ea-37ca-4844-a5f5-c00f7c96f889">
-          <form enctype="multipart/form-data" id="f6591e3c-c83f-4b21-94d7-c62d357c51d2" method="POST">
+         <div class="ms-3" id="c2b6e15e-af05-405a-a6fe-905b4e83c4db">
+          <form enctype="multipart/form-data" id="bcb4d5ac-239a-410d-8e51-92a3a278350c" method="POST">
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="4341c885-6bd5-4519-a2c1-2b5663eff13b">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="dedd30e9-2063-47f4-bb0f-5bb8c0dc173d">
              Selector1
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <select autocomplete="off" class="form-control" id="4341c885-6bd5-4519-a2c1-2b5663eff13b" name="choice">
-              <option id="7962446a-726e-478b-bb2b-9ba5377eb96a" value="1">
+             <select autocomplete="off" class="form-control" id="dedd30e9-2063-47f4-bb0f-5bb8c0dc173d" name="choice">
+              <option id="cc878e5a-e7a5-4ef9-8f2a-b989a6972e9d" value="1">
                One
               </option>
-              <option id="d7d51fa2-0678-47ff-b9a3-46d9f33e8855" selected="" value="2">
+              <option id="e0881b6b-24f2-4842-b7a6-ad0a6444d81c" selected="" value="2">
                Two
               </option>
-              <option disabled="" id="c0c5a720-c55d-463c-97dd-21050123ae97" value="3">
+              <option disabled="" id="b49eea16-492b-4bd6-834d-327e6803067a" value="3">
                Three
               </option>
              </select>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="2caa8fbe-c859-4d08-9f3a-b296132f31e1">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="c049992c-5675-4eaf-89c4-15e49a364ead">
              Selector2
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <select autocomplete="off" class="form-control" disabled="" id="2caa8fbe-c859-4d08-9f3a-b296132f31e1" name="choice">
-              <option id="7962446a-726e-478b-bb2b-9ba5377eb96a" value="1">
+             <select autocomplete="off" class="form-control" disabled="" id="c049992c-5675-4eaf-89c4-15e49a364ead" name="choice">
+              <option id="cc878e5a-e7a5-4ef9-8f2a-b989a6972e9d" value="1">
                One
               </option>
-              <option id="d7d51fa2-0678-47ff-b9a3-46d9f33e8855" selected="" value="2">
+              <option id="e0881b6b-24f2-4842-b7a6-ad0a6444d81c" selected="" value="2">
                Two
               </option>
-              <option disabled="" id="c0c5a720-c55d-463c-97dd-21050123ae97" value="3">
+              <option disabled="" id="b49eea16-492b-4bd6-834d-327e6803067a" value="3">
                Three
               </option>
              </select>
@@ -4316,31 +4426,31 @@ Form(
            </div>
           </form>
          </div>
-         <div class="mt-5" id="51d6bb2d-b3fa-442d-b02c-033f56077cc3">
-          <div class="d-flex justify-content-between" id="ce2299a1-b0b2-44e0-9075-572534f52b5a">
-           <h4 id="0f4aaa27-0ca1-414d-876c-12e846f652be">
+         <div class="mt-5" id="7b71c831-59ba-4bac-8f70-f17aa4964714">
+          <div class="d-flex justify-content-between" id="3d0371ea-8f67-4c06-95e3-b6a2d3e965d6">
+           <h4 id="2c8108e9-c576-4b79-82ec-600595a8c1c1">
             Method
-            <span class="text-primary" id="9617282e-9f19-4d32-9d5b-759215b8999e">
+            <span class="text-primary" id="007fe061-4ac1-4e23-8d3c-cd68583470d8">
              as_radio
             </span>
            </h4>
-           <div id="f83b90c8-1781-414c-979c-1b8fdc877c17">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#10feec2a-9c9a-4385-9455-3b1b906d0e19" data-bs-toggle="collapse" id="8d07da15-65fe-4734-94e4-91e5900bd5c2" onclick="return false;" type="button">
+           <div id="7cbc1574-fe2d-4216-bbce-ed41d35acf92">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#4e8109df-500a-4a32-8e69-e584e3cc9623" data-bs-toggle="collapse" id="1024d0cd-028c-4770-a976-a487b14e99d3" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="37a54d0d-ec03-4e95-a732-7b3e9b2bb883">
+          <span class="text-muted" id="30082810-2fcf-4e57-a644-9b2675db61fb">
            Makes selection in a form of radio buttons.
           </span>
-          <pre id="0fcc6ff8-0069-4252-9c44-894d71d8a621"><code class="python">as_radio()</code></pre>
-          <div class="ms-3 collapse" id="10feec2a-9c9a-4385-9455-3b1b906d0e19">
-           <h6 id="1bbb9b31-f97a-460c-a00f-29dd05a4a7f6">
+          <pre id="f8882f74-87da-4d5f-8f0e-8ec5397719ac"><code class="python">as_radio()</code></pre>
+          <div class="ms-3 collapse" id="4e8109df-500a-4a32-8e69-e584e3cc9623">
+           <h6 id="091e8036-b329-4353-a439-b4254d9aaeb1">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="4d2ae4e9-e6ba-4622-bcf5-4b169630fc5f">
+           <table class="table table-sm bg-light" id="b77d8c38-26e5-4359-9312-a98581bd2143">
             <thead>
              <tr>
               <th scope="col">
@@ -4373,13 +4483,13 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="7cfa6d0f-08f3-424c-9688-884bb01bc02c">
-           <h6 id="76b87333-664e-419f-96db-9009edfb3e9a">
+          <div class="ms-3" id="8d00ce49-982f-43fd-8d20-95f3074004a5">
+           <h6 id="c09c94a8-5c3f-4cd6-9804-e44af79fad29">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="638ce23b-4eba-4dd3-9de2-b4e7f17482bf"><code class="python">from bootwrap import Form, SelectInput
+           <pre id="b4dec264-7488-40d7-91f9-c7a97810225b"><code class="python">from bootwrap import Form, SelectInput
 
 options = [
     SelectInput.Option('One', 1),
@@ -4392,28 +4502,28 @@ Form(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="d1c3d3ea-e606-495d-96e7-04a5cb1250a7">
-           <form enctype="multipart/form-data" id="10b46996-c500-4493-a332-cbfced1d8ef4" method="POST">
+          <div class="ms-3" id="c82e12a3-ec58-4f07-8aab-ddb685b25528">
+           <form enctype="multipart/form-data" id="14dcfbcf-1650-4408-9225-43af03a8f407" method="POST">
             <div class="form-group row">
-             <label class="col-sm-4 col-form-label d-flex align-items-center" for="4ecad5cd-c21b-4bf6-a676-3cb9171df6eb">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="ed738510-b84e-49bd-b69d-8afa7969f5fe">
               Selector
              </label>
              <div class="col-sm-8 d-flex align-items-center">
               <div class="form-check me-3">
-               <input autocomplete="off" class="form-check-input" id="4300ee90-d39b-4211-9bc3-be811eb245ee" name="choice" type="radio" value="1"/>
-               <label class="form-check-label me-1" for="4300ee90-d39b-4211-9bc3-be811eb245ee">
+               <input autocomplete="off" class="form-check-input" id="d010e00f-0ca1-4f3d-9f6d-e29ca4714635" name="choice" type="radio" value="1"/>
+               <label class="form-check-label me-1" for="d010e00f-0ca1-4f3d-9f6d-e29ca4714635">
                 One
                </label>
               </div>
               <div class="form-check me-3">
-               <input autocomplete="off" checked="" class="form-check-input" id="e3de5708-783b-4a62-8bf3-e9a7e056f20e" name="choice" type="radio" value="2"/>
-               <label class="form-check-label me-1" for="e3de5708-783b-4a62-8bf3-e9a7e056f20e">
+               <input autocomplete="off" checked="" class="form-check-input" id="2b056857-8440-4d5d-8465-4327a16a4675" name="choice" type="radio" value="2"/>
+               <label class="form-check-label me-1" for="2b056857-8440-4d5d-8465-4327a16a4675">
                 Two
                </label>
               </div>
               <div class="form-check me-3">
-               <input autocomplete="off" class="form-check-input" disabled="" id="b6c6493a-73df-4046-81b8-3e2da965952a" name="choice" type="radio" value="3"/>
-               <label class="form-check-label me-1" for="b6c6493a-73df-4046-81b8-3e2da965952a">
+               <input autocomplete="off" class="form-check-input" disabled="" id="5c55660f-b1f6-486e-9041-5a76d8dcf0ce" name="choice" type="radio" value="3"/>
+               <label class="form-check-label me-1" for="5c55660f-b1f6-486e-9041-5a76d8dcf0ce">
                 Three
                </label>
               </div>
@@ -4424,36 +4534,36 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="ac65fd3d-d6cb-41a1-ae69-761b6e34a996">
-        <div class="mt-5" id="c1bd70dc-459b-43d2-bc9a-b2d8ed3484f9">
-         <div class="d-flex justify-content-between" id="ab7b9035-8d2a-4bec-a967-b60926e10154">
-          <h1 id="9aeeeac1-415e-41b3-9be3-9f7e68b536dd">
+       <div class="tab-pane fade" id="043fd079-2c32-45cd-8f91-508b434c0f1e">
+        <div class="mt-5" id="1c11983f-8de3-4886-afe8-1a7e4b64a61f">
+         <div class="d-flex justify-content-between" id="a46967a5-4775-471e-af4d-f8cfb779d797">
+          <h1 id="bd333ec3-07ac-44f6-9e59-fe985fe119db">
            Class
-           <span class="text-primary" id="4b284120-3ab4-486f-b6ac-c78890d983da">
+           <span class="text-primary" id="bb7ea26c-832a-460e-99cc-b314dbfba2d2">
             SelectInput.Option
            </span>
           </h1>
-          <div id="27de3434-b4ac-4366-aae5-01fea3ae518f">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f07967cd-5dd6-4bec-9a89-2e7e30f1c80b" data-bs-toggle="collapse" id="92619da8-5e4c-43c4-a57b-96eeff011152" onclick="return false;" type="button">
+          <div id="163a913c-a98b-481d-812b-923701fc810c">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#91221bbb-b523-4543-8e63-c5a9fedde1ab" data-bs-toggle="collapse" id="58ffff02-09d6-44a3-a6fe-44236242bafc" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="acfe44d7-3b50-445b-948a-9fb4bcc7f886">
+         <span class="text-muted" id="d4a1221e-43a2-47d9-9d69-2756efe29516">
           An option used by
           <code>
            SelectInput
           </code>
           .
          </span>
-         <pre id="9f64c42e-19ba-4bcd-9a65-153ac11a07a3"><code class="python">SelectInput.Option(name, value, disabled=False)</code></pre>
-         <div class="ms-3 collapse" id="f07967cd-5dd6-4bec-9a89-2e7e30f1c80b">
-          <h6 id="20fceb4d-8acf-4d62-88db-4a0c5ca1d9d8">
+         <pre id="e4adb56e-f97d-4d0e-9b97-4c1eeeb22116"><code class="python">SelectInput.Option(name, value, disabled=False)</code></pre>
+         <div class="ms-3 collapse" id="91221bbb-b523-4543-8e63-c5a9fedde1ab">
+          <h6 id="302a8bbe-418c-497d-a304-2b66bbb6cfd8">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="2915f0c8-6633-4b13-9cf6-f6a933b67a18">
+          <table class="table table-sm bg-light" id="a143d5be-be22-448b-87de-f1ca109ac162">
            <thead>
             <tr>
              <th scope="col">
@@ -4520,67 +4630,67 @@ Form(
            </tbody>
           </table>
          </div>
-         <div class="mt-5" id="5fc70392-4302-4cba-902e-60d980a9fb94">
-          <h4 id="2578c948-1b6e-426c-abce-db9f940acab6">
+         <div class="mt-5" id="a87165c0-a977-4a06-a387-7a3943ed8849">
+          <h4 id="055e7af0-8c41-4746-820a-4a14b4f5d964">
            Property
-           <span class="text-primary" id="1be5038f-b031-41c8-b9c6-555c39c632ac">
+           <span class="text-primary" id="f1b5113d-f157-44c8-8752-c7ae56b29068">
             disabled
            </span>
           </h4>
-          <span class="text-muted" id="bcccdcab-7dfd-467c-971e-041827cee30e">
+          <span class="text-muted" id="55f3b13b-1db1-447c-9d76-e69954f0fe08">
            None
           </span>
          </div>
-         <div class="mt-5" id="34450c0f-55c5-43fa-865e-0e0327cde57f">
-          <h4 id="030dbe80-5f5e-48da-94a4-ab3600e4e79a">
+         <div class="mt-5" id="f7f1d2aa-6db1-41ba-88b9-d2e40576ea3e">
+          <h4 id="49e270a0-379e-4089-8534-a969b1067afa">
            Property
-           <span class="text-primary" id="71a89902-5385-45c8-9585-1871ed0f56bb">
+           <span class="text-primary" id="b2a33c81-f3c3-40c3-92d4-7977073f10bd">
             name
            </span>
           </h4>
-          <span class="text-muted" id="98b1f0c3-5ecc-42d3-b116-7813f668c2f9">
+          <span class="text-muted" id="a43e34f9-2ef3-43a3-98df-527a8659b1fb">
            None
           </span>
          </div>
-         <div class="mt-5" id="bad9652d-fb5a-4224-b6a0-3ead0715d47a">
-          <h4 id="6c1daf72-19d1-4d43-82a4-85bb04ec6a94">
+         <div class="mt-5" id="24129d15-b8f4-4ef1-a15e-29b6c3c4306d">
+          <h4 id="db8bc0b3-de16-4dc3-aa57-db1eec986ee4">
            Property
-           <span class="text-primary" id="52767529-2a0b-44d5-8103-461730397473">
+           <span class="text-primary" id="d8d0927e-88dd-4a3f-b3b4-01788d8b45a1">
             value
            </span>
           </h4>
-          <span class="text-muted" id="55f03c08-4715-4b3c-963a-982ba8b0a70c">
+          <span class="text-muted" id="f238e069-fa54-4e1e-93d9-2384b8f49a92">
            None
           </span>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="864d6b01-c169-4473-b528-bb45086bd75e">
-        <div class="mt-5" id="8504398d-0d96-4e0f-8ec3-6cd009a15b75">
-         <div class="d-flex justify-content-between" id="625945c0-ea1e-48b7-9542-c06bc85e184c">
-          <h1 id="fa604fef-26e9-4830-827f-c5ddbeec28e4">
+       <div class="tab-pane fade" id="ee5f82e7-bc51-4cab-8dfd-872c07d694bd">
+        <div class="mt-5" id="e952a63c-da0a-4eb8-9bc4-0a99f028c714">
+         <div class="d-flex justify-content-between" id="011ed56a-af81-42d7-8836-3a7d706bb074">
+          <h1 id="da5b33e9-0759-49c9-9e15-0661f8ba5753">
            Class
-           <span class="text-primary" id="c3428653-110d-4803-b739-e1ebc69b746b">
+           <span class="text-primary" id="3eb17c9c-8abe-47c1-a027-885d15c5db14">
             HiddenInput
            </span>
           </h1>
-          <div id="dfadbe90-0471-46eb-8346-6135992683ec">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#cfbd3108-9253-4d48-86cb-99bce6a5d0a7" data-bs-toggle="collapse" id="8b2589b7-87e4-4eb9-8c50-fdf546063421" onclick="return false;" type="button">
+          <div id="cb409a61-5aa0-4523-9d36-648899f1f365">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#52c6377c-58cc-475f-8035-549d8da5b926" data-bs-toggle="collapse" id="1c0d1090-6953-4993-ac04-552bd2e8f326" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="2e0e3642-3781-477f-a02d-d163c3ee2ca8">
+         <span class="text-muted" id="8af55d32-5000-4bd4-a1d5-1b5d7931ef7b">
           A hidden input.
          </span>
-         <pre id="a75ce5ad-84cc-4d92-b96b-427b6e0b3fe8"><code class="python">HiddenInput(name, value=None)</code></pre>
-         <div class="ms-3 collapse" id="cfbd3108-9253-4d48-86cb-99bce6a5d0a7">
-          <h6 id="aaea0671-9b0b-4ab9-af2a-dd1ff2578a32">
+         <pre id="93422475-cd6e-4aee-8e1a-8accd94c0cd2"><code class="python">HiddenInput(name, value=None)</code></pre>
+         <div class="ms-3 collapse" id="52c6377c-58cc-475f-8035-549d8da5b926">
+          <h6 id="a10924d4-c950-4fc0-82de-46f7dc63827c">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="e6521db5-7b5a-446c-ad0d-cc461488d6a1">
+          <table class="table table-sm bg-light" id="357f536e-a72c-47ca-b308-77f05e9a673a">
            <thead>
             <tr>
              <th scope="col">
@@ -4628,13 +4738,13 @@ Form(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="0634bc81-b8f6-4c98-9cd9-126f50f760af">
-          <h6 id="6af6ccba-f5aa-4fe1-ab62-54caa8f4ccf3">
+         <div class="ms-3" id="bd22366c-af6e-460a-89ed-6372a36c5412">
+          <h6 id="9370d2f8-03dc-4a3f-bf35-78d4cce7e766">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="9adee363-830d-4aa0-bd61-d2e8daadcf2d"><code class="python">from bootwrap import Form, SelectInput
+          <pre id="aa2eb494-f8a4-40ba-9204-f58b171639cc"><code class="python">from bootwrap import Form, SelectInput
 
 Form(
     HiddenInput('token', '123')
@@ -4643,32 +4753,32 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="f9d2f415-1bea-4256-9524-c84b6d591176">
-        <div class="mt-5" id="b6668c4c-0569-462c-b283-1146f8a02b7b">
-         <div class="d-flex justify-content-between" id="0f0f6b20-c8b0-4105-be89-5f18e8710a36">
-          <h1 id="0c458f6e-f414-498f-8493-3f2ca8c31351">
+       <div class="tab-pane fade" id="09113c83-241c-4767-9e4c-ac1f4efed121">
+        <div class="mt-5" id="32d4de39-8c42-4e9d-a481-43af522d1f6e">
+         <div class="d-flex justify-content-between" id="fc59c559-6609-4324-a4be-5016dd731926">
+          <h1 id="b49b13a1-8136-4ad7-b580-ea7b16e3f8e6">
            Class
-           <span class="text-primary" id="f3b35a33-1668-46a3-908e-7c879a158ca0">
+           <span class="text-primary" id="d2c2cf97-2fd0-42df-b396-84c5f4b06948">
             FileInput
            </span>
           </h1>
-          <div id="8946bab9-275e-4f8d-8a7f-77f18fbaae0e">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#190a8b58-ba40-44ab-a5b8-bd735aacccb3" data-bs-toggle="collapse" id="4ac84cbe-9bc8-41d4-9ad6-037fd18a02dd" onclick="return false;" type="button">
+          <div id="77029282-ac69-4b29-992f-f3bda67f0259">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#4e9d6ca7-ac21-462d-a13f-cf3989c850c0" data-bs-toggle="collapse" id="3ab88dd2-2c0c-410d-a34a-f2696abfc1fd" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="b51fb1b1-46ce-4b9e-a1d8-76832716c27f">
+         <span class="text-muted" id="128ad124-d962-4fb1-bbf8-3ac91e0fcadd">
           A file input.
          </span>
-         <pre id="aea687ef-8f28-45d8-b4ec-78767fb77350"><code class="python">FileInput(label, name)</code></pre>
-         <div class="ms-3 collapse" id="190a8b58-ba40-44ab-a5b8-bd735aacccb3">
-          <h6 id="e70b2a68-c3be-4b90-886e-33168d07c2b5">
+         <pre id="74d755b4-1c52-46fe-a658-327d34d6bee6"><code class="python">FileInput(label, name)</code></pre>
+         <div class="ms-3 collapse" id="4e9d6ca7-ac21-462d-a13f-cf3989c850c0">
+          <h6 id="b1885963-6cf4-461e-8131-684b2830767f">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="635a2d1f-d1ca-4b92-9f2d-af5675eff83a">
+          <table class="table table-sm bg-light" id="59499e12-b570-4639-b738-575cb9e617db">
            <thead>
             <tr>
              <th scope="col">
@@ -4716,7 +4826,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="b1954a73-6693-447b-965d-7a8ad721ddc9">
+         <p id="d11a4bd9-8364-42d4-bdf4-f5959f319153">
           Use the
           <code>
            as_disabled()
@@ -4728,13 +4838,13 @@ Form(
           </code>
           component.
          </p>
-         <div class="ms-3" id="34e09425-e003-4cbf-8544-977c746177f2">
-          <h6 id="5cbd72f4-9ede-40b0-924d-a5ab9add2b68">
+         <div class="ms-3" id="40a7f5fb-92cf-4611-b63c-fa953118949b">
+          <h6 id="7abc96ff-502d-4b57-8950-6a43cc9c99e7">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="5c6faada-2424-49e4-a25b-c7b5387f7cf2"><code class="python">from bootwrap import Form, FileInput
+          <pre id="9f170ec2-443a-43d1-9016-847c39802739"><code class="python">from bootwrap import Form, FileInput
 
 Form(
     FileInput('File', 'file'),
@@ -4742,10 +4852,10 @@ Form(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="13a216e1-62a0-4253-83da-17b6d5a207f4">
-          <form enctype="multipart/form-data" id="19858713-ccd3-49b9-9ad9-7bbef8cde5af" method="POST">
+         <div class="ms-3" id="65e286a9-9ea7-49fb-a2b1-ae4bb6854736">
+          <form enctype="multipart/form-data" id="2d9710ea-a970-4125-98ca-eeeeabc315e1" method="POST">
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="ebce6d69-b88f-44da-8ebd-aa74eadc856d">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="2e07f7c2-d115-4044-a57a-9c6d08ab0f72">
              File
             </label>
             <div class="col-sm-8 d-flex align-items-center">
@@ -4756,13 +4866,13 @@ Form(
                <span class="btn btn-secondary" onclick="$(this).parent().find('input[type=file]').click();">
                 Browse
                </span>
-               <input id="ebce6d69-b88f-44da-8ebd-aa74eadc856d" name="file" onchange="$(this).parent().parent().find('.form-control').htms($(this).val().split(/[\|/]/).pop());" style="display: none;" type="file"/>
+               <input id="2e07f7c2-d115-4044-a57a-9c6d08ab0f72" name="file" onchange="$(this).parent().parent().find('.form-control').htms($(this).val().split(/[\|/]/).pop());" style="display: none;" type="file"/>
               </div>
              </div>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="39f22421-bb94-4d61-ba02-5d6d7d962bad">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="4c8e8ad4-db14-49dd-b14b-c5cd920267f1">
              File
             </label>
             <div class="col-sm-8 d-flex align-items-center">
@@ -4773,7 +4883,7 @@ Form(
                <span class="btn btn-secondary disabled" onclick="$(this).parent().find('input[type=file]').click();">
                 Browse
                </span>
-               <input disabled="" id="39f22421-bb94-4d61-ba02-5d6d7d962bad" name="file" onchange="$(this).parent().parent().find('.form-control').htms($(this).val().split(/[\|/]/).pop());" style="display: none;" type="file"/>
+               <input disabled="" id="4c8e8ad4-db14-49dd-b14b-c5cd920267f1" name="file" onchange="$(this).parent().parent().find('.form-control').htms($(this).val().split(/[\|/]/).pop());" style="display: none;" type="file"/>
               </div>
              </div>
             </div>
@@ -4782,32 +4892,32 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="6af4c4de-70cf-42d0-8d11-ae89b279deda">
-        <div class="mt-5" id="3554b193-94dc-4c96-8254-e26ebf06fee6">
-         <div class="d-flex justify-content-between" id="fe8c2d78-954e-49a7-b84c-2f6f651130b7">
-          <h1 id="8c065f0e-6778-418b-960e-addd70374227">
+       <div class="tab-pane fade" id="7c2edb6f-a46c-485c-b6f0-b972cc5dd856">
+        <div class="mt-5" id="c3e305d8-a250-49f2-bf96-69df06e0542d">
+         <div class="d-flex justify-content-between" id="3134718d-03f1-4cb5-9ac1-2563c01d1e6a">
+          <h1 id="5ff0c960-9742-4614-ab3c-e67b74239dd5">
            Class
-           <span class="text-primary" id="9412e5f2-bcf4-407f-9da8-215a05e2646e">
+           <span class="text-primary" id="b190dca0-e8ce-4c8f-a5d4-c24791a674ca">
             InputGroup
            </span>
           </h1>
-          <div id="16d247a8-2e8e-49f4-83c7-949972b7c024">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#cb999cab-acaa-4da6-afc2-c9167af08315" data-bs-toggle="collapse" id="b2282ac8-bb0b-452c-83de-768e565c78ef" onclick="return false;" type="button">
+          <div id="3a9f1759-b245-482e-92f4-1d22dc4bf510">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#c77cf240-87a1-49a7-bf8c-0d3035545d86" data-bs-toggle="collapse" id="600051c9-8011-4116-9b04-1101cbb222ce" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="9b59325c-f545-4a2b-9aaf-916ac559fd46">
+         <span class="text-muted" id="6d5cad64-c51a-406f-bb6f-e17e688cb790">
           A web component for an input group.
          </span>
-         <pre id="24820a0e-34da-4d25-a1ba-1fffe89de2e5"><code class="python">InputGroup(*inputs)</code></pre>
-         <div class="ms-3 collapse" id="cb999cab-acaa-4da6-afc2-c9167af08315">
-          <h6 id="f3fbec2f-5106-4ba5-8f46-f5911c7b4b80">
+         <pre id="5000afb4-2729-4e50-b1cc-35db479ddf04"><code class="python">InputGroup(*inputs)</code></pre>
+         <div class="ms-3 collapse" id="c77cf240-87a1-49a7-bf8c-0d3035545d86">
+          <h6 id="a087de41-b903-4071-a6f9-b5b27643d7c4">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="2b04b68f-70af-4cf5-9158-0de78448f9c8">
+          <table class="table table-sm bg-light" id="db066537-3cd4-43ac-b250-3cc85cd4ed9c">
            <thead>
             <tr>
              <th scope="col">
@@ -4844,16 +4954,16 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="38b56ef2-2b22-49c7-a5cf-a0023c0a063b">
+         <p id="598b0936-c8f1-4029-b3ce-2ed43d0e8e7f">
           Grous together a series of input components
          </p>
-         <div class="ms-3" id="27b4b835-db93-475f-9523-712323534601">
-          <h6 id="942c7a62-1033-420c-8565-0d11a32ab04e">
+         <div class="ms-3" id="7f670ffc-dae8-4983-9361-e39ab39751ea">
+          <h6 id="7afc5db2-1387-45d4-8332-f3de3beb5b9a">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="e62937b8-d5b5-4100-8319-2feb702ffb46"><code class="python">from bootwrap import Text, TextInput, NumericInput, InputGroup, Form
+          <pre id="df39bf81-3f91-41b1-823b-622b3c45417b"><code class="python">from bootwrap import Text, TextInput, NumericInput, InputGroup, Form
 
 at = Text("@")
 username = TextInput(None, 'username', placeholder='type username')
@@ -4880,35 +4990,35 @@ ig4 = InputGroup(login, at, password).mb(2)
 Form(ig1,ig2,ig3,ig4)
 </code></pre>
          </div>
-         <div class="ms-3" id="f270b61f-51ff-4f05-951a-840bf758bdc0">
-          <form enctype="multipart/form-data" id="3630a369-ced9-4ed3-b644-3427ad39052a" method="POST">
-           <div class="mb-2 input-group" id="1d5dd952-d327-4c36-8f8b-e4b0a01c3752" role="group">
-            <span class="input-group-text" id="14e5f35b-8628-44e6-a5d5-7f7a38ac0eb3">
+         <div class="ms-3" id="fd6b9a16-11cd-4d64-b18b-8c2d81d2a3c0">
+          <form enctype="multipart/form-data" id="59dfc912-4168-4c96-9e26-baf1b933b084" method="POST">
+           <div class="mb-2 input-group" id="274fa313-b34f-4d1c-9be0-b2a10a4ff14c" role="group">
+            <span class="input-group-text" id="0d84ac70-dd61-42b2-8113-9926c9cab7e5">
              @
             </span>
-            <input class="form-control" id="685c98f6-3eb2-4152-8c23-e3b4fe6e72e0" name="username" placeholder="type username" type="text"/>
+            <input class="form-control" id="74a98ec9-7722-4cbe-a7b2-4a23c2f30d66" name="username" placeholder="type username" type="text"/>
            </div>
-           <div class="mb-2 input-group" id="95893023-ec06-4af0-88bc-837d2c482094" role="group">
-            <input class="form-control" id="2d10c75c-93af-4759-b085-0efd8778d122" name="recipient" placeholder="Recipient username" type="text"/>
-            <span class="input-group-text" id="24a95277-2ec7-4f1c-b5a0-66ca8bf22522">
+           <div class="mb-2 input-group" id="47923a29-bd51-4e9d-83cc-3ae60cd2629f" role="group">
+            <input class="form-control" id="223a7aa4-878b-4122-a232-2cbe75375d7e" name="recipient" placeholder="Recipient username" type="text"/>
+            <span class="input-group-text" id="27f82d87-ec21-468f-9cce-24f21e00fd58">
              @example.com
             </span>
            </div>
-           <div class="mb-2 input-group" id="712e3434-e32c-4285-a2de-3fb4399f75de" role="group">
-            <span class="input-group-text" id="0f4fbe35-aab2-403f-8045-e288f31059ae">
+           <div class="mb-2 input-group" id="dd008e14-75dc-43dd-ac2c-3398391df2c8" role="group">
+            <span class="input-group-text" id="70406b73-4521-46df-8a74-f29f29d97e1a">
              $
             </span>
-            <input class="form-control" id="861e00a1-9b9e-4234-8c0e-43bf825f3602" name="amount" placeholder="Amount (to the nearest dollar)" type="number"/>
-            <span class="input-group-text" id="f8fb9d7f-4a67-4988-9892-1e4eb3762e3a">
+            <input class="form-control" id="486d2537-e976-4882-b009-1f4a378c0e62" name="amount" placeholder="Amount (to the nearest dollar)" type="number"/>
+            <span class="input-group-text" id="5b174f16-a7df-4ee5-a57e-69831f4e650d">
              .00
             </span>
            </div>
-           <div class="mb-2 input-group" id="e8e05a9d-6d7c-4d78-a907-13029a275525" role="group">
-            <input class="form-control" id="e0bcf93c-9cd9-4fc8-b34a-805d56216ea3" name="login" placeholder="Login" type="text"/>
-            <span class="input-group-text" id="c37f7a31-d951-4d5c-8f14-b80523bcbe40">
+           <div class="mb-2 input-group" id="57ead8c3-d108-4099-b9ef-bcc424a8907d" role="group">
+            <input class="form-control" id="593e8df9-794d-4875-8f68-0ae29c6c5d9a" name="login" placeholder="Login" type="text"/>
+            <span class="input-group-text" id="dfd001ab-6372-4bc8-b2a9-7e6635afdaec">
              @
             </span>
-            <input class="form-control" id="19a78a39-d24a-4281-b608-fe1b06c1b64f" name="password" placeholder="Password" type="password"/>
+            <input class="form-control" id="4b50d6a1-99b8-479d-8ab3-2686876fbb45" name="password" placeholder="Password" type="password"/>
            </div>
           </form>
          </div>
@@ -4917,52 +5027,52 @@ Form(ig1,ig2,ig3,ig4)
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="35e76910-6a7e-445d-a7d5-8e07a6cb5e0a">
-     <div id="d8fd9d1f-f4e3-46c4-893d-28ac723316e6">
+    <div class="tab-pane fade" id="fb3b094b-e2a8-4d64-9a79-a516779fb387">
+     <div id="119e4a5e-73b9-4992-a57c-d83076f2902d">
       <hr/>
-      <ul class="nav" id="19c39ea4-ac31-47c0-8dd5-401d09e9195b" role="tablist">
+      <ul class="nav" id="6254ce55-cec9-4ec1-9941-d294c1d66bd6" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#076addf1-454a-4268-8e4a-a4cf6a6b223e" data-bs-toggle="tab" href="#076addf1-454a-4268-8e4a-a4cf6a6b223e" id="8fb3ef2d-8be0-436a-9d4f-b2906c1a14f3" role="tab">
-         <span class="text-secondary" id="d704c124-adc9-4d2a-9a48-41461d020852">
+        <a class="nav-link active" data-bs-target="#19c7916c-4782-46a2-8640-984fa6fd2112" data-bs-toggle="tab" href="#19c7916c-4782-46a2-8640-984fa6fd2112" id="e0d5f64f-7b1f-4833-9d7e-3da73bd4d53d" role="tab">
+         <span class="text-secondary" id="4d954706-c568-4017-a4e8-eeeb8323a792">
           Icon
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#83977553-2755-486d-9733-ea12c8661ef1" data-bs-toggle="tab" href="#83977553-2755-486d-9733-ea12c8661ef1" id="2d765090-3a34-4526-b33e-c98875b7d889" role="tab">
-         <span class="text-secondary" id="5f7956cb-f9fb-4fa6-9a77-d8141242df44">
+        <a class="nav-link" data-bs-target="#7bca0758-85b3-4120-ab4d-36a52c89aa35" data-bs-toggle="tab" href="#7bca0758-85b3-4120-ab4d-36a52c89aa35" id="184c9340-0873-401b-9079-a1467747f030" role="tab">
+         <span class="text-secondary" id="6a4d14e7-cd7d-4d62-b4fa-4ee96a22d9f4">
           Spinner
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="076addf1-454a-4268-8e4a-a4cf6a6b223e">
-        <div class="mt-5" id="9d632384-76f0-4fba-be0e-719327e4367c">
-         <div class="d-flex justify-content-between" id="297cf3e2-6d31-48dd-9b14-e5929c3a3f10">
-          <h1 id="f0e4ee12-d790-48d0-9842-b0681535af26">
+       <div class="tab-pane fade active show" id="19c7916c-4782-46a2-8640-984fa6fd2112">
+        <div class="mt-5" id="ccadf50c-043f-4081-a314-f0322386db41">
+         <div class="d-flex justify-content-between" id="ec8c07cf-515e-4516-acf7-72d11473d49c">
+          <h1 id="42cd4bc8-64af-4c30-acc0-61236ea870c6">
            Class
-           <span class="text-primary" id="55729095-f227-4ef1-9f88-7d1b59adbfc1">
+           <span class="text-primary" id="15188ebb-668c-4ccc-8a40-37aee38319d7">
             Icon
            </span>
           </h1>
-          <div id="ed07bc7f-6a79-41e6-951e-ba9c8f4d201a">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#2ecd6f2b-d8ff-4c33-b237-b57f034ffaf4" data-bs-toggle="collapse" id="c87707e8-d985-4786-a8cd-f9454d6c3182" onclick="return false;" type="button">
+          <div id="af7909cf-6fde-44f2-b639-b79514f23529">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#bc3430d8-9408-4bca-9fd0-131af55bb049" data-bs-toggle="collapse" id="3739fac0-b46f-400d-9cdb-1c5bdf128af7" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="2818d97a-f7ee-439c-8794-eaf8fe1a911d">
+         <span class="text-muted" id="80aa1ed9-28e6-4af9-8757-178dfcf0b315">
           An icon.
          </span>
-         <pre id="56daf458-ef85-4a85-bb12-b5702afbe30a"><code class="python">Icon(name)</code></pre>
-         <div class="ms-3 collapse" id="2ecd6f2b-d8ff-4c33-b237-b57f034ffaf4">
-          <h6 id="f58547db-68be-4a73-91a2-729e8614c235">
+         <pre id="af2ecc06-f6e5-40f0-aa8e-817ce4057493"><code class="python">Icon(name)</code></pre>
+         <div class="ms-3 collapse" id="bc3430d8-9408-4bca-9fd0-131af55bb049">
+          <h6 id="9c7320a4-ca67-4e5b-ac31-76acfa1ccbca">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="9c66f07c-d304-436b-a543-5348482d1d98">
+          <table class="table table-sm bg-light" id="ac61a337-3e62-42e9-b8d9-b38992728892">
            <thead>
             <tr>
              <th scope="col">
@@ -4995,13 +5105,13 @@ Form(ig1,ig2,ig3,ig4)
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="d61c8cfa-05ba-4abe-8018-63407df16f34">
-          <h6 id="1c25cd3f-dbfe-4a33-b19b-1eab152ff7e3">
+         <div class="ms-3" id="b7f021ff-d253-4966-8040-dd7e4a598c70">
+          <h6 id="15325389-c1ea-44e8-88eb-a45ec55fbe1f">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="e0a79167-34c4-4ace-b6bd-cbd9cd97ea33"><code class="python">from bootwrap import Icon, Panel
+          <pre id="c2568632-6d91-46c1-b7e4-bb901ebb07b9"><code class="python">from bootwrap import Icon, Panel
 
 Panel(
     Icon("fas fa-folder"),
@@ -5016,53 +5126,53 @@ Panel(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="b999d83d-b0ae-4854-b443-b692b9be72bb">
-          <div id="555cc9de-15fc-44ab-85d7-3c0232dbb671">
-           <i class="fas fa-folder" id="dde87e04-c439-4cf1-b2fb-3b2f1081edf4">
+         <div class="ms-3" id="c27b3270-3432-42e0-a7ea-096dcb936e76">
+          <div id="b9ff3027-5b61-4d4d-80e9-2f65a36128e3">
+           <i class="fas fa-folder" id="5133e852-219d-42ba-bc77-0b1f0ffa2739">
            </i>
-           <i class="fas fa-folder text-primary" id="52e6ad7e-4165-480e-bba8-9d8d0bb33da4">
+           <i class="fas fa-folder text-primary" id="834d22c1-ed53-4ae3-afee-da8c8a423d97">
            </i>
-           <i class="fas fa-folder text-secondary" id="5bd82d8e-676c-42ae-a4b9-3f3347c17bdc">
+           <i class="fas fa-folder text-secondary" id="42971f88-3ead-4b24-99fa-4302b1405d35">
            </i>
-           <i class="fas fa-folder text-success" id="a00e84a7-7e67-4970-b31a-fdb8c60badf2">
+           <i class="fas fa-folder text-success" id="4036b424-cda4-4eb6-9738-0df772655f5b">
            </i>
-           <i class="fas fa-folder text-warning" id="54724cf6-facc-4c5e-a6d6-a8ec27d52493">
+           <i class="fas fa-folder text-warning" id="92929227-45cc-40af-a6d2-2604f87da2fd">
            </i>
-           <i class="fas fa-folder text-danger" id="861d96bb-bb20-4da9-9874-ac4fc50bd94d">
+           <i class="fas fa-folder text-danger" id="c8b644ba-77d3-4439-8ee6-72b3efb93dfa">
            </i>
-           <i class="fas fa-folder text-info" id="92def36c-29f0-49b6-85b1-c261c692a749">
+           <i class="fas fa-folder text-info" id="3ed417b1-fda8-463e-8429-20e979ae603c">
            </i>
-           <i class="fas fa-folder text-light" id="e0133873-4557-46fe-b23e-4c9331ec6ef4">
+           <i class="fas fa-folder text-light" id="28c2687a-a81e-4ade-a65f-eef1705546bc">
            </i>
-           <i class="fas fa-folder text-dark" id="cf4658b4-1276-4e70-930c-b952a55bb3c9">
+           <i class="fas fa-folder text-dark" id="303b2416-1a4b-4409-8075-f417db044827">
            </i>
           </div>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="83977553-2755-486d-9733-ea12c8661ef1">
-        <div class="mt-5" id="3069cdeb-0f69-42b5-9249-1b4cc6311296">
-         <div class="d-flex justify-content-between" id="baf1400a-cd70-4cdb-bd6b-f8a5f4f465bf">
-          <h1 id="d434b008-bceb-4c17-a6c1-803fff5c49e6">
+       <div class="tab-pane fade" id="7bca0758-85b3-4120-ab4d-36a52c89aa35">
+        <div class="mt-5" id="9fbfe1e6-73ac-4c27-87bc-4d3e4f8e91cd">
+         <div class="d-flex justify-content-between" id="ee842023-32ce-49fd-97bd-20b758119f4a">
+          <h1 id="f5dc1d3f-2aee-46a1-9f8c-9faafb4cf307">
            Class
-           <span class="text-primary" id="d644e623-2c73-4d0f-a01d-b0822a914d9e">
+           <span class="text-primary" id="ece3ce97-a5b7-4cba-a00c-c8cbc0b43257">
             Spinner
            </span>
           </h1>
-          <div id="a0441710-9afa-4370-a5ed-3841735e7771">
+          <div id="5e4ce376-4b55-4a98-90b0-cbb54fadd45f">
           </div>
          </div>
-         <span class="text-muted" id="a4c74e66-25d3-422c-a867-d923ff9d4fb2">
+         <span class="text-muted" id="de8e1386-9c68-465b-84d4-dc74b878f299">
           A spinner icon.
          </span>
-         <pre id="53b8ecbd-5018-44f4-815b-9745dd298d13"><code class="python">Spinner()</code></pre>
-         <div class="ms-3" id="415852c3-f771-41f5-a2db-aeada81e0b72">
-          <h6 id="fb2a1080-ba2b-403b-a475-a7ac66caea4a">
+         <pre id="5ae9d1b4-1578-4165-94c7-f5e01767a1f5"><code class="python">Spinner()</code></pre>
+         <div class="ms-3" id="0dac3430-b5f7-4a72-aa58-e0005c950f3b">
+          <h6 id="c351403e-37e3-4466-81e8-563127386e40">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="2338ce86-cc8f-4e7e-b11b-35cc64677ba7"><code class="python">from bootwrap import Spinner, Panel
+          <pre id="425532cd-a012-4e02-acc2-5d0907ebd6f7"><code class="python">from bootwrap import Spinner, Panel
 
 Panel(
     Spinner(),
@@ -5077,9 +5187,9 @@ Panel(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="01a3be93-7d1d-4cdc-94d6-112c65ec45c9">
-          <div id="a64e6c8d-7361-4e63-ab5c-618a5dacbefe">
-           <span class="spinner" id="3e407640-583a-4f81-8c04-9ac610ddfb9c">
+         <div class="ms-3" id="3ebb930a-26b5-4ed4-91f8-9a6d8faa8878">
+          <div id="648efe5e-a0bd-4d98-8734-9ae238c4fc56">
+           <span class="spinner" id="db8e9670-9046-4366-a7ca-5bf49086745f">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5098,7 +5208,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-primary" id="6d0d9004-164f-49bb-bdd6-74572244ae12">
+           <span class="spinner text-primary" id="c5cf86f2-ba44-4f52-a17c-2ed6f950de11">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5117,7 +5227,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-secondary" id="9a9f068a-6bea-4500-b4af-f9460250235a">
+           <span class="spinner text-secondary" id="45053a99-d495-43dc-9105-71a19115f5d2">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5136,7 +5246,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-success" id="0ab7e2e0-3246-418f-8e11-e22196cca8b4">
+           <span class="spinner text-success" id="6530cf83-ecd4-4977-8939-516cc2d01a20">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5155,7 +5265,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-warning" id="e40b18c3-2f97-4279-8197-e183a0357ebc">
+           <span class="spinner text-warning" id="4c9ef8e8-c9f4-4ddc-a2cd-d0c26f1c7382">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5174,7 +5284,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-danger" id="e4e666fd-144f-468c-ae58-0870e1420a7b">
+           <span class="spinner text-danger" id="770c7fed-9f48-41bc-9488-51887c512a5f">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5193,7 +5303,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-info" id="bb33c480-3fa6-498e-8242-545bb99739ff">
+           <span class="spinner text-info" id="576c39b4-a009-4ef4-83a9-f4cf9f0fae2e">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5212,7 +5322,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-light" id="34b05998-94e4-4278-b31d-424ea911ff80">
+           <span class="spinner text-light" id="8f5cac7d-39e5-43ee-9672-8683e25db836">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5231,7 +5341,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-dark" id="9f67da63-8745-457e-9d62-fcc296707936">
+           <span class="spinner text-dark" id="012372af-ac3a-4c52-bcbb-a6c618e45561">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5257,32 +5367,32 @@ Panel(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="1d000fe4-75d2-4540-b722-08e9bc3500c5">
-     <div class="mt-5" id="dc43c68d-21ed-462a-84f3-e9e987a97978">
-      <div class="d-flex justify-content-between" id="f7b1d4ae-d243-4ccc-bb50-4fd0b7856a1f">
-       <h1 id="4e5342f7-7d99-4ed3-a7ab-a48569770353">
+    <div class="tab-pane fade" id="74cdc53f-1f81-469c-b04d-0dfdc417a354">
+     <div class="mt-5" id="0cdaf3b4-c796-407e-bbe5-773442f47743">
+      <div class="d-flex justify-content-between" id="46062ad4-7ffb-4d70-b062-2033d80bef50">
+       <h1 id="eacb1561-8038-4f35-981f-1e55fd278f6d">
         Class
-        <span class="text-primary" id="64dea199-6c81-48ce-b266-a54184d3968d">
+        <span class="text-primary" id="e9a65563-2403-409a-a30f-106aa6faeb45">
          Image
         </span>
        </h1>
-       <div id="babb54fa-7494-47c7-82b4-b949f49f3d4d">
-        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#0ce55def-6ab0-4267-862f-9cd2e677adf3" data-bs-toggle="collapse" id="3043de93-7ffe-4b5c-9149-aa4b535ed7a2" onclick="return false;" type="button">
+       <div id="d6dec52a-0758-4292-8a8d-1e9bdb51bdd7">
+        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#9d1ee9b9-4c81-4ab7-9124-b8b0cd5878f1" data-bs-toggle="collapse" id="98bdba3e-34f6-4ba9-a8d2-4de806f8496d" onclick="return false;" type="button">
          Argument
         </button>
        </div>
       </div>
-      <span class="text-muted" id="f1398a90-6f86-4064-b97f-bebcc941119c">
+      <span class="text-muted" id="ca5ab472-27ab-4fe4-8d25-38eb45df6345">
        A web component for an image.
       </span>
-      <pre id="9eecec70-d351-42c2-b594-d7c81e7d7904"><code class="python">Image(src, width=None, height=None, alt=None)</code></pre>
-      <div class="ms-3 collapse" id="0ce55def-6ab0-4267-862f-9cd2e677adf3">
-       <h6 id="e284c460-625e-4bdb-a766-6ff6be087bf4">
+      <pre id="61cf998c-a85b-4af4-af78-2b155d47f9be"><code class="python">Image(src, width=None, height=None, alt=None)</code></pre>
+      <div class="ms-3 collapse" id="9d1ee9b9-4c81-4ab7-9124-b8b0cd5878f1">
+       <h6 id="e458cf7a-7e5c-419f-ad83-257421aeabd7">
         <strong>
          Arguments
         </strong>
        </h6>
-       <table class="table table-sm bg-light" id="bfa53ce9-2f19-4ae2-9a1d-f118708b7b30">
+       <table class="table table-sm bg-light" id="9b3df53d-cf56-4c44-a7ad-fc0729f157ac">
         <thead>
          <tr>
           <th scope="col">
@@ -5360,68 +5470,68 @@ Panel(
         </tbody>
        </table>
       </div>
-      <div class="ms-3" id="08caa01a-370f-44c0-814a-1c869208df89">
-       <h6 id="9deaec13-d4f7-4f3e-83f9-397938d83070">
+      <div class="ms-3" id="d0c70206-98f7-43b6-a66b-e6e0c8e6654e">
+       <h6 id="317e3e88-3d8f-4cf8-bc5c-367d1fbf1172">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="27db5906-2571-464f-bf6f-8faf904c8cea"><code class="python">from bootwrap import Image
+       <pre id="85f46885-d802-4ccf-aa64-e131479226a5"><code class="python">from bootwrap import Image
 
 Image("logo.png")
 </code></pre>
       </div>
-      <div class="ms-3" id="330815e8-2870-420c-93b3-3012cc7ba1e4">
-       <img id="0035ae86-6e8b-4238-8bb3-a55a58b426a1" src="logo.png"/>
+      <div class="ms-3" id="97cc7fb8-47ec-4a4e-8ada-67a36265f832">
+       <img id="38c82bf0-2486-4408-8481-dacee511329e" src="logo.png"/>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="3347c54e-5bc8-4e3a-acda-76e85ab3ff37">
-     <div id="98657e0d-5ed0-49ac-a7f9-90cf906f49d7">
+    <div class="tab-pane fade" id="679baaa6-caf2-4758-aa56-744c2a648e96">
+     <div id="a7ec072d-95a6-4587-92be-049d7e11d62e">
       <hr/>
-      <ul class="nav" id="9ed44bb4-1f2d-4013-b71e-9e0d4ce3a750" role="tablist">
+      <ul class="nav" id="3d6cf66e-de1c-4fe3-80c9-7b6d32568f20" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#a32b5c91-e3e4-45d2-aaae-bc6ab735853e" data-bs-toggle="tab" href="#a32b5c91-e3e4-45d2-aaae-bc6ab735853e" id="72176bf7-9ca9-49f9-bbe4-44451708eb04" role="tab">
-         <span class="text-secondary" id="02241dfb-1fae-4dad-9e95-11f225bddef0">
+        <a class="nav-link active" data-bs-target="#ca3105f6-7ac7-4c74-ad58-0604506e7af1" data-bs-toggle="tab" href="#ca3105f6-7ac7-4c74-ad58-0604506e7af1" id="a5e3f802-da6e-41d4-9658-946ceefcd65b" role="tab">
+         <span class="text-secondary" id="92d76039-12ce-4a19-941a-37b1332876e9">
           Javascript
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#d01c5ff3-cabb-4ac2-87be-9a5eeada970c" data-bs-toggle="tab" href="#d01c5ff3-cabb-4ac2-87be-9a5eeada970c" id="9d439ff4-2918-420f-bee5-f592566113e7" role="tab">
-         <span class="text-secondary" id="b2cf47f2-453c-4a13-ab74-80b086cf1c9b">
+        <a class="nav-link" data-bs-target="#640d627c-12a9-4524-9259-35b2a408e6f5" data-bs-toggle="tab" href="#640d627c-12a9-4524-9259-35b2a408e6f5" id="b8d1088d-4702-47b9-9234-9a35b32e7b31" role="tab">
+         <span class="text-secondary" id="b25a7d34-4deb-4b5b-83d3-06617b3686dd">
           jQuery
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="a32b5c91-e3e4-45d2-aaae-bc6ab735853e">
-        <div class="mt-5" id="c54718ca-77a2-4826-b3e0-5236ead2bb7e">
-         <div class="d-flex justify-content-between" id="ab41d42a-ef66-4f12-b7fb-92f15df3b0ff">
-          <h1 id="f179fca3-c6dc-4ea4-aa1e-59bd35d131f8">
+       <div class="tab-pane fade active show" id="ca3105f6-7ac7-4c74-ad58-0604506e7af1">
+        <div class="mt-5" id="7351da18-495b-450e-a325-eb01338f6680">
+         <div class="d-flex justify-content-between" id="dd9b47de-8dfb-46e7-9cf9-6dd853be1b91">
+          <h1 id="47b99945-62bd-47bc-905a-1d1f3468b63d">
            Class
-           <span class="text-primary" id="397fcad5-0e9f-47c2-846b-301c2319aeb5">
+           <span class="text-primary" id="c7d1e634-186a-46a7-bbbf-bf28a80aab31">
             Javascript
            </span>
           </h1>
-          <div id="11b4c1d0-a0e9-49a3-b2f1-f25bb60c2f7f">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#dd226eca-c3fa-4886-823b-f3b0e475c84c" data-bs-toggle="collapse" id="0f5b7e00-ee17-478e-8c34-a3fcab5f3203" onclick="return false;" type="button">
+          <div id="84ca196a-1a3c-4d88-9de8-023edb15ec32">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#ca50f42c-5bae-4b8a-a814-d4c5001dda92" data-bs-toggle="collapse" id="57862754-4a13-4eb3-a7e9-3dc7f645774b" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="d87b14b4-8ab6-4c03-8f44-ebee5b1ac3a2">
+         <span class="text-muted" id="1bab648d-6000-4be0-aa9e-c843410ae49c">
           A web component for a javascript.
          </span>
-         <pre id="7983d604-1fd7-4474-8a5b-d2c753d7a683"><code class="python">Javascript(src=None, script=None, submap=None)</code></pre>
-         <div class="ms-3 collapse" id="dd226eca-c3fa-4886-823b-f3b0e475c84c">
-          <h6 id="1ef4de6f-d995-45a6-a75c-eb004e019a8a">
+         <pre id="20c43739-6fb1-471b-90b3-6a5decdf3951"><code class="python">Javascript(src=None, script=None, submap=None)</code></pre>
+         <div class="ms-3 collapse" id="ca50f42c-5bae-4b8a-a814-d4c5001dda92">
+          <h6 id="fa0d5069-398c-4602-b43f-4cf955336e09">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="56208549-61c3-41cb-aad7-50650534c1d5">
+          <table class="table table-sm bg-light" id="e49facef-e583-475c-96e8-f477c6082f5b">
            <thead>
             <tr>
              <th scope="col">
@@ -5486,13 +5596,13 @@ Image("logo.png")
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="e945ebfe-f80d-46ba-bdcc-9f3728ea15e6">
-          <h6 id="96ee6cab-202c-46ad-8788-1aeeb18f198a">
+         <div class="ms-3" id="62855c18-e3e5-49b3-a3bb-824b97e02e88">
+          <h6 id="18c0b24d-e8b9-49d0-be9b-7e4e66c0e5d1">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="70df2a51-31c0-4dbe-bd00-d47daa990577"><code class="python">from bootwrap import Page, Javascript
+          <pre id="b6955f2b-67f5-43bf-8486-8d3b26ce5cfb"><code class="python">from bootwrap import Page, Javascript
 
 my_page = Page(
     ...
@@ -5505,28 +5615,28 @@ my_page = Page(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="d01c5ff3-cabb-4ac2-87be-9a5eeada970c">
-        <div class="mt-3" id="aea82c90-05a7-440a-873a-c6086be172a2">
-         <div id="40cd6002-4d9c-48f3-a26c-f66e6d1a3d68">
+       <div class="tab-pane fade" id="640d627c-12a9-4524-9259-35b2a408e6f5">
+        <div class="mt-3" id="7b1b2b60-494c-4b12-9ef2-7a583b408424">
+         <div id="e023e97c-ee09-4c2e-8982-e90116dc2fd4">
           <div class="row">
            <div class="col-md">
-            <div id="4d8acc4e-e0fc-404f-a740-5f263efda11e">
-             <h1 id="7490450b-4726-4b74-85a9-75a68ff0f926">
+            <div id="4bcbe3de-99d8-487e-86a3-8fc16520148a">
+             <h1 id="bbfa675c-3436-48c4-ad84-57e3d090fdce">
               jQuery
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="50a4f707-e799-4186-b74f-b0ec2c9ebe12">
+            <div id="1e80fdea-afe9-40bb-b8c7-7bacb8aab27c">
             </div>
            </div>
           </div>
          </div>
-         <div id="999a301c-42de-4c33-85e9-4428def0bde1">
+         <div id="bd932289-a7dc-4541-b2c7-81837139ac91">
           <div class="row">
            <div class="col-md">
-            <div id="cd52b100-4cab-4f27-be13-40a0bd3f2362">
-             <p id="99e3bbe0-5dcc-477b-85a4-cd2ddb6d4ea1">
+            <div id="ef5b3ee8-5b4d-4db9-8ca9-b4f024ffaeb8">
+             <p id="929286cf-9140-4aa9-8546-b6eeb30d93e9">
               Use
               <code>
                Javascript
@@ -5536,8 +5646,8 @@ my_page = Page(
             </div>
            </div>
            <div class="col-md">
-            <div id="0e7df325-904a-46f7-babe-7202933abc91">
-             <pre id="9c06973a-61bb-42b2-929a-33603b5df4d5"><code class="python">from bootwrap import Panel, Javascript, Button, Text
+            <div id="f0fbb5e6-367e-48e1-903c-2cb4ab2c2178">
+             <pre id="109870d4-fb0c-4916-a051-a08bc8ebe415"><code class="python">from bootwrap import Panel, Javascript, Button, Text
 
 label = Text("Answer:").as_strong()
 answer = Text("unknown").me(2).ms(2)
@@ -5562,27 +5672,27 @@ action = Javascript(
 Panel(
   label, answer, btn_yes, btn_no, action
 )</code></pre>
-             <div id="b0d849d0-1ad9-4da0-a5cd-9d577dab9c3b">
-              <span id="633ed485-8ddf-40ea-be3e-1598c6fbe68a">
+             <div id="af55cc12-28ce-41cf-b462-739941a4c52c">
+              <span id="fb97f4a9-ae7a-45f3-9a55-edbc7663cbee">
                <strong>
                 Answer:
                </strong>
               </span>
-              <span class="me-2 ms-2" id="2cf3cfc6-f298-44bf-bdfa-bc834d364c0d">
+              <span class="me-2 ms-2" id="f63ae7d5-ecac-4568-b063-d2079a15b338">
                unknown
               </span>
-              <button class="btn btn-success" id="654ef94b-12ff-42d6-8d2b-08c8699df5e5" onclick="return false;">
+              <button class="btn btn-success" id="1e69a142-c886-4949-84a3-b131fa41e1ad" onclick="return false;">
                Yes
               </button>
-              <button class="btn btn-danger" id="df4c6b64-4a1b-43ae-b600-eed55d05941d" onclick="return false;">
+              <button class="btn btn-danger" id="eb58ef0c-261c-4f9c-b120-483b42f9316a" onclick="return false;">
                No
               </button>
               <script type="application/javascript">
-               $("#654ef94b-12ff-42d6-8d2b-08c8699df5e5").on("click",function(){
-      $("#2cf3cfc6-f298-44bf-bdfa-bc834d364c0d").text("Yes");
+               $("#1e69a142-c886-4949-84a3-b131fa41e1ad").on("click",function(){
+      $("#f63ae7d5-ecac-4568-b063-d2079a15b338").text("Yes");
     });
-    $("#df4c6b64-4a1b-43ae-b600-eed55d05941d").on("click",function(){
-      $("#2cf3cfc6-f298-44bf-bdfa-bc834d364c0d").text("No");
+    $("#eb58ef0c-261c-4f9c-b120-483b42f9316a").on("click",function(){
+      $("#f63ae7d5-ecac-4568-b063-d2079a15b338").text("No");
     });
               </script>
              </div>
@@ -5595,32 +5705,32 @@ Panel(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="0e002492-6dc3-42f8-b28e-adf101b012a2">
-     <div class="mt-5" id="9bf6263b-8fde-4e6c-b95c-70a1744a96ed">
-      <div class="d-flex justify-content-between" id="61ae5d0a-3ae6-401c-8464-98786bc35a26">
-       <h1 id="28884787-3290-423c-a8c6-8dcf2780ac72">
+    <div class="tab-pane fade" id="361fb36f-ea93-4934-aef5-0b7a783a5fb4">
+     <div class="mt-5" id="e53c160f-e250-4fe6-ab77-e231b27757e8">
+      <div class="d-flex justify-content-between" id="730797e7-301a-4e95-a96a-ddc9d9d81525">
+       <h1 id="67c4d9be-bc3a-4e77-8018-3cfe635954aa">
         Class
-        <span class="text-primary" id="23090d63-c8a1-492e-925c-0041265a0521">
+        <span class="text-primary" id="ec36b8e0-c479-4f32-b251-07002d1967d5">
          Link
         </span>
        </h1>
-       <div id="50d27101-4bac-420b-86e8-8e1d2cb92b3a">
-        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#a5dbd705-2796-4d18-ab51-b214164611e8" data-bs-toggle="collapse" id="5d658e35-7dcc-42b0-9a1a-63c42265f7a8" onclick="return false;" type="button">
+       <div id="44ece4ab-4e68-4469-82ce-7a60a3d8cfbe">
+        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#0091b25e-1441-4c1f-bfac-813b7804dc48" data-bs-toggle="collapse" id="473988ab-f968-497f-ba61-a6c69ddf4103" onclick="return false;" type="button">
          Argument
         </button>
        </div>
       </div>
-      <span class="text-muted" id="0cb0f277-4791-47c6-ac22-857179ac7642">
+      <span class="text-muted" id="ea21414c-7eae-49d1-9864-4a3249c79588">
        A web component for an external resource link.
       </span>
-      <pre id="31b830e8-6a17-40f5-b312-30731bc8e68e"><code class="python">Link(href, rel='stylesheet', ctype='text/css')</code></pre>
-      <div class="ms-3 collapse" id="a5dbd705-2796-4d18-ab51-b214164611e8">
-       <h6 id="67696ca1-1914-4ede-8ace-107a20992c28">
+      <pre id="4630c43b-bd4f-47cc-aad3-2366dad315a6"><code class="python">Link(href, rel='stylesheet', ctype='text/css')</code></pre>
+      <div class="ms-3 collapse" id="0091b25e-1441-4c1f-bfac-813b7804dc48">
+       <h6 id="f9ae6546-37ba-448e-a4c4-a3f86bdbd2d5">
         <strong>
          Arguments
         </strong>
        </h6>
-       <table class="table table-sm bg-light" id="8cd99414-8059-4294-847e-f4e168d323c4">
+       <table class="table table-sm bg-light" id="d2777b4b-e84a-4d2c-9853-d1cdf98166d6">
         <thead>
          <tr>
           <th scope="col">
@@ -5686,17 +5796,17 @@ Panel(
         </tbody>
        </table>
       </div>
-      <p id="dbcf4254-1764-4f46-afc9-0800e50aa45f">
+      <p id="cd76a348-0d01-4c98-ba23-5208bc90b67a">
        See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link
     for more information.
       </p>
-      <div class="ms-3" id="3d330f61-e724-407a-92b1-3cd0725b4d22">
-       <h6 id="1a633c3e-d368-4727-b9eb-6958e78737c5">
+      <div class="ms-3" id="a156627f-b569-44b7-92ae-cf1a5b5cff96">
+       <h6 id="45b55c14-4af6-444e-8d80-9a59adcf0139">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="2ab833dc-b7b2-474f-9c96-5a8c03d6ae4c"><code class="python">from bootwrap import Page, Link
+       <pre id="8105f807-6df9-492b-b980-bc020410275e"><code class="python">from bootwrap import Page, Link
 
 my_page = Page(
     ...
@@ -5709,52 +5819,52 @@ my_page = Page(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="a481776f-f6cb-4630-9226-073d7a8849f5">
-     <div id="80e5ba43-d702-4a9a-b021-a8a69448cdc7">
+    <div class="tab-pane fade" id="ccb6efe0-aca5-489d-8338-f5cee6a0b8cc">
+     <div id="8bdf5486-a6c5-4748-a73d-365c63a2bf93">
       <hr/>
-      <ul class="nav" id="591571da-d424-4176-80bf-db6a9d6f3e51" role="tablist">
+      <ul class="nav" id="45d17216-fb48-46f9-9f94-7ec4995ac55d" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#46a2749c-eac7-4e83-9aed-780f2ac227c3" data-bs-toggle="tab" href="#46a2749c-eac7-4e83-9aed-780f2ac227c3" id="6929281d-1a61-4e28-b3fa-bae25701815a" role="tab">
-         <span class="text-secondary" id="d0528637-d9fc-4e7d-b057-324475bed115">
+        <a class="nav-link active" data-bs-target="#f928cbfc-f31c-47ea-b29e-f2649ee9fa29" data-bs-toggle="tab" href="#f928cbfc-f31c-47ea-b29e-f2649ee9fa29" id="f5252e47-2214-4424-978e-28d191cdbb64" role="tab">
+         <span class="text-secondary" id="b29d7620-1f0f-42c5-a5a0-3326a25acb7f">
           List
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#76737e58-b06f-4aef-86c5-4e78ed7c3038" data-bs-toggle="tab" href="#76737e58-b06f-4aef-86c5-4e78ed7c3038" id="ba7ee397-2a5c-4eb8-a616-bc1ac5abfaa9" role="tab">
-         <span class="text-secondary" id="b2532410-b853-4482-a8d7-20bf2beb5f98">
+        <a class="nav-link" data-bs-target="#d45386c9-d70c-435e-b88a-acb3ef3cd54c" data-bs-toggle="tab" href="#d45386c9-d70c-435e-b88a-acb3ef3cd54c" id="6d315e2b-cc2d-4621-a032-ac9d385d71cf" role="tab">
+         <span class="text-secondary" id="c6d8fd8f-c96e-49c3-81ea-fe895fc8623a">
           List.Item
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="46a2749c-eac7-4e83-9aed-780f2ac227c3">
-        <div class="mt-5" id="ee6d8dfd-4835-4b20-9b8c-ec0b17ce9122">
-         <div class="d-flex justify-content-between" id="8201dab0-9e7d-4904-87d2-25caf1f40919">
-          <h1 id="85b48410-5b8e-494f-a858-b4bef9296371">
+       <div class="tab-pane fade active show" id="f928cbfc-f31c-47ea-b29e-f2649ee9fa29">
+        <div class="mt-5" id="f7243fbc-07a1-47b0-8691-dbc5a685dc51">
+         <div class="d-flex justify-content-between" id="44170ba2-a1f1-43e5-ae25-f2fc55138cc7">
+          <h1 id="5544fea9-5f9a-4cca-91d7-a9a9e0289893">
            Class
-           <span class="text-primary" id="5a4c07ae-0cb9-4ba6-b92c-8497f7e5305d">
+           <span class="text-primary" id="df3a9fb8-c998-4637-aec1-17e4533e2ebd">
             List
            </span>
           </h1>
-          <div id="e7813489-a9b5-48b0-96e1-7f506637443d">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#666900b5-53e2-47e8-aa5e-526dd9459643" data-bs-toggle="collapse" id="b7497d39-d95b-45fe-8aa0-d5d2165b666e" onclick="return false;" type="button">
+          <div id="456e1af9-041f-4ec0-a183-ed7828605bdc">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#119608ee-08ac-4be9-8331-e1ab4aa030ca" data-bs-toggle="collapse" id="ec2befea-268f-4ec5-88a8-bdb6fd738a0a" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="49c128d2-e8ae-4ccb-9aaa-75719265c302">
+         <span class="text-muted" id="584dbcfa-cae3-4530-a2cb-c7e67c4b2254">
           A web component for a list of items.
          </span>
-         <pre id="42204c1b-1c1a-40c9-93d7-03e364c91fe3"><code class="python">List(*items)</code></pre>
-         <div class="ms-3 collapse" id="666900b5-53e2-47e8-aa5e-526dd9459643">
-          <h6 id="59426759-9acb-4e19-895a-9fed9424b74b">
+         <pre id="b83ea734-9992-4f0d-875a-f9119c57f5d1"><code class="python">List(*items)</code></pre>
+         <div class="ms-3 collapse" id="119608ee-08ac-4be9-8331-e1ab4aa030ca">
+          <h6 id="47c683ed-f15c-4cd5-a1c0-7dff55bb1f51">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="1df998c8-59da-4021-b280-ebf6b70017ae">
+          <table class="table table-sm bg-light" id="3b78f726-930d-4b0a-8421-2471b735e641">
            <thead>
             <tr>
              <th scope="col">
@@ -5795,13 +5905,13 @@ my_page = Page(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="beadc9ee-5bf0-463b-b4a3-b913c6d76abe">
-          <h6 id="8f7849b9-bb67-481e-889b-6cba088eecef">
+         <div class="ms-3" id="f044f899-03f6-48a2-ab1c-baabdaf1ec6e">
+          <h6 id="99525ba1-2c2e-40ce-8b4e-c7c2cf55c3c6">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="501dc701-eef7-4c36-bd05-ed10a6bb9d39"><code class="python">from bootwrap import Button, List, Image
+          <pre id="99aef6a5-7526-4cd7-b298-5db30d19c0bb"><code class="python">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy").as_success(),
@@ -5834,17 +5944,17 @@ List(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="4d535243-a7bb-4071-b4a4-ef7435cd29ba">
-          <div class="list-group" id="a85765ae-1143-4f18-9c33-3c52baee0111">
-           <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="2f637dcb-7fa2-4973-9eb2-9d784b3029df">
+         <div class="ms-3" id="bc38e4a0-4589-49ae-b20f-96c6285608e0">
+          <div class="list-group" id="29ed01ad-71ad-4967-a437-4800272e7a66">
+           <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="1ac78b34-0c20-4b2e-849f-71d427dc7a16">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="73fd04d9-fd47-48ff-bf12-e7dea8f09888" src="google-logo.png" width="32"/>
+             <img height="32" id="e1dac66d-1659-4b6d-b4a8-36cd8dd83ecf" src="google-logo.png" width="32"/>
              <div class="ms-2 me-2 w-100">
               <div class="d-flex w-100 justify-content-between">
-               <h5 id="57e8573b-6907-4842-82d4-645c535ab8b2">
+               <h5 id="902c15e1-23bd-47fe-98c5-a39941327445">
                 Google (NASDAQ: GOOGL)
                </h5>
-               <span id="ec824cbd-02f7-4bc4-ae27-4a43faaa1137">
+               <span id="db92d41d-d195-432b-aa8c-0ec566e05bd4">
                 <small>
                  12:04:58 12/01/2021
                 </small>
@@ -5854,16 +5964,16 @@ List(
              </div>
              <div class="d-flex align-items-start">
               <div class="btn-group">
-               <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="817c81fc-d815-438a-8312-5cc836cccf0c" onclick="return false;" style="cursor: pointer">
+               <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="e41b2cd3-f441-4b11-83f4-87539314ad0e" onclick="return false;" style="cursor: pointer">
                </i>
                <div class="dropdown-menu dropdown-menu-right">
-                <button class="dropdown-item btn btn-success" id="ee8a4869-b83a-4428-987c-7e25e8e55489" onclick="return false;">
+                <button class="dropdown-item btn btn-success" id="6273a6d0-05d6-4ac6-beaa-4e4e77b351b0" onclick="return false;">
                  Buy
                 </button>
-                <button class="dropdown-item btn" id="05ba1da9-a70b-4962-a57a-494c6dac0097" onclick="return false;">
+                <button class="dropdown-item btn" id="0e886dda-8553-478a-a671-8f25e2c669d0" onclick="return false;">
                  Sell
                 </button>
-                <button class="dropdown-item btn" id="569b3aa8-6492-44be-877d-e8a2369b6cd1" onclick="return false;">
+                <button class="dropdown-item btn" id="909ceb5a-a6df-465d-9855-e5f097e1d92c" onclick="return false;">
                  Transfer
                 </button>
                </div>
@@ -5871,15 +5981,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="f673497a-2692-4a8c-a519-cfcd91490abe">
+           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.linkedin.com" id="24304cea-49e0-4b8f-8bb9-1fb9587981a3">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="a02a2b83-7550-4c73-8beb-ff6985e5c532" src="linkedin-logo.png" width="32"/>
+             <img height="32" id="ea8054f8-c582-4b9c-a10d-00702ae7df10" src="linkedin-logo.png" width="32"/>
              <div class="ms-2 me-2 w-100">
               <div class="d-flex w-100 justify-content-between">
-               <h5 id="595314c5-e0c1-4ede-982f-291edeea0374">
+               <h5 id="794e662b-5906-4886-8a73-95247c97c31a">
                 LinkedIn (NASDAQ: LNKD)
                </h5>
-               <span id="51dfc4d7-b0fa-4fa1-9044-c5db68679393">
+               <span id="99673572-1989-4f4a-adf7-b3de3cfc3ddc">
                 <small>
                  12:04:58 12/01/2021
                 </small>
@@ -5889,16 +5999,16 @@ List(
              </div>
              <div class="d-flex align-items-start">
               <div class="btn-group">
-               <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="a96f3e83-40c7-4348-b112-51b5ba6e1327" onclick="return false;" style="cursor: pointer">
+               <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="91d77f63-9248-4149-9a9c-cb1d22dd6461" onclick="return false;" style="cursor: pointer">
                </i>
                <div class="dropdown-menu dropdown-menu-right">
-                <button class="dropdown-item btn btn-success" id="ee8a4869-b83a-4428-987c-7e25e8e55489" onclick="return false;">
+                <button class="dropdown-item btn btn-success" id="6273a6d0-05d6-4ac6-beaa-4e4e77b351b0" onclick="return false;">
                  Buy
                 </button>
-                <button class="dropdown-item btn" id="05ba1da9-a70b-4962-a57a-494c6dac0097" onclick="return false;">
+                <button class="dropdown-item btn" id="0e886dda-8553-478a-a671-8f25e2c669d0" onclick="return false;">
                  Sell
                 </button>
-                <button class="dropdown-item btn" id="569b3aa8-6492-44be-877d-e8a2369b6cd1" onclick="return false;">
+                <button class="dropdown-item btn" id="909ceb5a-a6df-465d-9855-e5f097e1d92c" onclick="return false;">
                  Transfer
                 </button>
                </div>
@@ -5906,15 +6016,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="96e8c335-9968-4a61-95b1-d92c7b5c3081">
+           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.amazon.com" id="e550d66e-54e4-4f1c-acba-74e81682a3cf">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="2465f293-90ef-435f-adeb-030312541411" src="amazon-logo.png" width="32"/>
+             <img height="32" id="78c14882-9dcc-48ab-9ca6-65457c13415d" src="amazon-logo.png" width="32"/>
              <div class="ms-2 me-2 w-100">
               <div class="d-flex w-100 justify-content-between">
-               <h5 id="51f21a95-f241-4ae2-a686-4e6b6d008e39">
+               <h5 id="e272acbe-7671-4721-9ea0-c2f226c7c91b">
                 Amazon (NASDAQ: AMZN)
                </h5>
-               <span id="5f408da1-f37f-46da-9ab3-22de7b9b09a4">
+               <span id="127dba00-dc16-4969-aff9-a96657a2c1bc">
                 <small>
                  12:04:58 12/01/2021
                 </small>
@@ -5924,16 +6034,16 @@ List(
              </div>
              <div class="d-flex align-items-start">
               <div class="btn-group">
-               <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="7f833add-b740-4cd1-b748-1c4d9a7a412e" onclick="return false;" style="cursor: pointer">
+               <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="e62b8d3a-a1e9-48e1-85a7-1b438ca7b1ac" onclick="return false;" style="cursor: pointer">
                </i>
                <div class="dropdown-menu dropdown-menu-right">
-                <button class="dropdown-item btn btn-success" id="ee8a4869-b83a-4428-987c-7e25e8e55489" onclick="return false;">
+                <button class="dropdown-item btn btn-success" id="6273a6d0-05d6-4ac6-beaa-4e4e77b351b0" onclick="return false;">
                  Buy
                 </button>
-                <button class="dropdown-item btn" id="05ba1da9-a70b-4962-a57a-494c6dac0097" onclick="return false;">
+                <button class="dropdown-item btn" id="0e886dda-8553-478a-a671-8f25e2c669d0" onclick="return false;">
                  Sell
                 </button>
-                <button class="dropdown-item btn" id="569b3aa8-6492-44be-877d-e8a2369b6cd1" onclick="return false;">
+                <button class="dropdown-item btn" id="909ceb5a-a6df-465d-9855-e5f097e1d92c" onclick="return false;">
                  Transfer
                 </button>
                </div>
@@ -5945,32 +6055,32 @@ List(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="76737e58-b06f-4aef-86c5-4e78ed7c3038">
-        <div class="mt-5" id="ca6f0c02-718f-4640-87b8-4c72fd2a9434">
-         <div class="d-flex justify-content-between" id="f0f240b1-1783-4af9-a9dd-93f6e5c45c93">
-          <h1 id="3aed73b5-84e9-4197-9020-680f64d9da78">
+       <div class="tab-pane fade" id="d45386c9-d70c-435e-b88a-acb3ef3cd54c">
+        <div class="mt-5" id="db8bb994-e87e-488a-b730-40c93c431955">
+         <div class="d-flex justify-content-between" id="4e12d4dc-0eb5-44ff-8cd2-296e9dfae28c">
+          <h1 id="e413ac4b-c85a-47f9-a7c4-e91bd9227eda">
            Class
-           <span class="text-primary" id="cb2b00fa-937a-4fa6-922a-f1c9d2994c53">
+           <span class="text-primary" id="44b657e4-4915-4b32-ae47-aa1566bb9190">
             List.Item
            </span>
           </h1>
-          <div id="b14cd57d-7826-493f-aa20-5d1ee4105cde">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#5fb09401-ebd7-4f8b-8ad2-c571dcf16449" data-bs-toggle="collapse" id="7c795eff-9e62-43cd-8405-01a7060702c0" onclick="return false;" type="button">
+          <div id="fe1b296a-ad2c-4d42-8e94-90e3d48ff1e2">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#def78203-738e-46fd-814c-8154bc2dd2d0" data-bs-toggle="collapse" id="93ecdb43-68fd-47bb-b8fc-7713a838dde5" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="779c2279-bd1c-4fa5-ad1b-33c5afc0112e">
+         <span class="text-muted" id="de199f68-5165-459d-b590-c9388ea08c01">
           A list item.
          </span>
-         <pre id="419906a9-4f73-432d-8461-89f3793c12dd"><code class="python">List.Item(title, description=None, marker=None, figure=None)</code></pre>
-         <div class="ms-3 collapse" id="5fb09401-ebd7-4f8b-8ad2-c571dcf16449">
-          <h6 id="3dcf46fe-02d9-4ee1-b661-fbfe98be9621">
+         <pre id="b6013cf9-0a7f-4bfd-8753-16a3580effea"><code class="python">List.Item(title, description=None, marker=None, figure=None)</code></pre>
+         <div class="ms-3 collapse" id="def78203-738e-46fd-814c-8154bc2dd2d0">
+          <h6 id="5226701b-d9eb-46a9-b074-443957f90731">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="bd33e4ed-2f79-494e-85db-ec714f20e636">
+          <table class="table table-sm bg-light" id="897edb72-e2c8-49f8-b89a-78a11c3aa769">
            <thead>
             <tr>
              <th scope="col">
@@ -6048,13 +6158,13 @@ List(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="84d9ce61-61cd-48f5-8f70-199a6c6985f9">
-          <h6 id="676f8c8e-5930-410c-9b50-b54a105c5272">
+         <div class="ms-3" id="fc69c3a2-2ea4-4532-82bf-d577979bd28e">
+          <h6 id="c1dc0b1b-78c3-41bc-8bc1-f1b456e06654">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="19a8a465-1cef-4615-a9b9-ea4cb1a1ab3b"><code class="python">from bootwrap import Button, List, Image
+          <pre id="08d259cd-ade6-4b30-b228-f10f999213be"><code class="python">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy"),
@@ -6072,17 +6182,17 @@ List(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="6bdf3271-4d9b-472e-a9d7-b03f9b5b8672">
-          <div class="list-group" id="b365b3f7-6604-4b8b-b1f0-f2d42af8c12e">
-           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="ad09ee20-0092-4d82-9edf-f832b4e6569d">
+         <div class="ms-3" id="07ddd3b0-07ef-4f1e-bf81-4d517a79de2b">
+          <div class="list-group" id="7363b9a3-a78c-4a27-9b71-c3c266c36dd1">
+           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="0238f6ff-c239-4cc1-bd2c-dd1a3494961d">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="a242f3e5-63ae-4fb4-a319-61c749921f1c" src="google-logo.png" width="32"/>
+             <img height="32" id="bde25ea1-3fba-4053-a0fa-c269e61a1e05" src="google-logo.png" width="32"/>
              <div class="ms-2 me-2 w-100">
               <div class="d-flex w-100 justify-content-between">
-               <h5 id="d563c138-dd21-4f9e-84ab-827df2fe97c8">
+               <h5 id="d90841c7-de3b-42c5-b3de-dee871f3f85d">
                 Google (NASDAQ: GOOGL)
                </h5>
-               <span id="279b9838-ae58-466e-a946-5ac641688819">
+               <span id="6dc2f23e-8e05-4a3c-be08-2639daa1db21">
                 <small>
                  12:04:58 12/01/2021
                 </small>
@@ -6091,13 +6201,13 @@ List(
               Price for a single Google share
              </div>
              <div class="d-flex align-items-start">
-              <button class="ms-1 btn" id="831e7713-9d33-4ee6-8165-bd685bae51c8" onclick="return false;">
+              <button class="ms-1 btn" id="f042f82a-694a-4138-931b-8202c8a8024a" onclick="return false;">
                Buy
               </button>
-              <button class="ms-1 btn" id="60484333-5de4-416f-b5fa-19e42bf10bad" onclick="return false;">
+              <button class="ms-1 btn" id="dd3c88e4-d1a9-401a-bcfe-a0278e250941" onclick="return false;">
                Sell
               </button>
-              <button class="ms-1 btn" id="3c89bf72-9ae6-4ff7-9e71-3340a7fa6c73" onclick="return false;">
+              <button class="ms-1 btn" id="a3bae2de-35a7-4835-9af1-9ce11ddee26a" onclick="return false;">
                Transfer
               </button>
              </div>
@@ -6105,28 +6215,28 @@ List(
            </a>
           </div>
          </div>
-         <div class="mt-5" id="ee77abc4-cfee-4253-8ef5-ffc2c3d83e0c">
-          <div class="d-flex justify-content-between" id="7e38112f-2103-4bee-bfde-c2e8c9750dc1">
-           <h4 id="ee19a8f2-4cbb-45bd-98ba-22ee159ecd54">
+         <div class="mt-5" id="f15d2b08-5165-4f9d-ac84-72620d942ad7">
+          <div class="d-flex justify-content-between" id="fe95fe23-6c8c-4ab0-b23a-4d4cdb162e96">
+           <h4 id="0f24f813-c824-4eb8-b9da-2cde779dbd9d">
             Method
-            <span class="text-primary" id="0a499780-99a3-4807-af0a-295cd2ec6cec">
+            <span class="text-primary" id="4104f5d2-5c6b-49e9-bdcd-cc6ad5461d45">
              as_selected
             </span>
            </h4>
-           <div id="99bb8fcf-d431-41b7-9fa8-96f280c5124b">
+           <div id="226f94bd-d576-4117-b2d6-672e322169eb">
            </div>
           </div>
-          <span class="text-muted" id="360c4295-4ff8-4a68-86c1-972c51e9627b">
+          <span class="text-muted" id="675ca4df-2023-4f77-ad43-c38b765a3654">
            Makes a list item selected.
           </span>
-          <pre id="f72af310-00bf-42ad-a6ed-27fa1145ccfd"><code class="python">as_selected()</code></pre>
-          <div class="ms-3" id="b7ec948b-aa14-4de2-8ee3-affe6968423c">
-           <h6 id="a439ab16-6705-495e-826f-56417d8d6c54">
+          <pre id="d3d5b5d0-2336-421c-8a54-1ca96074dbad"><code class="python">as_selected()</code></pre>
+          <div class="ms-3" id="f2f0260e-6033-43af-98ae-da2ef53e9210">
+           <h6 id="4c55a6ec-b3ad-4acb-9a05-7c6150618a4c">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="14751e74-858b-4168-96ad-742175bcf021"><code class="python">from bootwrap import Button, List, Image
+           <pre id="89a573cb-6627-42b6-9c46-ca4c022f71e2"><code class="python">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy"),
@@ -6145,17 +6255,17 @@ List(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="fa6ad16b-769b-48b6-8980-04c48e3be2fd">
-           <div class="list-group" id="0726d54a-f3d2-450f-9bab-44268b4381ee">
-            <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="a85ab7d3-4b2b-490d-8013-47ce39934eb5">
+          <div class="ms-3" id="b05cc5bd-492d-42d0-ad0d-ce89ae01bc32">
+           <div class="list-group" id="c78ff6bc-acae-4f57-8fce-2439cbea635f">
+            <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="b9396da3-db8f-4290-afc3-5b497e0ef6fe">
              <div class="d-flex w-100 justify-content-between">
-              <img height="32" id="f452507d-2c72-4d86-9679-2e49c04c689c" src="google-logo.png" width="32"/>
+              <img height="32" id="135fbab5-bddc-4477-a65d-58b31f8f6c11" src="google-logo.png" width="32"/>
               <div class="ms-2 me-2 w-100">
                <div class="d-flex w-100 justify-content-between">
-                <h5 id="cae0f32f-7c36-450a-ba4f-af4b741dca5e">
+                <h5 id="3067b9c8-d1c0-4e17-a420-cb78c2385b4d">
                  Google (NASDAQ: GOOGL)
                 </h5>
-                <span id="58a02d5d-629b-43b6-b856-2bf0e940c715">
+                <span id="b95c62c4-0248-4e2b-ad7c-ec3eb7cee150">
                  <small>
                   12:04:58 12/01/2021
                  </small>
@@ -6164,13 +6274,13 @@ List(
                Price for a single Google share
               </div>
               <div class="d-flex align-items-start">
-               <button class="ms-1 btn" id="fbdf8f4c-8253-4331-b9b6-793125f975a7" onclick="return false;">
+               <button class="ms-1 btn" id="8a6320ef-d2bd-4e4b-9a6c-58bd1028fcc2" onclick="return false;">
                 Buy
                </button>
-               <button class="ms-1 btn" id="3ac3030c-8813-446d-90a5-87f6edf6feb8" onclick="return false;">
+               <button class="ms-1 btn" id="f6b70406-125d-4a08-b3ce-14a547a2f9dc" onclick="return false;">
                 Sell
                </button>
-               <button class="ms-1 btn" id="22cc1eed-77e8-4d96-bb2f-e3ebf3efa9d0" onclick="return false;">
+               <button class="ms-1 btn" id="5c58e213-6ed2-4ae1-a175-d8977816dfd3" onclick="return false;">
                 Transfer
                </button>
               </div>
@@ -6179,28 +6289,28 @@ List(
            </div>
           </div>
          </div>
-         <div class="mt-5" id="9116ddf4-7776-4c9b-a95a-82b6e1c71a31">
-          <div class="d-flex justify-content-between" id="04231707-7ac1-46e6-9562-ad22f43bb90b">
-           <h4 id="ed806c7c-67f3-41b9-86df-ae86d25272a5">
+         <div class="mt-5" id="1ddcc334-81cb-4e79-b99d-a465be622e16">
+          <div class="d-flex justify-content-between" id="1afb933c-3d74-427b-bf6c-33874fe97b28">
+           <h4 id="c91f7b80-d235-4d51-a0d3-fa6eb51ff93a">
             Method
-            <span class="text-primary" id="b911d72f-7954-4083-a5c0-b3c492d3a857">
+            <span class="text-primary" id="ad5ee7c3-1e9e-43f6-8545-45d185004c32">
              pack_actions
             </span>
            </h4>
-           <div id="af1e3d43-a05e-4780-a896-a4be3c938828">
+           <div id="ce120ee9-ae96-4dd3-8af7-b164334b333c">
            </div>
           </div>
-          <span class="text-muted" id="8f1fe367-31db-435d-8204-d51270cccaf7">
+          <span class="text-muted" id="1197903d-6f3d-4e17-abde-0c0f57beadd7">
            Makes item actions packed under a drop-down menu.
           </span>
-          <pre id="2983c81d-e329-43b7-8afc-9a01d36d2285"><code class="python">pack_actions()</code></pre>
-          <div class="ms-3" id="86377e90-7583-49fc-b84c-ec6e6a8574a7">
-           <h6 id="90aff3e9-c156-486c-a85d-8534cdf4f62a">
+          <pre id="943db93d-c1f6-471b-a09a-4037e1275100"><code class="python">pack_actions()</code></pre>
+          <div class="ms-3" id="6caaf56e-87cf-4931-abb5-ced67f19a6be">
+           <h6 id="6d451a15-1c6a-4f92-a702-ed24edeafd96">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="2c5cf3d5-5fd5-406d-8d78-f69855f60095"><code class="python">from bootwrap import Button, List, Image
+           <pre id="03db6790-1177-4247-b3c6-1f6c449ea490"><code class="python">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy"),
@@ -6219,17 +6329,17 @@ List(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="54e0f67a-b8d7-4be4-8808-aaf33e5956b4">
-           <div class="list-group" id="ab97b264-1985-421e-bed1-27f229b27cc6">
-            <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="dedb158c-6566-4fbb-a7b3-dbceaac6e9c7">
+          <div class="ms-3" id="5f910f1e-5b6c-4d1a-9e0c-7cff0832f789">
+           <div class="list-group" id="d43d9330-f792-482c-92fb-d02208f56648">
+            <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="d15b6ef5-9144-47a9-8048-0528ea9af27b">
              <div class="d-flex w-100 justify-content-between">
-              <img height="32" id="16724ca5-3ebe-4da3-9f4f-0e9eba4071bf" src="google-logo.png" width="32"/>
+              <img height="32" id="47461905-3938-43cf-b7b3-9038fe77dd66" src="google-logo.png" width="32"/>
               <div class="ms-2 me-2 w-100">
                <div class="d-flex w-100 justify-content-between">
-                <h5 id="e48a5390-dbd0-4a92-a8e7-9b15ff135a16">
+                <h5 id="773c53ff-e960-45a6-9c74-1b134a023870">
                  Google (NASDAQ: GOOGL)
                 </h5>
-                <span id="5186fb54-35b5-44ec-8232-c37723fed3ad">
+                <span id="22522a7c-a94a-4e79-901c-b0cc6bd75ad5">
                  <small>
                   12:04:58 12/01/2021
                  </small>
@@ -6239,16 +6349,16 @@ List(
               </div>
               <div class="d-flex align-items-start">
                <div class="btn-group">
-                <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="cbb61c43-3357-477d-9c5f-6cebffaaa6fe" onclick="return false;" style="cursor: pointer">
+                <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="068856a5-ed31-4a00-a890-3999c2675619" onclick="return false;" style="cursor: pointer">
                 </i>
                 <div class="dropdown-menu dropdown-menu-right">
-                 <button class="dropdown-item btn" id="27f5e7bb-d815-41eb-a5c4-33af96547893" onclick="return false;">
+                 <button class="dropdown-item btn" id="3ae07047-be6c-4dba-b966-736014bb7e8c" onclick="return false;">
                   Buy
                  </button>
-                 <button class="dropdown-item btn" id="831d9223-2620-4496-9e06-9595b1b9f7bc" onclick="return false;">
+                 <button class="dropdown-item btn" id="283f5327-7a65-4b45-b055-5408928f7a6d" onclick="return false;">
                   Sell
                  </button>
-                 <button class="dropdown-item btn" id="68c9bcf2-ee6e-4a35-9c0d-347b0b053350" onclick="return false;">
+                 <button class="dropdown-item btn" id="1bccfd4b-a827-477b-8c24-f6d2a7aa00b9" onclick="return false;">
                   Transfer
                  </button>
                 </div>
@@ -6264,52 +6374,52 @@ List(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="5cd379c9-21ad-4110-9322-0cf8e1be8294">
-     <div id="cc708a21-fcac-44f4-ad2f-36d24918bd3e">
+    <div class="tab-pane fade" id="d3fc9219-3d8f-493b-aadd-69506b0586fa">
+     <div id="f8c8888a-9a49-49ba-ba97-eabe562cb11f">
       <hr/>
-      <ul class="nav" id="f21ce3f9-e589-4e30-81b2-43b6c9ca3072" role="tablist">
+      <ul class="nav" id="ef372909-5c55-4ba0-9e3c-3733ec0035ef" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#00bdb4ba-7c29-4a54-a688-3e8816a070d3" data-bs-toggle="tab" href="#00bdb4ba-7c29-4a54-a688-3e8816a070d3" id="858fecd9-a99f-43c5-b7ca-92895fa3f4b7" role="tab">
-         <span class="text-secondary" id="7555d9d9-6b43-4f62-b0f1-4cdd6fe426ba">
+        <a class="nav-link active" data-bs-target="#5c2c40b9-6fea-4d24-93ce-69fb633f92b2" data-bs-toggle="tab" href="#5c2c40b9-6fea-4d24-93ce-69fb633f92b2" id="0150d31a-63ba-4f4b-95f6-a731b2cc3845" role="tab">
+         <span class="text-secondary" id="28388d00-af80-4af7-a725-890b48cd1dd2">
           Navigation
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#24424733-893f-4726-beb9-cfeb354720b1" data-bs-toggle="tab" href="#24424733-893f-4726-beb9-cfeb354720b1" id="7f9c9bc2-d0dc-4aaf-8fed-6c867b1291e1" role="tab">
-         <span class="text-secondary" id="0f24772e-ba0f-40a2-afa5-f66736081c48">
+        <a class="nav-link" data-bs-target="#40e94c04-d6be-42c2-94bb-4ce016d879b9" data-bs-toggle="tab" href="#40e94c04-d6be-42c2-94bb-4ce016d879b9" id="df6c37a9-a19f-44e9-ab99-858503779d8a" role="tab">
+         <span class="text-secondary" id="e7b83267-01b4-4717-b11a-2654d5b31b3b">
           Navigation.Item
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="00bdb4ba-7c29-4a54-a688-3e8816a070d3">
-        <div class="mt-5" id="06463a9a-752c-46e9-a45e-569e6a2fcdda">
-         <div class="d-flex justify-content-between" id="9fcd68f3-32c4-4303-ab54-ec0246be7e15">
-          <h1 id="951ebff2-c4aa-4264-9fe0-4d057c4bc52c">
+       <div class="tab-pane fade active show" id="5c2c40b9-6fea-4d24-93ce-69fb633f92b2">
+        <div class="mt-5" id="0cf894a8-7eb9-4068-9654-919f9bfe9578">
+         <div class="d-flex justify-content-between" id="2ee24f34-9299-4fb3-8a9d-f344758d16ce">
+          <h1 id="cab5c520-69fe-45d3-a86b-6a1309cbd433">
            Class
-           <span class="text-primary" id="c3974c4a-5671-4147-b865-3e1aa0e4ba28">
+           <span class="text-primary" id="0cf8866a-bb1b-4941-a7d5-be22112af74d">
             Navigation
            </span>
           </h1>
-          <div id="a1afc920-4172-46db-92ac-0192c20cfaed">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#2790ec80-d7e1-40a6-a682-4377d4266358" data-bs-toggle="collapse" id="90bd6de8-614e-4627-8551-fc8765c36a6d" onclick="return false;" type="button">
+          <div id="f94a4f19-da12-4175-b55b-677feee33a31">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#1a999fe3-4530-4807-ac5f-3bf01bd278cc" data-bs-toggle="collapse" id="d4edfd43-dc74-409e-ae50-3aba3083c435" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="f540aabb-98bd-4bc2-bf64-821375570a12">
+         <span class="text-muted" id="a28f27e4-8c5a-4de6-a1ba-37496f557d3e">
           A web component for navigation.
          </span>
-         <pre id="d39e9fc4-9888-4897-9bd0-0f6bf33885a0"><code class="python">Navigation(*items)</code></pre>
-         <div class="ms-3 collapse" id="2790ec80-d7e1-40a6-a682-4377d4266358">
-          <h6 id="db2c465b-92e1-4ff3-8cba-55647dcbb1f1">
+         <pre id="ddc88506-0ac8-477a-9bc2-6202ab1dea89"><code class="python">Navigation(*items)</code></pre>
+         <div class="ms-3 collapse" id="1a999fe3-4530-4807-ac5f-3bf01bd278cc">
+          <h6 id="14086b33-93c7-4878-98bc-07f922535195">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="2da5e5f6-9097-4a7e-a6db-a51a282b69e4">
+          <table class="table table-sm bg-light" id="129230c0-f132-46c8-9adb-40a98cb847a2">
            <thead>
             <tr>
              <th scope="col">
@@ -6346,13 +6456,13 @@ List(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="bf12b2c2-3476-426d-a1a2-af8037d68f1f">
-          <h6 id="b7310492-cce7-46b5-b85a-9dceb3ac8f2b">
+         <div class="ms-3" id="1c6502bc-b699-4b4d-ae35-ef96ecaee5c4">
+          <h6 id="c93220cb-63d0-43ca-87ba-efc0121dd26e">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="84927be5-5ed5-41f1-ab5a-6141472e0e1c"><code class="python">from bootwrap import Navigation
+          <pre id="d6b68099-6ecc-4029-9e6f-a63844a6d69f"><code class="python">from bootwrap import Navigation
 
 Navigation(
     Navigation.Item('Chapter 1', 'Text 1', True),
@@ -6361,61 +6471,61 @@ Navigation(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="6daf0fac-9f95-4f10-9f49-801f328fcd7e">
-          <ul class="nav" id="db1b3e5f-b9d8-496b-8d62-a98eaa35642a" role="tablist">
+         <div class="ms-3" id="57f0b257-a66a-426b-828b-50b6c0930cbc">
+          <ul class="nav" id="7957cbf9-f5b9-4a3a-b205-e82a8c66a4b3" role="tablist">
            <li class="nav-item">
-            <a class="nav-link active" data-bs-target="#cd572352-1de7-4698-a6cc-dd3d2a502588" data-bs-toggle="tab" href="#cd572352-1de7-4698-a6cc-dd3d2a502588" id="89f623db-9bfd-4a12-93b1-5393d7809283" role="tab">
+            <a class="nav-link active" data-bs-target="#9a879caa-7237-4546-ab67-3977fb25af0f" data-bs-toggle="tab" href="#9a879caa-7237-4546-ab67-3977fb25af0f" id="a8243694-aaf6-4f75-baab-5d9f51376b2c" role="tab">
              Chapter 1
             </a>
            </li>
            <li class="nav-item">
-            <a class="nav-link" data-bs-target="#b7d37408-1945-4489-918f-a1f9211376cc" data-bs-toggle="tab" href="#b7d37408-1945-4489-918f-a1f9211376cc" id="0cc36aa3-6536-4e21-b05a-0c34fd6e43b9" role="tab">
+            <a class="nav-link" data-bs-target="#af54acde-5d9e-44f6-b7fd-23efb30e09bc" data-bs-toggle="tab" href="#af54acde-5d9e-44f6-b7fd-23efb30e09bc" id="d99de209-da34-4738-a770-6bfddc7451de" role="tab">
              Chapter 2
             </a>
            </li>
            <li class="nav-item">
-            <a class="nav-link" data-bs-target="#af839788-589a-49a9-a73f-f3f0d3b93b9b" data-bs-toggle="tab" href="#af839788-589a-49a9-a73f-f3f0d3b93b9b" id="dedeb559-88f8-4465-bf2c-f57d9d9e2f70" role="tab">
+            <a class="nav-link" data-bs-target="#e5b8c579-efbf-47ae-99af-2a0ca1ce945f" data-bs-toggle="tab" href="#e5b8c579-efbf-47ae-99af-2a0ca1ce945f" id="7cb2f96f-176c-46f3-b3fe-51db29531ad0" role="tab">
              Chapter 3
             </a>
            </li>
           </ul>
           <div class="tab-content">
-           <div class="tab-pane fade active show" id="cd572352-1de7-4698-a6cc-dd3d2a502588">
+           <div class="tab-pane fade active show" id="9a879caa-7237-4546-ab67-3977fb25af0f">
             Text 1
            </div>
-           <div class="tab-pane fade" id="b7d37408-1945-4489-918f-a1f9211376cc">
+           <div class="tab-pane fade" id="af54acde-5d9e-44f6-b7fd-23efb30e09bc">
             Text 2
            </div>
-           <div class="tab-pane fade" id="af839788-589a-49a9-a73f-f3f0d3b93b9b">
+           <div class="tab-pane fade" id="e5b8c579-efbf-47ae-99af-2a0ca1ce945f">
             Text 3
            </div>
           </div>
          </div>
-         <div class="mt-5" id="ad9b4b8e-1d73-46fe-8fe9-39863b667a11">
-          <div class="d-flex justify-content-between" id="a10b7b56-e102-4ece-bd25-47fb619e93ac">
-           <h4 id="0ec5bdc5-6d36-4eaa-9cf6-dc177f9ed583">
+         <div class="mt-5" id="89938f57-2fdf-40ad-b5f2-e5b8a82405b2">
+          <div class="d-flex justify-content-between" id="2a3d6798-ed28-4c64-b6f5-94336047ccf8">
+           <h4 id="d76bb6ab-b474-4233-bb2f-e543682d71c1">
             Method
-            <span class="text-primary" id="7d5b37bb-e2b0-460c-a650-40da593bdc9f">
+            <span class="text-primary" id="d43ace7a-c233-451e-9718-e3b00f7fedc4">
              as_pills
             </span>
            </h4>
-           <div id="82207ed0-9381-4043-bedf-7ab4492cbb31">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#8aeafaab-5b13-4a6e-8cb4-854651f3b46e" data-bs-toggle="collapse" id="b6173621-5fc1-4372-8726-873a363492e6" onclick="return false;" type="button">
+           <div id="de20028e-7588-404d-8bfa-467a48c9a384">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#be63b305-4364-46ef-b89c-aaea2149b415" data-bs-toggle="collapse" id="197dd603-4728-4d3f-a1fe-648fe9697a0e" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="99045f41-beee-4951-bf01-496c5d20ee3d">
+          <span class="text-muted" id="dde8aa7f-121d-49a1-8fa4-99f8aeae6592">
            Makes the navigation controls looks like buttons.
           </span>
-          <pre id="b9af7096-81a9-4534-9d8e-c88d3d441da9"><code class="python">as_pills()</code></pre>
-          <div class="ms-3 collapse" id="8aeafaab-5b13-4a6e-8cb4-854651f3b46e">
-           <h6 id="47a55131-89b9-4e0a-8703-6db9a783f4f0">
+          <pre id="2ca63f2b-16ff-4b7c-bdeb-b393f93e668f"><code class="python">as_pills()</code></pre>
+          <div class="ms-3 collapse" id="be63b305-4364-46ef-b89c-aaea2149b415">
+           <h6 id="772f6e6e-5d3e-4ede-9fe5-9e3bfd0d3078">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="d4625b58-b725-4c67-b468-c7f20695a616">
+           <table class="table table-sm bg-light" id="75da9258-07cf-414b-9218-12247f89f1f9">
             <thead>
              <tr>
               <th scope="col">
@@ -6448,13 +6558,13 @@ Navigation(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="40213930-8d53-4f55-ae6e-c5ffa708e9b2">
-           <h6 id="84adff63-e8f9-48ba-88d6-07861d6caa14">
+          <div class="ms-3" id="fd9558bc-d114-42f6-8865-797fe3a2aee1">
+           <h6 id="59c25f06-b904-47de-817a-004f4a36571e">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="a996971e-315d-465c-830a-635d6361b81d"><code class="python">from bootwrap import Navigation
+           <pre id="6ac73842-2c42-419a-8aa1-4922a03ede9a"><code class="python">from bootwrap import Navigation
 
 Navigation(
     Navigation.Item('Chapter 1', 'Text 1', True),
@@ -6463,62 +6573,62 @@ Navigation(
 ).as_pills()
 </code></pre>
           </div>
-          <div class="ms-3" id="af645912-f150-4d14-8dea-d0431c641988">
-           <ul class="nav nav-pills" id="3c929bbc-5fdf-4740-821a-5782b4fffe12" role="tablist">
+          <div class="ms-3" id="7a0ca778-6350-4b1c-9398-0bd11904e1ab">
+           <ul class="nav nav-pills" id="e93f6c59-01fb-448e-bc26-eca6fa58b2ab" role="tablist">
             <li class="nav-item">
-             <a class="nav-link active" data-bs-target="#1dbb0010-f706-4533-895a-0b377d5071af" data-bs-toggle="tab" href="#1dbb0010-f706-4533-895a-0b377d5071af" id="94e8d9dd-73cf-4f8c-a6c9-7c4408a2c8e4" role="tab">
+             <a class="nav-link active" data-bs-target="#556fb38c-52e5-4518-a968-a6d309cf2e9e" data-bs-toggle="tab" href="#556fb38c-52e5-4518-a968-a6d309cf2e9e" id="002342ae-3bb4-448a-9b5c-73e0ee9d1a5a" role="tab">
               Chapter 1
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-bs-target="#dad7d247-8692-440c-ba0f-95561b4caff7" data-bs-toggle="tab" href="#dad7d247-8692-440c-ba0f-95561b4caff7" id="4b5d6974-266a-4e8a-90c8-b8088c5ea5b2" role="tab">
+             <a class="nav-link" data-bs-target="#99370a11-e576-46b4-a96d-ae3e81deec43" data-bs-toggle="tab" href="#99370a11-e576-46b4-a96d-ae3e81deec43" id="719080d2-b8c6-46d2-a857-72fd24236bdb" role="tab">
               Chapter 2
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-bs-target="#204ce961-ea96-47d9-83c7-44a5a6b5a192" data-bs-toggle="tab" href="#204ce961-ea96-47d9-83c7-44a5a6b5a192" id="d22267d5-9b48-4fb6-a72a-c2ab06d378f3" role="tab">
+             <a class="nav-link" data-bs-target="#8b95cf6a-342d-45cb-ba99-0d98432121bb" data-bs-toggle="tab" href="#8b95cf6a-342d-45cb-ba99-0d98432121bb" id="d84f5858-d778-43aa-8688-b422d3772ada" role="tab">
               Chapter 3
              </a>
             </li>
            </ul>
            <div class="tab-content">
-            <div class="tab-pane fade active show" id="1dbb0010-f706-4533-895a-0b377d5071af">
+            <div class="tab-pane fade active show" id="556fb38c-52e5-4518-a968-a6d309cf2e9e">
              Text 1
             </div>
-            <div class="tab-pane fade" id="dad7d247-8692-440c-ba0f-95561b4caff7">
+            <div class="tab-pane fade" id="99370a11-e576-46b4-a96d-ae3e81deec43">
              Text 2
             </div>
-            <div class="tab-pane fade" id="204ce961-ea96-47d9-83c7-44a5a6b5a192">
+            <div class="tab-pane fade" id="8b95cf6a-342d-45cb-ba99-0d98432121bb">
              Text 3
             </div>
            </div>
           </div>
          </div>
-         <div class="mt-5" id="779f7bc9-ee73-41ce-a6f4-92e7c5f3d576">
-          <div class="d-flex justify-content-between" id="4722ec2e-3182-4de6-9669-4c1a1595ada1">
-           <h4 id="acd3e5e7-c199-472f-a5d3-babb15ac2788">
+         <div class="mt-5" id="99af9552-d5ad-4826-8153-48d6ef47be36">
+          <div class="d-flex justify-content-between" id="651d645e-8b64-4a57-9aae-6e971b7a4b80">
+           <h4 id="d9a09c26-f265-4da5-a3fb-9ce1f948efc9">
             Method
-            <span class="text-primary" id="4cf074f7-03b0-4864-8bc3-0a5b5d830e83">
+            <span class="text-primary" id="f4c79d33-cf62-4830-928b-773d5c5a4385">
              as_tabs
             </span>
            </h4>
-           <div id="06320de6-03c4-4bde-aa1c-7ebc36255546">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#5005c741-a33b-464f-a8de-c19d3630efb0" data-bs-toggle="collapse" id="3e250e8a-fcad-4620-858b-0c72efd768ba" onclick="return false;" type="button">
+           <div id="98925d59-ce2f-4e3b-b98e-de5ed07411e1">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#bbf0de84-3a1e-4387-8663-1f58f0725a7e" data-bs-toggle="collapse" id="c2e0e956-5377-4351-907d-4d6eda70b246" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="5459b1d5-d7e2-4e7e-8a5c-29fdb9bc1f87">
+          <span class="text-muted" id="f3d8c34f-2e3a-4d3e-8541-4b1059bbbbbd">
            Makes the navigation controls looks like buttons.
           </span>
-          <pre id="dd09b96a-81f6-40ce-8b79-058464e50b38"><code class="python">as_tabs()</code></pre>
-          <div class="ms-3 collapse" id="5005c741-a33b-464f-a8de-c19d3630efb0">
-           <h6 id="902e92ac-5f28-44cb-bb7c-b0d371809301">
+          <pre id="4c2dea38-2397-4a25-8509-a91ad2e5cc3b"><code class="python">as_tabs()</code></pre>
+          <div class="ms-3 collapse" id="bbf0de84-3a1e-4387-8663-1f58f0725a7e">
+           <h6 id="e05ab36e-f888-44e6-a20d-2049fa544549">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="8f9081f8-0382-43cc-adef-de0297c00358">
+           <table class="table table-sm bg-light" id="24a86e48-bdd2-4489-9076-23f5b586e072">
             <thead>
              <tr>
               <th scope="col">
@@ -6551,13 +6661,13 @@ Navigation(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="f19db590-74e0-4e0e-a3c7-e8bc4fa830fe">
-           <h6 id="f23ef749-d283-4a01-9457-0f2cf178ae27">
+          <div class="ms-3" id="f33da5bb-f8cb-4e3c-8957-d5eac49b2835">
+           <h6 id="22f9ca05-9a6b-40fb-ab12-760c4830daab">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="772b6f40-69be-4725-b25a-298725f5d38b"><code class="python">from bootwrap import Navigation
+           <pre id="e0d5d2a9-9713-4271-9fd5-b81333cb5594"><code class="python">from bootwrap import Navigation
 
 Navigation(
     Navigation.Item('Chapter 1', 'Text 1', True),
@@ -6566,62 +6676,62 @@ Navigation(
 ).as_tabs()
 </code></pre>
           </div>
-          <div class="ms-3" id="0a3a4205-1ee2-44e7-a59d-46397247a7bd">
-           <ul class="nav nav-tabs" id="8c2953e8-d13d-4410-bf4f-fcaa254e781c" role="tablist">
+          <div class="ms-3" id="473177e6-5fa8-419f-9ac7-ffafd961a4ec">
+           <ul class="nav nav-tabs" id="68e25f50-7d04-4c87-a238-971f0a208fd8" role="tablist">
             <li class="nav-item">
-             <a class="nav-link active" data-bs-target="#e671a70e-aea4-461e-86af-ce3b8c6f044a" data-bs-toggle="tab" href="#e671a70e-aea4-461e-86af-ce3b8c6f044a" id="db938037-8eeb-497e-af0b-d567ba5b0173" role="tab">
+             <a class="nav-link active" data-bs-target="#118db275-117b-4feb-8ca0-96ad6c48e7b9" data-bs-toggle="tab" href="#118db275-117b-4feb-8ca0-96ad6c48e7b9" id="2d4bb17e-8d12-4370-ae3b-77b016015003" role="tab">
               Chapter 1
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-bs-target="#baa6fd8c-eb26-40bb-9d52-85c50f61b141" data-bs-toggle="tab" href="#baa6fd8c-eb26-40bb-9d52-85c50f61b141" id="8f4dc84d-29f1-4612-8122-a9a4b3b4e339" role="tab">
+             <a class="nav-link" data-bs-target="#cd44f667-3478-4eb1-9ffe-5f11c352d978" data-bs-toggle="tab" href="#cd44f667-3478-4eb1-9ffe-5f11c352d978" id="d4601901-d86f-47ac-8d57-5ece28bd0ad7" role="tab">
               Chapter 2
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-bs-target="#d88871ae-65b6-4730-9578-786266095664" data-bs-toggle="tab" href="#d88871ae-65b6-4730-9578-786266095664" id="926bfd1e-327f-494c-8d3d-ecc564ae84ab" role="tab">
+             <a class="nav-link" data-bs-target="#4c0c84a4-3246-49d1-bcfc-2295762bdf43" data-bs-toggle="tab" href="#4c0c84a4-3246-49d1-bcfc-2295762bdf43" id="0ae46e20-1879-40e5-8e34-b09a39c3d955" role="tab">
               Chapter 3
              </a>
             </li>
            </ul>
            <div class="tab-content">
-            <div class="tab-pane fade active show" id="e671a70e-aea4-461e-86af-ce3b8c6f044a">
+            <div class="tab-pane fade active show" id="118db275-117b-4feb-8ca0-96ad6c48e7b9">
              Text 1
             </div>
-            <div class="tab-pane fade" id="baa6fd8c-eb26-40bb-9d52-85c50f61b141">
+            <div class="tab-pane fade" id="cd44f667-3478-4eb1-9ffe-5f11c352d978">
              Text 2
             </div>
-            <div class="tab-pane fade" id="d88871ae-65b6-4730-9578-786266095664">
+            <div class="tab-pane fade" id="4c0c84a4-3246-49d1-bcfc-2295762bdf43">
              Text 3
             </div>
            </div>
           </div>
          </div>
-         <div class="mt-5" id="e9a2ab5d-cbac-4c7e-b1b5-a2d95ebe8143">
-          <div class="d-flex justify-content-between" id="f9ae0a3e-12e1-447d-ae47-a9633dd3d4d5">
-           <h4 id="0b99b1c3-031d-4b89-8b32-a3a9fe3d2b54">
+         <div class="mt-5" id="99f9711f-426e-438e-8d92-90da8be3c659">
+          <div class="d-flex justify-content-between" id="880bcc73-3d7f-4a99-a04a-f31e8b5e9d54">
+           <h4 id="658168a2-f3d7-4264-8d1d-ba34bbb2d96b">
             Method
-            <span class="text-primary" id="5f2c1bbf-4cbb-4495-b960-c48b0b583ad2">
+            <span class="text-primary" id="17736451-5e3a-4022-95fd-8416a15dd71a">
              as_vertical
             </span>
            </h4>
-           <div id="a9d54c81-8db7-4132-831c-0ba5ac9f5dbd">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#1d702105-a0b4-447d-bc31-90344f887133" data-bs-toggle="collapse" id="71c8403a-fc17-4bfa-8da1-297a14fc216f" onclick="return false;" type="button">
+           <div id="c16be142-1fdb-49c3-a505-a54a6a01ac72">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#36a818db-9c38-474d-92d0-991470272c5d" data-bs-toggle="collapse" id="4b04a509-e02e-46a8-834e-4426c5843185" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="96a93a6f-ab23-4f2d-ba16-ee1bfe4fdd55">
+          <span class="text-muted" id="08135a1c-d341-4d3d-b1fe-91208b1bf390">
            Makes the navigation vertical.
           </span>
-          <pre id="3835b931-cbb5-41f9-9d00-489506020a6c"><code class="python">as_vertical()</code></pre>
-          <div class="ms-3 collapse" id="1d702105-a0b4-447d-bc31-90344f887133">
-           <h6 id="beebeb80-c90e-4df3-806c-4ff0a14a3401">
+          <pre id="bd88d658-e070-4154-91a0-4b4ccc135a6b"><code class="python">as_vertical()</code></pre>
+          <div class="ms-3 collapse" id="36a818db-9c38-474d-92d0-991470272c5d">
+           <h6 id="257a87a3-b8df-40c2-b6fb-d03b430c8f83">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="d8d53c1b-a778-4a4e-9223-d6f25085d178">
+           <table class="table table-sm bg-light" id="92968381-d77e-4a38-bc42-1c068dda5400">
             <thead>
              <tr>
               <th scope="col">
@@ -6654,13 +6764,13 @@ Navigation(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="ecce5a36-86a3-45a4-80c5-95d318e793de">
-           <h6 id="8565d5cc-2f89-4f30-a35a-ecd5b85acc82">
+          <div class="ms-3" id="f2d74896-1ba6-4f02-8ab6-7559d13bc8e1">
+           <h6 id="67381f0f-1117-4bd6-826b-32b0a2cd5e86">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="f960186a-7afb-4340-b496-daa9aa845f23"><code class="python">from bootwrap import Navigation
+           <pre id="03044792-3ace-465c-9d6f-3c421a93b6f4"><code class="python">from bootwrap import Navigation
 
 Navigation(
     Navigation.Item('Chapter 1', 'Text 1', True),
@@ -6669,33 +6779,33 @@ Navigation(
 ).as_vertical()
 </code></pre>
           </div>
-          <div class="ms-3" id="6ade576f-4073-44c4-b5f4-0007f30355d6">
+          <div class="ms-3" id="a7a6ceaf-1e8e-4ee0-b7c2-ac19c56dca0f">
            <div class="d-flex">
-            <ul class="nav flex-column" id="7a5aff8b-6412-4207-abb4-c478a6889181" role="tablist">
+            <ul class="nav flex-column" id="1803457f-6051-4176-aeef-1fcd3d414799" role="tablist">
              <li class="nav-item">
-              <a class="nav-link active" data-bs-target="#d7c1f7dd-4746-403d-8332-e17d6483fb88" data-bs-toggle="tab" href="#d7c1f7dd-4746-403d-8332-e17d6483fb88" id="d9e960c0-2073-4c46-927d-63f8eb6e4fcc" role="tab">
+              <a class="nav-link active" data-bs-target="#b6636b18-af32-4de9-8039-2920e6630483" data-bs-toggle="tab" href="#b6636b18-af32-4de9-8039-2920e6630483" id="22e05a90-e110-4a69-8e66-1af7a681d039" role="tab">
                Chapter 1
               </a>
              </li>
              <li class="nav-item">
-              <a class="nav-link" data-bs-target="#dbe2075f-ce80-4b93-b094-dcd609cdcf53" data-bs-toggle="tab" href="#dbe2075f-ce80-4b93-b094-dcd609cdcf53" id="88aff263-139f-4b83-ad59-3c4d18835574" role="tab">
+              <a class="nav-link" data-bs-target="#124d9587-3ca2-4176-b878-cbc95dcf7e16" data-bs-toggle="tab" href="#124d9587-3ca2-4176-b878-cbc95dcf7e16" id="cf82e101-6144-45dd-b252-477d9b4afc8f" role="tab">
                Chapter 2
               </a>
              </li>
              <li class="nav-item">
-              <a class="nav-link" data-bs-target="#c858a812-b19f-4786-a5b6-2678c30fcad9" data-bs-toggle="tab" href="#c858a812-b19f-4786-a5b6-2678c30fcad9" id="f0619722-37f8-4ce2-a8e9-a1a29d60a3d4" role="tab">
+              <a class="nav-link" data-bs-target="#561e4896-f1d3-4920-b239-6bf59eca8fac" data-bs-toggle="tab" href="#561e4896-f1d3-4920-b239-6bf59eca8fac" id="a7e86b90-3b58-43b8-b1a5-cf84fb20ea81" role="tab">
                Chapter 3
               </a>
              </li>
             </ul>
             <div class="tab-content">
-             <div class="tab-pane fade active show" id="d7c1f7dd-4746-403d-8332-e17d6483fb88">
+             <div class="tab-pane fade active show" id="b6636b18-af32-4de9-8039-2920e6630483">
               Text 1
              </div>
-             <div class="tab-pane fade" id="dbe2075f-ce80-4b93-b094-dcd609cdcf53">
+             <div class="tab-pane fade" id="124d9587-3ca2-4176-b878-cbc95dcf7e16">
               Text 2
              </div>
-             <div class="tab-pane fade" id="c858a812-b19f-4786-a5b6-2678c30fcad9">
+             <div class="tab-pane fade" id="561e4896-f1d3-4920-b239-6bf59eca8fac">
               Text 3
              </div>
             </div>
@@ -6704,52 +6814,52 @@ Navigation(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="24424733-893f-4726-beb9-cfeb354720b1">
-        <div class="mt-5" id="d41a36b0-f3fa-41bc-b4ad-6326e2703fe6">
-         <div class="d-flex justify-content-between" id="1cb27c1a-3329-4aa9-a8d0-47486a87d2dc">
-          <h1 id="228ed591-ae97-4eae-96e8-31be21186dab">
+       <div class="tab-pane fade" id="40e94c04-d6be-42c2-94bb-4ce016d879b9">
+        <div class="mt-5" id="3b3e7397-9492-41e9-a302-5ebf5bf4523c">
+         <div class="d-flex justify-content-between" id="3f9fdebd-19b3-481d-ab47-75f17ef7dc83">
+          <h1 id="df1fd0e2-59ea-4888-8821-1681339135ba">
            Class
-           <span class="text-primary" id="39398374-d74b-42e3-8e32-e91f400e145c">
+           <span class="text-primary" id="289f8a2e-b4c7-4863-8afd-0fe12be550d8">
             Navigation.Item
            </span>
           </h1>
-          <div id="35982121-669c-4688-8f48-1562ef6588b2">
+          <div id="7f73605a-6782-474c-9ce4-46eb51d3e98d">
           </div>
          </div>
-         <span class="text-muted" id="ab428f41-a753-42d9-ba90-08f1465ffc07">
+         <span class="text-muted" id="cff1cc39-f67d-484c-9bfd-b824290a1cf7">
           None
          </span>
-         <pre id="9d9285f2-9144-4dba-a65e-316c65ebc074"><code class="python">Navigation.Item(name, content, active=False)</code></pre>
-         <div class="mt-5" id="d4410c10-0ea5-48ae-a941-48e8fa68afe9">
-          <h4 id="f1150011-728c-4ab2-ab05-bb3f26b45b80">
+         <pre id="ad204fcc-f57b-41fa-a97c-272c39451512"><code class="python">Navigation.Item(name, content, active=False)</code></pre>
+         <div class="mt-5" id="d219c264-a641-463f-88fc-1632cd2222f8">
+          <h4 id="1f208938-0d19-4d97-970f-755f3b4dd61b">
            Property
-           <span class="text-primary" id="0c2e4e82-3dd2-45b5-b4a8-139b3ef6265a">
+           <span class="text-primary" id="5808d22d-e6ca-4f7b-8f40-060dd2cbce5e">
             active
            </span>
           </h4>
-          <span class="text-muted" id="4acc8882-1ebf-4af1-959a-e81ec40d0903">
+          <span class="text-muted" id="eb3afd60-e072-4a9c-93f3-1860fb88013e">
            None
           </span>
          </div>
-         <div class="mt-5" id="d7b7b7d9-a1f5-4ded-b734-669541db1c04">
-          <h4 id="1e81af70-687b-4d4f-88bf-c655972f74d5">
+         <div class="mt-5" id="e0f3f8c7-afa6-45ef-a353-72985cdd13a2">
+          <h4 id="15e62b56-5be5-4bdb-9044-0f585fa92cfe">
            Property
-           <span class="text-primary" id="2c255b8f-d7b3-4e78-b793-e01905d9429f">
+           <span class="text-primary" id="0c9626a5-4451-4f44-9d9c-b6207ba0c020">
             content
            </span>
           </h4>
-          <span class="text-muted" id="96602ca7-70d6-4170-b735-5861789b6565">
+          <span class="text-muted" id="b30b3e40-eb99-4984-9079-053325f678c6">
            None
           </span>
          </div>
-         <div class="mt-5" id="57aa78d5-56ac-42ce-a1ac-70ebf037d5d6">
-          <h4 id="ac5dad67-c77e-440e-a577-047ff8d17c2f">
+         <div class="mt-5" id="0a363bb6-5c6c-421d-a3d2-c1762a7bf054">
+          <h4 id="83b3648b-bded-47f4-ba5f-1aba817cc8d0">
            Property
-           <span class="text-primary" id="c08c3de4-f687-4c11-8814-2436abe3a6f9">
+           <span class="text-primary" id="a710ebee-dc37-4ef9-841f-1cc7e0125437">
             name
            </span>
           </h4>
-          <span class="text-muted" id="63b06901-414e-4105-81aa-41d1b2afd404">
+          <span class="text-muted" id="8b826437-f104-46cc-aa5c-48fec6b03c4d">
            None
           </span>
          </div>
@@ -6758,32 +6868,32 @@ Navigation(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="22f26453-0f63-4369-a34e-18876fd5eccf">
-     <div class="mt-5" id="e382d890-d296-411a-8608-c0dc5f5d8064">
-      <div class="d-flex justify-content-between" id="7cb7cf60-b4fb-421f-b5c3-b231b3e6ce04">
-       <h1 id="4dbc00ba-5fe1-4d64-a745-7af865847af7">
+    <div class="tab-pane fade" id="0b406f38-bbaa-4111-b418-37fbba3d7b05">
+     <div class="mt-5" id="e272557a-97d6-409f-be2c-9c086379b6dc">
+      <div class="d-flex justify-content-between" id="9a9a6c84-9168-46c6-b41b-a2692c9892a0">
+       <h1 id="d8c55048-2933-4e5e-9fd3-583b3f9f8187">
         Class
-        <span class="text-primary" id="c6f6afb9-1b83-4e62-ae69-2c14a0bf3c25">
+        <span class="text-primary" id="4a213dc2-2c80-42bb-80b2-50ba19bb0ab5">
          Panel
         </span>
        </h1>
-       <div id="01a7d990-f0da-4bc1-ab09-1f01a438769d">
-        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#a0c1b6b5-ab9e-4fbb-80fa-e74b0da7e44d" data-bs-toggle="collapse" id="d66d8846-3b74-46f2-b440-2992f13bafc9" onclick="return false;" type="button">
+       <div id="c11772a3-c8ed-4f1c-870b-1f0ebc7469fe">
+        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#c47cc2e2-450f-43fb-97f5-3884daa83fbc" data-bs-toggle="collapse" id="291b8110-1bf4-401e-a64b-5f3188763d2f" onclick="return false;" type="button">
          Argument
         </button>
        </div>
       </div>
-      <span class="text-muted" id="8f686f63-a905-4f8a-bf0e-a917daf33ae3">
+      <span class="text-muted" id="6e3cafa0-00f0-4575-9416-73a7999ed2b1">
        A web component for a panel.
       </span>
-      <pre id="bbc180ed-3e26-41f2-95be-e9a1c0d22307"><code class="python">Panel(*components)</code></pre>
-      <div class="ms-3 collapse" id="a0c1b6b5-ab9e-4fbb-80fa-e74b0da7e44d">
-       <h6 id="088e6e9c-31dc-4d50-b446-22ef57a7b306">
+      <pre id="ef220810-b0db-4352-a9f6-86b464d11ccb"><code class="python">Panel(*components)</code></pre>
+      <div class="ms-3 collapse" id="c47cc2e2-450f-43fb-97f5-3884daa83fbc">
+       <h6 id="da0274ed-6351-43c3-972e-001da6ab2b56">
         <strong>
          Arguments
         </strong>
        </h6>
-       <table class="table table-sm bg-light" id="c7d0becd-4d1a-4a4e-bfbd-686da59ff72d">
+       <table class="table table-sm bg-light" id="ebcc3e6b-975c-4398-bd7a-75807331780d">
         <thead>
          <tr>
           <th scope="col">
@@ -6820,13 +6930,13 @@ Navigation(
         </tbody>
        </table>
       </div>
-      <div class="ms-3" id="7d049c4a-5ca7-4a2a-9ab6-30bc45578e34">
-       <h6 id="4a8f50bc-248f-4c46-bc16-61ae45fdd011">
+      <div class="ms-3" id="c9e693dc-1dc2-4bea-99ba-533620337151">
+       <h6 id="55cb3e2d-489f-4103-bbaa-66fe60fef272">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="194c2c03-9824-4363-8e36-a7aa0017d273"><code class="python">from bootwrap import Text, Panel
+       <pre id="1b386d64-2fcf-4741-91ae-246402b1503d"><code class="python">from bootwrap import Text, Panel
 
 comp1 = Text("Component 1").add_classes("border").ms(1)
 comp2 = Text("Component 2").add_classes("border").ms(1)
@@ -6835,44 +6945,44 @@ comp3 = Text("Component 3").add_classes("border").ms(1)
 Panel(comp1, comp2, comp3)
 </code></pre>
       </div>
-      <div class="ms-3" id="632225d7-85ee-4574-bb74-1f07f7b184e7">
-       <div id="f43f6dcd-eace-451c-bb81-32aad9c3a9c9">
-        <span class="border ms-1" id="f47e2173-e300-4d3e-8d24-0177c1c3a27c">
+      <div class="ms-3" id="f28cccb9-d20e-47ec-a31e-5be6469c6b9a">
+       <div id="f941dabc-1d40-4ff2-a982-65b50560bb0a">
+        <span class="border ms-1" id="988364ee-fd54-44de-812f-4aba38693e1e">
          Component 1
         </span>
-        <span class="border ms-1" id="ea21d020-1a39-4e82-aac5-02f8347c89d5">
+        <span class="border ms-1" id="a43a406e-ee21-4fa7-9dc7-88d74fa65920">
          Component 2
         </span>
-        <span class="border ms-1" id="abe9ce0c-a3d1-4f13-a83b-1ff1bbaedc3a">
+        <span class="border ms-1" id="e4bd2525-cfb7-4155-9bef-d6b734559493">
          Component 3
         </span>
        </div>
       </div>
-      <div class="mt-5" id="f43051cf-75fb-4283-a55e-2be0dfbcbd2f">
-       <div class="d-flex justify-content-between" id="2b3609b6-90be-4cfa-9d2d-29ae79ecc0e5">
-        <h4 id="37909bcc-963a-41c9-8b1f-8ee7483cbf6a">
+      <div class="mt-5" id="3c90667d-2f9c-4f86-a978-af6c1c672116">
+       <div class="d-flex justify-content-between" id="326cece4-b670-428e-8b26-818750a03fee">
+        <h4 id="32d17895-78c5-4424-916d-3a985659ae01">
          Method
-         <span class="text-primary" id="016f7046-20e1-4363-852b-932a6a136f9c">
+         <span class="text-primary" id="9e6a1241-d96c-43be-87af-b1e1684d9abc">
           as_collapse
          </span>
         </h4>
-        <div id="3957ad19-3bc7-4fa8-b29b-03b877d24529">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#c11405bc-169c-487a-ac1c-3c5ab0de293c" data-bs-toggle="collapse" id="0c879eef-574e-4a99-8b89-1b467375927c" onclick="return false;" type="button">
+        <div id="a386c785-3142-4fb8-8f70-a3ad73f8cf63">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#8808caa6-faae-4f71-9ce1-9f9598d8b6ff" data-bs-toggle="collapse" id="0fd4da24-3a08-435a-ae70-aa6b6408da21" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="6d22909d-35cb-4848-9e1b-1c3a86294f51">
+       <span class="text-muted" id="0302569e-50b6-4ec1-b14d-77eb87b2fbd8">
         Makes the panel collapsed.
        </span>
-       <pre id="9623a260-8a3b-489d-a07e-32bb1c43d748"><code class="python">as_collapse()</code></pre>
-       <div class="ms-3 collapse" id="c11405bc-169c-487a-ac1c-3c5ab0de293c">
-        <h6 id="a7b1cba5-a47e-4eec-9cd9-926b6e2bb8b0">
+       <pre id="fb62a2d4-4c79-4ecc-86e9-6fdb5d93c337"><code class="python">as_collapse()</code></pre>
+       <div class="ms-3 collapse" id="8808caa6-faae-4f71-9ce1-9f9598d8b6ff">
+        <h6 id="45379435-f7f3-4b44-9d31-88ca36c7e366">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="64b28dfb-f1ac-4e68-b020-a8b69bd5c90f">
+        <table class="table table-sm bg-light" id="7cea6a9a-8838-4360-9161-e065273b0d47">
          <thead>
           <tr>
            <th scope="col">
@@ -6906,32 +7016,32 @@ Panel(comp1, comp2, comp3)
         </table>
        </div>
       </div>
-      <div class="mt-5" id="0ac66e4c-f0fe-4508-9b5b-9409e67462bc">
-       <div class="d-flex justify-content-between" id="1e44dd7e-e9c4-42d3-a745-2dfa533e76ce">
-        <h4 id="8949520a-2061-4df3-b7bc-85c07bb1083d">
+      <div class="mt-5" id="a7592fb1-083d-4f00-810b-decc129376fe">
+       <div class="d-flex justify-content-between" id="ccbffeb7-5095-4bff-a418-47020d323560">
+        <h4 id="2039da1c-314a-404a-8f02-1194d2596ea3">
          Method
-         <span class="text-primary" id="8c969a07-b388-4066-b776-41ca047e9cef">
+         <span class="text-primary" id="a30aea44-ff4f-4be4-a82a-70a8ac91616c">
           horizontal
          </span>
         </h4>
-        <div id="f560db71-f394-49e4-a04f-f5917e9b86fe">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#09705bb7-a561-4f04-aa32-ca8730c3dd30" data-bs-toggle="collapse" id="c3184fda-f450-4bc7-b6c7-301454748d61" onclick="return false;" type="button">
+        <div id="011848f4-5075-44d5-9bc9-6b50a73c4d37">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#2fae9908-9868-4f48-b007-e03a234365d3" data-bs-toggle="collapse" id="032d93d3-e47d-48ff-b0b5-866d1466327d" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="4010e819-700c-4b87-9a6e-8ef690781618">
+       <span class="text-muted" id="6668e060-6eb7-4d7e-a49a-034dbbcaa75f">
         Makes the panel with the horizontal arrangement of encapsulating
         elements
        </span>
-       <pre id="e0e53d20-a79d-4677-bbe5-a924b4e5eaee"><code class="python">horizontal()</code></pre>
-       <div class="ms-3 collapse" id="09705bb7-a561-4f04-aa32-ca8730c3dd30">
-        <h6 id="38924b6f-30d3-4ebf-b426-cfa047fa777d">
+       <pre id="c3245d5f-1e79-46fc-af9f-c5ce4f3dd1e9"><code class="python">horizontal()</code></pre>
+       <div class="ms-3 collapse" id="2fae9908-9868-4f48-b007-e03a234365d3">
+        <h6 id="846204a6-13fb-4a80-9363-4f5da19c02d5">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="cbe81cdb-b56b-4c97-a460-48ee26773848">
+        <table class="table table-sm bg-light" id="3628e998-62c2-4f7e-b147-cbd0d470d1fd">
          <thead>
           <tr>
            <th scope="col">
@@ -6964,13 +7074,13 @@ Panel(comp1, comp2, comp3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="222dab9f-77ec-4e90-afde-c82988d5c20b">
-        <h6 id="5d7b965f-55e3-495d-8421-c2ef1148fca9">
+       <div class="ms-3" id="a5070276-12bc-4839-9a15-581dba270825">
+        <h6 id="c4764005-3318-4859-b40b-6c8443419e3d">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="a3db32b6-5960-4493-b010-ea0a9c7d66ad"><code class="python">from bootwrap import Text, Panel
+        <pre id="f05ee76e-642d-45fc-bee1-a76c2f27f3a2"><code class="python">from bootwrap import Text, Panel
 
 comp1 = Text("Component 1").add_classes("border")
 comp2 = Text("Component 2").add_classes("border")
@@ -6979,21 +7089,21 @@ comp3 = Text("Component 3").add_classes("border")
 Panel(comp1, comp2, comp3).horizontal()
 </code></pre>
        </div>
-       <div class="ms-3" id="bd8b3612-4e79-4be9-a8d0-80394e4404d0">
-        <div id="bd0610f2-558a-45a7-9ea3-8ba066f746ee">
+       <div class="ms-3" id="25ae9ad3-6dfa-4bf7-af46-6a24ef97fd33">
+        <div id="64e0d17f-83a2-41b7-853e-75043991a166">
          <div class="row">
           <div class="col-md">
-           <span class="border" id="b27741be-9472-4bfd-a3e1-519ec3558903">
+           <span class="border" id="430737aa-5bfd-4417-af8a-e7d1153f9c27">
             Component 1
            </span>
           </div>
           <div class="col-md">
-           <span class="border" id="62c853f3-82bd-458f-9713-abd18e0245c5">
+           <span class="border" id="8ad68928-da83-4704-a9a2-0e6af7749bc2">
             Component 2
            </span>
           </div>
           <div class="col-md">
-           <span class="border" id="05a7ee9c-8747-4f9c-808a-cdca93e90f9e">
+           <span class="border" id="d834950d-30f7-4fb1-b69e-6a1a0eff503f">
             Component 3
            </span>
           </div>
@@ -7001,32 +7111,32 @@ Panel(comp1, comp2, comp3).horizontal()
         </div>
        </div>
       </div>
-      <div class="mt-5" id="2cb0d62a-c51f-4ba1-af17-620525220366">
-       <div class="d-flex justify-content-between" id="cfb51ce0-d395-41f5-aa93-d8ef5ae35629">
-        <h4 id="56c3a7bb-8a33-483a-8058-041ca99a8685">
+      <div class="mt-5" id="8b732d58-f4b9-4cc1-9b4c-f4e22c2e967a">
+       <div class="d-flex justify-content-between" id="a5c363c7-77f1-426c-8b73-e7e3eef1b08b">
+        <h4 id="4e291356-6bc3-4ba7-8b35-3649fc50d9bd">
          Method
-         <span class="text-primary" id="8452e894-c7a3-4f66-a052-bd7108223ce3">
+         <span class="text-primary" id="0bd1e7b1-4367-47fa-a761-54bef9859df5">
           vertical
          </span>
         </h4>
-        <div id="da8b9ff9-1ec3-4040-8945-091f6118fa80">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#bec17fcc-7302-4cce-9ecb-93ae5b8cf111" data-bs-toggle="collapse" id="98d91b95-94f9-44f3-9658-85c2ebbf1a38" onclick="return false;" type="button">
+        <div id="1e8ded0c-451c-4e81-84e4-0078f91a6f8a">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#c18fae8d-1314-4329-aeb7-e3a7f1669d5c" data-bs-toggle="collapse" id="a6d2945f-4ea2-4788-95c2-aaae5c910a51" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="5c953264-7bd4-4a29-9353-e76a18059d08">
+       <span class="text-muted" id="789fd8b9-36b9-48ea-9097-eb7e4493977c">
         Makes the panel with the vertical arrangement of encapsulating
         elements
        </span>
-       <pre id="6d91bf18-f8e7-4ebc-a0bb-ee1ac91c705b"><code class="python">vertical()</code></pre>
-       <div class="ms-3 collapse" id="bec17fcc-7302-4cce-9ecb-93ae5b8cf111">
-        <h6 id="4ee7c2c0-fe8d-467e-8944-f7bd422befab">
+       <pre id="f48a61ec-f4a5-4daa-b7a6-7f593daafa1e"><code class="python">vertical()</code></pre>
+       <div class="ms-3 collapse" id="c18fae8d-1314-4329-aeb7-e3a7f1669d5c">
+        <h6 id="d0f8e51e-5a80-4ee9-bdcd-04b7e097f8b4">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="a83884fe-197e-4a43-aaa5-d71feb952c59">
+        <table class="table table-sm bg-light" id="ba17d4ef-5d73-48bd-af04-f642913a48cc">
          <thead>
           <tr>
            <th scope="col">
@@ -7059,13 +7169,13 @@ Panel(comp1, comp2, comp3).horizontal()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="3f3d1efc-0646-429d-9257-6d80c495038c">
-        <h6 id="8f8f94f7-4995-4af9-bb36-ca90c1dd8c65">
+       <div class="ms-3" id="929d2eb8-d9a2-4544-a4e6-eb2ba7e1f868">
+        <h6 id="cfca7ec2-1ffc-4f35-acdb-20657e1b71d1">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="a70732f2-6cf0-4c2d-8460-d931ac1bd455"><code class="python">from bootwrap import Text, Panel
+        <pre id="15679625-36e9-4ca2-834a-8ed1d8a3439f"><code class="python">from bootwrap import Text, Panel
 
 comp1 = Text("Component 1").add_classes("border")
 comp2 = Text("Component 2").add_classes("border")
@@ -7074,25 +7184,25 @@ comp3 = Text("Component 3").add_classes("border")
 Panel(comp1, comp2, comp3).vertical()
 </code></pre>
        </div>
-       <div class="ms-3" id="162aa445-20b2-49e0-94a5-2cf5b81db297">
-        <div id="0434aec0-9928-4962-9601-d7b2245d9379">
+       <div class="ms-3" id="a6e89d8c-d276-40c5-a3ab-9dc420255942">
+        <div id="2dd2b7ef-31cc-42df-8687-24a2d020c154">
          <div class="row">
           <div class="col-md">
-           <span class="border" id="11b0f8a9-becd-4d64-835f-ea12c8f22074">
+           <span class="border" id="7c85f5bb-e2e1-4702-8bf7-36a5ff453a57">
             Component 1
            </span>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <span class="border" id="81620263-9bba-432e-b31a-3de6c75ab2dd">
+           <span class="border" id="a8e7adf0-e66b-4bd1-93bb-58279f3f0402">
             Component 2
            </span>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <span class="border" id="48727fdb-bdda-46a4-9113-db0fbb12a277">
+           <span class="border" id="a7dc5f77-5d25-4a47-a6f2-6012b2c65283">
             Component 3
            </span>
           </div>
@@ -7102,29 +7212,29 @@ Panel(comp1, comp2, comp3).vertical()
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="d6ca5092-9d3a-4835-a152-2e91732a946f">
-     <div class="mt-5" id="9348d1db-d5d2-4c2e-ab39-aa68b63c42ec">
-      <div class="d-flex justify-content-between" id="9521401b-aed4-48a4-9e11-a0dddf1af39c">
-       <h1 id="1d1f8c93-4512-47cf-9ee3-9dbeb19193c7">
+    <div class="tab-pane fade" id="fbd691b4-ae85-4548-84a0-ae2fb7958627">
+     <div class="mt-5" id="5c137431-49d4-49b5-9783-b38043fba83a">
+      <div class="d-flex justify-content-between" id="25d56554-bd63-4fcd-8eec-665c57f69acf">
+       <h1 id="2122d934-ca38-4834-8f35-bc45af477200">
         Class
-        <span class="text-primary" id="c36f69e7-8001-4d1e-8f43-1851918087fa">
+        <span class="text-primary" id="e1d6a344-251f-4225-9e31-31599931d9b9">
          Separator
         </span>
        </h1>
-       <div id="f5772181-e4ca-430c-8830-cc3c2f06f74d">
+       <div id="9aced04f-a46e-4812-a88a-0892191e025b">
        </div>
       </div>
-      <span class="text-muted" id="4bafda73-f7d0-4de2-8b16-f3a5bb04b6e7">
+      <span class="text-muted" id="53ad4059-48df-4d36-9aa1-625a66f92832">
        A horizontal line separator.
       </span>
-      <pre id="b66b0fa9-244d-4df3-a7ac-393ee3fdcb6e"><code class="python">Separator()</code></pre>
-      <div class="ms-3" id="c20ff1a0-a30d-4f81-80d6-23e164eb839c">
-       <h6 id="a2bb7621-b273-4c99-a6b9-2fbf4620899e">
+      <pre id="40877556-cc02-4329-882d-843d4bbc1b08"><code class="python">Separator()</code></pre>
+      <div class="ms-3" id="d93c41c0-7020-406f-9a14-edfe74051b82">
+       <h6 id="48eac7f0-9ee5-471d-b850-0ce00e4303e1">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="052bea4f-cdca-43f5-8030-1e625a768461"><code class="python">from bootwrap import Panel, Separator, Text
+       <pre id="add96cd4-1d57-4a60-be0c-968ccd70d47b"><code class="python">from bootwrap import Panel, Separator, Text
 
 Panel(
     Text("Top Text"),
@@ -7133,72 +7243,72 @@ Panel(
 )
 </code></pre>
       </div>
-      <div class="ms-3" id="a1a84090-0919-47d7-b6b1-54d15992a8e6">
-       <div id="9e393f4e-2bd0-4455-bc45-22db579fba97">
-        <span id="181f1edc-c7d2-4f4a-93aa-a4956b67f965">
+      <div class="ms-3" id="018a672b-4af9-496e-8ca4-549d9a60bf7d">
+       <div id="84f367e3-405d-49fb-97e3-a0e105de876e">
+        <span id="349bd046-ca04-426c-9019-b7930270e1b0">
          Top Text
         </span>
         <hr/>
-        <span id="ecfb98fd-7b4c-4104-b76e-b0766df950d1">
+        <span id="e5f562f9-f18b-4063-b0af-ce30e1a0b9cb">
          Bottom Text
         </span>
        </div>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="9e892640-a7a0-4013-b093-9dfd2f6a3a08">
-     <div id="df313e52-556c-412b-ba49-594bf16eed04">
+    <div class="tab-pane fade" id="5857ef78-23dc-4fa4-828b-d0bf22445b4f">
+     <div id="93910fa4-c002-416e-a9d2-191699bf73ee">
       <hr/>
-      <ul class="nav" id="342d720e-0591-4f7e-9089-df917cc65dda" role="tablist">
+      <ul class="nav" id="909651eb-cb33-4a08-a896-36272b4141eb" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#834dd990-8294-4f31-919e-033ec1c7bbb9" data-bs-toggle="tab" href="#834dd990-8294-4f31-919e-033ec1c7bbb9" id="d4ec0a4b-840a-4568-803a-b31be13ebcc2" role="tab">
-         <span class="text-secondary" id="68519b1b-4594-471e-8e8e-9b8a01248630">
+        <a class="nav-link active" data-bs-target="#81e7f7f9-767b-4410-8536-c6c56d468e05" data-bs-toggle="tab" href="#81e7f7f9-767b-4410-8536-c6c56d468e05" id="f12d5a90-d1d6-4280-b33b-16690bb39296" role="tab">
+         <span class="text-secondary" id="fad4abe0-dc20-4da2-868d-36ea15194e19">
           Table
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#b993d3fa-6f4a-44c6-8c63-c5ad528376d1" data-bs-toggle="tab" href="#b993d3fa-6f4a-44c6-8c63-c5ad528376d1" id="5d69d0f5-2e5f-49bc-b654-068da9f1496b" role="tab">
-         <span class="text-secondary" id="ac9c3db6-9abe-44d8-9f69-c5f2c8d7cbd2">
+        <a class="nav-link" data-bs-target="#fa5c66b2-3613-4190-b701-2b66ec932a93" data-bs-toggle="tab" href="#fa5c66b2-3613-4190-b701-2b66ec932a93" id="af10c125-4b19-4fc9-8c7e-0581bd45cfb7" role="tab">
+         <span class="text-secondary" id="aa6391dc-07a8-462a-a92c-ed17f45e8c31">
           Table.Head
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#2903aad2-caab-4709-aff2-e240b4d3a332" data-bs-toggle="tab" href="#2903aad2-caab-4709-aff2-e240b4d3a332" id="5085fd2a-bdce-4ef9-92e1-cba63f27db68" role="tab">
-         <span class="text-secondary" id="0e8fd71e-694b-4116-8198-90d3be280d97">
+        <a class="nav-link" data-bs-target="#c5ac0ee0-becc-41eb-9a30-ec8490d3ed32" data-bs-toggle="tab" href="#c5ac0ee0-becc-41eb-9a30-ec8490d3ed32" id="69569f07-c8db-4f65-9e0f-662a057b8088" role="tab">
+         <span class="text-secondary" id="c23722dc-580b-4662-8b4e-eabda8daefd4">
           Table.Body
          </span>
         </a>
        </li>
       </ul>
       <div class="tab-content">
-       <div class="tab-pane fade active show" id="834dd990-8294-4f31-919e-033ec1c7bbb9">
-        <div class="mt-5" id="216ffd6a-5021-4428-8508-2880e82669ba">
-         <div class="d-flex justify-content-between" id="e1dbf8ad-79d8-4654-8b94-77b0f0d21b66">
-          <h1 id="5fce54f3-0820-499b-930a-c16058f2d511">
+       <div class="tab-pane fade active show" id="81e7f7f9-767b-4410-8536-c6c56d468e05">
+        <div class="mt-5" id="90c6bd88-3e4e-4da7-b7a8-71b6f7b382d3">
+         <div class="d-flex justify-content-between" id="c84d003b-c835-422d-b07a-ee54dc5a15ba">
+          <h1 id="b7664aaa-666e-43ab-a41b-7ff4a12b64f1">
            Class
-           <span class="text-primary" id="e1007f00-e00a-42b7-959d-0f712d329f8f">
+           <span class="text-primary" id="f86b2c3f-075e-47b6-9b86-6d30a7a505f6">
             Table
            </span>
           </h1>
-          <div id="5d063929-9eb7-488b-94cd-2cbb277c1123">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#42362363-6b99-416a-b75e-4400e619d135" data-bs-toggle="collapse" id="1be3ee42-80d5-48b8-955e-c61031bbc80e" onclick="return false;" type="button">
+          <div id="0a7e4a28-1da9-4838-b491-a4f192339974">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#b50f0dd9-6d75-4600-9881-4570cfba2aed" data-bs-toggle="collapse" id="357a82be-556d-4165-9a16-4de96ceac799" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="1f5790bd-2c48-4be8-85c5-c404bd48c11b">
+         <span class="text-muted" id="a688af11-3df6-441c-b610-fcadf0a6e46a">
           A web component for a table.
          </span>
-         <pre id="52503f4e-1038-4452-958b-a361bd2954cc"><code class="python">Table(head, body)</code></pre>
-         <div class="ms-3 collapse" id="42362363-6b99-416a-b75e-4400e619d135">
-          <h6 id="9f17e7ef-c704-4535-91ae-8cf8fbabed32">
+         <pre id="cd11164d-1a4d-47e7-b9c4-01c9313749aa"><code class="python">Table(head, body)</code></pre>
+         <div class="ms-3 collapse" id="b50f0dd9-6d75-4600-9881-4570cfba2aed">
+          <h6 id="85ee29e7-d9e6-4b76-b24b-7215a7a7155a">
            <strong>
             Arguments
            </strong>
           </h6>
-          <table class="table table-sm bg-light" id="502ab7b3-aac8-45b9-bbe0-69aa5395ede5">
+          <table class="table table-sm bg-light" id="b53c8fe4-d941-474a-b0f8-7f6698203f23">
            <thead>
             <tr>
              <th scope="col">
@@ -7246,13 +7356,13 @@ Panel(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="571209e6-afd6-4cc5-b193-c97d90bb3362">
-          <h6 id="eb0e7c12-b802-4b39-ace7-2c2ea8918a6a">
+         <div class="ms-3" id="f74d12f9-a5b8-4dc2-865b-860e4d12ad29">
+          <h6 id="f8a2b5e5-7088-4b1a-8ae5-2ef161678689">
            <strong>
             Example
            </strong>
           </h6>
-          <pre id="55297fe9-cbae-435a-a03c-829637fa66d4"><code class="python">from bootwrap import Table
+          <pre id="6173c955-70a1-4ade-a3fd-d2b4f15522b1"><code class="python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7264,8 +7374,8 @@ Table(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="0e043de8-3a4d-43f6-ad1d-e2c5cdf665ad">
-          <table class="table" id="cfdaec03-f0ae-4573-919b-d3d4a71f746a">
+         <div class="ms-3" id="b5e39edb-c688-4718-a50e-b133643aa5a6">
+          <table class="table" id="9d7e4bfa-9f8f-46e5-a8f3-5a76417d3075">
            <thead>
             <tr>
              <th scope="col">
@@ -7316,53 +7426,53 @@ Table(
            </tbody>
           </table>
          </div>
-         <div class="mt-5" id="2f7c96ef-c04c-412c-a190-10678038b101">
-          <h4 id="321340f2-de66-49ec-89a1-1c4d354f1ec4">
+         <div class="mt-5" id="3c77331b-3a91-4fe2-984d-7e2173dc3193">
+          <h4 id="e17e090d-4068-47db-b96b-9ef2629b1e44">
            Property
-           <span class="text-primary" id="7cfdad4f-0873-4b6b-a2f6-b0ff3bed7d33">
+           <span class="text-primary" id="3762672f-363d-4d9d-95a7-597261808232">
             body
            </span>
           </h4>
-          <span class="text-muted" id="880fde0f-e9cb-463a-bce5-71a35739a12f">
+          <span class="text-muted" id="ec531954-4dee-4eb0-9012-c14b5932a951">
            The table body.
           </span>
          </div>
-         <div class="mt-5" id="48d35273-a906-4813-a58d-dcc5b780224c">
-          <h4 id="371e06ca-f41d-4c3f-9c5d-30c74a6e8bb0">
+         <div class="mt-5" id="6795f265-0dc8-439d-842d-1801f51b8e71">
+          <h4 id="353eb724-b3d4-4ca6-b237-c0ecab80e85a">
            Property
-           <span class="text-primary" id="c10654f8-974b-4483-82ab-00ec07a07505">
+           <span class="text-primary" id="254e5151-4435-4318-bc3d-c9f267350df2">
             head
            </span>
           </h4>
-          <span class="text-muted" id="4685e173-0aaa-4d0d-8054-7a83e05aa4ff">
+          <span class="text-muted" id="dc180947-69fe-43ed-9abd-c0296d67c6f8">
            The table head.
           </span>
          </div>
-         <div class="mt-5" id="c18acae6-dd06-4845-9014-f7e263e81f6b">
-          <div class="d-flex justify-content-between" id="57e34848-0a08-4816-bdcf-10dc82b69311">
-           <h4 id="7e059b5f-bf17-4d1b-8b89-d6238ddc51e1">
+         <div class="mt-5" id="a6050dd7-dcd1-4020-a368-a5d98944e16a">
+          <div class="d-flex justify-content-between" id="5d06e748-0ca1-4bd4-8647-523fb420c0ba">
+           <h4 id="f182f72b-304b-4fbd-876a-5794eac75952">
             Method
-            <span class="text-primary" id="bfc7543d-1d37-44d1-894b-4816d6d5830b">
+            <span class="text-primary" id="91624bbe-084d-4626-a868-9015304974d8">
              as_bordered
             </span>
            </h4>
-           <div id="44471ca1-5157-47f2-a5e4-4ee70fd22dad">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#d2ad1e16-7273-4467-b879-71f5b0cd078e" data-bs-toggle="collapse" id="e4a65f5a-f1a0-49c2-8ac4-39c8c07da63f" onclick="return false;" type="button">
+           <div id="ac41486a-6850-404e-9c0b-33f61e5de4f4">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#60c9b7ce-1fd2-4a0e-accf-25b4dd900ac4" data-bs-toggle="collapse" id="04331de7-3d71-40d7-9efb-11ff23e4d753" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="e6764a7c-a027-4bbb-8ca8-34e0803a04d4">
+          <span class="text-muted" id="398e015a-e5e7-4d3a-ace0-225f61f62f75">
            Adds borders on all sides of the table and cells.
           </span>
-          <pre id="0d22965f-261c-40a3-aad2-213932272c57"><code class="python">as_bordered()</code></pre>
-          <div class="ms-3 collapse" id="d2ad1e16-7273-4467-b879-71f5b0cd078e">
-           <h6 id="c08d6ec0-17af-4161-bc3d-66392962335b">
+          <pre id="572dbe15-2689-44d5-95b7-383b25fb47e6"><code class="python">as_bordered()</code></pre>
+          <div class="ms-3 collapse" id="60c9b7ce-1fd2-4a0e-accf-25b4dd900ac4">
+           <h6 id="eebff422-a2b6-418a-91b8-37fea10f9d6d">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="c6d015b7-87b2-43d1-aced-020401920ad6">
+           <table class="table table-sm bg-light" id="1e70c7e9-da81-4c3c-ae97-185ea54c0de4">
             <thead>
              <tr>
               <th scope="col">
@@ -7395,13 +7505,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="a027c750-3cd5-4f4a-bbb8-3a7089fa4f0d">
-           <h6 id="187e07a4-abf6-49c9-94bc-4165aef43592">
+          <div class="ms-3" id="9576c2de-cfa7-4c62-8acb-87cf534cf9fa">
+           <h6 id="074677b2-72ba-435e-803a-05fc9a6262b4">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="38ecc45f-78f4-4c2d-8818-057220380b50"><code class="python">from bootwrap import Table
+           <pre id="ee842810-1579-4a7f-9a6b-5eb4c1980b27"><code class="python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7413,8 +7523,8 @@ Table(
 ).as_bordered()
 </code></pre>
           </div>
-          <div class="ms-3" id="d23babe9-ceb4-44ad-968d-6618168be345">
-           <table class="table table-bordered" id="4d625d81-62a9-4d4c-8a1b-254f1d9a44c4">
+          <div class="ms-3" id="358d5454-156d-41be-8544-8ac8747430d8">
+           <table class="table table-bordered" id="d114aee4-a8b8-477b-9411-ad6611165865">
             <thead>
              <tr>
               <th scope="col">
@@ -7466,31 +7576,31 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="854f4f9b-d683-4bec-ad3c-e1783e4c3bfe">
-          <div class="d-flex justify-content-between" id="599edd8a-295d-479e-a5b1-d975c4b39d17">
-           <h4 id="51141713-2679-4c07-a178-16b253e87338">
+         <div class="mt-5" id="2131b20f-4472-4966-b0ff-95e8238e0dc9">
+          <div class="d-flex justify-content-between" id="fd891152-81cb-4e25-a5b9-9371954671bc">
+           <h4 id="611460dd-f51e-4d61-ad5e-8a44f8ea3f0d">
             Method
-            <span class="text-primary" id="ce369c9f-513f-40f6-867d-0ddd2fd53af2">
+            <span class="text-primary" id="701ddf06-809d-48bf-bbbb-992f145ce42d">
              as_dark
             </span>
            </h4>
-           <div id="9fb2963a-2f69-47dd-b2b7-bc34af150f38">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#8e9bd368-5412-4e8f-a91a-10a5d5ca7c4f" data-bs-toggle="collapse" id="3203673d-0721-4c81-ad17-c5b5b88a084f" onclick="return false;" type="button">
+           <div id="35c25c53-81b6-4349-b3b2-cd403402a667">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#d5a41db0-e8ea-43cf-905c-5fad46f67a77" data-bs-toggle="collapse" id="11c2809e-d2b4-4be1-b8fa-22efd119ff85" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="ed14bbb8-d604-4ee4-bb32-6d2cafb8c188">
+          <span class="text-muted" id="fb2464af-7aa0-4e1b-b5bd-3309b78ccf30">
            Inverts the colors—with light text on dark backgrounds.
           </span>
-          <pre id="2f189db9-742f-458e-96b4-4bf06ff589b1"><code class="python">as_dark()</code></pre>
-          <div class="ms-3 collapse" id="8e9bd368-5412-4e8f-a91a-10a5d5ca7c4f">
-           <h6 id="31c23bab-3454-486d-81ed-9f1846da1ffe">
+          <pre id="12aeea3a-f62a-4e01-85da-e546628fd527"><code class="python">as_dark()</code></pre>
+          <div class="ms-3 collapse" id="d5a41db0-e8ea-43cf-905c-5fad46f67a77">
+           <h6 id="24dc518a-da3b-4882-8b86-e9f22793265c">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="2fe53cce-d2a2-4d7a-89e3-effd504584a5">
+           <table class="table table-sm bg-light" id="5bc7b076-dd71-41b0-b05e-e8088a8e16be">
             <thead>
              <tr>
               <th scope="col">
@@ -7523,13 +7633,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="6243cd1c-054d-407d-89be-7d3e24887f46">
-           <h6 id="412231a5-bede-48a8-8a34-0b4c312d437b">
+          <div class="ms-3" id="b0f794b8-b773-470a-84bd-7030956af98f">
+           <h6 id="a7d3827a-ce72-4b40-add6-59bc0d97db4c">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="834e8dda-69e5-4d13-9794-213c97c3699e"><code class="python">from bootwrap import Table
+           <pre id="563eaf18-c71d-4291-8854-8203ab1eb3e5"><code class="python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7541,8 +7651,8 @@ Table(
 ).as_dark()
 </code></pre>
           </div>
-          <div class="ms-3" id="039ea8e3-6c9d-41c3-a59c-364bcc2a7d34">
-           <table class="table table-dark" id="43007a1a-ec8e-4a79-bfef-064875c5d520">
+          <div class="ms-3" id="a03bacc1-53a8-4cf8-b292-c0aff54ec6cb">
+           <table class="table table-dark" id="8ba28950-bb36-4937-b40f-abd83353f311">
             <thead>
              <tr>
               <th scope="col">
@@ -7594,34 +7704,34 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="28267bef-40dc-48f7-8dc2-3452e36e692d">
-          <div class="d-flex justify-content-between" id="1a6bb8e7-e652-4239-8aba-112b7920c520">
-           <h4 id="9b9194f9-49b0-4f3b-8d25-63a5df6c9a20">
+         <div class="mt-5" id="c3ce5220-9a81-4007-b72e-7760a3251586">
+          <div class="d-flex justify-content-between" id="57dfa6ea-4a0a-47e7-8ceb-932458a1c478">
+           <h4 id="43099f97-ef57-46aa-87da-f57f8212a2cc">
             Method
-            <span class="text-primary" id="1d2cbddd-7c94-4848-ac6d-bc2283a6c540">
+            <span class="text-primary" id="5a734fdb-a532-43f0-8119-7f810ccbe67a">
              as_responsive
             </span>
            </h4>
-           <div id="0eae0086-4c09-4d87-934f-b016b56abc93">
-            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#992d836e-298d-4891-82c3-5bfda03c12b6" data-bs-toggle="collapse" id="4981d31c-872f-4540-92c4-5da3be52e931" onclick="return false;" type="button">
+           <div id="b97257cc-ba04-4c5a-ba02-3cb6b4a160b4">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#2eed87b4-04d5-475a-ae00-c9f2338b5e72" data-bs-toggle="collapse" id="13176af8-8457-4449-a6c2-616fee2966db" onclick="return false;" type="button">
              Argument
             </button>
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#ae2f4425-b8f3-4f02-981c-721454f0e117" data-bs-toggle="collapse" id="7bfd6229-a495-4616-a020-e5e525726d2c" onclick="return false;" type="button">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#b3b3628e-7ffc-4e55-85e2-aa44ea96f37a" data-bs-toggle="collapse" id="48cbf7c8-62de-4bcd-8160-14ed158c360a" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="676eb45d-728a-462a-8741-6b2ac1065d63">
+          <span class="text-muted" id="5e4c4393-8b33-40f4-bfe0-156032b8e86e">
            Create responsive tables.
           </span>
-          <pre id="34d079e1-9fbc-492a-b102-6a5236045911"><code class="python">as_responsive(breakpoint=<breakpoint.sm: 'sm'="">)</breakpoint.sm:></code></pre>
-          <div class="ms-3 collapse" id="992d836e-298d-4891-82c3-5bfda03c12b6">
-           <h6 id="1eb00033-e060-4a69-a587-435543dc703e">
+          <pre id="4d462bfa-aef9-49ab-9bc2-109a847b7534"><code class="python">as_responsive(breakpoint=<breakpoint.sm: 'sm'="">)</breakpoint.sm:></code></pre>
+          <div class="ms-3 collapse" id="2eed87b4-04d5-475a-ae00-c9f2338b5e72">
+           <h6 id="c07f1a5c-6c87-4b77-ba96-811f7c7131b6">
             <strong>
              Arguments
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="030e9fa7-2018-48ab-9bfb-ecb4943625c2">
+           <table class="table table-sm bg-light" id="f3addb89-2d48-452c-94f3-3a7a831c6f70">
             <thead>
              <tr>
               <th scope="col">
@@ -7654,13 +7764,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3 collapse" id="ae2f4425-b8f3-4f02-981c-721454f0e117">
-           <h6 id="c9bcbbc3-8177-47f0-a356-79c48cd10fb1">
+          <div class="ms-3 collapse" id="b3b3628e-7ffc-4e55-85e2-aa44ea96f37a">
+           <h6 id="10fb74a8-8d48-4297-9d45-763d29a11670">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="c164a157-9485-4f60-9180-99b8bd94c768">
+           <table class="table table-sm bg-light" id="f4d8bb0d-0ce8-442c-b8fd-e7bb7510dc31">
             <thead>
              <tr>
               <th scope="col">
@@ -7693,13 +7803,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="245db4d7-7d59-47c9-949e-13ff09263ea6">
-           <h6 id="679d40be-b79a-4af2-bbe4-6a8e87e3baef">
+          <div class="ms-3" id="a0ebc8e4-4660-4d44-8c2e-28d441c10f7b">
+           <h6 id="4a932ce1-9636-4c7a-9bb7-097e70a194c9">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="eccaf6a6-005b-4d9b-a83d-d2482ff8ab03"><code class="python">from bootwrap import Table
+           <pre id="af4d2b3a-dbe7-455f-a587-63a78a6890ed"><code class="python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7711,8 +7821,8 @@ Table(
 ).as_responsive()
 </code></pre>
           </div>
-          <div class="ms-3" id="b3897428-fbae-496b-8a1f-71ed16ff85d0">
-           <table class="table table-responsive-sm" id="689fe591-cb8d-4e97-bb9b-7f4872070224">
+          <div class="ms-3" id="44725a13-0e65-4cd7-9f40-db4f1c22cd46">
+           <table class="table table-responsive-sm" id="ae4e4ba7-60de-4c04-9369-8b6c4a4049c6">
             <thead>
              <tr>
               <th scope="col">
@@ -7764,31 +7874,31 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="aed12188-372d-4cf2-892b-ccde89a64490">
-          <div class="d-flex justify-content-between" id="18c5b02d-4c57-4f12-85b6-cf0243566932">
-           <h4 id="900718d9-ee52-420a-9407-cd0c2e61b83b">
+         <div class="mt-5" id="495dac05-01b7-4ebb-a2c8-7e3603eb8dc0">
+          <div class="d-flex justify-content-between" id="139e1631-b789-4204-a149-a6df7bbba409">
+           <h4 id="ec374a1e-b31e-485b-84f0-c49c23dda4a2">
             Method
-            <span class="text-primary" id="95042147-6b81-429a-9440-ba8f074d8387">
+            <span class="text-primary" id="4da3f5c5-9946-4648-b30e-98a66ee466af">
              as_small
             </span>
            </h4>
-           <div id="32a72760-9946-4608-ab7d-01acc6ad552e">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#86863f1f-0ddd-4e26-b59d-b5e47e24b933" data-bs-toggle="collapse" id="765f5ded-51bf-43b0-adff-43108abd524b" onclick="return false;" type="button">
+           <div id="4f190224-a46b-49ed-ae49-8858b7840b28">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#7e6a020c-24ec-4245-9df7-127c924dc530" data-bs-toggle="collapse" id="8d886f93-4ab4-42e6-a854-46291c01fa5a" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="3f80248c-55e6-4b35-9557-49076000d4e9">
+          <span class="text-muted" id="4ab272f3-c81e-41e4-ba14-981d5efddf7a">
            Make tables more compact by cutting cell padding in half.
           </span>
-          <pre id="a9f9665f-62e4-4874-8929-611714e33f37"><code class="python">as_small()</code></pre>
-          <div class="ms-3 collapse" id="86863f1f-0ddd-4e26-b59d-b5e47e24b933">
-           <h6 id="df8f045b-8191-4346-9a88-740e42106b26">
+          <pre id="600e9437-2dd3-4c07-84cf-5237cfd5acff"><code class="python">as_small()</code></pre>
+          <div class="ms-3 collapse" id="7e6a020c-24ec-4245-9df7-127c924dc530">
+           <h6 id="7af4025f-83a9-4ca8-8794-fa620418cf7b">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="43d1ce96-215f-49ad-b681-55f7ca3afd1f">
+           <table class="table table-sm bg-light" id="0734e5cf-43f9-4bb6-af55-9d6276b5d951">
             <thead>
              <tr>
               <th scope="col">
@@ -7821,13 +7931,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="48368e96-aafe-49cf-aa4c-94e525675637">
-           <h6 id="f0989f1c-820c-4f47-813a-bd3dda3edd9a">
+          <div class="ms-3" id="1a892677-7860-4462-8704-58cc02d46b09">
+           <h6 id="2a50865e-7cc6-4c6a-8d88-e52e8117a40d">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="81d50335-aef3-4a1e-b95b-0dda68725698"><code class="python">from bootwrap import Table
+           <pre id="edb1f503-e8eb-4459-afad-b91de7d3ca3a"><code class="python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7839,8 +7949,8 @@ Table(
 ).as_small()
 </code></pre>
           </div>
-          <div class="ms-3" id="27bda8cd-5d9a-4ee8-826a-8916a3e112c3">
-           <table class="table table-sm" id="f40bce32-3005-484e-878b-c06e4576bf0e">
+          <div class="ms-3" id="9dd118a2-e790-43c7-b58b-5bba54fa44ee">
+           <table class="table table-sm" id="89aa92e1-de57-4be7-a9d5-8baee445c495">
             <thead>
              <tr>
               <th scope="col">
@@ -7892,31 +8002,31 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="5884ce31-d855-4704-a9c4-c006cb6a9f23">
-          <div class="d-flex justify-content-between" id="aceeddad-059d-44a9-9886-dfca3d76762d">
-           <h4 id="33312f10-342a-474c-ab8d-1d79ba2aa92b">
+         <div class="mt-5" id="42b16982-a70b-43fa-985c-49cb9eabaf62">
+          <div class="d-flex justify-content-between" id="b0552b8b-14da-4eb3-ae63-5acf6c3618dd">
+           <h4 id="b7e423ea-9ef2-4a6c-9b69-9ee83f36392a">
             Method
-            <span class="text-primary" id="f2488f5c-7092-4a53-85d7-9ca3a462d1da">
+            <span class="text-primary" id="b063ee6c-c90a-460c-835c-98667335f90f">
              as_striped
             </span>
            </h4>
-           <div id="52d5aec0-bce7-4fe6-a498-e3de51dcdc51">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#d03f6a52-8bf3-467f-a569-b927c4f19d7e" data-bs-toggle="collapse" id="cb3f8cb7-6bb8-4e66-9cba-7e67ab47bca0" onclick="return false;" type="button">
+           <div id="5539dace-dcac-4539-b13e-e7c9930e1147">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#4ead5173-51bc-450a-9721-bd39df25fc6c" data-bs-toggle="collapse" id="ba673d68-3658-48e7-a908-be8a764c4ffd" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="7a0a7b7e-b55d-44bb-ad84-e9c9cb5cb214">
+          <span class="text-muted" id="c5b4487f-6669-42e3-8f38-2055f05671b2">
            Adds zebra-striping to any table row within the table body.
           </span>
-          <pre id="1e99b508-c659-4268-b1e7-c85ac9f72389"><code class="python">as_striped()</code></pre>
-          <div class="ms-3 collapse" id="d03f6a52-8bf3-467f-a569-b927c4f19d7e">
-           <h6 id="c71c6c5b-abf6-4332-a136-0e4885ce9ed2">
+          <pre id="11c5faf8-f3a1-46b6-a35b-c093e12917c4"><code class="python">as_striped()</code></pre>
+          <div class="ms-3 collapse" id="4ead5173-51bc-450a-9721-bd39df25fc6c">
+           <h6 id="a1a3cc41-2198-413c-9f0a-32e4d585d36f">
             <strong>
              Returns
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="18f91227-340b-4fad-9a4a-c1cc5cb8e0ff">
+           <table class="table table-sm bg-light" id="4f7e2a97-3c2a-4107-8788-54f5ddbe5796">
             <thead>
              <tr>
               <th scope="col">
@@ -7949,13 +8059,13 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="5e7697c8-cb80-49ed-a621-dafde15210fb">
-           <h6 id="af5475ce-52d2-474a-b435-7a09a04f66d3">
+          <div class="ms-3" id="1caf23bc-2865-4b88-93de-101b7d0a8cfd">
+           <h6 id="28ee417d-3d82-4c5d-901d-b92ad6fae7df">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="731d36a4-6cdb-43cb-94e0-aa136904cbdd"><code class="python">from bootwrap import Table
+           <pre id="da53673c-3306-43f5-8497-e62b28314819"><code class="python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7967,8 +8077,8 @@ Table(
 ).as_striped()
 </code></pre>
           </div>
-          <div class="ms-3" id="aa4696c1-03ef-4bb8-b296-40802314b2c2">
-           <table class="table table-striped" id="6b61646c-8575-43f1-aec4-550bed3624ab">
+          <div class="ms-3" id="9a13d29b-fce6-4bb4-9b63-5df3be3cde8e">
+           <table class="table table-striped" id="5ac87824-f50f-4349-ac4a-5466e5614136">
             <thead>
              <tr>
               <th scope="col">
@@ -8022,44 +8132,44 @@ Table(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="b993d3fa-6f4a-44c6-8c63-c5ad528376d1">
-        <div class="mt-5" id="a5cd3d2d-0550-48d8-90f3-fd38b16244d3">
-         <div class="d-flex justify-content-between" id="f1500b14-93b6-49cf-ad96-2f4dadecd34f">
-          <h1 id="1e165d47-4a62-4570-a69d-1aef7563ef05">
+       <div class="tab-pane fade" id="fa5c66b2-3613-4190-b701-2b66ec932a93">
+        <div class="mt-5" id="49bb4472-ed15-4552-adf4-7d93618c03f7">
+         <div class="d-flex justify-content-between" id="a905a27e-82f3-445d-9883-a36eff60d873">
+          <h1 id="db57f4b8-ce88-49d8-ac88-ff4ab415e6d8">
            Class
-           <span class="text-primary" id="fff4f517-a6c4-4c80-ad20-68ecd874550f">
+           <span class="text-primary" id="9011af2b-3b9b-4987-84ea-b6d68b51fa34">
             Table.Head
            </span>
           </h1>
-          <div id="742f37f5-4cc4-4ba5-a91b-40a660c4b34f">
+          <div id="602ee06b-961d-4aae-b324-7863569ae0d8">
           </div>
          </div>
-         <span class="text-muted" id="6df1c17f-b427-4291-9470-8cfabbc97c9d">
+         <span class="text-muted" id="762d5d46-478b-4706-976e-8805fd96dce2">
           The table head.
          </span>
-         <pre id="251d1d72-668c-4f4a-af6a-fc0ed00768d7"><code class="python">Table.Head(head)</code></pre>
-         <div class="mt-5" id="f429d883-3c79-4296-bb7e-d7434d3dfd30">
-          <div class="d-flex justify-content-between" id="1bf077d0-95c3-47bd-98ff-08238f26cd4b">
-           <h4 id="3ace51ce-ec98-44de-80ef-48d7fdda82bc">
+         <pre id="6c4542c8-ea52-4809-abbf-94ad25d98d84"><code class="python">Table.Head(head)</code></pre>
+         <div class="mt-5" id="a5750c4c-8352-4a9f-9f36-5dbdca992902">
+          <div class="d-flex justify-content-between" id="35ca502e-f1a7-4619-bcd1-3be4b3b4ddb2">
+           <h4 id="411a086a-f5fe-4f47-baf7-987ee2cd6ba1">
             Method
-            <span class="text-primary" id="756b4d55-d3ca-45b5-b0a3-a618e126b439">
+            <span class="text-primary" id="eb2bd7c5-56ed-4062-96fd-3d93c0641aa8">
              as_dark
             </span>
            </h4>
-           <div id="21be2673-6520-4a9e-b8ab-8078efb1426b">
+           <div id="3f3bbcef-a4cd-46ae-9b9d-3e438c2a2bb5">
            </div>
           </div>
-          <span class="text-muted" id="a189f5db-a0a3-4c73-8c83-59d107008d59">
+          <span class="text-muted" id="b535efd7-4cbc-4b18-81e6-01f46f08b495">
            Makes the table head appears as dark gray.
           </span>
-          <pre id="8dc9ef74-6d45-4821-910e-e6c315698d33"><code class="python">as_dark()</code></pre>
-          <div class="ms-3" id="ca5a5d3f-58be-4ca1-b386-847535a69195">
-           <h6 id="218f1e6d-90f8-4d58-8278-801135187264">
+          <pre id="46e7a37f-daa5-4823-b8e0-ca160723c330"><code class="python">as_dark()</code></pre>
+          <div class="ms-3" id="73d58284-9ebd-4fcb-99cb-df12da373046">
+           <h6 id="9e6e3c92-5d48-4dbd-80e0-310f748d5399">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="c7f175f0-bcf8-4165-a473-466b5ccd7597"><code class="python">from bootwrap import Table
+           <pre id="847d39e2-d31a-48ec-930d-4e2fc16549fe"><code class="python">from bootwrap import Table
 
 table = Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -8074,8 +8184,8 @@ table.head.as_dark()
 table
 </code></pre>
           </div>
-          <div class="ms-3" id="9de849c4-81b2-4dee-b844-01e4cd90a4da">
-           <table class="table" id="d662b1d9-6b5d-4fe0-9597-02766604fd5e">
+          <div class="ms-3" id="62712837-86b0-404c-91cb-87192000f3e9">
+           <table class="table" id="dc87baa6-854a-40e0-b541-3c77400f83e7">
             <thead class="thead-dark">
              <tr>
               <th scope="col">
@@ -8127,28 +8237,28 @@ table
            </table>
           </div>
          </div>
-         <div class="mt-5" id="20515e9f-0254-42be-9d3c-b508a6d4c30c">
-          <div class="d-flex justify-content-between" id="a31ae850-89dc-43eb-be74-5cbf5c433607">
-           <h4 id="b01dee14-9fd3-4a69-8ce1-005b69284bc7">
+         <div class="mt-5" id="fc9ec82e-9766-4165-be12-f5ce5e5e1340">
+          <div class="d-flex justify-content-between" id="ae9332bb-e81d-4b60-bfef-284858f2eeed">
+           <h4 id="7a5e6fe2-eaa4-4851-94b7-72ea8244c5cf">
             Method
-            <span class="text-primary" id="52af422c-59be-47e3-83af-33616c5a83c5">
+            <span class="text-primary" id="452fa5d6-9bcd-4898-a028-6e4bcc8b1845">
              as_light
             </span>
            </h4>
-           <div id="1a34f070-0509-4a22-b122-fe8f62c675b7">
+           <div id="438c8fa6-77fb-4945-ae13-7ccd17f38404">
            </div>
           </div>
-          <span class="text-muted" id="61095d00-fec1-4883-a0e8-ac204200103e">
+          <span class="text-muted" id="e005c1b4-d72b-42b8-884a-34a20fe32a3e">
            Makes the table head appears as light gray.
           </span>
-          <pre id="4df5b9da-dfaf-425c-bbb4-d3c29c631dbf"><code class="python">as_light()</code></pre>
-          <div class="ms-3" id="251e5110-7679-4e3a-953a-b64b356f0f97">
-           <h6 id="479ae2ea-fcd2-4705-b73d-b4598986aa57">
+          <pre id="f71d4494-58a9-4975-bc67-515d69c15942"><code class="python">as_light()</code></pre>
+          <div class="ms-3" id="cfaf3eb1-93df-4641-80b4-5ceed0fddf2c">
+           <h6 id="be90c275-a07b-4ce8-a009-50c96e746856">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="c66ea8c2-1ff0-4db5-947b-a95b2625346d"><code class="python">from bootwrap import Table
+           <pre id="06c1b218-3e1e-469f-9146-da583ef7771b"><code class="python">from bootwrap import Table
 
 table = Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -8163,8 +8273,8 @@ table.head.as_light()
 table
 </code></pre>
           </div>
-          <div class="ms-3" id="a5aef7ac-5446-4e11-9ed4-2efba842f2cc">
-           <table class="table" id="3c09d110-2f88-49ae-9dcb-57ca291ad69e">
+          <div class="ms-3" id="e97588d9-a62c-4e84-86e0-b708956bd65b">
+           <table class="table" id="d1331331-0d2a-41d4-969a-604fcfa7875a">
             <thead class="thead-light">
              <tr>
               <th scope="col">
@@ -8218,47 +8328,47 @@ table
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="2903aad2-caab-4709-aff2-e240b4d3a332">
-        <div class="mt-5" id="082ab283-e5fc-4170-998f-abdf8d1eabc8">
-         <div class="d-flex justify-content-between" id="059530d9-b9d9-4d03-842c-09fa5bd92361">
-          <h1 id="fa044e85-18a3-4d92-86ce-aad5b863da88">
+       <div class="tab-pane fade" id="c5ac0ee0-becc-41eb-9a30-ec8490d3ed32">
+        <div class="mt-5" id="07282def-6fb3-46dd-8187-332e1a75f0bf">
+         <div class="d-flex justify-content-between" id="c9130b32-27c8-41f0-83a9-de9938ccefbe">
+          <h1 id="cf752756-73a4-4471-9aa9-42913f37c716">
            Class
-           <span class="text-primary" id="541efbe9-5c21-494b-b474-7a3d113c3c9d">
+           <span class="text-primary" id="4019a7dc-0eaa-4f8c-9152-54d54ac03b7e">
             Table.Body
            </span>
           </h1>
-          <div id="3214ff4c-a8b2-458a-b159-758dda3fa311">
+          <div id="e68694a9-e6ec-48c2-8aad-3112ce0fc86b">
           </div>
          </div>
-         <span class="text-muted" id="d868c1ec-af77-4899-9f65-616a9ad5f6a0">
+         <span class="text-muted" id="130ca6f4-731f-4cd8-b04c-29eb64aebda0">
           The table body.
          </span>
-         <pre id="534385bd-9f68-4b14-8409-5ecc5f84aed3"><code class="python">Table.Body(body)</code></pre>
-         <div class="mt-5" id="cc9b1c4c-68f0-4792-80c3-c4d810fbc5ca">
-          <div class="d-flex justify-content-between" id="d19f7ef9-33d4-4f0b-a457-d56757d453c1">
-           <h4 id="e7c4dfa6-83d7-4ffc-8f0c-a2bd2c5a5cf1">
+         <pre id="eac52deb-141d-428a-a9a0-f860c6ec3358"><code class="python">Table.Body(body)</code></pre>
+         <div class="mt-5" id="f4149db2-1481-475c-8c05-c79104b8a677">
+          <div class="d-flex justify-content-between" id="c1316ce1-1876-4486-a565-847086c7bef1">
+           <h4 id="22d20ef4-c64a-4d92-a693-8e17a1e268e7">
             Method
-            <span class="text-primary" id="643da073-6ef0-4f06-b8b0-0b5f30ec1dd3">
+            <span class="text-primary" id="16c08073-a4ca-4fdc-ade6-baf936060f45">
              transform
             </span>
            </h4>
-           <div id="0c6433cb-92ec-491d-9075-f0ff2dd35260">
-            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#69b43005-8b1d-44a7-acbb-d9de8d58a824" data-bs-toggle="collapse" id="1920db1a-362e-486e-b3d4-0fa1658b10e5" onclick="return false;" type="button">
+           <div id="267d3f5f-cc40-4691-b669-fbd81b583f3c">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#25706151-c771-4035-967d-8921e705b9bb" data-bs-toggle="collapse" id="da54e10a-0aa9-4b16-a5cc-17c262c19154" onclick="return false;" type="button">
              Argument
             </button>
            </div>
           </div>
-          <span class="text-muted" id="cbc4dd14-8fcf-41e3-8f78-1fa918e5d383">
+          <span class="text-muted" id="1690f4eb-32a2-4380-9a1f-5829f61dfb9d">
            Defines a function to transform a cell value
           </span>
-          <pre id="7dc58721-6a83-4be6-9c09-3109519f321e"><code class="python">transform(index, entity, fn)</code></pre>
-          <div class="ms-3 collapse" id="69b43005-8b1d-44a7-acbb-d9de8d58a824">
-           <h6 id="7b846b10-28f6-4265-95d1-5534f1202577">
+          <pre id="fa1dc824-55b7-46af-b578-077af9604f9b"><code class="python">transform(index, entity, fn)</code></pre>
+          <div class="ms-3 collapse" id="25706151-c771-4035-967d-8921e705b9bb">
+           <h6 id="c69a740a-5723-4d91-80a2-59e81a063b86">
             <strong>
              Arguments
             </strong>
            </h6>
-           <table class="table table-sm bg-light" id="39a3bfe4-08f8-4cde-9b2e-98f6ff21fd4f">
+           <table class="table table-sm bg-light" id="0b22f61a-c5ef-4bf9-9088-fd9aa8e1210e">
             <thead>
              <tr>
               <th scope="col">
@@ -8323,13 +8433,13 @@ table
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="1643692f-e13f-43af-9c70-01131e3181f1">
-           <h6 id="63eee7b5-9584-4b08-9bff-15f929134452">
+          <div class="ms-3" id="2bcdc7c2-7a02-46bb-8983-6b5cabcf8642">
+           <h6 id="26c33997-f827-45d6-be03-4e245ba84f28">
             <strong>
              Example
             </strong>
            </h6>
-           <pre id="6f79fdcc-ad96-4cf0-86a1-d28bc07bed04"><code class="python">from bootwrap import Table, TableEntity, Text
+           <pre id="454f568f-ebaa-4ef7-8884-0847cb6b9b3d"><code class="python">from bootwrap import Table, TableEntity, Text
 
 table = Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -8361,8 +8471,8 @@ table.body.transform(
 table
 </code></pre>
           </div>
-          <div class="ms-3" id="dc920bbf-6ec8-4335-a3ab-ac9ceddee36c">
-           <table class="table" id="42727e04-ca96-4566-aead-098359e8e6fa">
+          <div class="ms-3" id="3e84da10-be32-4eb2-afe9-6031b926a025">
+           <table class="table" id="547c7e48-8233-4fb5-82d0-9dd97fabe944">
             <thead>
              <tr>
               <th scope="col">
@@ -8425,32 +8535,32 @@ table
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="1d0cf74a-f71c-4f6f-b29d-8b7448af9b21">
-     <div class="mt-5" id="b714d0ff-3168-497c-848e-b93f66c59385">
-      <div class="d-flex justify-content-between" id="6915bc02-0e36-4230-a03e-9b7447a4a450">
-       <h1 id="7461e0ac-ce96-488b-8edd-33b383d405ef">
+    <div class="tab-pane fade" id="6cb58683-b3d9-4114-b55e-188cbe220c96">
+     <div class="mt-5" id="9b69c41e-31e9-44c7-b0e2-d03e4623b1ca">
+      <div class="d-flex justify-content-between" id="bbf14658-ceff-4154-8967-972e00583a9a">
+       <h1 id="2c819dc6-0538-4c63-94be-f5e086a5af50">
         Class
-        <span class="text-primary" id="dfca6b3e-5632-4d91-8acf-c7134eede7ad">
+        <span class="text-primary" id="c42f0fc3-eb95-491e-b865-07704c46b8da">
          Text
         </span>
        </h1>
-       <div id="dd59aa27-0881-441c-85a4-9d64590ff971">
-        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#124a41b8-7966-4b48-8e7f-9c2c9c0f68b2" data-bs-toggle="collapse" id="2a882c7f-f549-4340-a761-d94d533031a5" onclick="return false;" type="button">
+       <div id="3f38e8d3-e699-4dd3-ad66-ef667382970f">
+        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#ef799cec-7374-48b5-adf8-d58aa848ce29" data-bs-toggle="collapse" id="651c00c0-e5e7-4823-9d89-f44adf112681" onclick="return false;" type="button">
          Argument
         </button>
        </div>
       </div>
-      <span class="text-muted" id="c6808304-7f95-4a62-af57-57f3567f432d">
+      <span class="text-muted" id="66e47bcb-581f-4dba-b46b-f7c6e9af1121">
        A web component for a text.
       </span>
-      <pre id="e54eaf0c-843d-4dc8-96c5-89945d7c1692"><code class="python">Text(content)</code></pre>
-      <div class="ms-3 collapse" id="124a41b8-7966-4b48-8e7f-9c2c9c0f68b2">
-       <h6 id="5175b119-1a9f-43b7-974f-f0f82745e660">
+      <pre id="f4bed6a5-e0ac-4cab-809b-222b5c6f61a0"><code class="python">Text(content)</code></pre>
+      <div class="ms-3 collapse" id="ef799cec-7374-48b5-adf8-d58aa848ce29">
+       <h6 id="a0e58a01-9b4d-48a0-ad83-66858b0ff2f1">
         <strong>
          Arguments
         </strong>
        </h6>
-       <table class="table table-sm bg-light" id="762c94fe-5265-4bb3-9c9f-437196b7f627">
+       <table class="table table-sm bg-light" id="25a990fe-3ea0-4973-a4cd-30be9345761e">
         <thead>
          <tr>
           <th scope="col">
@@ -8483,47 +8593,47 @@ table
         </tbody>
        </table>
       </div>
-      <div class="ms-3" id="b0060ad1-29c9-41d9-879d-b5cd6b60b026">
-       <h6 id="dbc97fa1-9277-4c9a-957e-b97e4345f12f">
+      <div class="ms-3" id="6d0ef588-9053-45f1-889e-916900e283d7">
+       <h6 id="34807e59-86b6-4a34-94c2-c28edc3c61e1">
         <strong>
          Example
         </strong>
        </h6>
-       <pre id="911742df-9e08-4e18-a1c2-d463854413eb"><code class="python">from bootwrap import Text
+       <pre id="27598763-31ac-483d-a2a8-bfb07d6e3510"><code class="python">from bootwrap import Text
 
 Text("Normal text")
 </code></pre>
       </div>
-      <div class="ms-3" id="e71f4e8a-d8be-4dcc-9f0f-0ae81ed75544">
-       <span id="6725f8b2-e392-4e04-9093-45d94218577a">
+      <div class="ms-3" id="f6b41317-6d90-4aee-9bc2-9aec6eebd933">
+       <span id="53f62bbc-aebe-49e5-8554-087cbcc8ee9c">
         Normal text
        </span>
       </div>
-      <div class="mt-5" id="1f02d947-3309-4c30-8f31-48f163768719">
-       <div class="d-flex justify-content-between" id="0567c602-3ae9-4bf2-a468-b203846b0574">
-        <h4 id="30d05ca0-0c88-4834-88fb-1545609ef222">
+      <div class="mt-5" id="c13506fd-c4d3-492d-9c32-b674f3eba179">
+       <div class="d-flex justify-content-between" id="0b549318-1839-49be-9517-62b3cc170ae5">
+        <h4 id="23988200-9f2e-4e2a-89b2-baa1f76ac6c0">
          Method
-         <span class="text-primary" id="5df2e0e5-50ee-464f-80d0-dc0d347fb0cf">
+         <span class="text-primary" id="9432b2f6-a73c-4f88-8e87-05efd709629e">
           as_code
          </span>
         </h4>
-        <div id="faa82a46-d7d2-43e8-bead-fb6d5aa61e8d">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#a59c5d5b-57c9-4a2a-b73a-80b1402ba9fb" data-bs-toggle="collapse" id="5151337b-fc40-46d9-a3cf-e872be848289" onclick="return false;" type="button">
+        <div id="ac5e79c5-4f88-4935-9c44-f55c66d599d0">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#4c3780b6-cea7-4b29-a790-1cb7f5b2f6bb" data-bs-toggle="collapse" id="0ce5f9f0-efbb-4b80-9eb3-854878dd1357" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="6ec42816-38e7-4bac-895a-c9936a8aa7d1">
+       <span class="text-muted" id="a2b38772-29f6-4f96-8fd9-cf7db69ffc0c">
         Makes the text wrap as a code snippet.
        </span>
-       <pre id="7908206d-0243-4190-8f1e-d0289668ea0b"><code class="python">as_code()</code></pre>
-       <div class="ms-3 collapse" id="a59c5d5b-57c9-4a2a-b73a-80b1402ba9fb">
-        <h6 id="ce057600-da90-4b0e-9a72-8f5d2fd7d7e4">
+       <pre id="aacfc13f-7391-4efc-9499-f02e3afc0684"><code class="python">as_code()</code></pre>
+       <div class="ms-3 collapse" id="4c3780b6-cea7-4b29-a790-1cb7f5b2f6bb">
+        <h6 id="55759284-9ee9-41e5-a8b0-dcd54f006983">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="f1935caa-e73a-4d26-8be7-ce7e9eeaae10">
+        <table class="table table-sm bg-light" id="3e503194-5b20-4a8e-a1a6-ccab67eb311a">
          <thead>
           <tr>
            <th scope="col">
@@ -8556,49 +8666,49 @@ Text("Normal text")
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="f7e68f7d-e1c2-4cbe-b0f3-cbc0a1691e32">
-        <h6 id="373e99db-3267-4418-a56d-5ccb2b839a47">
+       <div class="ms-3" id="b7942ecb-3eff-49b3-a786-8d70b5d90c2b">
+        <h6 id="1f82c8c3-a8b8-4313-afc1-41bcb53a66d2">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="e5f6dfa7-7871-47b4-a491-cd55057604a4"><code class="python">from bootwrap import Panel, Text
+        <pre id="f4fc12c5-7032-48a5-9a92-1153bd685916"><code class="python">from bootwrap import Panel, Text
 
 Text("print('Hello world!')").as_code()
 </code></pre>
        </div>
-       <div class="ms-3" id="f4d12265-7877-4e82-ac0e-4ffca118cace">
-        <pre id="d98d96a3-dbfc-4f57-9416-60eb2cc20d3b"><code class="python">print('Hello world!')</code></pre>
+       <div class="ms-3" id="cc0e2cca-52e7-4195-bb19-fe7fc1c3cb4c">
+        <pre id="e3f08409-931d-4b63-b5fb-2ff9b057cd67"><code class="python">print('Hello world!')</code></pre>
        </div>
       </div>
-      <div class="mt-5" id="f2dbd25d-c04f-44cc-b702-7b68e3da0da7">
-       <div class="d-flex justify-content-between" id="e91c00ca-506f-4cad-843a-f4fb65979c01">
-        <h4 id="c132ee79-80ec-4f1d-86a8-49d50f917210">
+      <div class="mt-5" id="06f2721e-19c4-47ed-969b-79fe3387c3e8">
+       <div class="d-flex justify-content-between" id="0286211b-77d3-48e3-91b7-06cc0e3e883c">
+        <h4 id="87826178-5703-4cbd-90dc-bf1f10640d3d">
          Method
-         <span class="text-primary" id="ce47e324-83b1-4915-90e0-01d308631906">
+         <span class="text-primary" id="2c599786-7ecb-4044-9c7d-91fb49d149a4">
           as_heading
          </span>
         </h4>
-        <div id="1ac37785-2541-4891-9164-3c6f29f10fdc">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#60981c50-e3e9-4ed6-8008-0ca9f2406c2d" data-bs-toggle="collapse" id="578a10f3-7265-4d3f-8c14-f2a952fcdbb9" onclick="return false;" type="button">
+        <div id="8c2d1a5e-8477-4658-a890-7e51514c0ffa">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#3bea4f70-b093-4a19-93fb-b229b3f738df" data-bs-toggle="collapse" id="a7b3d830-2576-418f-a278-3654d3b44a5b" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#1c733fe7-7203-466b-9485-243d5acb01d7" data-bs-toggle="collapse" id="5addbff4-1008-4af4-af41-9f08ae2a7290" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#ec49a880-ac07-408b-a885-01edf310e0e8" data-bs-toggle="collapse" id="8afe0a13-9721-4223-b783-97eb313c2266" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="436ab0e9-7d6e-4d0e-a2d2-79ebfe528c28">
+       <span class="text-muted" id="8b9fe8fb-e6f8-4f62-aadc-b7325de33665">
         Makes the text as heading.
        </span>
-       <pre id="20e67284-8bd9-4444-b7b3-8599a06a9edd"><code class="python">as_heading(level)</code></pre>
-       <div class="ms-3 collapse" id="60981c50-e3e9-4ed6-8008-0ca9f2406c2d">
-        <h6 id="8b7f7e69-7209-4e6e-814e-1491c51db5fc">
+       <pre id="09965875-df76-47b3-9545-2da2b2d28348"><code class="python">as_heading(level)</code></pre>
+       <div class="ms-3 collapse" id="3bea4f70-b093-4a19-93fb-b229b3f738df">
+        <h6 id="09c2eb37-f7b8-4342-a8cf-5d40d79d0200">
          <strong>
           Arguments
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="c2b8fb0f-7cef-4a2b-a3a7-9f76d9861c19">
+        <table class="table table-sm bg-light" id="e68151be-bd38-4ada-82d6-d1168f8e97f7">
          <thead>
           <tr>
            <th scope="col">
@@ -8631,13 +8741,13 @@ Text("print('Hello world!')").as_code()
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="1c733fe7-7203-466b-9485-243d5acb01d7">
-        <h6 id="7dc0cd21-5786-4765-90a9-5efba35ac8aa">
+       <div class="ms-3 collapse" id="ec49a880-ac07-408b-a885-01edf310e0e8">
+        <h6 id="7eec047e-37f5-4097-80c5-e3188d7d221b">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="e5750478-6fa7-48c6-95bb-a6a0a5870f91">
+        <table class="table table-sm bg-light" id="7762b24b-e765-4430-b7ca-a5212e04c9cd">
          <thead>
           <tr>
            <th scope="col">
@@ -8670,13 +8780,13 @@ Text("print('Hello world!')").as_code()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="7f77ee51-3311-424e-bb65-7f2884ecb07f">
-        <h6 id="21c28dac-0550-4d26-b2e8-e893f1a43855">
+       <div class="ms-3" id="b0fbba16-4e0e-4d41-b903-95999cbcf1be">
+        <h6 id="fc975925-f051-4568-809e-43ab9841a719">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="13ca2ec2-1824-4938-81fa-66a0b19913dd"><code class="python">from bootwrap import Panel, Text
+        <pre id="f56dc116-5b6d-4120-b454-8a935e10cc0c"><code class="python">from bootwrap import Panel, Text
 
 Panel(
     Text("Header text 1").as_heading(1),
@@ -8688,54 +8798,54 @@ Panel(
 )
 </code></pre>
        </div>
-       <div class="ms-3" id="f472efaf-0087-4a52-a248-63b80977373f">
-        <div id="7c227e66-56e6-42ba-a31f-46577094408e">
-         <h1 id="59ce8e28-2d3c-41ac-b107-127a7d646814">
+       <div class="ms-3" id="92089206-21b7-41b9-a977-026917237dda">
+        <div id="3fe65c4b-960b-4ab6-b37b-f4623da136a2">
+         <h1 id="34134050-87c5-4fa6-8d57-a7ea2fcb8780">
           Header text 1
          </h1>
-         <h2 id="a3e3a474-575f-4a62-a195-4813f63b4300">
+         <h2 id="f92d1f19-a3ba-4e78-9952-8b9f415699bf">
           Header text 2
          </h2>
-         <h3 id="a322e39d-e1f3-4d7a-aa3b-a8b8aef92a5c">
+         <h3 id="84fbc43a-5162-4062-8e32-a7d267191279">
           Header text 3
          </h3>
-         <h4 id="39fa8016-29d9-45fd-99c9-86f04e1d20ab">
+         <h4 id="4c8bd155-15b6-425b-9056-3cd0beb12f2d">
           Header text 4
          </h4>
-         <h5 id="98644d35-5f35-4b82-9b56-861b927071be">
+         <h5 id="75d2d379-4726-4028-b765-6725a6214ad9">
           Header text 5
          </h5>
-         <h6 id="46149db5-9459-41ea-b853-32738d27549e">
+         <h6 id="98fff8f3-0f06-4b46-a3c9-c67f307d7299">
           Header text 6
          </h6>
         </div>
        </div>
       </div>
-      <div class="mt-5" id="b4a2a05c-2241-42b2-ac4d-41abd0590cf7">
-       <div class="d-flex justify-content-between" id="56f99f3d-e27a-4e1e-8fa1-2b5f1b036d5d">
-        <h4 id="0a0eae59-505b-414b-ad43-5b40335c0973">
+      <div class="mt-5" id="f6bb450f-6067-4937-ba1b-d03b3c6f59c0">
+       <div class="d-flex justify-content-between" id="fd43956f-947e-4607-b1e6-3edcf1d9b865">
+        <h4 id="3db4b391-5734-4dce-ab4f-978fb8d43c2d">
          Method
-         <span class="text-primary" id="dbe23b5b-5990-49c0-847b-1e8452602734">
+         <span class="text-primary" id="9dbdcd43-c50f-46b0-b90d-4ff55a820ac0">
           as_muted
          </span>
         </h4>
-        <div id="2c1a7376-2aca-45dd-a416-178738864253">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#557de3f4-af14-4b9b-a304-971031bf7980" data-bs-toggle="collapse" id="b5471860-7f9b-4a7f-af01-eb73a934b6af" onclick="return false;" type="button">
+        <div id="ed34dd4c-a347-48fd-909f-51ae724535dc">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#42b88cc8-7dc5-40df-8f42-40ee77ed102d" data-bs-toggle="collapse" id="8322ab9e-dfcf-4a59-944f-d634b81dc9a4" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="8d94636b-08b2-4fd4-8b9d-ce323d3338d4">
+       <span class="text-muted" id="33f7f7ed-7eb5-4bd8-aab6-b642da49fa01">
         Makes the text muted.
        </span>
-       <pre id="aab993f2-d010-48fa-aa23-92187a011b53"><code class="python">as_muted()</code></pre>
-       <div class="ms-3 collapse" id="557de3f4-af14-4b9b-a304-971031bf7980">
-        <h6 id="5ec822be-f694-415d-a22b-bff79cfdeb5d">
+       <pre id="44a74c6d-ae77-4b64-bfe6-ca371c9f2fa2"><code class="python">as_muted()</code></pre>
+       <div class="ms-3 collapse" id="42b88cc8-7dc5-40df-8f42-40ee77ed102d">
+        <h6 id="81ee73a8-d784-43cc-848b-114fef42465a">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="48d7dea7-f684-49bd-b907-6de10ece8b9c">
+        <table class="table table-sm bg-light" id="c2dd75c2-afe3-4c84-9d78-ac8e35ccec93">
          <thead>
           <tr>
            <th scope="col">
@@ -8768,48 +8878,48 @@ Panel(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="9b010c4f-6b7f-4541-a252-a16e8c683f7a">
-        <h6 id="c8ad4532-7384-414a-adf9-70528f395097">
+       <div class="ms-3" id="44395100-b65e-4e69-832b-ef3f9ad3b4ce">
+        <h6 id="8ee4a1f4-95af-40f1-a84a-0fac93b7f84a">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="debd2d03-6a34-4eff-bf11-71c5a5aef31b"><code class="python">from bootwrap import Text
+        <pre id="fa6c1e55-45da-4842-beff-ebc5ebe7d07d"><code class="python">from bootwrap import Text
 
 Text("Muted text").as_muted()
 </code></pre>
        </div>
-       <div class="ms-3" id="8d0734df-9b78-47c7-830d-f120119adc01">
-        <span class="text-muted" id="b16902d5-e7eb-4485-8d51-d321900e55bc">
+       <div class="ms-3" id="bc92e599-bde4-487c-adbb-aa0e11cd9de8">
+        <span class="text-muted" id="7e469fb9-88ce-4512-bb32-5ed205d9d719">
          Muted text
         </span>
        </div>
       </div>
-      <div class="mt-5" id="a71876a8-8233-4c06-8986-7cd886ba2943">
-       <div class="d-flex justify-content-between" id="8f003b02-1030-4f60-acbf-31db3856481a">
-        <h4 id="70ce018f-be8b-414e-be83-bebbd757edd6">
+      <div class="mt-5" id="6da24e8c-6030-470e-aa9d-7ac6ca64a4ba">
+       <div class="d-flex justify-content-between" id="3fc94c5f-b0a8-40f8-b005-1767f7895c78">
+        <h4 id="af8320c3-8197-499b-a938-ffd84f43854b">
          Method
-         <span class="text-primary" id="ee5841cc-08d1-4690-811e-1d9e214f1577">
+         <span class="text-primary" id="0a9c1f9c-835d-46f6-83ae-523ca0c3c386">
           as_paragraph
          </span>
         </h4>
-        <div id="f6b9373e-6822-4e06-92d5-a6557e2ca787">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#e8f451d0-6d78-46f8-9f15-8b60f5b7e4f3" data-bs-toggle="collapse" id="a32e2f30-863a-43c4-a763-8c9d0373e1bb" onclick="return false;" type="button">
+        <div id="6098fe23-b373-427c-89b2-453de1a6b589">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#44da9a61-ad41-4fe3-abd7-2301574cc3eb" data-bs-toggle="collapse" id="4140a9a0-76f3-4b1b-8fab-1d2a8e487e8d" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="1c37178e-4ddc-467d-a119-1d0bd9459b4e">
+       <span class="text-muted" id="e868ba73-a88a-4993-a717-6f2c17a943ff">
         Makes the text wrap in a paragraph.
        </span>
-       <pre id="57f92666-cb38-4631-a198-d16c2af6b26e"><code class="python">as_paragraph()</code></pre>
-       <div class="ms-3 collapse" id="e8f451d0-6d78-46f8-9f15-8b60f5b7e4f3">
-        <h6 id="eb614e9f-9c5e-4d66-83fa-7364192577b9">
+       <pre id="cd62704e-b16f-4537-9e77-6ffa2b0f0cea"><code class="python">as_paragraph()</code></pre>
+       <div class="ms-3 collapse" id="44da9a61-ad41-4fe3-abd7-2301574cc3eb">
+        <h6 id="ddcbf0ed-f2bf-4982-8ef6-26b1599f6b74">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="2e7c67d5-4b14-4b81-9fab-4b19c24b6772">
+        <table class="table table-sm bg-light" id="d0af8adc-32f8-4def-989e-4515df10dc25">
          <thead>
           <tr>
            <th scope="col">
@@ -8842,13 +8952,13 @@ Text("Muted text").as_muted()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="009c429b-cdfa-488b-9205-547e6b8991ee">
-        <h6 id="bcb072b7-1ed0-4f06-b377-c9acdaa67498">
+       <div class="ms-3" id="de2c76d4-80e9-4bfd-832f-0b0c51733369">
+        <h6 id="e60d377f-2abd-4d21-ae03-3ae31d3feb13">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="41e3cc5c-eeb7-4548-a732-cf4d4f3b6cca"><code class="python">from bootwrap import Panel, Text
+        <pre id="d74c3c81-827f-428e-ba72-04a6dcdabfe5"><code class="python">from bootwrap import Panel, Text
 
 Panel(
     Text("Paragraph 1").as_paragraph(),
@@ -8857,45 +8967,45 @@ Panel(
 )
 </code></pre>
        </div>
-       <div class="ms-3" id="12d407e5-0f5a-4164-861c-193483398d43">
-        <div id="41ed9659-2530-4b8f-8e45-796d26ef4ce0">
-         <p id="95e8531f-e9d0-4c8d-b85b-0d94943461fa">
+       <div class="ms-3" id="79935bca-8e85-48b2-9db8-b7352192f326">
+        <div id="b10385bd-a1e5-46f6-8bca-3e99585cf1df">
+         <p id="ee3ecd09-ac2f-4acd-9bf2-ed300af09aac">
           Paragraph 1
          </p>
-         <p id="55402a68-ecef-40b4-a12e-a5d028e2d314">
+         <p id="a2549af3-4afb-42eb-97d9-096f3df1bcc2">
           Paragraph 2
          </p>
-         <p id="1277dee9-fc76-417c-b426-fd38e53d806e">
+         <p id="17290aac-763b-426a-9f85-1ec4aad0bebc">
           Paragraph 3
          </p>
         </div>
        </div>
       </div>
-      <div class="mt-5" id="d0f6ba82-a665-421e-8089-1f429e0aacad">
-       <div class="d-flex justify-content-between" id="f0849553-15ac-4f01-b618-93c14f541539">
-        <h4 id="40a7a0c4-31d7-44f3-9424-dfcac78f10a4">
+      <div class="mt-5" id="fda170e9-c3f9-4b44-9b32-058011b7b7da">
+       <div class="d-flex justify-content-between" id="d0d79ac7-9ff0-40dd-9540-01d3607fd26b">
+        <h4 id="ee755cbd-a57b-4e1c-a99e-8c104baae0b9">
          Method
-         <span class="text-primary" id="2f2c2130-8c24-4668-b2ed-a68cf2bdcbef">
+         <span class="text-primary" id="b76083c0-4114-4848-87a5-ffccf7d90932">
           as_small
          </span>
         </h4>
-        <div id="25b127e8-b992-4522-be4d-6d5655896179">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#d92ccfd3-da16-4caa-9fe6-76c42c94ec36" data-bs-toggle="collapse" id="2c0a8bf2-f1c0-4ebf-a76d-3880ae3a8e20" onclick="return false;" type="button">
+        <div id="e4b879f8-8574-43e5-85db-304df562b7ae">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#9cfe50e9-def0-42af-b654-c04e2a9f69da" data-bs-toggle="collapse" id="2b8bbdb4-9238-4055-a582-8c1e6e9ceefe" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="3ff1921c-3390-49cd-9f03-dae37daa5d48">
+       <span class="text-muted" id="968d0243-34c0-4d7c-88c9-35c397d8089c">
         Makes the text as small.
        </span>
-       <pre id="b434061e-758f-43b5-a9c4-3196fd6c0ad3"><code class="python">as_small()</code></pre>
-       <div class="ms-3 collapse" id="d92ccfd3-da16-4caa-9fe6-76c42c94ec36">
-        <h6 id="a36ed526-fd01-4a44-8c30-60b165c04b02">
+       <pre id="31fbe878-2a99-4539-9525-03887055a5ed"><code class="python">as_small()</code></pre>
+       <div class="ms-3 collapse" id="9cfe50e9-def0-42af-b654-c04e2a9f69da">
+        <h6 id="873ffd49-abe2-4027-998b-8a018ef7721a">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="aba490da-36f0-4c29-908c-5e73a9062bdf">
+        <table class="table table-sm bg-light" id="64259ec5-a46b-46a1-8c69-4cb300a04a8a">
          <thead>
           <tr>
            <th scope="col">
@@ -8928,50 +9038,50 @@ Panel(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="615d6689-cc56-4fef-81a3-a1cbfcde48b2">
-        <h6 id="6ea50ca1-65c7-4d31-9fd3-8dec42c0589f">
+       <div class="ms-3" id="a792e1f9-9e0c-4ebe-bd77-8dce04a4935d">
+        <h6 id="64a22c2e-1577-4635-829e-1f1abc751a68">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="ee34ce34-614c-4242-92b3-1050354826aa"><code class="python">from bootwrap import Text
+        <pre id="9e988114-36f6-45fe-802d-173ae4775329"><code class="python">from bootwrap import Text
 
 Text("Small text").as_small()
 </code></pre>
        </div>
-       <div class="ms-3" id="fa047b54-d653-4890-9fec-0770c80c67e7">
-        <span id="e26becf7-a3c2-49f6-9a75-d3fb97221200">
+       <div class="ms-3" id="8c648dfe-b899-4fe1-965a-372ae0a9c9d5">
+        <span id="3c8ccd6b-5033-4a43-a290-eab3ab18dcba">
          <small>
           Small text
          </small>
         </span>
        </div>
       </div>
-      <div class="mt-5" id="a7fd3e52-68cb-41ea-b999-e397009b19a6">
-       <div class="d-flex justify-content-between" id="eb89534c-6303-4dce-9acd-b4c94581c1b3">
-        <h4 id="c581c323-65ae-4b5a-821b-7ee9befe3a4b">
+      <div class="mt-5" id="047cbdca-101b-4553-99b0-73ccca1c4987">
+       <div class="d-flex justify-content-between" id="e97b3730-6c61-4729-bd56-a0816de34fb5">
+        <h4 id="36c154da-2545-44fc-82ff-e7e6ae784f6d">
          Method
-         <span class="text-primary" id="4c627d8e-35ec-4786-9c43-5278fa8d7b62">
+         <span class="text-primary" id="e5fa89e5-df39-48a6-919a-5a6a5b30891e">
           as_strong
          </span>
         </h4>
-        <div id="ec76fe81-54c4-4c11-ac81-4638ca25ce29">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#dc2fe755-fa35-4ebd-bfe1-e96ea6ec0b61" data-bs-toggle="collapse" id="f42a018d-75e2-41b7-849b-adcea52c8011" onclick="return false;" type="button">
+        <div id="0af95455-9667-4037-a683-59535777ef87">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#f623cf55-3336-40e0-9602-8eb84827d810" data-bs-toggle="collapse" id="0a6db0c7-6225-4887-952e-08cfab579cec" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="4d8b6d3d-35cb-4657-b6d1-74943e2911e4">
+       <span class="text-muted" id="c97be7bb-bb3a-4895-b9ed-a873e9bed87b">
         Makes the text as strong.
        </span>
-       <pre id="fe200622-2ea9-4cac-9279-cb9fc769c340"><code class="python">as_strong()</code></pre>
-       <div class="ms-3 collapse" id="dc2fe755-fa35-4ebd-bfe1-e96ea6ec0b61">
-        <h6 id="04fb52f5-b720-4e51-a57f-794598f36f52">
+       <pre id="d9a7678b-2a6a-4ad8-9588-948ae8f7a44a"><code class="python">as_strong()</code></pre>
+       <div class="ms-3 collapse" id="f623cf55-3336-40e0-9602-8eb84827d810">
+        <h6 id="2188160a-f700-4295-84e5-32befdcf6faa">
          <strong>
           Returns
          </strong>
         </h6>
-        <table class="table table-sm bg-light" id="8cebc8c4-fd1b-4fcb-813a-a10514c3701e">
+        <table class="table table-sm bg-light" id="bd39119e-839f-4fe3-9e48-cdc60ced2d0b">
          <thead>
           <tr>
            <th scope="col">
@@ -9004,19 +9114,19 @@ Text("Small text").as_small()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="512a1006-ba8e-4d46-a318-59df5ff5d68b">
-        <h6 id="13af67fd-89e5-44bd-8744-a25a5cc869ba">
+       <div class="ms-3" id="a81b2049-700a-4344-9f3a-e91516ce6fdb">
+        <h6 id="51b196d9-1411-4f5d-b8d4-fa984e213c3f">
          <strong>
           Example
          </strong>
         </h6>
-        <pre id="1a268932-76ce-4bcb-ac66-90c27cd958aa"><code class="python">from bootwrap import Text
+        <pre id="6f908370-6290-4592-b0b3-cb69ec97c268"><code class="python">from bootwrap import Text
 
 Text("Strong text").as_strong()
 </code></pre>
        </div>
-       <div class="ms-3" id="f413ed41-2a16-421c-b889-52ab5f51ef97">
-        <span id="b56c5f06-d209-4630-995d-35c07a9d4a98">
+       <div class="ms-3" id="334c6283-3037-43b4-ad41-119dca4c9362">
+        <span id="903f185c-0a3d-429e-8dc2-9d39ae8754b0">
          <strong>
           Strong text
          </strong>
diff --git a/docs/index.html b/docs/index.html
index 435179f..4f5b110 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="c4870222-abb9-4dc5-9cab-11fc7117296d" src="logo.png" width="32"/>
-   <span class="text-light" id="22701cb5-fd52-4d26-9a15-b6358c0fc5c6">
+   <img alt="Bootwrap Logo" id="6db8b2d8-658a-4537-ae8d-f623b917768e" src="logo.png" width="32"/>
+   <span class="text-light" id="77179879-d4ee-4b95-a5f2-d1951428a65e">
     <strong>
      Bootwrap
     </strong>
@@ -34,39 +34,39 @@
    <div class="collapse navbar-collapse" id="menu">
     <ul class="navbar-nav me-auto">
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="index.html" id="b22975da-52c4-4f28-ab6e-ed5c222be853">
+      <a class="ms-2 nav-link" href="index.html" id="6f9e300d-97f0-4136-92b0-f573686f8a55">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="layout.html" id="2f10dea9-3992-4bef-96d4-7f68dd84d974">
+      <a class="ms-2 nav-link" href="layout.html" id="ba3171b4-3106-448a-ad96-a68724fd0cf5">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="base.html" id="d5ea5afc-b2a2-49a1-a732-fd420d1f6e96">
+      <a class="ms-2 nav-link" href="base.html" id="1325c100-7ed0-4a44-8b8b-93108ce40f83">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="components.html" id="1b29e841-3c5b-4aee-863a-04b3ae3d76cc">
+      <a class="ms-2 nav-link" href="components.html" id="267596e7-de7a-4d81-9a54-4b0fa87c9716">
        Components
       </a>
      </li>
     </ul>
-    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="c01b22b6-79a8-4a1a-b5c0-997b3ce4a138" role="button">
+    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="b50104dd-083d-4fb9-84ac-665b5a45ccca" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container-fluid">
-   <div id="fc318cd5-1a24-42c7-bbbe-66130bc30353">
-    <div class="mt-3" id="28825a20-03ce-49b3-b320-e66bbc139c40">
-     <div id="97aa8955-c0c4-4f72-bd2f-948a8797abd4">
+   <div id="14c85c61-ca38-4c77-9f01-1211a3b12890">
+    <div class="mt-3" id="7dc5cbdc-9cc3-4e66-9cb6-f9ad94fbe2ab">
+     <div id="f40b6525-015c-475e-be5c-f9ec542f713c">
       <div class="row">
        <div class="col-md">
-        <div id="41970f9d-6904-4ad9-8ef0-0e8259852931">
-         <h1 id="8c2d3c69-c2cf-4778-9726-42121a56dcf2">
+        <div id="97c3210d-0f7b-4eb8-b2c6-9dc3f66bd3df">
+         <h1 id="a8dcddb4-dc2a-47f2-abf2-82514ae17d16">
           <span class="display-4">
            Bootwrap
           </span>
@@ -74,16 +74,16 @@
         </div>
        </div>
        <div class="col-md">
-        <div id="d4dbd9fd-04bf-43f5-a356-48b4b1a3e425">
+        <div id="65f05656-1cf2-4908-b7db-50d39b20fd14">
         </div>
        </div>
       </div>
      </div>
-     <div id="00e270f0-6f9e-43ef-a6f5-a983e35d3861">
+     <div id="dd79f291-b07b-4946-a0b1-b713ca18faf1">
       <div class="row">
        <div class="col-md">
-        <div id="71116973-37ed-4c21-9005-d9fed057e9ab">
-         <p id="5a7d286f-629d-442a-9c7b-54b8a0d2325e">
+        <div id="12ab751b-4023-431c-80c4-c7005df78e07">
+         <p id="bf7974ce-e281-46e3-a8be-2cf6abb05bae">
           <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,72 +91,72 @@
         </div>
        </div>
        <div class="col-md">
-        <div id="f29b3988-e0b6-43b9-971f-b90cb0367cd4">
-         <div class="text-center" id="d56b1819-28ce-4bf7-b7a3-bd05290cfba0">
-          <img height="300" id="9ba59f13-5f06-4c98-9ea4-b6604a2fbb64" src="flash.png"/>
+        <div id="e82ccebe-bca9-41a9-b87d-7b6b03b5cfbe">
+         <div class="text-center" id="da7fbcce-d5a3-495a-b582-6a804fbe217d">
+          <img height="300" id="b33e5021-a2fe-4ba8-8b30-b851ff04ef38" src="flash.png"/>
          </div>
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="4263718b-ce22-4732-b885-55b48d91df81">
-     <div id="6231d833-3753-4fc0-8d69-f8a2d83a159e">
+    <div class="mt-3" id="bccd0656-83d6-4c73-85a9-7cc2f4f02707">
+     <div id="b845a6f6-59fb-4932-9cab-7d45a8b9af52">
       <div class="row">
        <div class="col-md">
-        <div id="01bc5682-bd70-48d2-884b-ed3ee1e3203a">
-         <h1 id="f832c25e-d6d6-4468-904b-f8e67a269292">
+        <div id="c4f72e58-3e8f-4f28-80c1-4906995ba63f">
+         <h1 id="bb6cc9db-bc3e-41dc-bd4b-3230b903f42d">
           Installation
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="3769b7ac-797f-45e2-83c4-cd8cc807d96f">
+        <div id="8d9bde63-4fe5-4795-bb56-34a382f2e008">
         </div>
        </div>
       </div>
      </div>
-     <div id="bfcd7cd7-39d7-4cf9-be7a-b0f0cd461815">
+     <div id="e1a6148b-1606-4c77-b4ae-45c346171c50">
       <div class="row">
        <div class="col-md">
-        <div id="5f7e120c-0adf-4784-b532-4c3963c5ac18">
-         <p id="1de945bf-c5a7-4c53-a2ac-58587c5f3699">
+        <div id="a716a162-5118-44bd-aa60-1615388102a2">
+         <p id="24316245-1fad-43c4-b03a-6b1917d5a6a9">
           Use the following command to install Python Bootwrap:
          </p>
-         <pre id="a0f1008d-31fa-4269-94b7-3747cb1726ab"><code class="python">~$ pip install bootwrap</code></pre>
+         <pre id="63642dce-2148-4042-9a68-d20c82fe90e4"><code class="python">~$ pip install bootwrap</code></pre>
         </div>
        </div>
        <div class="col-md">
-        <div id="38a3c387-1177-4016-9ad5-08fd0aae6cd8">
+        <div id="48bb4154-7990-4d6d-8f95-be6f085d89de">
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="d2944e53-5892-4c8d-bd40-e5163e64a175">
-     <div id="116330aa-90df-4742-9ce6-8457f15a00ef">
+    <div class="mt-3" id="b4307587-0d4c-4fee-9fd1-af6b674e6399">
+     <div id="3dec6b02-e4bb-4c20-aeb0-af73f52a4546">
       <div class="row">
        <div class="col-md">
-        <div id="542564d3-a66a-4159-9c6e-2d8249461603">
-         <h1 id="b763f67c-6539-45a2-b336-61cb24d98b88">
+        <div id="6a5d0cbd-5efd-4ca2-8b05-257861737513">
+         <h1 id="9017a7a1-4adb-4ad9-8424-ea5b20322f48">
           Single-Page Application
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="364395e1-b6e7-459f-bde6-3bd856c3fc95">
+        <div id="95b35d64-73b7-45d1-befd-2d468b837e84">
         </div>
        </div>
       </div>
      </div>
-     <div id="b35c060f-d052-42a2-b0ce-67dcf47197ce">
+     <div id="e3f6af88-6c91-4d37-ae8b-79bdb8fe6901">
       <div class="row">
        <div class="col-md">
-        <div id="01597988-932f-402e-8e80-220ae9bba40e">
-         <p id="ee9fcf3d-a9ea-4d3c-afcf-19a3bf03b4fe">
+        <div id="7241f956-2cf2-499a-842d-c8f86d6aad8a">
+         <p id="2b4f83c2-4fcd-450f-869c-d85073983340">
           A single-page Bootwrap application looks something like this:
          </p>
-         <pre id="65466e87-fcce-4c97-a5b0-c55a69a9e68b"><code class="python">from flask import Flask
+         <pre id="ad473c1c-0a82-41ff-9e86-afdd3750955e"><code class="python">from flask import Flask
 from markupsafe import Markup
 from bootwrap import Page, Text
 
@@ -173,39 +173,39 @@ if __name__ == '__main__':
         </div>
        </div>
        <div class="col-md">
-        <div id="53c27d3f-ac72-412d-93a9-f9a36cd7f22f">
-         <div class="text-center" id="11766ac2-6d34-47ad-94fd-fc3b8647f1c9">
-          <img height="200" id="64388cb8-5c9d-43e5-827d-b66b74a64138" src="single-page-app.png"/>
+        <div id="48472af4-dbec-4e9b-8dd5-58e849c65ca3">
+         <div class="text-center" id="f9438b33-744f-4724-a329-a54795f6e446">
+          <img height="200" id="55f554e5-387e-4653-91be-30d2e29f0f9f" src="single-page-app.png"/>
          </div>
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="91aa37bb-5ba0-4419-b4a6-dd1734a6d4e3">
-     <div id="ee8c347b-1491-4444-a05a-a25209557c61">
+    <div class="mt-3" id="26038ebf-cfa9-4082-934a-f7d082082fca">
+     <div id="34faec52-8b63-40a9-ab3e-4695d33b0444">
       <div class="row">
        <div class="col-md">
-        <div id="e6f647af-e588-43c0-a557-79d492ab8996">
-         <h1 id="aa6296b3-8aea-4e36-ab6f-a2012cdc6f8c">
+        <div id="9a01154c-5bd5-4a48-a5bc-b69b114cda42">
+         <h1 id="3c1cc366-27c5-4e09-a6b5-80dffcadb1c0">
           Multi-Pages Application
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="f951083f-7b66-4482-a267-49feae822a85">
+        <div id="c99f59a0-36b7-4c35-a4bd-a2398dc59780">
         </div>
        </div>
       </div>
      </div>
-     <div id="1008435c-c22e-478b-bbc8-4186cc1a052d">
+     <div id="01429be6-1cd2-45ac-856b-4952b0e9af3b">
       <div class="row">
        <div class="col-md">
-        <div id="620c1984-7187-4b4c-a7ad-af4db4b33276">
-         <p id="9ce6b68f-240f-4543-addf-8554d94b9ba3">
+        <div id="253befea-0f88-4d86-a627-31bc103c90bc">
+         <p id="da8ca59a-25b3-480e-a84d-ce077e10452a">
           A multi-pages Bootwrap application looks something like this:
          </p>
-         <pre id="283f0167-7d4a-423a-91d1-45cde1935073"><code class="python">from flask import Flask
+         <pre id="73df0003-776e-42a6-a003-32197df2c866"><code class="python">from flask import Flask
 from markupsafe import Markup
 from bootwrap import (
   Page, Menu, Image, Anchor, Button, Text
@@ -286,9 +286,9 @@ if __name__ == '__main__':
         </div>
        </div>
        <div class="col-md">
-        <div id="003ed3fd-cd3e-42d8-907e-fbdd0a17896f">
-         <div class="text-center" id="eeeec480-d5cf-4298-bba1-6e9f4e46ddc9">
-          <img height="200" id="8d0ac825-41f8-40f3-8e1a-070f3abf6382" src="multi-pages-app.png"/>
+        <div id="af5438f9-65f4-429f-a790-c18a3ef6e197">
+         <div class="text-center" id="747433fc-01d6-4713-bc03-89e9a6e02b86">
+          <img height="200" id="e8668583-3ebb-40d9-96b6-acdf901ed7e7" src="multi-pages-app.png"/>
          </div>
         </div>
        </div>
diff --git a/docs/layout.html b/docs/layout.html
index 002a207..24ded3c 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="ac244f5f-a074-4461-9495-484a4ac0bcc6" src="logo.png" width="32"/>
-   <span class="text-light" id="34a3d05e-191f-45f5-8569-ad2a6640b61f">
+   <img alt="Bootwrap Logo" id="db613b31-6855-473e-a89f-dc5c2775acc6" src="logo.png" width="32"/>
+   <span class="text-light" id="0d06eb1c-22b6-48aa-b7f0-be461bab120f">
     <strong>
      Bootwrap
     </strong>
@@ -34,54 +34,54 @@
    <div class="collapse navbar-collapse" id="menu">
     <ul class="navbar-nav me-auto">
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="index.html" id="25347f91-0ee9-4036-8e82-6d709bbcdd5f">
+      <a class="ms-2 nav-link" href="index.html" id="be9b6550-168e-4102-8f8d-e7ac910c0702">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="layout.html" id="f10784c2-4fff-427c-9f30-a66229e5aace">
+      <a class="ms-2 nav-link" href="layout.html" id="9b7782d5-4836-4763-9d40-7a46513f4041">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="base.html" id="721ac1e9-2844-4371-8446-8962ccabd7ae">
+      <a class="ms-2 nav-link" href="base.html" id="590f829a-2b9c-4805-98cf-89720a7e63ff">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="components.html" id="eaeab7d4-2e30-49df-be27-18e2e97aef8b">
+      <a class="ms-2 nav-link" href="components.html" id="6df1ac72-3269-4bda-bd18-f79237193e78">
        Components
       </a>
      </li>
     </ul>
-    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="a8837b96-a2b5-4a85-bd9d-9b5ef8f9ae10" role="button">
+    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="22989966-fea2-4ec5-a888-7cc645dc6d73" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container-fluid">
-   <div id="d3195086-1889-4fdd-a7f5-721c496a618b">
-    <div class="mt-3" id="d819ef5d-3a39-4fc6-b01e-e2dd56f59a85">
-     <div id="3eb8fa52-9bf4-4990-aace-23d11621b4f6">
+   <div id="c7838a12-6c60-43d7-a7d9-5eb457005371">
+    <div class="mt-3" id="8f9945e0-2fcb-4d18-9d4e-6122be72fdea">
+     <div id="7f46a239-86a3-47ee-bfe8-2b8879998378">
       <div class="row">
        <div class="col-md">
-        <div id="88310ea5-e0e5-4b39-8856-339b49eba2ab">
-         <h1 id="e4e593d2-8f70-4fa3-80cc-ad638db0c1a1">
+        <div id="bc1986fe-9d3d-4152-929d-ed7efa8dcde8">
+         <h1 id="ba8de846-24a4-452c-b376-b8c53f4c2a73">
           Layout
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="fce917ef-7d6e-4e1c-b8c2-96b820edba56">
+        <div id="008a2642-f61c-4022-97d4-a1d4eabe1812">
         </div>
        </div>
       </div>
      </div>
-     <div id="b9ce88b4-5d25-42e1-af84-1ab717512e56">
+     <div id="dfd00f9a-a588-4817-9688-f71f00688c43">
       <div class="row">
        <div class="col-md">
-        <div id="53ff3d34-ff2a-449e-96fa-8d86091aee2b">
-         <p id="e07cce6f-64ff-497b-bf37-2b535e82b7ae">
+        <div id="2be16b0f-e9bd-4d43-99fd-5bae521abcb0">
+         <p id="661637ba-76f1-4b52-8a90-09fab618ebff">
           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="30a83d31-81ba-421e-acc2-b5a5e873b3f7">
+         <p id="08693771-1625-4fd7-adad-0e0c3cfbb61b">
           <strong>
            Note:
           </strong>
@@ -101,36 +101,36 @@
         </div>
        </div>
        <div class="col-md">
-        <div id="58feb0c8-c960-4781-907a-9cef07530fde">
-         <div class="text-center" id="89e55053-a55a-4ccb-aa53-2ea9b1564f11">
-          <img height="200" id="0518c2f7-2c59-4584-a6b9-4a3ff3f11cd8" src="layout.png"/>
+        <div id="a8d108c8-ee43-40da-aa37-60e09a3942d2">
+         <div class="text-center" id="e4aca00b-45c8-41ad-83de-3b60ca967c2c">
+          <img height="200" id="b8eec2d8-4786-46b1-9623-bb701f193494" src="layout.png"/>
          </div>
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="15a9857a-a033-47e8-84f2-103440017021">
-     <div id="2ca392fb-4ae7-4c8e-8a29-050cf103e515">
+    <div class="mt-3" id="7382be26-2e4b-4436-9c4e-fd480adbf5a1">
+     <div id="813875e9-7c25-4674-9016-ea85bf3776ce">
       <div class="row">
        <div class="col-md">
-        <div id="9e31a2ae-91e1-4201-aa80-338c99154258">
-         <h1 id="6b6801a9-3ecb-4d88-8b0d-114a7c3c7efb">
+        <div id="254241ea-bbe9-47a8-85d6-ac7656f0c09a">
+         <h1 id="8aadd11e-4711-48e0-9219-e087aa5de234">
           Page
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="9eddd9b9-e636-4c6b-8273-9607dd74f59a">
+        <div id="c3b8d39f-1b8c-448b-9d2e-3e90826f711e">
         </div>
        </div>
       </div>
      </div>
-     <div id="f2cc019a-ffea-4bec-81af-b7b83c376c8f">
+     <div id="eec0acd0-2185-4095-80ab-9441a0a742c9">
       <div class="row">
        <div class="col-md">
-        <div id="f311adab-0828-43df-8733-5bac292e6494">
-         <p id="d5151138-e515-46d9-ba1c-fc33a0313010">
+        <div id="4ad482ba-fc3b-47d9-aedf-dc47f3ad276e">
+         <p id="ac926a86-1149-426d-8d59-e6f313446a5e">
           The container could be any element inheriting
           <code>
            WebComponent
@@ -141,7 +141,7 @@
           </code>
           .
          </p>
-         <pre id="aa37792d-1cc3-4639-94ab-5c5edcadc8b7"><code class="python">from bootwrap import Page
+         <pre id="dd946888-3bc6-42b1-87cf-c6a894abb1f5"><code class="python">from bootwrap import Page
 
 page = Page(
   favicon=..., title=..., resources=..., menu=...,
@@ -150,43 +150,43 @@ page = Page(
         </div>
        </div>
        <div class="col-md">
-        <div id="a7d1709e-bc58-4def-8e1d-ef4729f980a2">
-         <div class="text-center" id="89b5af7e-d936-49e3-9d2b-062c2b5a78bf">
-          <img height="250" id="a853e98b-84bb-4af8-8ed4-dc0e148dee49" src="page.png"/>
+        <div id="03c7ff05-02f2-4c4a-ba90-dfeb12626466">
+         <div class="text-center" id="ead597d9-4f06-4d95-81be-323c7e71bab0">
+          <img height="250" id="ee516fad-2c91-4752-8033-c3ae497dc874" src="page.png"/>
          </div>
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="54d35681-d4e3-4caa-b379-e34718ac42e9">
-     <div id="49545f33-91cb-4af9-82aa-834d4bb4da55">
+    <div class="mt-3" id="2c065f46-5e23-4fcd-9131-4d11e723b0f8">
+     <div id="6b9fba0a-a8b8-4a7c-b1c3-460dd1cc8af2">
       <div class="row">
        <div class="col-md">
-        <div id="88d92567-d9f2-4499-9de4-0a3442d953f4">
-         <h1 id="9fc231ae-7716-4e70-8c8b-b83cc68eda73">
+        <div id="170f607c-ae4e-4a9c-932d-d3ce12ef8e3b">
+         <h1 id="c31b4b98-fcca-4d46-a4ca-62fc988e5062">
           Menu
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="c1900438-56a5-423d-bf35-0912e05b5d29">
+        <div id="0d62c843-a26f-48a3-86b3-bfed751f0fe7">
         </div>
        </div>
       </div>
      </div>
-     <div id="c38a062f-6df9-44db-bcb9-484e6ea5dbb0">
+     <div id="34e8bf5f-adec-4198-ab77-01082a35ef68">
       <div class="row">
        <div class="col-md">
-        <div id="384d2763-6949-475e-b376-e0915b2890c1">
-         <p id="46b6c318-962b-4fcd-8d0e-bf77e00b8823">
+        <div id="d6d99110-de07-4fb6-8f45-9cc413431fe7">
+         <p id="a79b7d76-76fb-43ae-a872-88efa325ef06">
           The menu represents the top-level navigation bar containing anchors and actions allowing to switch between different application
           <code>
            Page
           </code>
           s.
          </p>
-         <pre id="abe1f0cd-add4-44c4-abc2-ead8c786ae28"><code class="python">from bootwrap import Menu
+         <pre id="8457dba8-98ad-47a0-98d2-6ff2ee0de787"><code class="python">from bootwrap import Menu
 
 menu = Menu(
   logo=..., brand=..., anchors=...,  actions=...
@@ -194,9 +194,9 @@ menu = Menu(
         </div>
        </div>
        <div class="col-md">
-        <div id="45d408a9-22f5-4c74-859e-2a85b4ec7abf">
-         <div class="text-center" id="42b23963-8faf-400f-9764-97762ce3da16">
-          <img height="100" id="9ace9f70-6043-45e0-b0fd-4eb8925d477b" src="menu.png"/>
+        <div id="b6046fcd-9c68-418f-90d9-453e55db7b82">
+         <div class="text-center" id="fc410914-8088-4f3c-9e34-9342134e5418">
+          <img height="100" id="135be047-862f-4c86-86b7-b2f1b6133d0d" src="menu.png"/>
          </div>
         </div>
        </div>


Test patch:
diff --git a/tests/test_button.py b/tests/test_button.py
index a909e6d..39c8f38 100644
--- a/tests/test_button.py
+++ b/tests/test_button.py
@@ -10,7 +10,8 @@ from bootwrap import (
     Button,
     Panel,
     Dialog,
-    Text
+    Text,
+    Icon
 )
 from .helper import HelperHTMLParser
 
@@ -74,6 +75,38 @@ def test_button():
     assert actual == expected
 
 
+@pytest.mark.button
+def test_button_with_icon():
+    left_button = Button('Left').with_icon(
+        Icon("fa-solid fa-arrow-left")
+    )
+    actual = HelperHTMLParser.parse(str(left_button))
+    expected = HelperHTMLParser.parse(f'''
+        <button id="{left_button.identifier}"
+            class="btn"
+            onclick="return false;">
+            <i id="..." class="fa-solid fa-arrow-left"></i>
+            Left
+        </button>
+    ''')
+    assert actual == expected
+
+    right_button = Button('Left').with_icon(
+        Icon("fa-solid fa-arrow-left"), True
+    )
+    actual = HelperHTMLParser.parse(str(right_button))
+    expected = HelperHTMLParser.parse(f'''
+        <button id="{right_button.identifier}"
+            class="btn"
+            onclick="return false;">
+            Right
+            <i id="..." class="fa-solid fa-arrow-left"></i>
+        </button>
+    ''')
+    assert actual == expected
+
+
+
 @pytest.mark.button
 def test_link_button():
     button = Button('Somename').link('someurl')