Repository: mmgalushka/bootwrap

Issue:
Incorrect response of checkbox, json input and navtabs.

Discussion:

Patch:
diff --git a/bootwrap/components/form.py b/bootwrap/components/form.py
index ae67d48..62821eb 100644
--- a/bootwrap/components/form.py
+++ b/bootwrap/components/form.py
@@ -5,6 +5,7 @@ A form with input elements.
 from abc import ABC, abstractmethod
 from textwrap import dedent
 from html import escape
+from json import dumps
 
 from .base import WebComponent, ClassMixin, AvailabilityMixin, AppearanceMixin, OutlineMixin
 from .utils import attr, tag, inject
@@ -148,6 +149,26 @@ class CheckboxInput(Input, AppearanceMixin, OutlineMixin):
         self.__switch = False
         self.__button = False
         self.__inline = False
+        self.__label_on_left = False
+
+    def label_on_left(self):
+        """Makes an input label showing on left.
+
+        Returns:
+            obj (self): The instance of this class.
+
+        Example:
+            from bootwrap import Form, CheckboxInput
+
+            output = Form(
+                CheckboxInput('One', 'opt1').label_on_left(),
+                CheckboxInput('Two', 'opt2', True).label_on_left().as_switch(),
+                CheckboxInput('Three', 'opt3').label_on_left().as_disabled(),
+                CheckboxInput('Four', 'opt4', True).label_on_left().as_disabled()
+            )
+        """
+        self.__label_on_left = True
+        return self
 
     def as_radio(self, value):
         """Makes a chack box as radio button. 
@@ -231,50 +252,79 @@ class CheckboxInput(Input, AppearanceMixin, OutlineMixin):
         return ""
 
     def __str__(self):
-        self.add_classes('form-check')
-        type = "checkbox" if self.__value is None else "radio"
-        if self.__inline:
-            self.add_classes('form-check-inline')
-        if self.__switch:
-            self.add_classes('form-switch')
-        # Sets input class (for the button look)
-        input_classes = "form-check-input"    
-        if self.__button:
-            input_classes = "btn-check"
-        # Sets label class (for the button look)
-        label_classes = "form-check-label"    
-        if self.__button:
-            label_classes = "btn"
-            if self._category:
-                if self._border:
-                    label_classes += f' btn-outline-{self._category}'
-                else:
-                    label_classes += f' btn-{self._category}'
-        
-        wc_input_n_label = f'''
-            <input {attr('id', self.identifier)}
-                {attr('name', self._name)}
-                {attr('value', self.__value)}
-                {attr('class', input_classes)}
-                type="{type}"
-                autocomplete="off"
-                {attr('checked', self.__checked)}
-                {attr('disabled', self._disabled)}>
-            </input>    
-            <label {attr('class', label_classes)} 
-                {attr('for', self.identifier)}>
-                {self._label or ''}
-            </label>
-        '''
-
-        if self.__button:
-            return wc_input_n_label
-        else:
+        if self.__label_on_left:
+            label_classes = \
+                'col-sm-4 col-form-label d-flex align-items-center'
+            receiver_classes = \
+                'col-sm-8 d-flex align-items-center'
             return f'''
-                <div {attr('class', self.classes)}>
-                    {wc_input_n_label}
+                <div {attr('class', 'form-group row')}>
+                    <label {attr('class', label_classes)}
+                        {attr('for', self.identifier)}>
+                        {self._label}
+                    </label>
+                    <div {attr('class', receiver_classes)}>
+                        <input {attr('id', self.identifier)}
+                            {attr('name', self._name)}
+                            {attr('class', 'form-check-input')}
+                            {attr('value', "true" if self.__value is None else self.__value)}
+                            type="checkbox"
+                            autocomplete="off"
+                            {attr('checked', self.__checked)}
+                            {attr('disabled', self._disabled)}>
+                        </input>    
+                        <input type="hidden" name="{self._name}" value="false">
+                        </input> 
+                    </div>
                 </div>
             '''
+        else:
+            self.add_classes('form-check')
+            type = "checkbox" if self.__value is None else "radio"
+            if self.__inline:
+                self.add_classes('form-check-inline')
+            if self.__switch:
+                self.add_classes('form-switch')
+            # Sets input class (for the button look)
+            input_classes = "form-check-input"    
+            if self.__button:
+                input_classes = "btn-check"
+            # Sets label class (for the button look)
+            label_classes = "form-check-label"    
+            if self.__button:
+                label_classes = "btn"
+                if self._category:
+                    if self._border:
+                        label_classes += f' btn-outline-{self._category}'
+                    else:
+                        label_classes += f' btn-{self._category}'
+
+            wc_input_n_label = f'''
+                <input {attr('id', self.identifier)}
+                    {attr('name', self._name)}
+                    {attr('value', "true" if self.__value is None else self.__value)}
+                    {attr('class', input_classes)}
+                    type="{type}"
+                    autocomplete="off"
+                    {attr('checked', self.__checked)}
+                    {attr('disabled', self._disabled)}>
+                </input>    
+                <input type="hidden" name="{self._name}" value="false">
+                </input> 
+                <label {attr('class', label_classes)} 
+                    {attr('for', self.identifier)}>
+                    {self._label or ''}
+                </label>
+            '''
+
+            if self.__button:
+                return wc_input_n_label
+            else:
+                return f'''
+                    <div {attr('class', self.classes)}>
+                        {wc_input_n_label}
+                    </div>
+                '''
         
 
 class Freehand(Input):
@@ -580,28 +630,32 @@ class JsonInput(Input):
         input_attr = [
             attr('id', self.identifier),
             attr('name', self._name),
-            attr('value', escape(self.__value)),
+            attr('value', escape(
+                dumps(self.__value, ensure_ascii=False, indent=4).strip())
+            ),
             attr('type', "hidden"),
         ]
         input_tag = tag('input', input_attr, '')
 
         json_attr = [
-            attr('class', 'language-json')
+            attr('class', 'language-json'),
         ]
-        code_tag = tag('code', json_attr, dedent(self.__value))
+        json_tag = tag('code', json_attr, escape(
+            dumps(self.__value, ensure_ascii=False, indent=4).strip(),
+            quote=False
+        ))
 
         onkeyup = 'javascript:$(\'#'+self.identifier+'\').val($(this).text())'
         pre_attr = [
             attr('contenteditable', 'false' if self._disabled else 'true'),
             attr('class', "w-100"),
-            attr('onkeyup', onkeyup)
+            attr('onkeyup', onkeyup),
+            
         ]
-        pre_tag = tag('pre', pre_attr, dedent(code_tag))
+        pre_tag = tag('pre', pre_attr, json_tag)
 
         return pre_tag + input_tag
 
-    
-
 class HiddenInput(Input):
     """A hidden input.
 
diff --git a/bootwrap/components/navigation.py b/bootwrap/components/navigation.py
index a03be56..f0023b4 100644
--- a/bootwrap/components/navigation.py
+++ b/bootwrap/components/navigation.py
@@ -66,10 +66,10 @@ class Navigation(WebComponent, ClassMixin):
             from bootwrap import Navigation
 
             output = Navigation(
-                Navigation.Item('Chapter 1', 'Text 1', True),
-                Navigation.Item('Chapter 2', 'Text 2'),
-                Navigation.Item('Chapter 3', 'Text 3')
-            ).as_vertical()
+                Navigation.Item('Chapter1', 'Text 1', True),
+                Navigation.Item('Chapter2', 'Text 2'),
+                Navigation.Item('Chapter3', 'Text 3')
+            ).as_vertical().as_pills()
         """
         self.__vertical = True
         return self
@@ -143,7 +143,7 @@ class Navigation(WebComponent, ClassMixin):
                 role="tablist">
                 {''.join(menus)}
             </ul>
-            <div class="tab-content">
+            <div class="tab-content w-100">
                 {inject(*panels)}
             </div>
         '''
@@ -153,4 +153,4 @@ class Navigation(WebComponent, ClassMixin):
                 <div class="d-flex">{output}</div>
             '''
 
-        return output
+        return output
\ No newline at end of file
diff --git a/docs/base.html b/docs/base.html
index d0b81e1..ba0a0b5 100644
--- a/docs/base.html
+++ b/docs/base.html
@@ -27,8 +27,8 @@
  </head>
  <body>
   <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
-   <img alt="Bootwrap Logo" id="3eeae6b2-c951-4ec6-8ef4-2c4e89b3bc54" src="logo.png" width="32"/>
-   <strong class="text-light" id="2eef0ed3-9974-4ad7-ba9e-900247ca5f8c">
+   <img alt="Bootwrap Logo" id="44bf3147-f1fb-423f-ba30-a79af42d3b84" src="logo.png" width="32"/>
+   <strong class="text-light" id="3e756071-01b8-4ba8-9b11-eead46097150">
     Bootwrap
    </strong>
    <button aria-controls="menu" aria-expanded="false" aria-label="Toggle menu" class="navbar-toggler" data-bs-target="#menu" data-bs-toggle="collapse" type="button">
@@ -38,90 +38,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="f7eaad2e-90b6-445a-b78c-96dc140a44ab">
+      <a class="ms-2 nav-link" href="index.html" id="c10802ef-236f-4e37-b7b3-1c0bc40c48ae">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="layout.html" id="0b386269-694f-4028-bc44-dd37ecbae9ff">
+      <a class="ms-2 nav-link" href="layout.html" id="28fb91a1-8f36-414a-9749-3ff98b19f861">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="base.html" id="0c8fd30c-81a8-4169-b347-b9944f3f95dc">
+      <a class="ms-2 nav-link" href="base.html" id="2ed97c46-4daa-452c-ad65-8b939c2c3a8d">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="components.html" id="fa95d89e-f891-455f-973c-abd8f9c90ec1">
+      <a class="ms-2 nav-link" href="components.html" id="142c8896-6513-4b7a-9d51-86e7d8d11186">
        Components
       </a>
      </li>
     </ul>
-    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="efc1875b-2e2f-41b5-a794-d3d5dcd1dad2" role="button">
+    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="d97dd107-11c5-4ada-a031-071dff23882e" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container-fluid">
-   <ul class="nav nav-pills" id="cf623893-e3db-4508-8264-8e34c94d8b52" role="tablist">
+   <ul class="nav nav-pills" id="d6a38b71-d920-4d5b-b302-e1b1c3c2a18e" role="tablist">
     <li class="nav-item">
-     <a class="nav-link active" data-bs-target="#589e24d1-038e-4bee-b3d0-00fe917a86d4" data-bs-toggle="tab" href="#589e24d1-038e-4bee-b3d0-00fe917a86d4" id="777e2f12-f5ea-4b20-b7aa-4866099eb6b3" role="tab">
+     <a class="nav-link active" data-bs-target="#14c3f043-2263-4010-ab34-49ef80291d1f" data-bs-toggle="tab" href="#14c3f043-2263-4010-ab34-49ef80291d1f" id="8d8e9851-9aae-45df-8b8e-1c005f7cc56a" role="tab">
       WebComponent
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#9345fea4-a46f-400f-98eb-c635f3b71d92" data-bs-toggle="tab" href="#9345fea4-a46f-400f-98eb-c635f3b71d92" id="1928326f-62e0-4e4d-9d4e-949a16ed1a56" role="tab">
+     <a class="nav-link" data-bs-target="#5b5843c0-c889-40ec-8cd7-ac62d13222df" data-bs-toggle="tab" href="#5b5843c0-c889-40ec-8cd7-ac62d13222df" id="b3ab5d98-958e-4349-b0ad-ee63db139375" role="tab">
       ClassMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#f967aecb-8b3a-4319-9a3d-afab0916b423" data-bs-toggle="tab" href="#f967aecb-8b3a-4319-9a3d-afab0916b423" id="d637e945-88b8-44f6-a58c-d5b4e7dcfc45" role="tab">
+     <a class="nav-link" data-bs-target="#48e426d8-3458-4d9a-989f-937dc889c5d6" data-bs-toggle="tab" href="#48e426d8-3458-4d9a-989f-937dc889c5d6" id="9ca9653f-c68c-4eba-ab9d-db73b0857532" role="tab">
       ActionMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#60f2fb13-956e-4b6a-ab90-d099579cdb7e" data-bs-toggle="tab" href="#60f2fb13-956e-4b6a-ab90-d099579cdb7e" id="80897cf9-69e8-4334-8b52-08871fc1583f" role="tab">
+     <a class="nav-link" data-bs-target="#b04dacfd-a3e4-48d5-80f8-b0cc34a4d160" data-bs-toggle="tab" href="#b04dacfd-a3e4-48d5-80f8-b0cc34a4d160" id="0e8073d4-3d44-4f7c-8a62-b42afa3d6152" role="tab">
       AppearanceMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#c7ea1c28-1b5c-45b2-9c7f-0aba103ea892" data-bs-toggle="tab" href="#c7ea1c28-1b5c-45b2-9c7f-0aba103ea892" id="8fbf8246-6ac0-4512-b12e-9b09e7b5cb9a" role="tab">
+     <a class="nav-link" data-bs-target="#681c59cf-8ec8-45ad-aab5-8a82ec0b31b4" data-bs-toggle="tab" href="#681c59cf-8ec8-45ad-aab5-8a82ec0b31b4" id="70540619-f993-4855-b129-bffaf30fca06" role="tab">
       OutlineMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#468938f3-7e1b-4ae3-9fb2-06660a3d6802" data-bs-toggle="tab" href="#468938f3-7e1b-4ae3-9fb2-06660a3d6802" id="260ee81d-c9e3-43a0-8a92-a97f2fcd70b6" role="tab">
+     <a class="nav-link" data-bs-target="#c92f701c-1102-491b-8957-7e42611795f7" data-bs-toggle="tab" href="#c92f701c-1102-491b-8957-7e42611795f7" id="71b9159d-af53-418a-a05c-929e007bea3a" role="tab">
       AvailabilityMixin
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#be09ccde-e46b-48e1-bbce-7a9e83813663" data-bs-toggle="tab" href="#be09ccde-e46b-48e1-bbce-7a9e83813663" id="3994d7df-1433-4935-bc90-ee24e30ed94f" role="tab">
+     <a class="nav-link" data-bs-target="#2281a93f-8b48-4a3d-acc6-7dea5c29dd8e" data-bs-toggle="tab" href="#2281a93f-8b48-4a3d-acc6-7dea5c29dd8e" id="1a4caaf8-58c4-4ce9-aeea-f825fc02b9c2" role="tab">
       Constants
      </a>
     </li>
    </ul>
-   <div class="tab-content">
-    <div class="tab-pane fade active show" id="589e24d1-038e-4bee-b3d0-00fe917a86d4">
-     <div class="mt-5" id="be49d2a9-c3bd-47ed-9ff1-1857a86d74ea">
-      <div class="d-flex justify-content-between" id="b181625e-7c67-4858-98ec-be8d6324f0aa">
-       <h1 id="2699d523-e8f6-4153-922c-a6b126202210">
+   <div class="tab-content w-100">
+    <div class="tab-pane fade active show" id="14c3f043-2263-4010-ab34-49ef80291d1f">
+     <div class="mt-5" id="4d7deb94-e148-45a9-b247-79f8279b8654">
+      <div class="d-flex justify-content-between" id="2880fb64-befb-4934-b11b-bb66e7b199ad">
+       <h1 id="47c1d164-6d47-40f2-b86f-07b04a28b60f">
         Class
-        <span class="text-primary" id="2a6da642-161c-4851-a75d-6df31615c3be">
+        <span class="text-primary" id="75ff383a-31ac-487a-8195-41b8bf169dd4">
          WebComponent
         </span>
        </h1>
-       <div id="0ea4c437-2b15-4a9a-9818-3e5c49992c43">
+       <div id="5a5ca1e6-e6fa-4eb6-a6a7-d0715c9059ba">
        </div>
       </div>
-      <span class="text-muted" id="70950927-6415-4c46-bec1-e1fb5bfa9eaa">
+      <span class="text-muted" id="bd1fb4cc-428e-4089-8c18-8ff7dd988e32">
        A web component base class.
       </span>
-      <pre id="9556c6a2-4670-41f0-915b-ed00ebde2e68"><code class="language-python">WebComponent()</code></pre>
-      <p id="df4ea4bd-9e4a-454d-8903-937e6720a563">
+      <pre id="ae19f903-335d-47c0-83a3-cdec0768dbc6"><code class="language-python">WebComponent()</code></pre>
+      <p id="410009f9-cb7a-4d51-8337-8e4aa52bcfab">
        This class must be inherited by all web components.
       </p>
-      <p id="02f6e320-d3fe-4f2a-8446-18129fabce34">
+      <p id="9835fc85-2086-4b20-a7f3-f372328d6260">
        In many operations where one web component encapsulates another one has
     implemented a type check. If the received element is not
        <code>
@@ -138,11 +138,11 @@
        </code>
        class.
       </p>
-      <div class="ms-3" id="463164f0-71b7-4462-b83f-d0f60a9c25d2">
-       <h6 id="91918f5c-f99f-42c8-a75a-d89ee161aa62">
+      <div class="ms-3" id="d82e1897-18c0-44e9-8f95-632552b2b899">
+       <h6 id="4ec29024-5313-4bbf-8aff-6d566271c77b">
         Example
        </h6>
-       <pre id="fdb99769-2fd9-4b9f-831a-60cd3458ff75"><code class="language-python">from bootwrap import WebComponent
+       <pre id="0d62e189-8235-40a3-82df-ea5a4f36e0ba"><code class="language-python">from bootwrap import WebComponent
 
 class CustomHeader(WebComponent):
     def __init__(self, title):
@@ -156,17 +156,17 @@ class CustomHeader(WebComponent):
         '''
 </code></pre>
       </div>
-      <div class="mt-5" id="ac5813ef-846e-41a6-b5ba-ec7a5fe22ae9">
-       <h4 id="14a65b93-e7ee-447e-806e-74071dbad69f">
+      <div class="mt-5" id="dbc4ff08-1269-42b4-95dc-48689c5cf81e">
+       <h4 id="f5612ef3-d86f-4e97-84a4-ec46333db6ef">
         Property
-        <span class="text-primary" id="d621077a-fcbb-4660-9029-4c52cc195cea">
+        <span class="text-primary" id="f5bd2ed8-85b5-4dec-a715-f80531e7ed49">
          identifier
         </span>
        </h4>
-       <span class="text-muted" id="8d3b95b6-fec4-4231-ab32-3fa941013053">
+       <span class="text-muted" id="55560d04-52de-4b3a-8a2c-e34410480173">
         A unique web component identifier.
        </span>
-       <p id="0b4a2538-810b-48e1-b809-595861d94024">
+       <p id="f7f1e842-ce48-4d53-9889-2628f1db5276">
         Every
         <code>
          WebComponent
@@ -179,7 +179,7 @@ class CustomHeader(WebComponent):
         </code>
         .
        </p>
-       <p id="d6a2edc2-bedd-4756-b70c-671a5df92559">
+       <p id="5df1b9ea-8901-4c61-9ee3-71428ecabf66">
         When you create a custom
         <code>
          WebComponent
@@ -195,11 +195,11 @@ class CustomHeader(WebComponent):
         </code>
         .
        </p>
-       <div class="ms-3" id="5b033451-de31-48f3-ba3c-5ae1920a7458">
-        <h6 id="e842c21a-49e7-40fd-b082-684e83094bb1">
+       <div class="ms-3" id="dab1e148-6ac7-487f-8990-1c2bcfcd381c">
+        <h6 id="22c44a38-96c2-40e9-91d1-4adf8f5dc180">
          Example
         </h6>
-        <pre id="4fd49d48-6f96-48e2-a006-d3f30b129e72"><code class="language-python">header = CustomHeader('Hello World")
+        <pre id="81e706c4-4d11-47a8-83e8-1ebae3be93a9"><code class="language-python">header = CustomHeader('Hello World")
 print(header.classes)
 
 # Result: cfe040e6-df5f-4a3a-b96e-b0cefc31bbd9
@@ -208,41 +208,41 @@ print(header.classes)
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="9345fea4-a46f-400f-98eb-c635f3b71d92">
-     <div class="mt-5" id="743b6209-0269-47cd-9e8e-bd57a74d4835">
-      <div class="d-flex justify-content-between" id="8373ef6b-ca29-436b-bd9b-0731985ee5bb">
-       <h1 id="8a45ba36-76d9-4ad5-b94b-ac337ca873d4">
+    <div class="tab-pane fade" id="5b5843c0-c889-40ec-8cd7-ac62d13222df">
+     <div class="mt-5" id="a6a8dfb8-a63e-42d7-9037-58c4bf2fee4a">
+      <div class="d-flex justify-content-between" id="33fdc524-0586-4764-86ce-406c08771a7e">
+       <h1 id="aa3a9c7d-a84e-4e8e-bec1-e6fa540128d2">
         Class
-        <span class="text-primary" id="ac3f3cf0-70ef-48b8-9216-628f67bcf5cc">
+        <span class="text-primary" id="78b68e3f-8f9c-4a02-8bcf-556a6df8f58d">
          ClassMixin
         </span>
        </h1>
-       <div id="655b0661-bf66-4311-b9b9-7b929587dc44">
+       <div id="7b6a7140-1a86-4691-ba33-2873973716cf">
        </div>
       </div>
-      <span class="text-muted" id="e7077287-c8fb-4c99-9cda-91e4e2068c24">
+      <span class="text-muted" id="25eb277f-bf6f-4e3e-826c-a89d85d99a99">
        Mixin for a web component which class can be amended.
       </span>
-      <pre id="31628cd7-334e-4038-87d4-9115c2ad7404"><code class="language-python">ClassMixin()</code></pre>
-      <p id="55dce03f-de54-433a-bbe0-6e55c3405cf1">
+      <pre id="a7d21b25-42bf-4968-9fb5-6bb5636e766d"><code class="language-python">ClassMixin()</code></pre>
+      <p id="6b06cebb-ea6b-40c9-a001-412d4cfe0f58">
        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="83b400db-7f98-41f1-a87d-f2967d59f406">
-       <h4 id="b067f92a-8b18-4820-a82a-efec9162fe2d">
+      <div class="mt-5" id="a599469f-5218-47d0-9c4c-225410c602df">
+       <h4 id="6695ccce-1609-47e4-bba0-5f25172b1260">
         Property
-        <span class="text-primary" id="c2521dd2-3b69-41c4-a96c-ad8d9968f966">
+        <span class="text-primary" id="6d629fee-b64f-4ef0-b2af-144e7e5dac3c">
          classes
         </span>
        </h4>
-       <span class="text-muted" id="c05cbc27-70fa-4f75-8659-711e0f9f68c7">
+       <span class="text-muted" id="a669d0af-1e18-4220-8ffd-30651565f0e4">
         The web component classes.
        </span>
-       <div class="ms-3" id="68cdeaff-f152-4b12-bd56-30d2aae900a8">
-        <h6 id="432d1935-a0ab-401b-b0d8-a16a57fb99f0">
+       <div class="ms-3" id="33e60cc1-9ba3-4ab1-9837-f1d4056106c6">
+        <h6 id="aff14005-5e8c-4e49-aff1-d8345fc266e6">
          Example
         </h6>
-        <pre id="17bccfd5-b60d-4015-ac18-5dd9c5d2131c"><code class="language-python">from bootwrap import Button
+        <pre id="f5c87d22-cb3d-4b8d-8317-05463029097b"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").add_classes("ms-1 me-1")
@@ -252,32 +252,32 @@ print(button.classes)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="3b7be03b-b23a-450e-bbfd-e96a3fa83ca8">
-       <div class="d-flex justify-content-between" id="3926d837-eeeb-4250-ad6a-b3e7d88d9236">
-        <h4 id="cdacc104-59b7-499c-a6f8-559beb131458">
+      <div class="mt-5" id="327846b9-f878-4369-8dcd-d75571fd7c57">
+       <div class="d-flex justify-content-between" id="ba6f0798-8e20-4227-b0e7-cd3283825280">
+        <h4 id="edbdf885-ab13-426c-b495-72ae1201dcca">
          Method
-         <span class="text-primary" id="f7b1d3fb-13c9-4fdc-855d-6a1997a5fc14">
+         <span class="text-primary" id="20153649-03fd-43a5-827a-969bc42d58a7">
           add_classes
          </span>
         </h4>
-        <div id="d71e0126-c7ed-4493-a738-6163545ee4df">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#07e65060-41c8-49df-a4c8-4e49ac7048a2" data-bs-toggle="collapse" id="a53057ce-5a87-450c-960a-8cd0509d620d" onclick="return false;" type="button">
+        <div id="52605339-cdae-4007-8882-a96a74a77182">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#bd95fec4-7bdb-4e7e-83c2-8fd880784fbf" data-bs-toggle="collapse" id="e9ba39be-68b1-4cb8-80d8-88f32414d2fa" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#41ca9d22-0587-43e7-99b7-1e463315c6ab" data-bs-toggle="collapse" id="3ecd5cdd-63ab-4a2f-909c-7601deeea269" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#77273130-196f-4778-92c5-b7e57a7fba16" data-bs-toggle="collapse" id="b28774ce-e505-4a7b-9447-8e66d0dfa1c9" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="1db37a3d-c76a-4ff8-8bc2-3a62c4ec66d2">
+       <span class="text-muted" id="d182e088-e477-42b2-ae84-3c6f981bfd4c">
         Adds other classes.
        </span>
-       <pre id="906c5d54-0f0f-41c8-8bf1-58417c92703f"><code class="language-python">add_classes(classes)</code></pre>
-       <div class="ms-3 collapse" id="07e65060-41c8-49df-a4c8-4e49ac7048a2">
-        <h6 id="4186f58c-bd54-4cef-933b-be68d016faf0">
+       <pre id="75767f66-1552-499d-8a74-7380dc756847"><code class="language-python">add_classes(classes)</code></pre>
+       <div class="ms-3 collapse" id="bd95fec4-7bdb-4e7e-83c2-8fd880784fbf">
+        <h6 id="0d1c857e-e56d-4496-aa10-06b3fbf7f5e1">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="6ae977f1-3e5c-497a-9a84-e5560d1990c8">
+        <table class="table table-sm bg-light" id="94890e7b-c549-47a5-99bf-22926eb50dae">
          <thead>
           <tr>
            <th scope="col">
@@ -311,11 +311,11 @@ print(button.classes)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="41ca9d22-0587-43e7-99b7-1e463315c6ab">
-        <h6 id="8043dbf9-8e12-433f-ae43-e187f8c0e9b8">
+       <div class="ms-3 collapse" id="77273130-196f-4778-92c5-b7e57a7fba16">
+        <h6 id="de9c64f8-8483-46b8-9fdd-9f246861b570">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="b83194f0-7ff8-4f6d-862f-39b5a4c06872">
+        <table class="table table-sm bg-light" id="32c69353-3172-4b65-bb83-316f09603ddc">
          <thead>
           <tr>
            <th scope="col">
@@ -348,47 +348,47 @@ print(button.classes)
          </tbody>
         </table>
        </div>
-       <p id="047095d1-07f9-4dac-8b01-81f43f386f15">
+       <p id="2d2a2a36-68ba-4634-945a-ddbd9fb956fd">
         Note, the order of specified classes will be preserved during the
         component rendering.
        </p>
-       <div class="ms-3" id="10b69f69-ffdf-4734-8f75-5e60bdd178b2">
-        <h6 id="990a89cc-c7ac-4fe4-b7bd-30490515f47e">
+       <div class="ms-3" id="e81c8d67-da04-4f5b-9097-c4ebef0bebd5">
+        <h6 id="00f2cbe8-d79c-4e9a-9726-bc3b39e6ff1b">
          Example
         </h6>
-        <pre id="327e102d-528d-4ba3-b3c7-736037ea62d1"><code class="language-python">from bootwrap import Button
+        <pre id="a4efc687-c735-4933-ba9e-7a2bae0119a3"><code class="language-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="d21fff09-fdc4-41ad-8678-a1b53f658f88">
-       <div class="d-flex justify-content-between" id="0a40018d-1bc3-447c-b6ef-b901426519ca">
-        <h4 id="bd189676-7017-4d9a-87f6-bc5592af3de4">
+      <div class="mt-5" id="58f2e024-d193-4e79-a5fe-e03a79e02ffa">
+       <div class="d-flex justify-content-between" id="5a0c84db-e6d4-4ff9-bffe-46f91068937c">
+        <h4 id="5d3ad94d-aa73-4bcd-b728-bc6f586ab3eb">
          Method
-         <span class="text-primary" id="83f6e504-a01b-4faf-9c13-7b786f7d238d">
+         <span class="text-primary" id="f935d7d3-3e03-4b17-8dc4-6ed06966424a">
           m
          </span>
         </h4>
-        <div id="137856de-a147-48b5-89d4-9efd5d013b78">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f6c92908-a9b9-4285-a86e-5ccbc8fa35f8" data-bs-toggle="collapse" id="4998350c-cb6e-4bfe-adaa-d412838b1181" onclick="return false;" type="button">
+        <div id="e5105055-36f8-407c-ba49-b121f9da9362">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#53d4e16a-1627-4677-98bf-e00e2e44c2ae" data-bs-toggle="collapse" id="7cd3e63e-9819-48a0-b5f0-3cd01d73e04a" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#9a4978a0-2071-42c1-929e-48abb1de7872" data-bs-toggle="collapse" id="31a5175d-b9fd-4485-998b-7de45d80b081" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#28051c0a-bb3a-4e2e-a297-9016d3e7f878" data-bs-toggle="collapse" id="2076c558-ad00-4f36-a140-5779adb506ac" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="dc85007a-bd7e-418b-b63b-eff2fdeb2c6f">
+       <span class="text-muted" id="34e1c22f-170c-49a8-aaad-3c6da1a2f941">
         Sets margin for all four sides to the specified size.
        </span>
-       <pre id="8fbc31ad-31af-400e-9e9c-ce3de727bf01"><code class="language-python">m(size)</code></pre>
-       <div class="ms-3 collapse" id="f6c92908-a9b9-4285-a86e-5ccbc8fa35f8">
-        <h6 id="5fd4307e-3a86-47a3-8341-d36afc9f0d08">
+       <pre id="45302c65-f501-46da-b2e9-6f5f68c05981"><code class="language-python">m(size)</code></pre>
+       <div class="ms-3 collapse" id="53d4e16a-1627-4677-98bf-e00e2e44c2ae">
+        <h6 id="6bd78649-6076-425b-adeb-a8fe6755be2d">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="65ba7565-c853-45d6-ac5e-a1fd70193ec1">
+        <table class="table table-sm bg-light" id="21dfc5f1-1ed7-4a0c-97f3-bdd1119b9af6">
          <thead>
           <tr>
            <th scope="col">
@@ -421,11 +421,11 @@ button = Button("Hello").add_classes("ms-1 me-1")
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="9a4978a0-2071-42c1-929e-48abb1de7872">
-        <h6 id="81305885-c310-48a6-bd51-a3562a0baa40">
+       <div class="ms-3 collapse" id="28051c0a-bb3a-4e2e-a297-9016d3e7f878">
+        <h6 id="54b2c735-32a5-45a3-a251-56468573249c">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="9af7d4b4-337d-4b4c-8131-7d8595f75a10">
+        <table class="table table-sm bg-light" id="ff87c929-6927-411d-bacd-80d405c7b3b5">
          <thead>
           <tr>
            <th scope="col">
@@ -458,43 +458,43 @@ button = Button("Hello").add_classes("ms-1 me-1")
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="58128e10-54fb-4147-bdbf-70e2a85de58e">
-        <h6 id="06421cf3-341b-4969-a777-580a9c0c9435">
+       <div class="ms-3" id="87a769ff-0e49-435c-869d-abc70cc1cdd7">
+        <h6 id="d7be57af-d2ef-4165-971f-489526075712">
          Example
         </h6>
-        <pre id="75fef427-6a63-46e1-a4d8-cd8f99cb88e3"><code class="language-python">from bootwrap import Button
+        <pre id="91d2d3b5-b389-48c0-bcf2-3172ea0ce301"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").m(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="8d25e80f-8e74-4a54-8a21-6e9d8a67b62b">
-       <div class="d-flex justify-content-between" id="8cea630b-5469-4400-b585-3a26a66a252e">
-        <h4 id="f5dc695d-6a43-4cb3-abe5-5bb7905d7530">
+      <div class="mt-5" id="8363a26e-3d03-484c-848b-cd9e2de0ee22">
+       <div class="d-flex justify-content-between" id="d2004f5c-e8cf-4893-8a34-f005130f8c6c">
+        <h4 id="4d12f707-b540-4ba5-99c5-b6d899649370">
          Method
-         <span class="text-primary" id="7e996779-9142-42e3-811e-33b70ab4f002">
+         <span class="text-primary" id="1cfbad9c-ff02-4f3f-8ea9-6f7e99c2555a">
           mb
          </span>
         </h4>
-        <div id="af9a7e49-f16a-4cfe-bec9-fa2e0bb8256d">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#964bab31-0a91-4822-a559-ccf567846e59" data-bs-toggle="collapse" id="e74a4728-2b9b-44d4-bc78-1ccc46af064a" onclick="return false;" type="button">
+        <div id="a1bddd52-d7d0-4a18-8b09-39f2a3c27ec5">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#1cec91a0-278e-41aa-ba8a-407c5cb45fd4" data-bs-toggle="collapse" id="975013cd-46cb-4001-8353-63686cb410cd" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#0f231daf-10e0-43c7-89e6-d93bb09b88bb" data-bs-toggle="collapse" id="4dc0e0a8-4cc4-4853-b367-ac83f6d6fb68" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#253364e5-b305-48e4-b960-6ce955432b64" data-bs-toggle="collapse" id="200f24a9-a245-42f7-9ac4-5bc2aa6aa4e9" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="f312fdf2-4fc2-4db8-a9e2-1e833ca2e818">
+       <span class="text-muted" id="b9c1b37c-3982-4bf5-b47e-27e782e09bb2">
         Sets margin for the bottom side the specified size.
        </span>
-       <pre id="165b0415-e712-478f-ba29-0916a0f6140a"><code class="language-python">mb(size)</code></pre>
-       <div class="ms-3 collapse" id="964bab31-0a91-4822-a559-ccf567846e59">
-        <h6 id="f3e96f59-6c3f-490b-b108-39a45e6556f2">
+       <pre id="45ae89b2-a831-4e54-a5c4-cbe930831fd4"><code class="language-python">mb(size)</code></pre>
+       <div class="ms-3 collapse" id="1cec91a0-278e-41aa-ba8a-407c5cb45fd4">
+        <h6 id="674d7d8c-cd97-4d6f-8160-626483f1207a">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="14ceaa06-6aa2-4ce9-acd2-80cbf9492ceb">
+        <table class="table table-sm bg-light" id="3e1d13a1-f3e8-45c3-a585-54f800cbf184">
          <thead>
           <tr>
            <th scope="col">
@@ -527,11 +527,11 @@ button = Button("Hello").m(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="0f231daf-10e0-43c7-89e6-d93bb09b88bb">
-        <h6 id="d0235ddb-b001-4795-a356-4652181ffea3">
+       <div class="ms-3 collapse" id="253364e5-b305-48e4-b960-6ce955432b64">
+        <h6 id="c22897e5-5a6c-4cb5-87cc-ec13213f63c1">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="bac0bf93-56dd-457a-8417-bb3d09233304">
+        <table class="table table-sm bg-light" id="10285002-5f96-4d41-8619-a0c8bd2428ac">
          <thead>
           <tr>
            <th scope="col">
@@ -564,43 +564,43 @@ button = Button("Hello").m(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="79606fe2-fe7f-400a-9c87-6e08ceaf48a8">
-        <h6 id="7ae3b632-fc13-4984-9ce7-473a2cdc5969">
+       <div class="ms-3" id="ced70fd6-1630-476e-b9e8-3971552e5766">
+        <h6 id="bb91afe7-c9cb-426c-a4dc-a5666de1090a">
          Example
         </h6>
-        <pre id="9f7843d4-8c78-41ce-91de-04010cb31425"><code class="language-python">from bootwrap import Button
+        <pre id="aaf4874e-5c86-4264-8a8e-b21bccd5a8e4"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").mb(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="3674fbad-2003-4766-a18a-51b7560e86a4">
-       <div class="d-flex justify-content-between" id="2d906b69-c77f-4312-bdaa-e8dc7de9b40e">
-        <h4 id="aac5404d-6b99-41fd-a80b-11b218bb558e">
+      <div class="mt-5" id="d54cb638-ca4a-4061-b7fd-a0364e82501b">
+       <div class="d-flex justify-content-between" id="b2b5ae25-f55e-4d95-a154-7850a27d7e9d">
+        <h4 id="c3da7b7b-09c5-44f2-841b-6886541a13b4">
          Method
-         <span class="text-primary" id="5a9d1d06-e547-4d59-bdc2-3f573c74a200">
+         <span class="text-primary" id="458e2940-b0d7-49fa-a254-4f07870a9aa2">
           me
          </span>
         </h4>
-        <div id="33de69db-f59c-452d-8633-76aba7e84394">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#14219b95-f79b-4be2-a8e7-98487a9016a9" data-bs-toggle="collapse" id="27628e15-7b94-4b55-8d7c-a42d0d2d1044" onclick="return false;" type="button">
+        <div id="9664574f-44fd-40b5-849c-0c1e388b746e">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#a354b940-fa94-41bf-85b8-760bda1a90d9" data-bs-toggle="collapse" id="15626e61-2700-477f-8123-f26f428133f2" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#43718790-1f99-4467-b40b-58ce2387e203" data-bs-toggle="collapse" id="976d61d0-c004-4449-b700-3fc68bfae6b5" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#272e75e0-43ce-4d95-941a-3f0ff577a12c" data-bs-toggle="collapse" id="91c70ce3-342d-4be3-b72e-df28ae446cff" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="f464bb01-98ba-4e5c-b6b3-63c1f9b7d09e">
+       <span class="text-muted" id="4fd2cfdc-5b85-4644-a06d-47a0f8e0f7af">
         Sets margin for the end(right-side) to the specified size.
        </span>
-       <pre id="fa468afd-880c-43cb-a2b0-b933a0b59f60"><code class="language-python">me(size)</code></pre>
-       <div class="ms-3 collapse" id="14219b95-f79b-4be2-a8e7-98487a9016a9">
-        <h6 id="db63eea4-4f2a-4175-b69b-5af85e4099f7">
+       <pre id="6a0399c8-3549-4b9f-b687-68de78704db9"><code class="language-python">me(size)</code></pre>
+       <div class="ms-3 collapse" id="a354b940-fa94-41bf-85b8-760bda1a90d9">
+        <h6 id="5d59ed72-5676-411e-9276-fac8ddc664bf">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="d1588a7b-5e14-47a5-9483-a1ef8bbe28fc">
+        <table class="table table-sm bg-light" id="279ddb03-bab5-4656-862f-8575380ae5d4">
          <thead>
           <tr>
            <th scope="col">
@@ -633,11 +633,11 @@ button = Button("Hello").mb(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="43718790-1f99-4467-b40b-58ce2387e203">
-        <h6 id="0b17e489-92e0-48be-a14b-b09d663bcd1e">
+       <div class="ms-3 collapse" id="272e75e0-43ce-4d95-941a-3f0ff577a12c">
+        <h6 id="1d18a808-f727-4835-bfe5-d44e788e443b">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="7d140493-1df0-4d09-b699-94eb737f00e7">
+        <table class="table table-sm bg-light" id="08bc1f23-9185-493b-b52f-5989c9f04db3">
          <thead>
           <tr>
            <th scope="col">
@@ -670,43 +670,43 @@ button = Button("Hello").mb(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="16d0b8d8-2b7d-4094-af62-fa88073b3270">
-        <h6 id="47190b4a-6296-4dbd-b3e3-582fc5c8f407">
+       <div class="ms-3" id="a4944a5b-d8b2-4368-8480-fed4514c3648">
+        <h6 id="c0890d4d-8fa5-4f90-a0fb-88e524acb5a2">
          Example
         </h6>
-        <pre id="85b1f609-71f9-488e-895e-8d2b5a2d06a7"><code class="language-python">from bootwrap import Button
+        <pre id="0b70fde6-86d5-40a5-86e2-5afce16aa3ca"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").me(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="0bd92b41-0075-4b8a-a5f7-06989b002dd3">
-       <div class="d-flex justify-content-between" id="f03b4bd7-4e5d-4bf2-b30f-2c8e97be71a1">
-        <h4 id="d626e667-ef5b-42c8-8690-ed7f1c5b0827">
+      <div class="mt-5" id="26782879-33a9-420c-906e-162c43763123">
+       <div class="d-flex justify-content-between" id="8a1a41a3-c5f0-4fb1-bb39-cadb898b3c3a">
+        <h4 id="37e26d33-12b0-48ef-955e-019d49ba9509">
          Method
-         <span class="text-primary" id="4a14b7bd-b616-4cc5-ac6d-97cf070f95cf">
+         <span class="text-primary" id="1e456b5b-b9e9-4bd0-8107-c6c60d2fb214">
           ms
          </span>
         </h4>
-        <div id="39991fbe-e077-41de-af2e-39b00baf7aa6">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#36dd79c4-1444-401f-9aaa-14eccae2f874" data-bs-toggle="collapse" id="c0a10105-3f3d-40ef-8710-934d9a1c5445" onclick="return false;" type="button">
+        <div id="93a4300d-d091-4e7c-a2f4-12c731de5d8a">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#be6eef30-8e88-4293-9b07-2eed7e09d2f7" data-bs-toggle="collapse" id="374f8c0b-cbe4-457c-aede-5a1544fb78ed" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#a0f26d17-6c96-45cf-aebc-c2b4d23aea77" data-bs-toggle="collapse" id="1682fcc6-5abe-41a6-a6ef-52033d116329" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#2729b702-18d9-4e75-b29f-63b10a52409d" data-bs-toggle="collapse" id="cc48ab8a-e3f0-475d-a42f-4dfc47bf2a35" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="6cd235e4-6e1b-452f-9755-7493d22e69f9">
+       <span class="text-muted" id="9e0cb318-ac8c-4fad-a745-c38927fc091f">
         Sets margin for the start(left-side) to the specified size.
        </span>
-       <pre id="7bd6ff32-e058-4c26-88b6-6447cbe1fb64"><code class="language-python">ms(size)</code></pre>
-       <div class="ms-3 collapse" id="36dd79c4-1444-401f-9aaa-14eccae2f874">
-        <h6 id="b6ad1d79-062a-49f6-9f4f-69dabe4d39ed">
+       <pre id="74ce9cb8-6084-4c88-b53e-08cf2848b8f1"><code class="language-python">ms(size)</code></pre>
+       <div class="ms-3 collapse" id="be6eef30-8e88-4293-9b07-2eed7e09d2f7">
+        <h6 id="677c6d93-45fe-4ec4-90fa-3bfdbb39e566">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="a4b28174-d76e-4c05-a7a1-e4f95a802fe4">
+        <table class="table table-sm bg-light" id="062ec925-ba2a-4628-a061-da0d610c99dd">
          <thead>
           <tr>
            <th scope="col">
@@ -739,11 +739,11 @@ button = Button("Hello").me(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="a0f26d17-6c96-45cf-aebc-c2b4d23aea77">
-        <h6 id="ba9b6c46-57dc-42f5-8673-ed009171fe5d">
+       <div class="ms-3 collapse" id="2729b702-18d9-4e75-b29f-63b10a52409d">
+        <h6 id="f69e1743-ecdb-4bfe-946a-cd1715b36318">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="be943a32-e374-4d35-8cde-bb495ae637fa">
+        <table class="table table-sm bg-light" id="e607be2e-b6cb-4e4a-880c-124a59d7bf5e">
          <thead>
           <tr>
            <th scope="col">
@@ -776,43 +776,43 @@ button = Button("Hello").me(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="d941943d-2311-418f-aa75-9e17ff65bdae">
-        <h6 id="3ba7e96f-8ca6-4edb-93c6-352ae588d62f">
+       <div class="ms-3" id="80e3e775-8a55-43b7-8116-433abeb9510e">
+        <h6 id="25c19a4e-44f4-4068-b6d4-0c75655dc76d">
          Example
         </h6>
-        <pre id="1d84db5f-2e7f-4bad-be6d-3547fe4b3d5e"><code class="language-python">from bootwrap import Button
+        <pre id="518a6414-63ca-4cc7-9cd3-fe2f406e264a"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").ms(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="cc20dfb4-5f08-4bef-98de-8b7dfa29880c">
-       <div class="d-flex justify-content-between" id="4eb889b7-9bca-427b-8d1c-edd0b45c7a63">
-        <h4 id="f15914ef-c9e5-437a-9355-0263727c7fe6">
+      <div class="mt-5" id="2d60cece-0d27-4fb2-b7bd-3bd23d74da79">
+       <div class="d-flex justify-content-between" id="170fdf03-78ac-422c-ac5e-13edc0ba4ac0">
+        <h4 id="069e989b-4f74-44f6-b623-93d475a185a1">
          Method
-         <span class="text-primary" id="6897b39f-c589-458e-9d43-3cf0d1ec06a0">
+         <span class="text-primary" id="278b12a4-76f4-45f7-b74a-9136d5d3944e">
           mt
          </span>
         </h4>
-        <div id="e7a17311-211b-4e94-a7ce-5a93e2d481fd">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#1a70c7b5-2e2e-4544-adc8-7b3cfadca312" data-bs-toggle="collapse" id="662220ac-5752-4958-9198-6d732ac9d0a9" onclick="return false;" type="button">
+        <div id="10d688ae-d017-49b2-8736-c4f2f60062a4">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#127a50d6-1da4-4e2c-bd3e-fe9df7495fa0" data-bs-toggle="collapse" id="f884a8b6-12a9-492c-820e-d5557bbfef22" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#498cb58f-635a-4982-98af-bb2d35b5659a" data-bs-toggle="collapse" id="59f4f70e-465d-46cf-b930-e0bb477b9641" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#a9bb5dca-af0f-4a90-b4ec-d7e4be7e0315" data-bs-toggle="collapse" id="12c0b98b-4e3f-47ff-b9ae-e5def72d6809" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="bf7cad06-fbbb-4149-ba63-e83fc2753cb0">
+       <span class="text-muted" id="f22d7750-ef0f-4656-ba1c-23e640e7842b">
         Sets margin for the top side to the specified size.
        </span>
-       <pre id="2e0448ba-12e8-4272-9c89-66631926d079"><code class="language-python">mt(size)</code></pre>
-       <div class="ms-3 collapse" id="1a70c7b5-2e2e-4544-adc8-7b3cfadca312">
-        <h6 id="ab7efc80-456e-40f8-9e7f-fa9787eba936">
+       <pre id="2a84564c-3b1e-4695-9326-80674161980a"><code class="language-python">mt(size)</code></pre>
+       <div class="ms-3 collapse" id="127a50d6-1da4-4e2c-bd3e-fe9df7495fa0">
+        <h6 id="996bbfd6-15bf-4ec9-9dc7-48200a94c922">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="6c7a0e1e-621f-45d5-a848-5b2500967f45">
+        <table class="table table-sm bg-light" id="2fe58d34-2a75-4779-a352-67ced1044d1d">
          <thead>
           <tr>
            <th scope="col">
@@ -845,11 +845,11 @@ button = Button("Hello").ms(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="498cb58f-635a-4982-98af-bb2d35b5659a">
-        <h6 id="df68ee73-7190-4bfe-990e-c2cc243bec60">
+       <div class="ms-3 collapse" id="a9bb5dca-af0f-4a90-b4ec-d7e4be7e0315">
+        <h6 id="2f72b464-fd3e-4461-99f4-769548e43b8e">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="e1f64275-ce41-4a5b-ba1b-8bb53ab09c45">
+        <table class="table table-sm bg-light" id="adfbc76c-7715-475d-98e7-02e8aca881bb">
          <thead>
           <tr>
            <th scope="col">
@@ -882,43 +882,43 @@ button = Button("Hello").ms(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="90a7cf0f-f321-43ff-8dc8-d8c2443f6d01">
-        <h6 id="4a3895f4-da27-45c5-970c-cf8fac5a0830">
+       <div class="ms-3" id="6ac2774d-fb8a-4810-82f1-5230dc3cba4c">
+        <h6 id="77863078-9188-4e37-9342-7b3c176833d2">
          Example
         </h6>
-        <pre id="7d3d94f0-a3ba-4016-a59f-df7e61fdbdda"><code class="language-python">from bootwrap import Button
+        <pre id="a6bf94c5-45b7-4835-a2e8-e4ee4751b6fa"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").mt(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="b075b3ef-4e24-4684-acfc-0b2033c91435">
-       <div class="d-flex justify-content-between" id="736872a1-25d9-48c3-b053-fc4e4995baa1">
-        <h4 id="0a0042bb-6378-4292-93f6-7c3827e21299">
+      <div class="mt-5" id="fc2bc79a-7553-4827-bb5e-18e784a14326">
+       <div class="d-flex justify-content-between" id="a8b0e881-a5f9-4dd7-8061-eeaaf0912ee7">
+        <h4 id="bc124f4f-5241-45bb-a7f7-fe8c88b51d84">
          Method
-         <span class="text-primary" id="3f106d5a-a917-46a6-bfe8-16b61b6fd1aa">
+         <span class="text-primary" id="1104e9da-4366-4b63-b1fc-70f7c5077987">
           mx
          </span>
         </h4>
-        <div id="283dd1cc-293a-43f5-a77a-86bfc665744c">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#32ccf081-f55e-4bda-8d47-7d1b2c38c8a4" data-bs-toggle="collapse" id="a2c14c1c-b64a-4541-ad4e-173f100ba58d" onclick="return false;" type="button">
+        <div id="3b6eed12-5a62-4278-bfc1-17499aefe53c">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#a09951c4-e568-41e2-a736-348ba523dd30" data-bs-toggle="collapse" id="7cbc2a09-410c-477b-a359-e09548ea163f" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#cd6abb29-079c-4696-bf18-3f44e6320c1b" data-bs-toggle="collapse" id="d3bc4d90-d80b-45e3-a6df-a247e7563135" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#495052d7-c363-4ef3-9839-43087a18aed5" data-bs-toggle="collapse" id="52c80b01-8832-417a-ae5e-99ce5c81fdf4" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="dca1262d-648b-4361-b804-7a4b4e0dd781">
+       <span class="text-muted" id="c4615e4c-8103-4896-bdba-d57120f0a89e">
         Sets margin for left and right sides to the specified size.
        </span>
-       <pre id="7e8409fc-724f-4234-b0d5-61e04e07df4a"><code class="language-python">mx(size)</code></pre>
-       <div class="ms-3 collapse" id="32ccf081-f55e-4bda-8d47-7d1b2c38c8a4">
-        <h6 id="ffa0c0b3-0cee-4178-bae5-60a2cdbc4d5d">
+       <pre id="4eefd201-435d-4bb6-97bd-425251789fe0"><code class="language-python">mx(size)</code></pre>
+       <div class="ms-3 collapse" id="a09951c4-e568-41e2-a736-348ba523dd30">
+        <h6 id="915aae4b-7c4b-4520-bbce-7b5a1732d22b">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="25f94319-9078-400c-8cd7-fa9b0e3c5669">
+        <table class="table table-sm bg-light" id="f50bd994-a8e4-4efa-8035-fdc8a1cdd961">
          <thead>
           <tr>
            <th scope="col">
@@ -951,11 +951,11 @@ button = Button("Hello").mt(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="cd6abb29-079c-4696-bf18-3f44e6320c1b">
-        <h6 id="013c8319-b13a-4829-b5d0-390b3f1d511d">
+       <div class="ms-3 collapse" id="495052d7-c363-4ef3-9839-43087a18aed5">
+        <h6 id="d5fbf5ac-ea2c-49c0-9ec0-9e0d006bd593">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="4a78ad73-86a0-46f9-a9e1-3f94c2f3a0b1">
+        <table class="table table-sm bg-light" id="cc78a4d8-7307-465c-8711-439e3ce16b1e">
          <thead>
           <tr>
            <th scope="col">
@@ -988,43 +988,43 @@ button = Button("Hello").mt(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="196ad377-d040-4631-8fff-bcff0b5957a8">
-        <h6 id="98b75a3c-cef2-468d-b316-461853c82ca1">
+       <div class="ms-3" id="3a53b599-dd68-4a24-aecf-a783b5d07df8">
+        <h6 id="cb515d78-9241-4ec2-bd2d-6fb5abfaf181">
          Example
         </h6>
-        <pre id="49bc0738-2d80-4d59-94ee-d78475934645"><code class="language-python">from bootwrap import Button
+        <pre id="78d7b4c0-9815-46e6-a692-0e1f94f78d97"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").mx(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="553d5d6f-058b-42a6-91ea-9fd7329f4799">
-       <div class="d-flex justify-content-between" id="e2a5c25c-8a54-4ba2-8aa4-b2cbe3543439">
-        <h4 id="076efe29-7c97-425c-adb3-23538220b253">
+      <div class="mt-5" id="4ad4f1bd-314d-4692-bdfb-6e46a3659f28">
+       <div class="d-flex justify-content-between" id="81666647-d837-4448-b332-6d44bbef9184">
+        <h4 id="9a571cc2-25bd-48d9-b9f5-4b17848d07da">
          Method
-         <span class="text-primary" id="d52fa11f-29a2-489c-8f3e-b9817bdcf27d">
+         <span class="text-primary" id="1dcbbb51-b808-4751-871f-455005e1ff7f">
           my
          </span>
         </h4>
-        <div id="63f6d076-e2a8-4fca-9210-f09be83432e0">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#987a3d4f-4af8-4575-9bd0-523457d7aced" data-bs-toggle="collapse" id="eccafb54-a929-4c9e-a90b-c7c9a08542ab" onclick="return false;" type="button">
+        <div id="ef4ff6c8-7eec-4c1c-9460-ef07f317bbfd">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#4c48150b-b76b-4642-9cb6-aeef4275f4e7" data-bs-toggle="collapse" id="e4f40cfc-4cd6-45ff-b99c-4e6e43b80304" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#348e815a-3fe8-47b1-a1a8-1696fe3ba86c" data-bs-toggle="collapse" id="43672ca4-625a-451c-a06e-39dd25833f7e" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#4ccf4f90-8f1d-4a69-bd9c-39e315a41f2b" data-bs-toggle="collapse" id="e891f489-d0bd-44d6-9e02-251992f4aed9" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="a4edcd31-a6fe-483e-b0d3-5b7a0c30ab03">
+       <span class="text-muted" id="04afc73e-ed60-4acf-b776-3e816d3b256e">
         Sets margin for top and bottom sides to the specified size.
        </span>
-       <pre id="cab01586-2796-45ae-a279-abecf6986c18"><code class="language-python">my(size)</code></pre>
-       <div class="ms-3 collapse" id="987a3d4f-4af8-4575-9bd0-523457d7aced">
-        <h6 id="f8145c73-551a-4349-8b54-2480e7e8e215">
+       <pre id="bb84b45c-455e-4e1b-9277-412eaf376356"><code class="language-python">my(size)</code></pre>
+       <div class="ms-3 collapse" id="4c48150b-b76b-4642-9cb6-aeef4275f4e7">
+        <h6 id="f0fe6150-3510-4327-afad-a5c008d1a143">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="f3de9c8e-44dc-4cf8-882e-cc1931db6068">
+        <table class="table table-sm bg-light" id="aa0cc260-5783-4296-9984-8f4812969216">
          <thead>
           <tr>
            <th scope="col">
@@ -1057,11 +1057,11 @@ button = Button("Hello").mx(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="348e815a-3fe8-47b1-a1a8-1696fe3ba86c">
-        <h6 id="54060820-29cb-493f-8ef5-a04e33be61ec">
+       <div class="ms-3 collapse" id="4ccf4f90-8f1d-4a69-bd9c-39e315a41f2b">
+        <h6 id="f8ed4df5-b58a-435c-a926-a1130693f0e0">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="f4ca1dd0-4077-4537-bcb7-2e809b7c2b62">
+        <table class="table table-sm bg-light" id="e3949477-5f40-4ae9-967e-5466637599b2">
          <thead>
           <tr>
            <th scope="col">
@@ -1094,43 +1094,43 @@ button = Button("Hello").mx(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="ec97cef2-0840-4b05-b4dd-69f24c17bdb2">
-        <h6 id="92592080-8c5d-4b8e-84c6-f84f26347aa1">
+       <div class="ms-3" id="e00de941-a267-413e-ab35-e70f4db93bac">
+        <h6 id="61db8e25-e4bf-495e-bb39-3f1e10753609">
          Example
         </h6>
-        <pre id="fec92ae1-e147-4838-95e2-8f66dc0aa467"><code class="language-python">from bootwrap import Button
+        <pre id="396fc896-a982-4cd1-a1c2-438222b5ccfa"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").my(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="d55367b5-bb3d-4799-89e8-a8376b6f49a6">
-       <div class="d-flex justify-content-between" id="d14f6d23-085c-4efc-a658-d010aa4e893c">
-        <h4 id="76eb5e1a-3366-4e3b-94d0-61b6a7e40954">
+      <div class="mt-5" id="ebb3d518-aaca-427a-8631-e4d40043307e">
+       <div class="d-flex justify-content-between" id="2ecfed7e-1c53-4c56-a4cb-a5d91fb761c8">
+        <h4 id="e44cee0a-4792-4382-b2a6-b8c0a01ab354">
          Method
-         <span class="text-primary" id="4a48443f-cd52-4cd1-8552-45ff9ca1023c">
+         <span class="text-primary" id="1a922aba-c5f4-498e-b645-25dc4205e142">
           p
          </span>
         </h4>
-        <div id="aa289d28-8eaf-49bc-a41e-7e259501189d">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#bd7bbfca-60f7-41a9-a7dd-e440fc5a45a4" data-bs-toggle="collapse" id="7dffa7b9-0816-4685-a6a9-74036c3c7845" onclick="return false;" type="button">
+        <div id="e82392f2-2f9a-496c-81bb-ce33e9fc5b92">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#5d56a266-9303-4c3f-9c58-8a260a8d6809" data-bs-toggle="collapse" id="061dbcf4-36d4-4e62-935b-4b3d286b0014" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#d19c6c03-2118-48eb-8c36-17560b49b9eb" data-bs-toggle="collapse" id="cae97a88-c7aa-4075-ad6c-3fec4fe5d654" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#72814b6a-1b33-42cc-9c72-912005b01db8" data-bs-toggle="collapse" id="984a93a2-aa2b-43dd-bad6-442ba56961ec" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="0383e2b6-36f2-4b05-8c21-704ee73c761b">
+       <span class="text-muted" id="defdc6f0-d1ae-46f6-89c5-5d89c29829d8">
         Sets padding for all four sides to the specified size.
        </span>
-       <pre id="3026af00-ddc4-4b6a-b523-3ad13c8cc4a0"><code class="language-python">p(size)</code></pre>
-       <div class="ms-3 collapse" id="bd7bbfca-60f7-41a9-a7dd-e440fc5a45a4">
-        <h6 id="c895dca4-2f3b-4ad3-8521-ff380e620717">
+       <pre id="e5cadedb-c60a-47c4-89da-322ab0ab1350"><code class="language-python">p(size)</code></pre>
+       <div class="ms-3 collapse" id="5d56a266-9303-4c3f-9c58-8a260a8d6809">
+        <h6 id="72364528-dec5-4d68-9cd0-e5b23ba2491d">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="90ab0c4f-34fe-4613-a52c-ddcfefed1948">
+        <table class="table table-sm bg-light" id="651601c7-490f-4dfe-b1b9-45c9fdea05e2">
          <thead>
           <tr>
            <th scope="col">
@@ -1163,11 +1163,11 @@ button = Button("Hello").my(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="d19c6c03-2118-48eb-8c36-17560b49b9eb">
-        <h6 id="25117bb6-0e97-49c0-92cb-821485761508">
+       <div class="ms-3 collapse" id="72814b6a-1b33-42cc-9c72-912005b01db8">
+        <h6 id="1eaa4a0b-b3e6-4fa3-8892-6f649109a88b">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="3a8011b6-c05a-4b49-8cf7-f3870d5868cb">
+        <table class="table table-sm bg-light" id="b4cc228b-9214-4b2b-8762-082b045a5911">
          <thead>
           <tr>
            <th scope="col">
@@ -1200,43 +1200,43 @@ button = Button("Hello").my(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="4368e531-1e1c-4e29-97dc-78e7aa5ffab6">
-        <h6 id="f14d53d0-330c-4a0c-9454-5f7ef047cd7a">
+       <div class="ms-3" id="93c0115e-9cde-4944-aafc-ce27e74e5ee7">
+        <h6 id="04305aa1-fcfc-4e78-bfe3-281906c55d41">
          Example
         </h6>
-        <pre id="7c4a4b6e-c5b0-477c-a2ae-cb867bc36065"><code class="language-python">from bootwrap import Button
+        <pre id="605b0e52-fc40-4acb-bb0a-7205de430d5d"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").p(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="945224e3-ee09-467c-a5cf-a6d4d502840a">
-       <div class="d-flex justify-content-between" id="5a6272da-ab3d-4608-97d6-303ed2c86bb0">
-        <h4 id="33dd6050-9fc7-4577-8de0-7e303c70b18e">
+      <div class="mt-5" id="ace2e522-ffba-4a45-9f78-45ccaddb70f4">
+       <div class="d-flex justify-content-between" id="24a70d35-74f5-4318-b8c7-7827e12a3010">
+        <h4 id="ed9ecc51-a308-47b9-9546-b261cb5e4980">
          Method
-         <span class="text-primary" id="cad70134-6b60-413b-ad5a-734414dcbebd">
+         <span class="text-primary" id="47412b7b-414b-4022-a586-d92237c3be99">
           pb
          </span>
         </h4>
-        <div id="be9a22c6-9f8a-440b-a400-1d0ebb5f3e1c">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#2b8121d4-7497-48e0-b6b4-2a81d0a25dcd" data-bs-toggle="collapse" id="c8d5e496-d626-4284-b4b5-755f41d1c360" onclick="return false;" type="button">
+        <div id="56b8c3f1-b2bd-41af-82fb-ab8d0358754d">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#1e3119cb-d66f-4287-8274-24ec89328812" data-bs-toggle="collapse" id="945995b8-870f-46ad-969c-8a120ffc3add" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#a4e2fdd0-0a82-4ce3-b181-15c9d96fc9de" data-bs-toggle="collapse" id="6755fb48-9e23-4b2b-845b-28e221cc43cc" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#a3e20eeb-2617-4d69-ab58-3e960d6b2093" data-bs-toggle="collapse" id="e9e0f5bb-6600-4342-8e6f-47193f1f4de8" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="ddd257df-2e5c-48f0-81aa-e5c4d2ab2af8">
+       <span class="text-muted" id="59fa5c59-9fa5-4953-8f66-739e20144c6f">
         Sets padding for the bottom side the specified size.
        </span>
-       <pre id="054bc8e6-3121-4e03-a08d-e47573e13fd4"><code class="language-python">pb(size)</code></pre>
-       <div class="ms-3 collapse" id="2b8121d4-7497-48e0-b6b4-2a81d0a25dcd">
-        <h6 id="01bb2231-b38a-4766-a602-15d48b01ee42">
+       <pre id="30bd212b-7473-4a64-b35e-dd355b27cdb3"><code class="language-python">pb(size)</code></pre>
+       <div class="ms-3 collapse" id="1e3119cb-d66f-4287-8274-24ec89328812">
+        <h6 id="bf2f31ce-3060-4c8b-a45c-3b5cf9b2addd">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="122a7031-4fe3-4323-b1ed-90ea51659e57">
+        <table class="table table-sm bg-light" id="56a4c096-c3e1-4701-ac1c-430ca01bd0ea">
          <thead>
           <tr>
            <th scope="col">
@@ -1269,11 +1269,11 @@ button = Button("Hello").p(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="a4e2fdd0-0a82-4ce3-b181-15c9d96fc9de">
-        <h6 id="d9b27071-f0a0-4b45-a0f4-49f6c9e84cfe">
+       <div class="ms-3 collapse" id="a3e20eeb-2617-4d69-ab58-3e960d6b2093">
+        <h6 id="f75f16f2-83de-4fc7-8c38-4f2ac7baeca9">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="c7105d16-3e45-4f75-b7b7-34ef4dc30c07">
+        <table class="table table-sm bg-light" id="bd062b34-2c77-46e5-9475-207a76a3963b">
          <thead>
           <tr>
            <th scope="col">
@@ -1306,43 +1306,43 @@ button = Button("Hello").p(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="88bc99a3-ef6f-4ece-9994-b239a52b3b21">
-        <h6 id="6e6b2002-330f-4ab2-9d33-a444d4e60377">
+       <div class="ms-3" id="f8454ad9-1af8-491d-ab35-0cb9eb41907b">
+        <h6 id="062da52c-16c6-4629-a36f-634dc492cb98">
          Example
         </h6>
-        <pre id="05e498e8-e4a8-4a4f-8c5e-522a861364f7"><code class="language-python">from bootwrap import Button
+        <pre id="655804ed-64da-400c-8bab-c7f60bf5ced9"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").pb(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="f4b22355-3e67-4f95-842c-56bf20075e59">
-       <div class="d-flex justify-content-between" id="51cec300-0ebd-4cee-ae89-96e8fc494110">
-        <h4 id="f7a0eca1-8f66-4a1e-96e8-bd5539bf6def">
+      <div class="mt-5" id="d34c61dc-7e2c-4b91-8768-0e8833ae627a">
+       <div class="d-flex justify-content-between" id="28b82356-2b89-4ac1-93bc-6a6b89f93fa9">
+        <h4 id="e272a2a1-6af1-4c61-b8a3-fd95965652c5">
          Method
-         <span class="text-primary" id="bc038cd1-f7b3-4042-a4d2-6465e99213a3">
+         <span class="text-primary" id="21958a70-cd4d-4650-87a6-48948e681de0">
           pe
          </span>
         </h4>
-        <div id="db0e759e-a265-4d31-bc70-384a769705ae">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#2c75513f-399d-4d8c-8d4a-76495c388d5e" data-bs-toggle="collapse" id="495dd993-6d22-425c-ba26-831fab3c5ecf" onclick="return false;" type="button">
+        <div id="a3139121-49fe-41f3-ac08-46622b691b2c">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#2dabb0cf-374f-450e-a150-af10445a2393" data-bs-toggle="collapse" id="87ddb7a8-3963-4270-a8d3-55527d3acccb" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#3e18d3be-81b9-4ede-bda6-4c3d00031ac8" data-bs-toggle="collapse" id="39b2c084-9b58-4450-b136-81ce2104f8b8" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#6694735d-7d59-436c-ba99-93e2f6b8da50" data-bs-toggle="collapse" id="802ff8f8-8af1-4e2f-9403-3b506eaf85df" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="1a3a59bf-88bb-4cea-93e0-8198b8735062">
+       <span class="text-muted" id="25d522f2-94be-4ca6-8aa3-2611b7c7024e">
         Sets padding for the end(right-side) to the specified size.
        </span>
-       <pre id="6cae42d6-5d01-4afd-9e3c-a3cde2725832"><code class="language-python">pe(size)</code></pre>
-       <div class="ms-3 collapse" id="2c75513f-399d-4d8c-8d4a-76495c388d5e">
-        <h6 id="0f4ed910-5986-4bf1-940e-55209cca853b">
+       <pre id="6c1d6893-74f2-4c6a-a595-8043941021bf"><code class="language-python">pe(size)</code></pre>
+       <div class="ms-3 collapse" id="2dabb0cf-374f-450e-a150-af10445a2393">
+        <h6 id="6b015ef1-c1c4-4b56-99e7-48307cafdb3a">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="57a31314-c90a-40b4-ba93-cda5cd5bb78a">
+        <table class="table table-sm bg-light" id="d75392ea-8792-4bd6-b918-0cd8f280facc">
          <thead>
           <tr>
            <th scope="col">
@@ -1375,11 +1375,11 @@ button = Button("Hello").pb(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="3e18d3be-81b9-4ede-bda6-4c3d00031ac8">
-        <h6 id="8a925bce-8808-4edb-a45d-5de6326e78a1">
+       <div class="ms-3 collapse" id="6694735d-7d59-436c-ba99-93e2f6b8da50">
+        <h6 id="c44dcc81-9174-474a-bdb3-cccdbfa6e3b3">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="a93d4241-7da0-4111-8dab-527fbb1104bc">
+        <table class="table table-sm bg-light" id="84069e43-e32a-42cf-bf7e-492d0e440b7a">
          <thead>
           <tr>
            <th scope="col">
@@ -1412,43 +1412,43 @@ button = Button("Hello").pb(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="90a2a2f9-375b-42dc-9f80-f49b475c96bb">
-        <h6 id="4c615920-f7ea-4476-8f35-18b8c22a408f">
+       <div class="ms-3" id="5c1ed033-7168-4060-bdc8-8562179a4d4b">
+        <h6 id="e356f67a-4b52-40ca-a0cf-2e0814db5576">
          Example
         </h6>
-        <pre id="d8d857c2-3393-4519-be93-e6b8456ce038"><code class="language-python">from bootwrap import Button
+        <pre id="e7a1e18a-e1f8-4b5c-b62a-c7cdc3b019d6"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").pe(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="a4e5b865-9dff-4d03-acdb-0ea876c80fc6">
-       <div class="d-flex justify-content-between" id="b80f5b5d-893f-4afc-9b85-48eee58621e3">
-        <h4 id="e6f44382-60dd-403d-bfbe-47464f4f1db0">
+      <div class="mt-5" id="a804c329-9174-46d2-8f2a-b4b233125e00">
+       <div class="d-flex justify-content-between" id="2480926b-14a7-47bf-a117-7a8900b44247">
+        <h4 id="413a3dfc-6638-4d5e-bf56-711cdbee8c77">
          Method
-         <span class="text-primary" id="6df025ba-99d7-414c-963b-4edd3f459d26">
+         <span class="text-primary" id="42035ce9-34ea-49f3-8da7-9590cb2d4722">
           ps
          </span>
         </h4>
-        <div id="b08f2dc5-0467-4bef-8923-460dfabac101">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#8d7bc737-e411-440d-82a0-e6388cdc7913" data-bs-toggle="collapse" id="21baa06b-b41a-4cd1-ab44-22cc29b17e85" onclick="return false;" type="button">
+        <div id="c85d2c56-5cea-4446-9abb-6d87acb0da6c">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f5daeeff-4f45-484f-814b-80f1c272fd94" data-bs-toggle="collapse" id="1fe32100-8133-454d-9a36-528fc1cd30d5" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#635c52c0-fa61-4130-9156-b28a60886eab" data-bs-toggle="collapse" id="089a07b0-3d8b-47f3-9f3f-0d220e52d11c" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#2f74fec3-f11c-427b-a2b7-2ba693da09a8" data-bs-toggle="collapse" id="703adb67-2baf-4524-a15b-3e4fce971420" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="03ea9ccd-538e-49d0-8e20-8174f2737fa0">
+       <span class="text-muted" id="c293569a-b055-4297-9d6f-928a3d24ee65">
         Sets padding for the start(left-side) to the specified size.
        </span>
-       <pre id="10e685e1-6cad-42dc-aa8d-0071e6c77c96"><code class="language-python">ps(size)</code></pre>
-       <div class="ms-3 collapse" id="8d7bc737-e411-440d-82a0-e6388cdc7913">
-        <h6 id="559a292a-a741-474c-80a6-bdedba578d64">
+       <pre id="81de6f75-9fa6-4164-904d-764278d3ac3b"><code class="language-python">ps(size)</code></pre>
+       <div class="ms-3 collapse" id="f5daeeff-4f45-484f-814b-80f1c272fd94">
+        <h6 id="8cc1883a-fd35-4ef3-9c61-257287f1c7d8">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="edc14fae-207e-4639-bedc-35416f3bd117">
+        <table class="table table-sm bg-light" id="e07e39d5-593a-4baa-8f7b-972cde0c306a">
          <thead>
           <tr>
            <th scope="col">
@@ -1481,11 +1481,11 @@ button = Button("Hello").pe(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="635c52c0-fa61-4130-9156-b28a60886eab">
-        <h6 id="6425b1bb-2f48-45f0-aa0c-02197718f50b">
+       <div class="ms-3 collapse" id="2f74fec3-f11c-427b-a2b7-2ba693da09a8">
+        <h6 id="3ff69193-f10d-4859-ba71-98aef22d4684">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="4bdcebfb-db05-47b5-8e09-cbb896252fd3">
+        <table class="table table-sm bg-light" id="26195836-bf24-4bd8-90dd-e422932871f0">
          <thead>
           <tr>
            <th scope="col">
@@ -1518,43 +1518,43 @@ button = Button("Hello").pe(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="3cc4fbb8-39e8-4c47-ae7d-9b87d1ab5cb5">
-        <h6 id="19d677b9-75fb-4b74-9b83-245914b0cb99">
+       <div class="ms-3" id="362837c5-6be6-4a97-8a14-3a4d634f693c">
+        <h6 id="ddd56a8b-1a3c-4bf0-8657-0c3a154edd44">
          Example
         </h6>
-        <pre id="2e9e0462-b3b4-450f-ae31-791d7c45dacf"><code class="language-python">from bootwrap import Button
+        <pre id="b7c8ed37-43d9-4c94-b6c0-cde56f0acae1"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").ps(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="c1254417-a44e-4438-b0b2-7071d1c116eb">
-       <div class="d-flex justify-content-between" id="93193b1c-de23-4cff-9796-884406f88be9">
-        <h4 id="014c1832-d9d9-4bac-b0ca-3e063293a216">
+      <div class="mt-5" id="e5c496b9-1257-48d4-9207-38185a2c6884">
+       <div class="d-flex justify-content-between" id="698a1c08-5e81-4fcb-9ae5-68d7e57cc401">
+        <h4 id="80f3879f-bba2-4ac6-923e-1e98cf648058">
          Method
-         <span class="text-primary" id="226ca9cd-19b7-499b-b53a-a45342e83ee4">
+         <span class="text-primary" id="101d0638-f66d-468b-8efe-d4259abef921">
           pt
          </span>
         </h4>
-        <div id="412aaf39-d998-430f-817c-23bcaf4fa815">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#59c5b1e9-2df4-4f85-9866-ddc9fe7df2c6" data-bs-toggle="collapse" id="8f91c856-6927-40c0-80d2-b6f4c6a30054" onclick="return false;" type="button">
+        <div id="4758c4de-946b-4a71-aa65-030253007f60">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#199d89e2-bbe5-46a2-8376-f19480401e5d" data-bs-toggle="collapse" id="b30d02f0-b9ee-499b-b718-2af770a9fd62" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#5d7c7c88-618b-473b-abcc-c7a990def601" data-bs-toggle="collapse" id="0376726b-f056-4a2a-a7e9-97c4b817497f" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#c60624ea-c1de-450b-b49e-ce9f60d298e5" data-bs-toggle="collapse" id="6e434e69-ab1a-49d4-863c-7f15e8d2fbe2" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="829ee252-62c0-4551-bbf8-c51efc65f69a">
+       <span class="text-muted" id="85016017-fc2c-49b7-acd5-0d9be418fe3d">
         Sets padding for the top side to the specified size.
        </span>
-       <pre id="443439cf-342c-485f-abf9-cc859f9d3280"><code class="language-python">pt(size)</code></pre>
-       <div class="ms-3 collapse" id="59c5b1e9-2df4-4f85-9866-ddc9fe7df2c6">
-        <h6 id="e8be6722-4cbd-46e9-a99a-804da06ee77b">
+       <pre id="a89639b5-e94a-4525-b3ab-7ab5eea1f070"><code class="language-python">pt(size)</code></pre>
+       <div class="ms-3 collapse" id="199d89e2-bbe5-46a2-8376-f19480401e5d">
+        <h6 id="a77c2cbb-74bf-4cdb-9f52-b455b2999f10">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="38fdee74-38f5-4d07-b2c7-00e4e434ddff">
+        <table class="table table-sm bg-light" id="64dd6794-3a9d-4345-a70c-5236c731d05a">
          <thead>
           <tr>
            <th scope="col">
@@ -1587,11 +1587,11 @@ button = Button("Hello").ps(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="5d7c7c88-618b-473b-abcc-c7a990def601">
-        <h6 id="230dfe38-f37b-4e8b-b5af-ae138248421e">
+       <div class="ms-3 collapse" id="c60624ea-c1de-450b-b49e-ce9f60d298e5">
+        <h6 id="2dcbb997-78a2-488f-a809-b0c6c328f751">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="2c61f379-5848-4759-becc-e679feafc0b6">
+        <table class="table table-sm bg-light" id="f8f9b687-8a1d-4c16-aeab-0175086020f6">
          <thead>
           <tr>
            <th scope="col">
@@ -1624,43 +1624,43 @@ button = Button("Hello").ps(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="3abd641b-eb2d-44a5-812a-2088cf3d6b84">
-        <h6 id="16b51a30-4780-4590-bb32-f800e20061ae">
+       <div class="ms-3" id="6d667021-f971-44d1-a10a-a0f0fac7c7e2">
+        <h6 id="f3212dde-83c8-484c-8790-e25a849f7b4d">
          Example
         </h6>
-        <pre id="29fe9e9f-85a4-4fb1-ac26-a2cc0fd82bf4"><code class="language-python">from bootwrap import Button
+        <pre id="edf97931-9869-4eb7-a460-1ef417bcdeb1"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").pt(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="00f2d7e4-e196-47c9-8df6-5bc38a0ab779">
-       <div class="d-flex justify-content-between" id="4fcb7ab8-b349-4f2d-8689-9a81727939e3">
-        <h4 id="558c37e7-a680-4fb8-8867-62baeae73ff0">
+      <div class="mt-5" id="68d56194-773a-42a3-964b-1f5f345a43bb">
+       <div class="d-flex justify-content-between" id="81f9f2fb-02b8-4c4a-8fed-7534fa0fb2aa">
+        <h4 id="b72ae2db-f2ce-48f2-89d3-28bfb7c6a82a">
          Method
-         <span class="text-primary" id="6cab75b7-437f-48aa-b2b6-8fd50bbcc900">
+         <span class="text-primary" id="a8d270ec-cf75-417f-87eb-5a705db9ff2d">
           px
          </span>
         </h4>
-        <div id="b824ad3b-f4e1-406e-a9b7-4374d09edf64">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#b8bbe4c8-3831-4553-83ef-88dec88da448" data-bs-toggle="collapse" id="caa2e2bf-f361-4cc9-963b-1a95087343bc" onclick="return false;" type="button">
+        <div id="0984de69-bba2-4048-95d6-89442a9b0265">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#b92b5e64-2de2-482f-a8b5-5a93e4c63419" data-bs-toggle="collapse" id="75d1f119-1ccd-443a-b855-48f4ba61a43b" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#d01ba119-4091-400f-9d05-61a63959c11f" data-bs-toggle="collapse" id="40e9c498-1b37-4a52-ab81-27185be0fc0a" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#fdbc221e-261e-403a-bac9-b4c66b90bc97" data-bs-toggle="collapse" id="11af82a4-52b6-4106-b6af-6812691b15f0" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="ffd879f5-3f89-4baf-bb9d-c5d3f4755b65">
+       <span class="text-muted" id="bed9af8e-32bf-4cf8-88e9-99705c20bdde">
         Sets padding for left and right sides to the specified size.
        </span>
-       <pre id="ae3f3aa5-2c97-45a6-8c29-927f18316c39"><code class="language-python">px(size)</code></pre>
-       <div class="ms-3 collapse" id="b8bbe4c8-3831-4553-83ef-88dec88da448">
-        <h6 id="ac42dcc4-8c47-4faf-82ae-2a2c71cb8440">
+       <pre id="747b2d37-0e49-4825-8078-d20baecac9ad"><code class="language-python">px(size)</code></pre>
+       <div class="ms-3 collapse" id="b92b5e64-2de2-482f-a8b5-5a93e4c63419">
+        <h6 id="c525dcae-a0c4-4f85-8100-8a394628819a">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="1939a92a-1522-4898-aa82-29c5993f2028">
+        <table class="table table-sm bg-light" id="bc4c3a82-32bd-4c84-9e08-b29f93a6354c">
          <thead>
           <tr>
            <th scope="col">
@@ -1693,11 +1693,11 @@ button = Button("Hello").pt(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="d01ba119-4091-400f-9d05-61a63959c11f">
-        <h6 id="2e1d49dc-f790-4592-ba25-f8b536d00ad5">
+       <div class="ms-3 collapse" id="fdbc221e-261e-403a-bac9-b4c66b90bc97">
+        <h6 id="221c4b2a-94d1-4922-beec-2af9f40ccf9b">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="f7ee85b3-1ec2-4aec-9ca1-d377ea2e42dd">
+        <table class="table table-sm bg-light" id="bcd37751-2550-463d-8fe6-b55145a2ee63">
          <thead>
           <tr>
            <th scope="col">
@@ -1730,43 +1730,43 @@ button = Button("Hello").pt(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="226d9c9d-ac6c-40c7-b82d-929c17c4217a">
-        <h6 id="effb9932-617c-4c72-9e69-d641e9d90cae">
+       <div class="ms-3" id="dfad4460-efbc-4116-9feb-abb1e7ee3378">
+        <h6 id="3ec8c09a-0e47-4a57-965c-163b46566e73">
          Example
         </h6>
-        <pre id="9a970660-19b6-4ae8-b48a-bc20b439e4c6"><code class="language-python">from bootwrap import Button
+        <pre id="1537276e-7c7d-42b8-823b-b1a7fcb352a6"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").px(3)
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="a03ca96c-2bc8-4bbf-965d-94c6e6df92a0">
-       <div class="d-flex justify-content-between" id="d4ee56e7-bc51-448f-9211-bd8b7d3f6731">
-        <h4 id="179ebf24-12ff-4bfd-a4b0-d1ac7977f7e3">
+      <div class="mt-5" id="9d81efaf-651d-4682-abf6-853447e71042">
+       <div class="d-flex justify-content-between" id="6c6b114e-c5a2-4e11-a24d-bc965c85b08f">
+        <h4 id="995b1991-6778-4d45-98d8-765cbc61421b">
          Method
-         <span class="text-primary" id="9356e213-4977-43b3-97e7-ad24a5750f4e">
+         <span class="text-primary" id="88905da8-f3cb-4afc-9bf4-194e325795e7">
           py
          </span>
         </h4>
-        <div id="acf82757-3d5c-40a7-8601-9fc01c43d09e">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#73b3c8e4-6afe-41db-a455-ef4f1818f83b" data-bs-toggle="collapse" id="f77d81b4-5a88-4932-89c9-a25d6e465fea" onclick="return false;" type="button">
+        <div id="63502f2b-cca5-4231-a8cb-ea9cff1cf530">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#85abfcb7-4b13-46b8-9978-2a01ebeea59c" data-bs-toggle="collapse" id="68dcaacd-f517-4275-8540-185ee13a22bd" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#be13b6e9-18c0-488c-89c8-42a212785e21" data-bs-toggle="collapse" id="e3b7fc32-51fb-4f19-97cb-2a4118630528" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#3679e737-ac3f-4d82-9c4e-2c9369b24316" data-bs-toggle="collapse" id="1efe2bca-f733-4d9b-b108-485cc5c8f8e1" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="320ef325-5a3a-4ec2-b1fb-625430ffbf51">
+       <span class="text-muted" id="b4d63a11-3995-4b70-a5b5-96f44a2395dc">
         Sets padding for top and bottom sides to the specified size.
        </span>
-       <pre id="27da0cf6-5626-4637-bb08-6390f521ead9"><code class="language-python">py(size)</code></pre>
-       <div class="ms-3 collapse" id="73b3c8e4-6afe-41db-a455-ef4f1818f83b">
-        <h6 id="9c6babe2-6cf7-47e9-a1d1-34a41856b37b">
+       <pre id="73618921-1dc3-4a5d-bb21-08d27ed7ae42"><code class="language-python">py(size)</code></pre>
+       <div class="ms-3 collapse" id="85abfcb7-4b13-46b8-9978-2a01ebeea59c">
+        <h6 id="72e93566-8333-4925-a5b6-4a31293c1972">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="be3d2f5a-33ef-47bc-a353-313d6cd728e2">
+        <table class="table table-sm bg-light" id="a8d5a444-c4cf-43ec-a9d6-55502e451e0f">
          <thead>
           <tr>
            <th scope="col">
@@ -1799,11 +1799,11 @@ button = Button("Hello").px(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="be13b6e9-18c0-488c-89c8-42a212785e21">
-        <h6 id="713dca7e-a9e1-4c9a-a29f-2de10e09f64b">
+       <div class="ms-3 collapse" id="3679e737-ac3f-4d82-9c4e-2c9369b24316">
+        <h6 id="bcb9702a-808f-49f3-b299-6f0949f02114">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="d0804c92-a3ab-4675-a19d-0939fcf7ba0a">
+        <table class="table table-sm bg-light" id="bf2fea93-1f62-4866-9bb1-10e853714e2f">
          <thead>
           <tr>
            <th scope="col">
@@ -1836,11 +1836,11 @@ button = Button("Hello").px(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="4b8647a5-04de-4263-9744-3e9397db0680">
-        <h6 id="dc1474e5-fc16-4204-b883-462afe96c993">
+       <div class="ms-3" id="66091fc4-59da-4c0c-8978-0c29b9858271">
+        <h6 id="ebc05083-4cfe-49f9-ad1a-19ed1c36ec6f">
          Example
         </h6>
-        <pre id="7bfd37e0-0af2-4dbe-86ab-9427d7154c5c"><code class="language-python">from bootwrap import Button
+        <pre id="4444a55b-f50b-42fd-b3bd-6a305cbaddb6"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ClassMixin.
 button = Button("Hello").py(3)
@@ -1849,48 +1849,48 @@ button = Button("Hello").py(3)
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="f967aecb-8b3a-4319-9a3d-afab0916b423">
-     <div class="mt-5" id="eedcf7ed-1371-4e76-9d0c-8a19c7320667">
-      <div class="d-flex justify-content-between" id="0de1b33d-22eb-4c9f-b252-c18adba486ff">
-       <h1 id="3e0b8b99-4059-4351-98fe-4f7bc6543e41">
+    <div class="tab-pane fade" id="48e426d8-3458-4d9a-989f-937dc889c5d6">
+     <div class="mt-5" id="74407f39-77b6-48e2-8052-baf57fb1b24f">
+      <div class="d-flex justify-content-between" id="b43a65f4-2546-4f68-898c-ad689c9e20c1">
+       <h1 id="44ddfcd1-9ec4-4472-9c40-e2dd46f006e8">
         Class
-        <span class="text-primary" id="6488177d-d64e-4c78-ab4c-e63dbb690ad5">
+        <span class="text-primary" id="c9a3f8ca-1162-49e1-8d51-d048381b3283">
          ActionMixin
         </span>
        </h1>
-       <div id="f5d11ff8-f759-4662-a57a-8bc05fcef028">
+       <div id="d3a3b93d-73e9-4a35-9768-277039ce1120">
        </div>
       </div>
-      <span class="text-muted" id="dc02a91c-ed30-462e-a548-e073de4be04c">
+      <span class="text-muted" id="89a8e746-6f3e-494f-b112-289ed30a3fe6">
        Mixin for a web component which able to perform an action.
       </span>
-      <pre id="7fa4b606-fe33-4768-9124-b0a9586efa15"><code class="language-python">ActionMixin()</code></pre>
-      <div class="mt-5" id="7d37ac1b-81c9-47a7-86b1-ffba70f34305">
-       <div class="d-flex justify-content-between" id="16eba716-e445-4272-a7d1-fb92d2c14985">
-        <h4 id="2bf51315-0d88-42a8-8c79-028f3d6a5456">
+      <pre id="e5d5f7fb-c047-4cef-bbdd-1e0f40d8bdf3"><code class="language-python">ActionMixin()</code></pre>
+      <div class="mt-5" id="17a4ac37-dd2b-48e7-8d2a-6d562dfa489d">
+       <div class="d-flex justify-content-between" id="9cfdcc7c-f814-48f4-a29f-096fdfc78b9d">
+        <h4 id="1a5219cc-5399-41e8-8f25-93b283f59eb2">
          Method
-         <span class="text-primary" id="6f74bb60-05eb-4e0e-9e81-64e61ff3ee43">
+         <span class="text-primary" id="c4187334-6046-4a7f-9166-a012107ec34e">
           add_menu
          </span>
         </h4>
-        <div id="daf5745d-68ef-43d4-9c5c-e2678fc97cbb">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f0bf8fde-682b-48de-9300-cb7faeb80f8a" data-bs-toggle="collapse" id="ebe459ae-bb81-4617-b4e6-8275e7c3ac8f" onclick="return false;" type="button">
+        <div id="a0c4c9c4-3af9-4e24-8f21-e7257960b64d">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#886c6cae-0995-4c86-83d9-9b6a542eb958" data-bs-toggle="collapse" id="81dfc4be-154f-46bd-aeef-137973e7ae48" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#f6b322cc-6e8d-48ad-a146-b88f5c339eb7" data-bs-toggle="collapse" id="ab8c886f-396d-4530-b1d8-4a709422ab0b" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#067fdc96-fbe2-4ce2-9f38-74b3387b515a" data-bs-toggle="collapse" id="cf9a9a32-f658-4a8c-bbd6-07368340059b" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="42fa6b26-a402-4ce3-898d-a4590d1af44e">
+       <span class="text-muted" id="c8646376-c579-434c-bcd7-0b2b771dcfd4">
         Adds dropdown menu.
        </span>
-       <pre id="f5c4ba8c-005c-49b2-a91b-8f73bfb3e914"><code class="language-python">add_menu(*menu)</code></pre>
-       <div class="ms-3 collapse" id="f0bf8fde-682b-48de-9300-cb7faeb80f8a">
-        <h6 id="3a678f9c-dbc5-43fd-809c-529ac78cfe69">
+       <pre id="bf5fae97-2f22-4f27-a909-aaa83eec2333"><code class="language-python">add_menu(*menu)</code></pre>
+       <div class="ms-3 collapse" id="886c6cae-0995-4c86-83d9-9b6a542eb958">
+        <h6 id="46ce84d7-f175-468a-b070-3e2936e18dd1">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="828f1189-a2d9-4455-9058-b0dde62499b9">
+        <table class="table table-sm bg-light" id="7c9e656d-f432-41b4-85a7-3221719acabe">
          <thead>
           <tr>
            <th scope="col">
@@ -1932,11 +1932,11 @@ button = Button("Hello").py(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="f6b322cc-6e8d-48ad-a146-b88f5c339eb7">
-        <h6 id="d3ae7bea-efcd-49e0-b0c9-593f86996405">
+       <div class="ms-3 collapse" id="067fdc96-fbe2-4ce2-9f38-74b3387b515a">
+        <h6 id="5fb50afa-5658-4f9c-a699-fde6101122bb">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="5338af47-886e-46cc-b6e5-304622221b86">
+        <table class="table table-sm bg-light" id="7fc1572c-ab4c-444d-bc77-e16eefa2ab7a">
          <thead>
           <tr>
            <th scope="col">
@@ -1969,11 +1969,11 @@ button = Button("Hello").py(3)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="fc3bf091-9b26-49ef-975f-1bb63f8712ba">
-        <h6 id="7aa39a18-58f7-4b24-965c-95a93a22f1fa">
+       <div class="ms-3" id="bd5cf8b2-19dd-4aeb-bb60-3033b3d69adb">
+        <h6 id="6baf137d-9941-4ae4-b946-fe049c0af7e7">
          Example
         </h6>
-        <pre id="a9772424-e9b1-4201-a693-cf42dba74897"><code class="language-python">from bootwrap import Button
+        <pre id="706f77df-30f5-4b16-9f30-5a10145f67f3"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits ActionMixin.
 button = Button('Portfolio').add_menu(
@@ -1984,29 +1984,29 @@ button = Button('Portfolio').add_menu(
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="a932d2e8-53fe-4589-8c7c-cc68af53c651">
-       <div class="d-flex justify-content-between" id="7701ac43-b5b0-4be7-a747-63ce0307546d">
-        <h4 id="a0b5a282-1b42-4171-8246-70a5c96858b9">
+      <div class="mt-5" id="a22c4ebb-d730-4b5b-8879-fb110cb2eb32">
+       <div class="d-flex justify-content-between" id="2a892940-737c-452e-91ef-7d799421e511">
+        <h4 id="08398550-298b-4b7e-ad06-4f6221df2b9f">
          Method
-         <span class="text-primary" id="b28060d4-7e95-490d-bbfd-b09ee5b991fd">
+         <span class="text-primary" id="f95c6de0-68e9-4288-8485-cf590fd39220">
           dismiss
          </span>
         </h4>
-        <div id="bb23c29f-36fd-4145-adf7-1f573498307e">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#83256ff5-5e43-48ee-911d-3b670bec4680" data-bs-toggle="collapse" id="62e9d82b-5ecf-4228-aef6-4ca74d012da1" onclick="return false;" type="button">
+        <div id="93b6a916-453f-4694-bda4-1ac1980f4a13">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#ad93fa42-b78e-4f0c-9895-27a1d00bab08" data-bs-toggle="collapse" id="e0bb896c-134e-464b-b101-52226b088a68" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="ec107a12-3dc6-49c5-919d-4fe96cdc0270">
+       <span class="text-muted" id="416f9b61-485f-4fb8-a808-5fcae6be050d">
         Performes a dismiss action.
        </span>
-       <pre id="dff12bcb-cc3c-49e9-9730-19713da9be1b"><code class="language-python">dismiss()</code></pre>
-       <div class="ms-3 collapse" id="83256ff5-5e43-48ee-911d-3b670bec4680">
-        <h6 id="ca612dc9-4370-4a7d-8fd6-5a62809724f1">
+       <pre id="661ae757-4f73-40b3-a9fc-c5c4f7773442"><code class="language-python">dismiss()</code></pre>
+       <div class="ms-3 collapse" id="ad93fa42-b78e-4f0c-9895-27a1d00bab08">
+        <h6 id="e36c6a6b-3725-4027-94b9-d2baafce521c">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="3a37bf35-a009-4da3-8839-17d7476a4b7a">
+        <table class="table table-sm bg-light" id="7dcb983c-46a9-4691-944c-0f340826b174">
          <thead>
           <tr>
            <th scope="col">
@@ -2039,11 +2039,11 @@ button = Button('Portfolio').add_menu(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="15989466-ac67-47d0-aa5a-703e4739c8e2">
-        <h6 id="8726e11a-b0ae-489f-adaf-9d2dd0280b1d">
+       <div class="ms-3" id="d5be10a4-98b0-4f3e-b8aa-781b94f5abf9">
+        <h6 id="2a8edc2e-b5c5-4cf9-8a67-633a011d3a94">
          Example
         </h6>
-        <pre id="88e14123-961c-4c44-9b40-26f46f008a5f"><code class="language-python">from bootwrap import Dialog, Button
+        <pre id="42303dbc-ab57-47dd-b11b-b89e447c10f0"><code class="language-python">from bootwrap import Dialog, Button
 
 # Note, that Button inherits ActionMixin.
 dialog = Dialog(
@@ -2053,32 +2053,32 @@ dialog = Dialog(
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="f060c08d-3778-4da9-adda-0d2811ff3886">
-       <div class="d-flex justify-content-between" id="34c2202c-598b-4528-a973-d4893e36e344">
-        <h4 id="c8df64a3-2eec-41e0-bb48-9e40763142fd">
+      <div class="mt-5" id="6fb086c0-6866-4cdb-a8bb-5d2d6ab49a78">
+       <div class="d-flex justify-content-between" id="9cb9d63d-f18d-4aa1-b9c0-5fa50010b2ea">
+        <h4 id="95b88a37-4a1a-4db3-9656-2502ebd4f278">
          Method
-         <span class="text-primary" id="4df658ec-85e0-4f83-b20a-52c6c6026676">
+         <span class="text-primary" id="faed22f5-1d55-42de-b306-e57344e038ef">
           link
          </span>
         </h4>
-        <div id="e13a90d4-a724-49bd-bd69-b8e9f00b4b80">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#edd881a9-b28b-4417-9808-035c4f6b150f" data-bs-toggle="collapse" id="f1484cd8-ef6b-404b-9b2c-ad6504365a8a" onclick="return false;" type="button">
+        <div id="ae5c9e36-5094-4fa9-b40c-e038d80171ae">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#128f6ca5-1732-4ee9-a22a-d7856bdbb367" data-bs-toggle="collapse" id="7e577955-5e9d-4b60-afe3-8017ddf8321e" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#d6596f8c-3b2e-474b-8bb9-c5abd8ed9187" data-bs-toggle="collapse" id="102df432-c0cc-4579-b386-8826584cc771" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#38fa7669-aafa-4160-a3dd-117e18e39e74" data-bs-toggle="collapse" id="51db5895-dbec-4e63-9930-92be7204d938" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="105b3885-6cc0-48fe-8478-a5d8b1eeac2a">
+       <span class="text-muted" id="8e2d0c29-3650-4a99-8103-1cc62bfcd06c">
         Links to the web-resource.
        </span>
-       <pre id="959ac0ab-3808-42ee-8831-ecf230fe34dc"><code class="language-python">link(target)</code></pre>
-       <div class="ms-3 collapse" id="edd881a9-b28b-4417-9808-035c4f6b150f">
-        <h6 id="8e3d39c0-e170-40ef-8db8-f373a769beb2">
+       <pre id="a8541a82-5487-48ed-8b23-d9eefda2ab16"><code class="language-python">link(target)</code></pre>
+       <div class="ms-3 collapse" id="128f6ca5-1732-4ee9-a22a-d7856bdbb367">
+        <h6 id="ec78a292-93b0-4913-8606-73d28e02ba68">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="e3b6d68e-a130-4edf-8515-2255d50d24f4">
+        <table class="table table-sm bg-light" id="4cc35d26-79ca-4397-b39e-066b9a2c2bb2">
          <thead>
           <tr>
            <th scope="col">
@@ -2116,11 +2116,11 @@ dialog = Dialog(
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="d6596f8c-3b2e-474b-8bb9-c5abd8ed9187">
-        <h6 id="a8a32895-f015-4bbb-9f88-391fc0256dad">
+       <div class="ms-3 collapse" id="38fa7669-aafa-4160-a3dd-117e18e39e74">
+        <h6 id="5077e9a5-87e1-4d01-9b02-dd816c980b3d">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="dccb9e80-af4b-4db5-97ad-f721e0d5c5d6">
+        <table class="table table-sm bg-light" id="a2f2702c-6f0c-4cda-8cd6-88d695c60399">
          <thead>
           <tr>
            <th scope="col">
@@ -2153,40 +2153,40 @@ dialog = Dialog(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="ba0b7861-d543-4aac-872f-5f2eebb25fa0">
-        <h6 id="efada32a-c7ea-486d-8992-e2bc47f7ded1">
+       <div class="ms-3" id="d3939613-bdc8-417f-8767-aa2783023e7f">
+        <h6 id="72224b59-be21-4ca2-a79a-40b83bf231ed">
          Example
         </h6>
-        <pre id="a07e5a1e-ee1d-460b-94c0-cadb3d3d05e2"><code class="language-python">from bootwrap import Button
+        <pre id="f78f1f7d-507e-4423-a3a9-645661d74d38"><code class="language-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="7a0d09e2-4862-4da0-8983-862f343ebd5a">
-       <div class="d-flex justify-content-between" id="e8a754ed-d781-44ec-8a74-ed9683c7351e">
-        <h4 id="873ec0a2-ea2e-439b-870b-e79ae4ec582e">
+      <div class="mt-5" id="a22bef89-b718-40d4-843b-b593cbac51e9">
+       <div class="d-flex justify-content-between" id="18f38d95-5e7b-4091-99e7-7a51e1250fd9">
+        <h4 id="4a29062a-cbc7-4d77-8eb5-a2768da3750e">
          Method
-         <span class="text-primary" id="3f2782cd-05d5-46e1-9e76-3df57647e962">
+         <span class="text-primary" id="b0952997-f27b-4f65-b198-109d12196e62">
           submit
          </span>
         </h4>
-        <div id="a280f320-05a3-4cd8-92c0-8224615644f8">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#fb7d74a1-5de9-4b97-ad68-1154d4b5bb0c" data-bs-toggle="collapse" id="3d747ca3-2fed-40ec-8593-293e0d479e7e" onclick="return false;" type="button">
+        <div id="a750b938-bcc8-41ff-90d7-333d34ae1ffc">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#55e2b592-deeb-4ff7-abf4-b83aa47ad8d9" data-bs-toggle="collapse" id="2a7fc8ed-09f0-4998-8f34-715dd7473b56" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="9e2047d3-1f6b-415a-98ce-2fd6c07d9bb2">
+       <span class="text-muted" id="546a2dd9-a3c6-48aa-bece-6a00b58566bd">
         Performes a submit action.
        </span>
-       <pre id="41b92ca8-9549-4c9b-9116-aff2a2cf4a9d"><code class="language-python">submit()</code></pre>
-       <div class="ms-3 collapse" id="fb7d74a1-5de9-4b97-ad68-1154d4b5bb0c">
-        <h6 id="e6e966c2-aa5c-474a-b4c3-01672677337e">
+       <pre id="9a8bdbe0-6376-4420-bb0f-92c5306f2bcd"><code class="language-python">submit()</code></pre>
+       <div class="ms-3 collapse" id="55e2b592-deeb-4ff7-abf4-b83aa47ad8d9">
+        <h6 id="24c75cab-bc74-41f8-a584-9a58763ca675">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="3492a991-1ed2-4067-9531-a6f3f05cc596">
+        <table class="table table-sm bg-light" id="d9fc8be6-fde6-43a9-b92c-325779c7be2b">
          <thead>
           <tr>
            <th scope="col">
@@ -2219,11 +2219,11 @@ button = Button("Search").link("https://www.google.com")
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="80d7617f-ea4e-4614-bad8-76c786642682">
-        <h6 id="0aea6f3e-5cbc-44a3-abdf-10ca332b2f37">
+       <div class="ms-3" id="9a77e3bc-ca1d-4cb0-b3a6-967fc463336e">
+        <h6 id="21073f9c-29e9-44e1-8f3a-495e5f0f3777">
          Example
         </h6>
-        <pre id="e5842d61-e4a1-4f9f-b066-18480137c907"><code class="language-python">from bootwrap import Form, Button
+        <pre id="20016ba7-7ed7-4627-9ac6-a26fe7a295be"><code class="language-python">from bootwrap import Form, Button
 
 # Note, that Button inherits ActionMixin.
 form = Form(
@@ -2233,32 +2233,32 @@ form = Form(
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="d1d69d4e-0dd8-4a3d-a566-f19ae5c7f1bd">
-       <div class="d-flex justify-content-between" id="334edcc0-0c43-4249-9783-e6166c6af1f4">
-        <h4 id="b4f365af-e162-4f1d-8947-e35bd3653343">
+      <div class="mt-5" id="6c6c38df-11ce-45c2-9b15-db6759883942">
+       <div class="d-flex justify-content-between" id="6bcc47f2-6cb7-492c-b6ad-21caa2c6a754">
+        <h4 id="aa0814ef-c4e8-4c6f-96b8-36f94000e563">
          Method
-         <span class="text-primary" id="a9cddc6e-ff51-432d-9cbd-64392a367754">
+         <span class="text-primary" id="2f976577-599a-429a-ba7c-a3cbbda3fb61">
           toggle
          </span>
         </h4>
-        <div id="01c98617-3bbb-47d7-b299-873e95f37885">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#c00ddb9e-625d-43a2-9cce-0a3c60bfdee1" data-bs-toggle="collapse" id="87715dda-b15f-4e0a-84b2-31da8158ed7c" onclick="return false;" type="button">
+        <div id="8a85844a-0b2c-4f77-a5ac-7946877d17d8">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#3b96273f-1da5-4e81-a87f-80b360243c25" data-bs-toggle="collapse" id="7db83c4a-af9e-4ac3-bbc8-7dc469d23945" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#abd213d0-b3d5-42a1-b881-67c7077d539a" data-bs-toggle="collapse" id="76d41d71-98f9-41c3-af0a-8436ccf17bb0" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#28b2519e-4e16-41df-8dd7-7eb275679282" data-bs-toggle="collapse" id="cec2e36c-38fc-4daa-8462-f17c5ae9e26e" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="36090e6a-a79c-4923-a0e5-9975ccb2a6a6">
+       <span class="text-muted" id="eaf704e4-a1db-41e9-bc55-cbae1ab45623">
         Toggles an other web component.
        </span>
-       <pre id="d6cc2f7f-c233-4d70-a271-348537130b35"><code class="language-python">toggle(target)</code></pre>
-       <div class="ms-3 collapse" id="c00ddb9e-625d-43a2-9cce-0a3c60bfdee1">
-        <h6 id="9f3761a1-3657-477f-a837-7c0d8249c9b6">
+       <pre id="6909b95e-647a-45eb-ac06-1ea616f5bb77"><code class="language-python">toggle(target)</code></pre>
+       <div class="ms-3 collapse" id="3b96273f-1da5-4e81-a87f-80b360243c25">
+        <h6 id="bf43bf7c-ce6e-4944-8327-00d5f1b42126">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="1019aca6-fa32-485f-8419-23895208ffda">
+        <table class="table table-sm bg-light" id="194f6805-b105-4a15-8e54-e84cf4d9cd2a">
          <thead>
           <tr>
            <th scope="col">
@@ -2291,11 +2291,11 @@ form = Form(
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="abd213d0-b3d5-42a1-b881-67c7077d539a">
-        <h6 id="587fdcb7-a8ec-47b6-9837-95091c2b8e51">
+       <div class="ms-3 collapse" id="28b2519e-4e16-41df-8dd7-7eb275679282">
+        <h6 id="ef26bb40-b601-4d74-844e-5f2060467a00">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="97045646-4935-4c20-8d68-99ceddb7134c">
+        <table class="table table-sm bg-light" id="c594617c-117c-4c13-90d4-6b611be9c5f9">
          <thead>
           <tr>
            <th scope="col">
@@ -2328,11 +2328,11 @@ form = Form(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="0b207a6c-edd4-42b5-bfbc-cbbd3c9f505d">
-        <h6 id="e2b98f25-aaa3-462c-aaea-b0478e872585">
+       <div class="ms-3" id="002b97c9-f88b-4f2a-bb7e-7b58d63d2d78">
+        <h6 id="991bed74-8910-4c85-a454-fb48e4a6645b">
          Example
         </h6>
-        <pre id="64cde1e0-6aac-473a-8031-744e2564a4b5"><code class="language-python">from bootwrap import Button, Dialog
+        <pre id="bdb13dd6-17fd-4716-b243-ae573dadabcb"><code class="language-python">from bootwrap import Button, Dialog
 
 # Note, that Button inherits ActionMixin.
 dialog = Dialog(...)
@@ -2342,46 +2342,46 @@ button = Button("Open").toggle(dialog)
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="60f2fb13-956e-4b6a-ab90-d099579cdb7e">
-     <div class="mt-5" id="4991a894-20d8-4bad-900f-85f0872392de">
-      <div class="d-flex justify-content-between" id="28955c8c-48d7-46b1-925c-5115d10d6b55">
-       <h1 id="8555e5f1-fef8-4d2d-a806-b155167eecea">
+    <div class="tab-pane fade" id="b04dacfd-a3e4-48d5-80f8-b0cc34a4d160">
+     <div class="mt-5" id="c110c180-0200-4d9e-b5ee-25ec03bb325f">
+      <div class="d-flex justify-content-between" id="3aab9641-0fc6-45cf-8ce0-8714f959b309">
+       <h1 id="e9a534bc-5025-4e29-84a7-a99174c22d66">
         Class
-        <span class="text-primary" id="26088689-4588-4ca0-ba1d-bb1b40e9fc2e">
+        <span class="text-primary" id="2ce26887-8c89-471d-9cb3-0a31c002e93e">
          AppearanceMixin
         </span>
        </h1>
-       <div id="34e7917e-6bf7-43d0-ab80-539bdbe29f69">
+       <div id="556a696b-341b-40ef-84e5-4cedb7b8d8c6">
        </div>
       </div>
-      <span class="text-muted" id="e3f9a8ad-eefa-47e7-8495-f5c7f0082f84">
+      <span class="text-muted" id="ed2b2200-3c48-4bae-a8b0-360b1265b75f">
        Mixin for a web component which appearance can be associated
     with predefined categories.
       </span>
-      <pre id="6f720351-8d2d-4456-88e7-2b08b6cd8bca"><code class="language-python">AppearanceMixin()</code></pre>
-      <div class="mt-5" id="3421d570-d5ef-42fa-a1e8-62250e9105ec">
-       <div class="d-flex justify-content-between" id="17d09233-5a5f-4827-a688-c6398e0d820e">
-        <h4 id="d77265ec-00a4-498b-a125-a51ec867e869">
+      <pre id="1f1048d7-2bfb-4466-ba70-a68656c06515"><code class="language-python">AppearanceMixin()</code></pre>
+      <div class="mt-5" id="294df27e-d864-4663-baf3-d4b6616ae77d">
+       <div class="d-flex justify-content-between" id="b1db1e3d-5ed6-44a2-8260-413ba222e06a">
+        <h4 id="f50b6fcd-f4cb-47e0-bf6d-095b45938b07">
          Method
-         <span class="text-primary" id="b5300e44-ab85-43b0-b1ae-a1c4be94126a">
+         <span class="text-primary" id="2f61cad4-69c2-4e54-9f8f-e1fb8d433dc0">
           as_danger
          </span>
         </h4>
-        <div id="88251b6f-b892-474b-bc95-3d5496c3e76d">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#dd072279-2186-40e5-a531-adee3fa97297" data-bs-toggle="collapse" id="448a39de-64b8-4865-ab64-6700332bdd02" onclick="return false;" type="button">
+        <div id="f37a8404-1207-4df8-89c9-a6a23e2751dd">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#fa1a5b6d-c625-49a6-b962-2c894af175de" data-bs-toggle="collapse" id="ae0453e3-ce21-4f31-83e5-86184160d516" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="318f8dd2-cbbe-444b-9814-4fcdff2c86ac">
+       <span class="text-muted" id="7c10ad4b-a1f7-433a-ac40-bdcb666023ce">
         Makes the 'danger' look to a web components.
        </span>
-       <pre id="454d1796-0249-4e34-8b80-8d5befb2105e"><code class="language-python">as_danger()</code></pre>
-       <div class="ms-3 collapse" id="dd072279-2186-40e5-a531-adee3fa97297">
-        <h6 id="19480af2-36d8-4ca4-b6b5-c14d2c5487dc">
+       <pre id="b664fad0-fab9-43ff-a10e-1295aff818dc"><code class="language-python">as_danger()</code></pre>
+       <div class="ms-3 collapse" id="fa1a5b6d-c625-49a6-b962-2c894af175de">
+        <h6 id="685b66b1-8a9e-4b80-957a-2178b02a16cc">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="ea21b6f0-57ab-418e-b69e-e5844be2e1e2">
+        <table class="table table-sm bg-light" id="d4ab6d7b-15c6-4465-99a7-41c2862ad5fb">
          <thead>
           <tr>
            <th scope="col">
@@ -2414,40 +2414,40 @@ button = Button("Open").toggle(dialog)
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="d5e0947f-7bdd-42e3-af35-682022704e6a">
-        <h6 id="9e011ceb-1c0a-4b0d-ba2f-394ec3b8e7bb">
+       <div class="ms-3" id="cce13b3b-fbc3-40de-ba7e-15a50ae768f8">
+        <h6 id="50a818a3-9e75-4b6f-92b8-f348d8cd1e96">
          Example
         </h6>
-        <pre id="b1ab71be-a3d6-430d-a3f4-cfba154ba573"><code class="language-python">from bootwrap import Button
+        <pre id="1ec8227a-c078-48b5-b841-35860fbeb18a"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Danger").as_danger()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="a185cbd1-693f-4ef0-b670-32d5662fa524">
-       <div class="d-flex justify-content-between" id="c7a356d3-c8bb-4d2c-9d10-8b9cdbd77d58">
-        <h4 id="1f128879-7f92-4f9e-869a-2ef2fb420c98">
+      <div class="mt-5" id="c49cadf3-2915-47f0-a2a8-af6850a9f3c3">
+       <div class="d-flex justify-content-between" id="a2faac54-8811-49b5-98a6-8ca59b182400">
+        <h4 id="2b889df2-fb68-4081-87bc-34fd8f0b9284">
          Method
-         <span class="text-primary" id="f611ea50-ccad-4cb6-96df-369f62d98fcb">
+         <span class="text-primary" id="69e2906d-cf70-4970-9f3a-8d291eeb6cb1">
           as_dark
          </span>
         </h4>
-        <div id="23cb48f1-f6d5-4bfb-a121-16450ae42845">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#52940801-988f-43db-b7ea-ee7d2ae7be34" data-bs-toggle="collapse" id="dd058ae2-144f-4965-b69e-36171103a7f0" onclick="return false;" type="button">
+        <div id="143bdd3a-0ab9-4a6f-84b5-72a352fce19c">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#2c2835fa-b4df-4db9-a6f7-b1aed9ab88e9" data-bs-toggle="collapse" id="81a8be9e-b9e4-4e18-bf8f-c94c0f2d28ee" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="c83daf09-ffcc-4d4c-8de5-ebd7c3aed00e">
+       <span class="text-muted" id="f659e47c-ea19-4474-adfb-9bff7a1dc4b4">
         Makes the 'dark' look to a web components.
        </span>
-       <pre id="f7be4fa7-adf0-4682-80bf-9527014e86f4"><code class="language-python">as_dark()</code></pre>
-       <div class="ms-3 collapse" id="52940801-988f-43db-b7ea-ee7d2ae7be34">
-        <h6 id="beb427fa-7762-489b-bd28-7f712ba71582">
+       <pre id="77d3e680-62db-4a05-9fc0-aedf61a5d771"><code class="language-python">as_dark()</code></pre>
+       <div class="ms-3 collapse" id="2c2835fa-b4df-4db9-a6f7-b1aed9ab88e9">
+        <h6 id="68297763-9742-43b4-897d-1d66f6a31484">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="19ffae98-15b8-42f1-93bd-55f53435a7ab">
+        <table class="table table-sm bg-light" id="74cd118f-d7b2-422f-9f3b-c83ff3b1c156">
          <thead>
           <tr>
            <th scope="col">
@@ -2480,40 +2480,40 @@ button = ("Danger").as_danger()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="d8a7e6c9-6288-447e-8511-1b148e1eff1c">
-        <h6 id="a71fb55e-2327-421a-bc56-f920a577ec89">
+       <div class="ms-3" id="83feb43c-74e0-4de4-ae49-4d9d97be4527">
+        <h6 id="84a9bac2-e70c-45c0-b504-efd6ca160338">
          Example
         </h6>
-        <pre id="2dcd0a68-58fc-4333-8416-bafdace8aecf"><code class="language-python">from bootwrap import Button
+        <pre id="9eeaf347-33e4-4409-b8f2-afa6f5f9040d"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Dark").as_dark()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="27e2b611-265e-4469-8d44-77b278967f5a">
-       <div class="d-flex justify-content-between" id="a993bba6-fe4c-4df9-8695-026ba6ac07fd">
-        <h4 id="b5812899-1b07-47ed-9b55-3990639514df">
+      <div class="mt-5" id="f5eaeaa5-797c-4038-8a5c-76f331a3fde9">
+       <div class="d-flex justify-content-between" id="67a4aa93-1c4d-4ef9-8fe9-5247f9c01d51">
+        <h4 id="f092dee7-9c07-47d2-b914-a8af4d05b678">
          Method
-         <span class="text-primary" id="44c2e808-7bd6-46a9-b7e1-ed5036dd640b">
+         <span class="text-primary" id="9cb43eb8-8c07-4ecd-89c2-c4b3397632a9">
           as_info
          </span>
         </h4>
-        <div id="0edcb6f9-7248-40f4-af93-c709f97e4e03">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#3760e140-c6a9-4591-af2b-4e7927b58ec3" data-bs-toggle="collapse" id="4b87df94-e824-457c-9eb3-0d3bb845daef" onclick="return false;" type="button">
+        <div id="774a4727-9086-4c41-b3aa-c19324db10f3">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#35276de5-c4b9-4bc0-9464-541d6b6cf7a9" data-bs-toggle="collapse" id="24922137-f660-419e-9c8b-757971676615" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="b83537a3-596e-4fb5-9d21-249e87837404">
+       <span class="text-muted" id="2c270b83-e5a8-4d22-ac47-6ed2005b3a1f">
         Makes the 'info' look to a web components.
        </span>
-       <pre id="bbd6b50c-2f76-4a16-a53a-30fd8dd57758"><code class="language-python">as_info()</code></pre>
-       <div class="ms-3 collapse" id="3760e140-c6a9-4591-af2b-4e7927b58ec3">
-        <h6 id="d47aee5f-292c-460a-beba-a8bcf29d2ea4">
+       <pre id="44b4c10a-0852-49c9-b004-ed45c7cebf5b"><code class="language-python">as_info()</code></pre>
+       <div class="ms-3 collapse" id="35276de5-c4b9-4bc0-9464-541d6b6cf7a9">
+        <h6 id="0ee16bf6-1d6e-4b41-915e-01912fa71904">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="efa7d118-dbb4-4442-8fb4-824aae42258c">
+        <table class="table table-sm bg-light" id="3ff4763a-4ff7-4546-8d99-56667526c955">
          <thead>
           <tr>
            <th scope="col">
@@ -2546,40 +2546,40 @@ button = ("Dark").as_dark()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="610300fb-6d78-4c7b-b595-9603454b7c56">
-        <h6 id="a7fe6ac3-5836-429b-b505-55db4be0da9e">
+       <div class="ms-3" id="b520150b-7c6b-4449-a5b7-9016b0b9f1cb">
+        <h6 id="5f526092-b655-41ae-a534-b50e067b3474">
          Example
         </h6>
-        <pre id="0faef214-37b9-4e32-95b7-2df2507fce1f"><code class="language-python">from bootwrap import Button
+        <pre id="fb2f9ff6-100a-4d02-bd42-0adb7d2a8d54"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Info").as_info()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="4c7e123c-19b0-4132-b61d-d6af5c438cb2">
-       <div class="d-flex justify-content-between" id="56f81b27-87c0-4612-9ff8-6ecf6483f7a6">
-        <h4 id="0a126512-23c4-45b7-bf09-c2f4c6d6d998">
+      <div class="mt-5" id="8ee8c15f-433f-4b5b-9c70-d3d6a3f7c33a">
+       <div class="d-flex justify-content-between" id="5c183afc-b7cf-4378-8e15-856c14afb211">
+        <h4 id="40f80461-b274-4d62-a2fe-9dd15862502f">
          Method
-         <span class="text-primary" id="4ef1a16a-9267-4411-a676-1119c1196b6b">
+         <span class="text-primary" id="16db6514-fb12-4af4-9174-21cb738a7087">
           as_light
          </span>
         </h4>
-        <div id="66317914-72d1-4bee-b56d-9648a53def98">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#0ca440f9-3c97-4f41-ad57-05394fc086fd" data-bs-toggle="collapse" id="c24fd69f-7652-4f18-84fc-06fbd6a7cc27" onclick="return false;" type="button">
+        <div id="0d598385-32f0-4ab4-bf5f-ab0d9ac42f3c">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#78c1f3d8-9061-4265-9f80-73c6c140aed9" data-bs-toggle="collapse" id="d3a2d60f-00d1-4c48-8e44-f791e96f1bd5" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="a08a2e02-b983-4b6a-b4bb-3b4a47677dbc">
+       <span class="text-muted" id="daf17502-e96d-40dd-9977-070bdad93b7e">
         Makes the 'light' look to a web components.
        </span>
-       <pre id="af58366b-aad8-4b36-a1f2-d0e8953fdf15"><code class="language-python">as_light()</code></pre>
-       <div class="ms-3 collapse" id="0ca440f9-3c97-4f41-ad57-05394fc086fd">
-        <h6 id="30c01461-c24c-41c6-8f8f-15444e57135a">
+       <pre id="5af8f13b-57f3-4976-bfe4-5bac25217bf3"><code class="language-python">as_light()</code></pre>
+       <div class="ms-3 collapse" id="78c1f3d8-9061-4265-9f80-73c6c140aed9">
+        <h6 id="8884bdb9-40ce-4bd5-8f0a-1017a28ca5a9">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="b88971f4-296e-494e-8a5f-c9139dd26ece">
+        <table class="table table-sm bg-light" id="a73ddc12-a0ba-4da3-bf96-04aa75857fc9">
          <thead>
           <tr>
            <th scope="col">
@@ -2612,40 +2612,40 @@ button = ("Info").as_info()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="d1036207-46f9-4585-971b-e1ce4a42214a">
-        <h6 id="bd27fd87-652d-4aa3-b2cb-b6501fd995cd">
+       <div class="ms-3" id="2ec73fa3-e344-4271-8021-46e343cd3758">
+        <h6 id="b913a2c7-5259-459e-93c5-66ec166eaadf">
          Example
         </h6>
-        <pre id="3b33d431-5be1-485e-a0a1-01c56dfee04d"><code class="language-python">from bootwrap import Button
+        <pre id="ddc9181b-3e90-4b3c-90bf-c0d1b64709ab"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Light").as_light()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="ebd8b4f6-e40b-4455-8bf0-35c170790d66">
-       <div class="d-flex justify-content-between" id="9530f985-9e7f-4771-bc33-2b46df2c8f43">
-        <h4 id="c0c0b32a-8041-46b1-9e11-8edf7dd3f427">
+      <div class="mt-5" id="2562c186-e0c1-453b-9688-94b8175acf10">
+       <div class="d-flex justify-content-between" id="2f644856-0071-47e4-8c2f-6079667609b9">
+        <h4 id="d1f44fd3-20ad-43d7-88b8-86ba1a82ded7">
          Method
-         <span class="text-primary" id="7320439e-bc5f-4a74-933e-982e1e59eebb">
+         <span class="text-primary" id="7c868cca-aabb-452f-b328-674296278eb9">
           as_primary
          </span>
         </h4>
-        <div id="c6ff93be-9ee2-409a-b90d-39e57e2ff375">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#1a1f5359-5b69-4647-a61c-734f5240c4e7" data-bs-toggle="collapse" id="d7ea2dc4-45c0-45be-b1d0-4ef7f647a2aa" onclick="return false;" type="button">
+        <div id="abb6c997-5474-4fc0-89a9-0e25d0823a50">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#fe87c91e-ffa5-4bca-974d-3eba7b7ae1e8" data-bs-toggle="collapse" id="4ca097ec-c5b2-49c7-8cc0-2ac7d0e570fc" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="095839a3-71da-4173-bbf6-bc88736f1951">
+       <span class="text-muted" id="340ef0d6-9862-4b58-9edc-915041f64374">
         Makes the 'primary' look to a web components.
        </span>
-       <pre id="eb6a348f-2b90-4c8f-8ecc-55cd548ac3b1"><code class="language-python">as_primary()</code></pre>
-       <div class="ms-3 collapse" id="1a1f5359-5b69-4647-a61c-734f5240c4e7">
-        <h6 id="b07144c1-1e25-443a-94e6-5a3342d0bca5">
+       <pre id="16b02291-6c34-4d13-9fd1-f8d0a6d86bdc"><code class="language-python">as_primary()</code></pre>
+       <div class="ms-3 collapse" id="fe87c91e-ffa5-4bca-974d-3eba7b7ae1e8">
+        <h6 id="f5e84d2e-55e5-4639-a44d-cbe884e51259">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="5cb1d4d6-7508-4858-9174-84d26a26497d">
+        <table class="table table-sm bg-light" id="5db88bd0-1e9f-4138-bb30-6a0d9a338294">
          <thead>
           <tr>
            <th scope="col">
@@ -2678,40 +2678,40 @@ button = ("Light").as_light()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="a938029c-b454-4f01-9e92-1a9bb3f80925">
-        <h6 id="9541ff9e-3ac2-4818-aa31-8ab9ab698eeb">
+       <div class="ms-3" id="f15d4139-516d-4429-9339-8e16e7732299">
+        <h6 id="8b38d1f5-646b-4a3d-9756-3db4dd8b4210">
          Example
         </h6>
-        <pre id="cf24005f-092e-4d8d-961e-2e43c5bd788f"><code class="language-python">from bootwrap import Button
+        <pre id="d5c42303-840b-4d32-9074-70d1d76a5359"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Primary").as_primary()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="88c347b9-db6c-4dd9-ba6f-035546fde8b0">
-       <div class="d-flex justify-content-between" id="69dd5ec6-7a52-4c27-be0d-cf387334fef0">
-        <h4 id="2a5237b7-9263-4d96-8270-e98444022c24">
+      <div class="mt-5" id="a5ac104a-cf19-4387-82f9-b2634b875220">
+       <div class="d-flex justify-content-between" id="5de884ee-d5e8-47b6-8277-eecf8b98712e">
+        <h4 id="f6fd1c65-e854-4537-979e-2afbd42985dd">
          Method
-         <span class="text-primary" id="a6f551d8-46c3-42a2-989f-19d09c3a80cf">
+         <span class="text-primary" id="39511d5c-a75a-45ef-bbdf-c0f9bfe7f7cc">
           as_secondary
          </span>
         </h4>
-        <div id="f5de331a-ef9a-41b4-be9a-122b1cb62058">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#0c2cc6f4-8425-46e5-9d50-cdd90e1b93bc" data-bs-toggle="collapse" id="197ebad1-9a59-4352-b2ac-c87f6852bafa" onclick="return false;" type="button">
+        <div id="7d1a5898-1f7c-44a5-8595-5c9d3c522640">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#33807524-7e97-4e06-a4b4-2f40bc815106" data-bs-toggle="collapse" id="e26c518c-fa28-4390-b49e-4d6adb11bcc9" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="ff2db36b-2490-46d2-bf53-01cb6d80c122">
+       <span class="text-muted" id="9fd83f64-77c5-4e3a-83b4-31603fe6050d">
         Makes the 'secondary' look to a web components.
        </span>
-       <pre id="70963bb1-a577-4997-a9c0-1ea047526d3a"><code class="language-python">as_secondary()</code></pre>
-       <div class="ms-3 collapse" id="0c2cc6f4-8425-46e5-9d50-cdd90e1b93bc">
-        <h6 id="e570d763-8724-4f3e-8aa8-0b1b3322a6d7">
+       <pre id="dc223599-5033-487e-bb2b-4e3fa49529c1"><code class="language-python">as_secondary()</code></pre>
+       <div class="ms-3 collapse" id="33807524-7e97-4e06-a4b4-2f40bc815106">
+        <h6 id="583d63b7-a869-4810-8802-f9134ffffb65">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="2fff6295-c19b-4108-81d6-8dd19bea5fb2">
+        <table class="table table-sm bg-light" id="a9b151ff-e13f-4451-b9cb-369bb4b1b793">
          <thead>
           <tr>
            <th scope="col">
@@ -2744,40 +2744,40 @@ button = ("Primary").as_primary()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="6a01baec-e55a-4492-8b33-cd9c3ab8184b">
-        <h6 id="60e840b4-c998-4f11-be44-7f31e699e44a">
+       <div class="ms-3" id="786de559-c4f4-4dd4-88fb-900301b90f72">
+        <h6 id="01d73cd9-a061-4032-bd8c-d6f8c12788ab">
          Example
         </h6>
-        <pre id="4373c267-2a46-49c8-8285-f7eef5f7927d"><code class="language-python">from bootwrap import Button
+        <pre id="f84814fc-1dba-42d7-823a-562b2025e7ae"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Secondary").as_secondary()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="490e7e2e-b350-4ef7-a2aa-36af2e499903">
-       <div class="d-flex justify-content-between" id="6896f4f8-d3bf-43b4-b6ed-b23073e22e8d">
-        <h4 id="32d81145-3bc1-41c6-b7b8-433dde9448f4">
+      <div class="mt-5" id="992de6d0-ea1a-4bd6-913e-dd8caec0d6ee">
+       <div class="d-flex justify-content-between" id="b4068f5b-30ea-4b6f-a05f-e9a019758216">
+        <h4 id="bbec004f-e1e2-40da-a9e1-f825f75271a0">
          Method
-         <span class="text-primary" id="725f5f4a-4570-4876-83ee-ff643d04e8b4">
+         <span class="text-primary" id="fce1ef5e-5716-4f9a-93c3-ce8920af4625">
           as_success
          </span>
         </h4>
-        <div id="53d97dd6-73fe-4fe5-b604-34c5d598f0e5">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#6734bb55-3ca1-47c3-808e-979908b0f64c" data-bs-toggle="collapse" id="933b96ab-c072-4590-8a67-412802afb273" onclick="return false;" type="button">
+        <div id="8c8f12c4-ce3f-47cf-81c6-35db052148dd">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#2e112811-ac58-4752-9205-90b3b1c94c21" data-bs-toggle="collapse" id="fe746284-0118-42cb-8442-0332213c07d1" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="0d7c8128-967e-462c-bea2-70d10db5dac7">
+       <span class="text-muted" id="8765d1a6-c562-4d56-853a-0ec9a2492a0f">
         Makes the 'success' look to a web components.
        </span>
-       <pre id="ed973c76-bec9-4834-a284-4dcb3c48575c"><code class="language-python">as_success()</code></pre>
-       <div class="ms-3 collapse" id="6734bb55-3ca1-47c3-808e-979908b0f64c">
-        <h6 id="3d898cd0-2614-4f57-9c51-0eac6451c236">
+       <pre id="54dc7846-1650-4b09-88b1-2e4995bab6f7"><code class="language-python">as_success()</code></pre>
+       <div class="ms-3 collapse" id="2e112811-ac58-4752-9205-90b3b1c94c21">
+        <h6 id="005ebd40-8b39-4797-8572-c144b06f7c26">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="a51cda4d-5b3c-46e4-8999-573727d78a1a">
+        <table class="table table-sm bg-light" id="8b33c7f0-69d7-4868-ac6d-f5833f115a1a">
          <thead>
           <tr>
            <th scope="col">
@@ -2810,40 +2810,40 @@ button = ("Secondary").as_secondary()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="57ff666a-9b28-4f91-8ad4-66a9613f98e6">
-        <h6 id="11f71fb5-0c71-440f-af1d-f0d5060a3d70">
+       <div class="ms-3" id="f455655e-b68b-4efc-b875-262b7f16313e">
+        <h6 id="c0baf509-d182-4424-8455-3c7bc82a3440">
          Example
         </h6>
-        <pre id="6b30899e-b520-41b6-961d-6b92b4d23273"><code class="language-python">from bootwrap import Button
+        <pre id="fb76b809-1748-4ea5-86ac-e2ea49747a68"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Success").as_success()
 </code></pre>
        </div>
       </div>
-      <div class="mt-5" id="a55b7dfc-140b-482b-88a2-621f802121c7">
-       <div class="d-flex justify-content-between" id="7962aec9-a4d9-44f0-8c39-badd700ec298">
-        <h4 id="1ac9f691-cd20-407f-b06a-6db09c6171ec">
+      <div class="mt-5" id="3ef005aa-18b2-4f19-86a4-80c93e7c965e">
+       <div class="d-flex justify-content-between" id="dc010979-9855-40dc-894e-852c96a48669">
+        <h4 id="be8e759b-c986-476d-90e0-7df0171a927a">
          Method
-         <span class="text-primary" id="fd03c4bf-3872-4efe-8fe2-bfe8e1dacab8">
+         <span class="text-primary" id="947dc23a-0a5a-4fcd-90af-072ced5ebdc1">
           as_warning
          </span>
         </h4>
-        <div id="05b9aeba-3e03-4526-9aec-02cc380f57c1">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#e2519da5-a581-42ec-be6e-a48dc63a4cb9" data-bs-toggle="collapse" id="8975b6bb-c68b-414f-a92d-112004501b74" onclick="return false;" type="button">
+        <div id="dc2037d6-c5c1-4052-a207-ba0edeb56189">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#68976cf3-2133-4b1e-b8ee-3e1025b443c1" data-bs-toggle="collapse" id="df04417e-24f2-4e28-8ac5-4f8590d13093" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="630d46b4-9cee-4a0f-8583-19706e179874">
+       <span class="text-muted" id="473b2088-f707-4368-9203-2483b2b052da">
         Makes the 'warning' look to a web components.
        </span>
-       <pre id="f59c6aeb-ead4-48bc-8578-ef7938ea6c16"><code class="language-python">as_warning()</code></pre>
-       <div class="ms-3 collapse" id="e2519da5-a581-42ec-be6e-a48dc63a4cb9">
-        <h6 id="32d8045c-79a9-4092-8069-11c816aaafe3">
+       <pre id="568ecc22-3300-4525-8781-4efaa6317e6c"><code class="language-python">as_warning()</code></pre>
+       <div class="ms-3 collapse" id="68976cf3-2133-4b1e-b8ee-3e1025b443c1">
+        <h6 id="3b943675-9af0-47a7-9570-e089d41d9013">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="ec11bbf6-3d56-44e3-950f-d859330b478c">
+        <table class="table table-sm bg-light" id="94d2bb82-dc57-4a1d-b9fe-6878ea23e523">
          <thead>
           <tr>
            <th scope="col">
@@ -2876,11 +2876,11 @@ button = ("Success").as_success()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="6aeedc45-e8eb-4dd4-9d7b-c50c8b9bbed8">
-        <h6 id="5e592618-d988-402d-adc4-3c833f45896f">
+       <div class="ms-3" id="1bbd0279-634c-4c1f-ba3b-5f04c2f0b391">
+        <h6 id="acbb506a-2b89-4779-bc44-60947cf841de">
          Example
         </h6>
-        <pre id="b4767460-9b38-4c6a-a17a-ada996a6d417"><code class="language-python">from bootwrap import Button
+        <pre id="d4984cde-0fea-4339-9a23-a02bd970f6c7"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Warning").as_warning()
@@ -2889,23 +2889,23 @@ button = ("Warning").as_warning()
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="c7ea1c28-1b5c-45b2-9c7f-0aba103ea892">
-     <div class="mt-5" id="fc88108c-bae4-478e-8fb1-efc0dadbfa50">
-      <div class="d-flex justify-content-between" id="55b57dda-353e-476a-8857-92bc08ec25d4">
-       <h1 id="e1f86a55-ae0d-4b87-aeda-67dd35a2b922">
+    <div class="tab-pane fade" id="681c59cf-8ec8-45ad-aab5-8a82ec0b31b4">
+     <div class="mt-5" id="0ff6dd0f-a383-4277-be11-198955cc2adf">
+      <div class="d-flex justify-content-between" id="3da37182-43b0-4eea-8388-627dfcb8aa4d">
+       <h1 id="943ac6ba-c209-42f9-a77e-4dd9d811c3ac">
         Class
-        <span class="text-primary" id="32c4d243-d023-4967-994d-16dea8965146">
+        <span class="text-primary" id="e92b3f7a-f1a6-4266-a17b-2998bc26158b">
          OutlineMixin
         </span>
        </h1>
-       <div id="0eee9083-01c1-4435-9f20-82d453c7596b">
+       <div id="9187cc3b-86a5-415d-b5b7-47b1b6c0f9ae">
        </div>
       </div>
-      <span class="text-muted" id="4b1c615c-7b54-4ab8-b397-6e331cd512a8">
+      <span class="text-muted" id="a748d47e-ef24-4f8d-bc1a-e67e55be2b18">
        Mixin for a web component that can be surrounded by a border.
       </span>
-      <pre id="ae1addaf-6812-4bc1-9d1c-66899b4bd445"><code class="language-python">OutlineMixin()</code></pre>
-      <p id="7ffc19d3-970b-4a81-92d6-d2b91e8ac101">
+      <pre id="51362ef0-3061-4536-8838-01cc16090cde"><code class="language-python">OutlineMixin()</code></pre>
+      <p id="18169cf6-c74c-4e95-a6fa-ff5442751f18">
        Usually
        <code>
         OutlineMixin
@@ -2917,29 +2917,29 @@ button = ("Warning").as_warning()
        to
     specify the border appearance.
       </p>
-      <div class="mt-5" id="1bfb2f14-8d30-47e7-b62b-21dc5af29cad">
-       <div class="d-flex justify-content-between" id="12ef513f-4cbb-4f75-b83e-1a6f1bf0ab98">
-        <h4 id="051448e0-2375-40f8-a43c-f58a2ef49824">
+      <div class="mt-5" id="27c2f941-7f06-4c2d-acc4-57622db1e155">
+       <div class="d-flex justify-content-between" id="eb5584a1-a7e3-406a-a6d3-5584b2a8eb0d">
+        <h4 id="2f5c303b-8439-4c75-9652-1a5995d75974">
          Method
-         <span class="text-primary" id="cb33fcd3-696a-4fe2-acc1-fcf07e052af6">
+         <span class="text-primary" id="818ca222-b501-4369-bf6f-d32f0e353ed7">
           as_outline
          </span>
         </h4>
-        <div id="2eada020-ffe4-40ec-bf6f-a16985d8daa0">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#d0f275ce-9aaf-4d35-bbbb-3f917d7991df" data-bs-toggle="collapse" id="88ec9ac8-2e6b-48e3-8216-2455eed049a0" onclick="return false;" type="button">
+        <div id="7db9e4d6-b3f5-47ff-be3f-4f0e09cb6ee6">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#0b75e13c-6cfe-4cb0-8890-0b2779bf1ac2" data-bs-toggle="collapse" id="90cb235c-4476-4413-b817-706eb064b0b4" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="045321bc-7c42-4209-bebd-4615fbf95cb6">
+       <span class="text-muted" id="f84e32e2-bf5a-4dea-8598-cf05f07f0b95">
         Makes the web component surrounded by a border.
        </span>
-       <pre id="ae49aa9f-838d-4f66-85d1-bc6f40c9f423"><code class="language-python">as_outline()</code></pre>
-       <div class="ms-3 collapse" id="d0f275ce-9aaf-4d35-bbbb-3f917d7991df">
-        <h6 id="a7137300-5f91-433d-a79a-1effdf6fb40e">
+       <pre id="157f8e09-bc9c-4a28-ba66-a0cf22654678"><code class="language-python">as_outline()</code></pre>
+       <div class="ms-3 collapse" id="0b75e13c-6cfe-4cb0-8890-0b2779bf1ac2">
+        <h6 id="5cd05e91-20e2-4da1-a2b7-f61ec040c432">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="be213086-2333-4e40-9739-e4c796f9d990">
+        <table class="table table-sm bg-light" id="5f4859c0-32be-4e4f-865e-d791c501b77a">
          <thead>
           <tr>
            <th scope="col">
@@ -2972,11 +2972,11 @@ button = ("Warning").as_warning()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="23517eb1-410b-4c0a-87c3-e8822bf07c14">
-        <h6 id="03287f6e-4a03-4bf6-b47f-bce176065f58">
+       <div class="ms-3" id="4e5d0c13-15d2-44ad-9aea-173caf88519e">
+        <h6 id="db04c073-b29e-4ecc-9f1f-17e1e2b7adf5">
          Example
         </h6>
-        <pre id="e79cf858-4a25-4995-95b8-fd1042ed16c1"><code class="language-python">from bootwrap import Button
+        <pre id="52e6d534-e992-41e0-86e9-fd3590fa0299"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Primary").as_primary().as_outline()
@@ -2985,49 +2985,49 @@ button = ("Primary").as_primary().as_outline()
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="468938f3-7e1b-4ae3-9fb2-06660a3d6802">
-     <div class="mt-5" id="a4bd09cb-88e0-4a62-bae2-03d14f72263c">
-      <div class="d-flex justify-content-between" id="cee37ed4-ed02-4e3c-afc0-f8c0b2845848">
-       <h1 id="ee53bb18-a6dd-4ae1-9470-97aeda4f56dc">
+    <div class="tab-pane fade" id="c92f701c-1102-491b-8957-7e42611795f7">
+     <div class="mt-5" id="5e3cf6e1-e5e9-4b37-94e3-322e68e69d7e">
+      <div class="d-flex justify-content-between" id="f43710c0-b914-4626-92ce-4d9d57a9973c">
+       <h1 id="02db59fa-e103-40a8-bfae-735730aa725c">
         Class
-        <span class="text-primary" id="ce55270d-31d0-4b96-9375-dfade04e5394">
+        <span class="text-primary" id="5e686892-c18e-4812-ac99-421b82db2daf">
          AvailabilityMixin
         </span>
        </h1>
-       <div id="5f662f96-0553-4140-b7d6-db0077c3c7b0">
+       <div id="d4cde59f-f66b-4c70-b39c-249d439e576a">
        </div>
       </div>
-      <span class="text-muted" id="2dfc1024-54fc-4c89-bda6-d0194dd4fb16">
+      <span class="text-muted" id="4d637b20-a800-4781-82f7-a9606870d6bf">
        Mixin for a web component which can be enabled or disabled.
       </span>
-      <pre id="decbe140-da6b-4af9-bed6-ab4249ade3d6"><code class="language-python">AvailabilityMixin()</code></pre>
-      <p id="46ecb87e-85a4-4456-b204-bf23a7b2c592">
+      <pre id="407a7d77-f068-4897-ac99-4e36622fb9e5"><code class="language-python">AvailabilityMixin()</code></pre>
+      <p id="2e9f36e6-3421-4777-9dc1-74b4255864c7">
        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="49876b7f-8b95-4fca-acbb-2e9065d56a63">
-       <div class="d-flex justify-content-between" id="3b3edb8a-ca87-4380-b842-3261a9793056">
-        <h4 id="327fada7-1455-4077-bcdb-0fffaeca5689">
+      <div class="mt-5" id="d0834a5d-382c-4632-b1f5-48a361b2946b">
+       <div class="d-flex justify-content-between" id="06ae5ae2-169a-4e01-a712-2c42e340ae49">
+        <h4 id="bdbd3b1e-aa22-4876-a306-5a931166becf">
          Method
-         <span class="text-primary" id="18309cb0-ffd3-4035-b5f4-fedb9bb4f59c">
+         <span class="text-primary" id="9c5e0090-5f20-4c25-b3f7-976b2902fa3f">
           as_disabled
          </span>
         </h4>
-        <div id="f92720c8-11f8-42c1-8056-89cd5514d3f2">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#5dbb0c38-927d-40df-b8b5-5fe0b8656de3" data-bs-toggle="collapse" id="b8a9e277-a547-4b6a-b0e0-0d6a4b83357d" onclick="return false;" type="button">
+        <div id="c7287178-6a8f-44ae-b43a-056546003e16">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#09101ab7-34c6-4819-9c9a-19ad6698cc3f" data-bs-toggle="collapse" id="22d37fbe-687c-4114-8126-2ffe53f27b37" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="ce6ab8df-e8cd-429b-a7df-bf227f417ff8">
+       <span class="text-muted" id="46d26ba9-4db4-4d63-a6c6-7f6966b15001">
         Disables a web component.
        </span>
-       <pre id="f80f1a82-2a61-4449-87ec-b5ade20078d9"><code class="language-python">as_disabled()</code></pre>
-       <div class="ms-3 collapse" id="5dbb0c38-927d-40df-b8b5-5fe0b8656de3">
-        <h6 id="504610ea-8232-4a71-b849-6419b041e74b">
+       <pre id="4714daaa-ecab-4c3c-ad87-ad478bb4c911"><code class="language-python">as_disabled()</code></pre>
+       <div class="ms-3 collapse" id="09101ab7-34c6-4819-9c9a-19ad6698cc3f">
+        <h6 id="d4110fd7-ebcb-4f7c-b043-8b291c53ade9">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="004b0e4a-44f3-4137-a312-bdf00ac62c00">
+        <table class="table table-sm bg-light" id="64507080-3268-46f3-9fd8-bf97066d3f7a">
          <thead>
           <tr>
            <th scope="col">
@@ -3060,11 +3060,11 @@ button = ("Primary").as_primary().as_outline()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="9990fcf7-a93b-499a-84cc-5d9ba721e807">
-        <h6 id="472ac48d-be65-4414-b8bd-f24325a47322">
+       <div class="ms-3" id="a9a60e86-f887-4679-ae18-47acedb9154c">
+        <h6 id="147646a4-8970-4a7f-9b27-727efe2610bf">
          Example
         </h6>
-        <pre id="7877824e-87d5-4bb0-8986-9659da47c0d2"><code class="language-python">from bootwrap import Button
+        <pre id="ebffac52-3e15-4995-8603-7af8d93fbad5"><code class="language-python">from bootwrap import Button
 
 # Note, that Button inherits AppearanceMixin.
 button = ("Primary").as_disabled()
@@ -3073,56 +3073,56 @@ button = ("Primary").as_disabled()
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="be09ccde-e46b-48e1-bbce-7a9e83813663">
-     <div id="e9934bfe-1b36-47ca-bf49-08456c4fd22e">
+    <div class="tab-pane fade" id="2281a93f-8b48-4a3d-acc6-7dea5c29dd8e">
+     <div id="5a6a9e20-5d0d-4cc8-85c3-362b5d5aa285">
       <hr/>
-      <ul class="nav" id="37315f60-b7a1-4cc4-91df-e3f98ded74da" role="tablist">
+      <ul class="nav" id="fabae730-a449-46ab-a0e4-7ae6703ea1a8" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#f6a7f89a-c38f-4705-9393-4088b63adae2" data-bs-toggle="tab" href="#f6a7f89a-c38f-4705-9393-4088b63adae2" id="aa29d63b-af29-4eb5-a246-9cc53dd5455f" role="tab">
-         <span class="text-secondary" id="4db45f10-503a-4126-b067-3fe6fcab1925">
+        <a class="nav-link active" data-bs-target="#8544c852-0755-4e44-82c5-dc6941fad279" data-bs-toggle="tab" href="#8544c852-0755-4e44-82c5-dc6941fad279" id="3a49fcea-5b4b-4d67-a904-bb13d2a72a82" role="tab">
+         <span class="text-secondary" id="a4e5bf0d-b2eb-4ffd-8014-25cf1a4218b4">
           Breakpoint
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#60cb3bb4-dc08-455c-a071-900edfdf7b98" data-bs-toggle="tab" href="#60cb3bb4-dc08-455c-a071-900edfdf7b98" id="91ea2884-1fb8-4ead-9298-6051679f9cea" role="tab">
-         <span class="text-secondary" id="7fb93a52-8f0c-4978-8e7a-15d112aadda7">
+        <a class="nav-link" data-bs-target="#7b6b397a-99ce-4250-bea6-f5012f9a5099" data-bs-toggle="tab" href="#7b6b397a-99ce-4250-bea6-f5012f9a5099" id="1b3c5777-b87b-4fd6-9272-ffa88cc62696" role="tab">
+         <span class="text-secondary" id="26353326-e07e-41a5-95a4-dd820bce4b49">
           Action
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="f6a7f89a-c38f-4705-9393-4088b63adae2">
-        <div class="mt-5" id="a4e6207d-bd5f-4d58-ad9d-195f38f67df9">
-         <div class="d-flex justify-content-between" id="77a10582-095b-42de-9c2d-10ed182ccd24">
-          <h1 id="51a18205-635a-433a-b828-4ead919e99e2">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="8544c852-0755-4e44-82c5-dc6941fad279">
+        <div class="mt-5" id="5a8038a6-0968-4205-8f16-bdc934abcf09">
+         <div class="d-flex justify-content-between" id="c51ceb2b-3650-472b-8f3e-cc0f61144de3">
+          <h1 id="c927b577-f514-4e4c-a3e6-57d4799f9150">
            Class
-           <span class="text-primary" id="44a5c01b-96a7-4943-81d3-fcc9bb8bf8cd">
+           <span class="text-primary" id="8b53ae93-e272-4e46-9fb4-71cba84d8481">
             Breakpoint
            </span>
           </h1>
-          <div id="3f358005-ad46-4886-a7e5-e8173edee4c7">
+          <div id="ad0c03da-7629-455e-9ce4-0b008d8cd237">
           </div>
          </div>
-         <span class="text-muted" id="8e01cc4d-aed8-4935-9b9a-38e03475fc0a">
+         <span class="text-muted" id="111b0663-01e5-45ed-a219-79a3b76c29ac">
           The breakpoint constants.
          </span>
-         <p id="6fbefa4c-9b43-4968-a632-7fe2e1ac46ed">
+         <p id="75a87f79-61d5-4428-a195-29cf94e4830e">
           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="bd4b1be0-326e-4653-93a2-6e784d46ad0e">
+         <p id="fe2fdc32-f312-413b-9540-9d83cbb2d5cf">
           See
           <a href="https://getbootstrap.com/docs/4.0/layout/overview/#responsive-breakpoints">
            for more information.
           </a>
          </p>
-         <div id="b2c8f7e6-9fe9-4fd4-8963-2d869e6da414">
+         <div id="4e58b28b-7ef5-4431-9996-3b629603f744">
           <div class="row">
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="d6882e91-1c0e-4aeb-896c-d34e280e2b03">
+            <div class="p-1 m-1 border text-center" id="ad798405-7a70-4078-ac79-857dd6dec79a">
              Breakpoint.
              <strong class="text-primary">
               LG
@@ -3130,7 +3130,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="fa6bef97-3cdb-4daf-8328-33813ed458c6">
+            <div class="p-1 m-1 border text-center" id="942a237b-9705-47e6-86e7-6371eb174c43">
              Breakpoint.
              <strong class="text-primary">
               MD
@@ -3138,7 +3138,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="a324923c-a678-4db7-92c9-c399d00c201a">
+            <div class="p-1 m-1 border text-center" id="a66086d6-f739-4ec2-ae14-118d0d0979bd">
              Breakpoint.
              <strong class="text-primary">
               SM
@@ -3146,7 +3146,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="09b98855-dd04-48b9-9919-ae05f0c7e51b">
+            <div class="p-1 m-1 border text-center" id="330a7485-a0ed-43f6-b414-663f97f925cb">
              Breakpoint.
              <strong class="text-primary">
               XL
@@ -3154,7 +3154,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="9ddab922-5121-4a97-8922-27803eb40e5d">
+            <div class="p-1 m-1 border text-center" id="05c6be90-cc92-4e53-a1a0-213ffcb1d053">
              Breakpoint.
              <strong class="text-primary">
               XS
@@ -3165,25 +3165,25 @@ button = ("Primary").as_disabled()
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="60cb3bb4-dc08-455c-a071-900edfdf7b98">
-        <div class="mt-5" id="493a21f7-53fc-4aeb-8a37-7de943a42458">
-         <div class="d-flex justify-content-between" id="dca94b43-d079-4dce-803f-5f3f52928108">
-          <h1 id="5d643f1c-97c4-40f8-84a4-d4e87ad73028">
+       <div class="tab-pane fade" id="7b6b397a-99ce-4250-bea6-f5012f9a5099">
+        <div class="mt-5" id="b453d9d5-352c-4242-a39f-844fe1302e51">
+         <div class="d-flex justify-content-between" id="a3bdd534-4646-46e7-bd1a-4630e064a5ff">
+          <h1 id="7266e8a8-6be6-4c6d-8efc-7d355b9dff52">
            Class
-           <span class="text-primary" id="b259911a-4764-44e8-b35d-11f98af29d97">
+           <span class="text-primary" id="488341b1-e959-41af-b870-75e673d444ef">
             Action
            </span>
           </h1>
-          <div id="fe726e00-56dc-44d0-a7e5-31a52d036884">
+          <div id="819b13af-ef54-46cc-b9e0-12d09ee343a7">
           </div>
          </div>
-         <span class="text-muted" id="6249cc85-1734-45a6-838e-b9b28b455827">
+         <span class="text-muted" id="e5483f77-2657-4cb4-bc2d-1badf979c31e">
           The action constants.
          </span>
-         <div id="55ac068d-b42f-49f9-bec6-122ff7714e4f">
+         <div id="bf2cac4d-d5c9-4b2c-82ae-6b5b7ee51f4f">
           <div class="row">
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="21717c01-c25a-4e92-ae8b-656735305d11">
+            <div class="p-1 m-1 border text-center" id="24af323b-f5c8-429c-b99d-6260c5cb7c9e">
              Action.
              <strong class="text-primary">
               DISMISS
@@ -3191,7 +3191,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="3e7c19b9-66b5-4f33-90d1-f59153dc9bf1">
+            <div class="p-1 m-1 border text-center" id="2405fa6f-6c77-459a-9e66-b90a3d05a4c0">
              Action.
              <strong class="text-primary">
               LINK
@@ -3199,7 +3199,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="6aa42c76-b1bd-4067-8fd4-f440a7c14544">
+            <div class="p-1 m-1 border text-center" id="e77170a5-bf0f-4e64-98ca-98e14a7f4509">
              Action.
              <strong class="text-primary">
               SUBMIT
@@ -3207,7 +3207,7 @@ button = ("Primary").as_disabled()
             </div>
            </div>
            <div class="col-md">
-            <div class="p-1 m-1 border text-center" id="f0801f3c-4e47-4505-8409-8a95820eaa81">
+            <div class="p-1 m-1 border text-center" id="066187c3-b74e-4b94-869a-7b9ad4a3eb18">
              Action.
              <strong class="text-primary">
               TOGGLE
diff --git a/docs/components.html b/docs/components.html
index 2d20b98..5f243f4 100644
--- a/docs/components.html
+++ b/docs/components.html
@@ -27,8 +27,8 @@
  </head>
  <body>
   <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
-   <img alt="Bootwrap Logo" id="d1980c01-e557-44e6-be81-8fb3d18ca09b" src="logo.png" width="32"/>
-   <strong class="text-light" id="0d8cf917-89ee-43e3-b73f-23ff3553edc4">
+   <img alt="Bootwrap Logo" id="71957634-ec1b-4fa9-a0ee-f52f0bdc88e3" src="logo.png" width="32"/>
+   <strong class="text-light" id="a2c539c6-a305-4583-96a7-abac877e4ac6">
     Bootwrap
    </strong>
    <button aria-controls="menu" aria-expanded="false" aria-label="Toggle menu" class="navbar-toggler" data-bs-target="#menu" data-bs-toggle="collapse" type="button">
@@ -38,197 +38,197 @@
    <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="9d5e2f77-627a-459f-ae7a-20337333447d">
+      <a class="ms-2 nav-link" href="index.html" id="d227451a-b2fd-4264-b8c7-f4fe5042f8d4">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="layout.html" id="c63fdba2-57ca-46e5-815b-714850a5a5d4">
+      <a class="ms-2 nav-link" href="layout.html" id="29e92399-cbe9-45fe-8b51-937ac7e87200">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="base.html" id="f986a3cd-7942-449a-8fb8-252c623c7e6a">
+      <a class="ms-2 nav-link" href="base.html" id="ff2ad7ed-421c-4d47-9ff4-01a5f64e0985">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="components.html" id="191700ba-c160-4351-a6b2-571cdeff4d97">
+      <a class="ms-2 nav-link" href="components.html" id="15c16c56-ad51-4666-9442-43303b18feb7">
        Components
       </a>
      </li>
     </ul>
-    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="26fdf1c5-34d8-4611-ade5-6408fdd06bb1" role="button">
+    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="b487aee8-4d6b-4003-b57b-deef41bda5f1" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container-fluid">
-   <ul class="nav nav-pills" id="19db80d0-bbfb-4041-a71a-b5cfc7904411" role="tablist">
+   <ul class="nav nav-pills" id="ad1d7c63-e12b-4a89-a043-f290c2db9cb2" role="tablist">
     <li class="nav-item">
-     <a class="nav-link active" data-bs-target="#4c1998c8-8c24-4fae-b30f-39e2d72548f3" data-bs-toggle="tab" href="#4c1998c8-8c24-4fae-b30f-39e2d72548f3" id="d2def06d-d53e-47f6-ac79-f4b4e9d44723" role="tab">
+     <a class="nav-link active" data-bs-target="#0aa8b880-f673-4e40-ac92-75c0c74ecff4" data-bs-toggle="tab" href="#0aa8b880-f673-4e40-ac92-75c0c74ecff4" id="7c321b2d-bebc-4afe-a89b-20086dd43197" role="tab">
       Anchor
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#683e5446-de97-40e9-986b-53b8baf932ae" data-bs-toggle="tab" href="#683e5446-de97-40e9-986b-53b8baf932ae" id="7b4becd2-8abd-4a1b-8bf7-33aec2351050" role="tab">
+     <a class="nav-link" data-bs-target="#a1d38c52-b3d4-4f88-84a7-bc3c63ea0ff2" data-bs-toggle="tab" href="#a1d38c52-b3d4-4f88-84a7-bc3c63ea0ff2" id="0948f405-61a8-4fcc-ae5c-c5a617d36980" role="tab">
       Badge
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#9a37d77a-b13c-4b66-b6a4-e07019cda9c3" data-bs-toggle="tab" href="#9a37d77a-b13c-4b66-b6a4-e07019cda9c3" id="e55ebf74-79fa-42d6-b563-c17433bec2a6" role="tab">
+     <a class="nav-link" data-bs-target="#2dfe11c3-44d7-45e6-92d4-820258d5ef71" data-bs-toggle="tab" href="#2dfe11c3-44d7-45e6-92d4-820258d5ef71" id="ebbd5614-a9c0-4d53-941a-5a2cfef889cf" role="tab">
       Button
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#0e4ce36e-cc66-4ec8-87db-f624b500f88f" data-bs-toggle="tab" href="#0e4ce36e-cc66-4ec8-87db-f624b500f88f" id="02bf7922-573d-4946-8cd8-78ceda1db00e" role="tab">
+     <a class="nav-link" data-bs-target="#82b58c9e-23bb-4a53-bb9b-508040e2a361" data-bs-toggle="tab" href="#82b58c9e-23bb-4a53-bb9b-508040e2a361" id="412dc356-8b20-4fc0-add5-686d929d0d49" role="tab">
       ButtonGroup
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#17f0939f-d8cd-4b88-a304-d3a6ec3cdd4f" data-bs-toggle="tab" href="#17f0939f-d8cd-4b88-a304-d3a6ec3cdd4f" id="19904a06-a02c-4cd5-8fd1-df78250145f8" role="tab">
+     <a class="nav-link" data-bs-target="#39dc3370-d745-467d-a103-445d5467b763" data-bs-toggle="tab" href="#39dc3370-d745-467d-a103-445d5467b763" id="293cfdd7-8719-4bdd-8825-e04a06eb999f" role="tab">
       Deck
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#a67674fa-408a-4201-9d55-be97e5faa7d8" data-bs-toggle="tab" href="#a67674fa-408a-4201-9d55-be97e5faa7d8" id="6e63a56b-ea37-4b91-912d-43d611a9044c" role="tab">
+     <a class="nav-link" data-bs-target="#1eb85ec5-e7fc-4cea-a968-02024d628fe7" data-bs-toggle="tab" href="#1eb85ec5-e7fc-4cea-a968-02024d628fe7" id="0df1626f-024e-4599-9973-e68b5b5b8dde" role="tab">
       Dialog
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#3d845cde-8cda-40e5-80b4-760c4ee88188" data-bs-toggle="tab" href="#3d845cde-8cda-40e5-80b4-760c4ee88188" id="95caadce-2bec-41b2-aaee-cd0a20d8367f" role="tab">
+     <a class="nav-link" data-bs-target="#ffe22e44-60bf-4fda-b060-e8f8dca4d2c0" data-bs-toggle="tab" href="#ffe22e44-60bf-4fda-b060-e8f8dca4d2c0" id="db743e00-f2f9-45d0-b978-ef5b9a6107ec" role="tab">
       Form
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#94bd6d16-6066-4dda-a7a9-862caca19305" data-bs-toggle="tab" href="#94bd6d16-6066-4dda-a7a9-862caca19305" id="9e5d1036-33ca-4e33-b6b4-3ab2a711fc04" role="tab">
+     <a class="nav-link" data-bs-target="#35ba166e-0f34-4f9a-a26f-49fc6347bb7e" data-bs-toggle="tab" href="#35ba166e-0f34-4f9a-a26f-49fc6347bb7e" id="5dc10ccb-e587-4dd9-a307-02113ed5e806" role="tab">
       Icon
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#eae874f4-60dd-4493-a80a-ecdf5140ed2a" data-bs-toggle="tab" href="#eae874f4-60dd-4493-a80a-ecdf5140ed2a" id="3801c442-720a-4cf1-9591-08e2c3d8372c" role="tab">
+     <a class="nav-link" data-bs-target="#2ba3809b-560b-4825-915a-a8164d380b0b" data-bs-toggle="tab" href="#2ba3809b-560b-4825-915a-a8164d380b0b" id="c2be847f-90ac-4272-bf13-0c5553156446" role="tab">
       Image
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#2b471f6e-00fb-4570-a9ad-2efe105cc74e" data-bs-toggle="tab" href="#2b471f6e-00fb-4570-a9ad-2efe105cc74e" id="d8f31435-3485-4350-a1c5-a9a2841b7db6" role="tab">
+     <a class="nav-link" data-bs-target="#a92dd6b3-bbfb-46e6-a3a2-709f91fd5af1" data-bs-toggle="tab" href="#a92dd6b3-bbfb-46e6-a3a2-709f91fd5af1" id="077d63e6-d23a-4572-bdd0-882df9928175" role="tab">
       Javascript
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#3afab468-a13a-4dd8-b55d-0b836a6c85ef" data-bs-toggle="tab" href="#3afab468-a13a-4dd8-b55d-0b836a6c85ef" id="4a4b6224-08f4-48bf-957c-6b8da99b635d" role="tab">
+     <a class="nav-link" data-bs-target="#c7abbd56-a2ac-4bad-a834-96bcc7954dfe" data-bs-toggle="tab" href="#c7abbd56-a2ac-4bad-a834-96bcc7954dfe" id="d7f2a65a-96fc-4b67-8864-1852245ff5da" role="tab">
       Link
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#b137127a-7e5a-4aaf-bbf7-7dfe1c566c18" data-bs-toggle="tab" href="#b137127a-7e5a-4aaf-bbf7-7dfe1c566c18" id="6389e2eb-6963-4c8d-860f-30fb469c924e" role="tab">
+     <a class="nav-link" data-bs-target="#6c1f08a1-4c11-4721-892b-c6be695451e6" data-bs-toggle="tab" href="#6c1f08a1-4c11-4721-892b-c6be695451e6" id="6bf06a4a-b51e-4820-b1e7-e0fe85099e40" role="tab">
       List
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#03400682-e2dd-4428-b712-1d694f6aa40d" data-bs-toggle="tab" href="#03400682-e2dd-4428-b712-1d694f6aa40d" id="84b98bb6-d704-47c7-8cf6-b3907889d9e6" role="tab">
+     <a class="nav-link" data-bs-target="#88f47bd6-b9c0-4bef-8d1f-0024cd8c04a8" data-bs-toggle="tab" href="#88f47bd6-b9c0-4bef-8d1f-0024cd8c04a8" id="424e59f8-5be4-46fc-a4ad-f005986bd580" role="tab">
       Navigation
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#486b0c01-2d84-4973-97a3-c08a62aaf89d" data-bs-toggle="tab" href="#486b0c01-2d84-4973-97a3-c08a62aaf89d" id="129a0b68-e33e-47bf-8f1e-b7500018509d" role="tab">
+     <a class="nav-link" data-bs-target="#850c7063-1719-4e74-b552-fb60bfc3d355" data-bs-toggle="tab" href="#850c7063-1719-4e74-b552-fb60bfc3d355" id="ebe2aae2-d388-4e66-8b77-d699227d6d97" role="tab">
       Panel
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#9f76d8e3-e7d4-465c-8904-92989d0563e0" data-bs-toggle="tab" href="#9f76d8e3-e7d4-465c-8904-92989d0563e0" id="5c2bb268-2257-4d4f-b674-e40f898a5cbd" role="tab">
+     <a class="nav-link" data-bs-target="#98279619-57db-4a97-80ac-c10757d39ee0" data-bs-toggle="tab" href="#98279619-57db-4a97-80ac-c10757d39ee0" id="b7dd8b30-0786-487e-a6ce-b4e111370b5a" role="tab">
       Separator
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#ed2977cf-fedd-497b-9efa-0dc18edcd646" data-bs-toggle="tab" href="#ed2977cf-fedd-497b-9efa-0dc18edcd646" id="dc69bf97-646a-4984-9713-96b9eb40482a" role="tab">
+     <a class="nav-link" data-bs-target="#76b006e8-d6c5-4b33-b6c5-fcf28580ce05" data-bs-toggle="tab" href="#76b006e8-d6c5-4b33-b6c5-fcf28580ce05" id="ce488fc6-5a3b-4a44-94a5-8775db2f4281" role="tab">
       Table
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#7bbaf003-c029-4ded-8cd5-2e9e20756a68" data-bs-toggle="tab" href="#7bbaf003-c029-4ded-8cd5-2e9e20756a68" id="a5c75d9a-3052-4717-b64c-08f7b5517789" role="tab">
+     <a class="nav-link" data-bs-target="#3c5b41a7-a5e9-48bd-aaf8-a575a4443ca7" data-bs-toggle="tab" href="#3c5b41a7-a5e9-48bd-aaf8-a575a4443ca7" id="a60f5be4-2e77-489c-996a-96588bccb9b8" role="tab">
       Text
      </a>
     </li>
     <li class="nav-item">
-     <a class="nav-link" data-bs-target="#4614f849-ef22-4d62-8f64-2659c26ecbd9" data-bs-toggle="tab" href="#4614f849-ef22-4d62-8f64-2659c26ecbd9" id="ae4f60d4-34f1-468a-bc57-e002b7f26a1e" role="tab">
+     <a class="nav-link" data-bs-target="#058e8f0c-e01b-4b9d-bf4c-440b103ef89d" data-bs-toggle="tab" href="#058e8f0c-e01b-4b9d-bf4c-440b103ef89d" id="262a2a9f-0813-471f-99d3-88ecc58dcb54" role="tab">
       Toast
      </a>
     </li>
    </ul>
-   <div class="tab-content">
-    <div class="tab-pane fade active show" id="4c1998c8-8c24-4fae-b30f-39e2d72548f3">
-     <div id="6cb4a35a-f5b0-4331-b93e-89513b0baf7f">
+   <div class="tab-content w-100">
+    <div class="tab-pane fade active show" id="0aa8b880-f673-4e40-ac92-75c0c74ecff4">
+     <div id="a6190e76-a924-420e-acad-514bb6b6619d">
       <hr/>
-      <ul class="nav" id="7d10b3e4-a3d4-4adf-97cc-1049c8b7c04a" role="tablist">
+      <ul class="nav" id="85605f24-4c60-45f0-997b-d3fa2626c80d" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#561c6cda-04e6-41cd-bb33-7424e1cc2f8e" data-bs-toggle="tab" href="#561c6cda-04e6-41cd-bb33-7424e1cc2f8e" id="2513d090-8b68-4d95-87e3-f7e1d09197dc" role="tab">
-         <span class="text-secondary" id="c84ff11c-45b0-4aff-9dc4-6f7ad105fb92">
+        <a class="nav-link active" data-bs-target="#1632cda3-66fd-43a7-877d-47d363c9f350" data-bs-toggle="tab" href="#1632cda3-66fd-43a7-877d-47d363c9f350" id="857baa6f-a00c-45ec-a67a-adb7272b8435" role="tab">
+         <span class="text-secondary" id="042bd37a-f52e-468a-ac3f-5f98d80f4758">
           Anchor
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#1e9cdbc8-3f5c-4b91-968e-b9fda69090ed" data-bs-toggle="tab" href="#1e9cdbc8-3f5c-4b91-968e-b9fda69090ed" id="85cce8e5-1311-4406-92ef-01760659c981" role="tab">
-         <span class="text-secondary" id="3a0ebd93-f8ad-47a4-8d56-9b34ac28baa9">
+        <a class="nav-link" data-bs-target="#3e595a49-7a5a-413b-98bb-49a624826c23" data-bs-toggle="tab" href="#3e595a49-7a5a-413b-98bb-49a624826c23" id="3e19451c-a04b-4010-8667-283d2409e27e" role="tab">
+         <span class="text-secondary" id="772d8be3-b255-4e15-b28f-809acaff9b01">
           Appearance
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#2fc3ddbe-5d30-4cd7-9817-ce61012a7cfb" data-bs-toggle="tab" href="#2fc3ddbe-5d30-4cd7-9817-ce61012a7cfb" id="c4d4b3aa-5790-4456-84f2-005dbc067156" role="tab">
-         <span class="text-secondary" id="af0eece8-17e9-4c96-b1db-1b9bbe7b1cc5">
+        <a class="nav-link" data-bs-target="#20835a89-3e25-40e7-9110-c41a06ee2d6b" data-bs-toggle="tab" href="#20835a89-3e25-40e7-9110-c41a06ee2d6b" id="705bdf80-c3e3-451a-8c10-20be2bce381b" role="tab">
+         <span class="text-secondary" id="3b23055f-a37f-4ada-83e0-463de38b7850">
           Link Resource
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#b2be7e2b-c3b5-45f0-b463-a52e09e56a84" data-bs-toggle="tab" href="#b2be7e2b-c3b5-45f0-b463-a52e09e56a84" id="438933d5-bd05-488b-bc95-975797d8a794" role="tab">
-         <span class="text-secondary" id="8c5524f2-31d0-4dc0-8dd1-facfdbf7cce3">
+        <a class="nav-link" data-bs-target="#5709e5f8-12ae-4f84-b147-fab22923f53a" data-bs-toggle="tab" href="#5709e5f8-12ae-4f84-b147-fab22923f53a" id="fe7feabf-9515-41c4-9f6b-6272cdca6e71" role="tab">
+         <span class="text-secondary" id="f006c785-cfba-489a-859c-3c13f0a40a70">
           Open Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#640a5d46-789e-4301-a5e3-d56a442b970c" data-bs-toggle="tab" href="#640a5d46-789e-4301-a5e3-d56a442b970c" id="88c8d539-c000-4697-ad02-5c9b26ab0043" role="tab">
-         <span class="text-secondary" id="a4a2aee0-1df1-4d3e-a209-72b1c65b9856">
+        <a class="nav-link" data-bs-target="#09e47103-2bf3-41bd-8146-84aea215bec0" data-bs-toggle="tab" href="#09e47103-2bf3-41bd-8146-84aea215bec0" id="a840e3c1-b538-41cc-988b-e2aa89eb6fcb" role="tab">
+         <span class="text-secondary" id="d39a3e6a-6754-4f1e-8418-c8ccfede36b2">
           Close Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#6450da26-7ace-4d62-92bf-8860e9901dbe" data-bs-toggle="tab" href="#6450da26-7ace-4d62-92bf-8860e9901dbe" id="96f82c46-f02a-4da7-8b58-9c1f1cb04aab" role="tab">
-         <span class="text-secondary" id="8314bc37-f7b3-4e10-982b-2a27f3ea2789">
+        <a class="nav-link" data-bs-target="#19184da1-eee8-473c-aaee-9993555fc45e" data-bs-toggle="tab" href="#19184da1-eee8-473c-aaee-9993555fc45e" id="4ed55ac7-8da6-4e9e-85b4-8cfb582bdfde" role="tab">
+         <span class="text-secondary" id="55e6f9bb-7910-415d-a9d0-1d2107d7840e">
           Expand/Collapse Panel
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="561c6cda-04e6-41cd-bb33-7424e1cc2f8e">
-        <div class="mt-5" id="e673c9e0-e5f3-4297-8827-5e206b7a34f4">
-         <div class="d-flex justify-content-between" id="9d62fe0c-66f3-4b31-b097-3b7c58be703f">
-          <h1 id="7f66d805-0b3d-4607-a235-e30d17247516">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="1632cda3-66fd-43a7-877d-47d363c9f350">
+        <div class="mt-5" id="e30a5ff9-7ad5-4dcd-9b72-440815770dd1">
+         <div class="d-flex justify-content-between" id="72dea81c-376b-4793-9e15-c29b6af099be">
+          <h1 id="dc50b34d-9f67-46d6-866e-ae033502db4e">
            Class
-           <span class="text-primary" id="fa87a7f5-35ca-4f09-86c7-67cefb5db447">
+           <span class="text-primary" id="f83342fe-9321-40ca-910d-e4eb2e6ce245">
             Anchor
            </span>
           </h1>
-          <div id="0983af2f-688e-43f0-ba16-65f4a57975b4">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#9b08067d-ceaa-4c4c-b04c-4fbf35fb2765" data-bs-toggle="collapse" id="1cbdd405-24ca-40bc-9b3e-43689aef4d5b" onclick="return false;" type="button">
+          <div id="2e5348d1-7b95-4094-b347-ad3adc716f7f">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#28cfe321-4f79-4f48-959b-a26657675bc3" data-bs-toggle="collapse" id="62602df0-c7df-4e18-bed0-c68bcc3bf0fa" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="9d1b23e6-4777-44da-b151-496eda308609">
+         <span class="text-muted" id="3ff25ca2-b21b-4cb8-a81b-686186a73d11">
           A web component for an anchor.
          </span>
-         <pre id="f35a2295-4818-473e-8232-4e629446306c"><code class="language-python">Anchor(inner=None)</code></pre>
-         <div class="ms-3 collapse" id="9b08067d-ceaa-4c4c-b04c-4fbf35fb2765">
-          <h6 id="a2648e1f-edfa-4ab6-b01f-f9efc69c9372">
+         <pre id="888a6ccf-96df-46de-b813-08248108841e"><code class="language-python">Anchor(inner=None)</code></pre>
+         <div class="ms-3 collapse" id="28cfe321-4f79-4f48-959b-a26657675bc3">
+          <h6 id="9637c069-100b-41c1-aa9d-9a5ed924892a">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="4fd30e82-e293-4b98-9e27-6485ea448f30">
+          <table class="table table-sm bg-light" id="8dc35395-469e-4f76-a102-0defffd786f3">
            <thead>
             <tr>
              <th scope="col">
@@ -261,7 +261,7 @@
            </tbody>
           </table>
          </div>
-         <p id="25baf5fc-fcf3-4521-8f09-630419b24512">
+         <p id="25f73068-04ab-4f44-9950-ef0646c4c1cc">
           The
           <code>
            Anchor
@@ -280,43 +280,43 @@
     conjunction with other components, for example, in creating a navigation
     menu.
          </p>
-         <div class="ms-3" id="60aa1dac-7418-4982-a282-e06ff0cc77cf">
-          <h6 id="ff2b2680-62b4-4db1-a6fb-959db6437248">
+         <div class="ms-3" id="6d026674-6679-4a28-b135-bdc96b10957e">
+          <h6 id="4f887bae-5210-4609-b1d5-bf3fe68f9119">
            Example
           </h6>
-          <pre id="05d73efc-aebf-458e-9382-5c49927749a3"><code class="language-python">from bootwrap import Anchor
+          <pre id="dbea5a9c-cca4-45e0-8226-50cdd790f761"><code class="language-python">from bootwrap import Anchor
 Anchor('Google Search').link('https://www.google.com/')
 </code></pre>
          </div>
-         <div class="ms-3" id="4c2bdd19-77d9-4573-9305-6be1ae446602">
-          <a href="https://www.google.com/" id="1a591c61-2dce-4319-8c2d-4fff9e657b3b">
+         <div class="ms-3" id="624f0d61-9cfe-4244-a0d3-481ef2f0195e">
+          <a href="https://www.google.com/" id="ded6078a-ae2c-49ad-b8c4-78ccdb693d45">
            Google Search
           </a>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="1e9cdbc8-3f5c-4b91-968e-b9fda69090ed">
-        <div class="mt-3" id="6fe5a972-fc26-4305-9e16-68e3f5ba8f59">
-         <div id="a525c7e3-7fc5-47a6-b723-795be5344725">
+       <div class="tab-pane fade" id="3e595a49-7a5a-413b-98bb-49a624826c23">
+        <div class="mt-3" id="a6a252f7-9c80-4c24-8e8f-86369f7343c4">
+         <div id="5c74c11b-970d-434c-ab7e-fa02d0f989fe">
           <div class="row">
            <div class="col-md">
-            <div id="7ee373d0-fd5c-49af-94ad-eb3f0e2f4f78">
-             <h1 id="b24665ac-27d8-4843-808d-a62f46424d1c">
+            <div id="12c000dd-1042-45f3-affe-32ed483231f0">
+             <h1 id="62cf54e4-a2d2-414c-a827-c73f731f4d3c">
               Appearance
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="33c20a7a-f97e-41dc-bf88-0f4cbdc62457">
+            <div id="58206300-8c21-468a-b938-a6777e597d83">
             </div>
            </div>
           </div>
          </div>
-         <div id="75e5fbaa-11c2-4744-8d8c-c499669494dd">
+         <div id="bf86f435-0bcb-4b67-bb7c-fdde497d3dcc">
           <div class="row">
            <div class="col-md">
-            <div id="217676ac-ee5c-4094-a5af-dc278d8964a6">
-             <p id="fcf28fbd-a58f-4655-b022-a5dfe8a92e06">
+            <div id="0cccc120-9bdb-44d2-b97b-3d044cd6d0e7">
+             <p id="96540a58-8d5b-4a6c-a3f1-057a9df2855a">
               Change
               <code>
                Anchor
@@ -358,8 +358,8 @@ Anchor('Google Search').link('https://www.google.com/')
             </div>
            </div>
            <div class="col-md">
-            <div id="a9561a8d-a372-48ac-ad61-1318cf2a8823">
-             <pre id="58c38c02-d3bf-4318-96a5-99a9af85b193"><code class="language-python">from bootwrap import Panel, Anchor
+            <div id="1d465c99-68d3-4db8-8573-5f7bc575837a">
+             <pre id="9e0fc0cb-a7c8-4db4-a853-73a87ace199b"><code class="language-python">from bootwrap import Panel, Anchor
 panel = Panel(
   Anchor("Primary").link("#").as_primary(),
   Anchor("Secondary").link("#").as_secondary(),
@@ -373,29 +373,29 @@ panel = Panel(
 for anchor in panel:
   anchor.mb(1)
 panel</code></pre>
-             <div id="27740a22-8f6a-40c2-ba65-1be090640d6e">
-              <a class="mb-1 text-primary" href="#" id="4ca66329-4482-4c32-b5a3-f2dd9dd11ace">
+             <div id="2485da53-b90a-47e9-a4e6-222907fa0ad2">
+              <a class="mb-1 text-primary" href="#" id="ae8f0435-4b75-41c1-b085-ae4cd9a35386">
                Primary
               </a>
-              <a class="mb-1 text-secondary" href="#" id="3fbb3f61-3e58-4fb4-bee7-d468cece7e7a">
+              <a class="mb-1 text-secondary" href="#" id="be8434a3-0776-4ed5-8b05-20816c92eecb">
                Secondary
               </a>
-              <a class="mb-1 text-success" href="#" id="66016d1c-5f5a-4c2e-a65d-087ca3d7ed12">
+              <a class="mb-1 text-success" href="#" id="a34c9884-e546-4eea-b46a-759645c39ac2">
                Success
               </a>
-              <a class="mb-1 text-warning" href="#" id="5f32ed75-9f99-49ec-8c0a-fa56f3fb268a">
+              <a class="mb-1 text-warning" href="#" id="cee26d4c-d268-49c3-b51a-bec8ca23eb1a">
                Warning
               </a>
-              <a class="mb-1 text-danger" href="#" id="5f00f535-8a33-4c47-9190-b61ac87b2535">
+              <a class="mb-1 text-danger" href="#" id="ca286691-81c6-4c86-adfa-0d490cfdf2f0">
                Danger
               </a>
-              <a class="mb-1 text-info" href="#" id="5d827b7d-ed3e-4a29-9c47-ba9f0932bf2b">
+              <a class="mb-1 text-info" href="#" id="aa605989-ce09-4d58-9c52-3874a1109628">
                Info
               </a>
-              <a class="mb-1 text-light" href="#" id="0f591d60-b11b-46e5-ac7e-b84a8676dd19">
+              <a class="mb-1 text-light" href="#" id="b10cbc1f-14b1-43b9-b42b-d23e4cf48309">
                Light
               </a>
-              <a class="mb-1 text-dark" href="#" id="8b563e1f-6b3b-43d0-bbb9-6fb6a02b7404">
+              <a class="mb-1 text-dark" href="#" id="277c9664-3483-424c-b06f-d84f0ea3f294">
                Dark
               </a>
              </div>
@@ -405,28 +405,28 @@ panel</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="2fc3ddbe-5d30-4cd7-9817-ce61012a7cfb">
-        <div class="mt-3" id="3ea1550d-b467-41b1-9e25-86bf8d4388c0">
-         <div id="e5efb64c-7c4f-47d9-9455-86237c065a9a">
+       <div class="tab-pane fade" id="20835a89-3e25-40e7-9110-c41a06ee2d6b">
+        <div class="mt-3" id="618cc328-2af2-4398-aafb-4487c619257d">
+         <div id="a0d54e8c-07a9-4a12-800d-2227dca9e3ce">
           <div class="row">
            <div class="col-md">
-            <div id="76d0d6ff-83a0-4f21-8886-4a4aabf224e6">
-             <h1 id="6237492b-4be8-470b-8a43-aac2efc5893d">
+            <div id="e012d90a-01b4-45cf-b782-c803b9a63417">
+             <h1 id="f34a8b73-e875-4587-835c-9c091845248a">
               Link Resource
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="93d98854-8e9c-4b38-967b-cecaa973c799">
+            <div id="40860749-87fe-4987-b164-51c53c0b893b">
             </div>
            </div>
           </div>
          </div>
-         <div id="16f481f6-fa96-4bb1-a17c-861ef3108b88">
+         <div id="471f13e7-de67-474d-825e-d78d74675214">
           <div class="row">
            <div class="col-md">
-            <div id="57c1620b-4666-4294-b5a2-882e1e7202b8">
-             <p id="fbcd29d4-6a6f-43d1-bae7-1e47c639185f">
+            <div id="f39c8d5d-48bf-42dc-a224-fd4179dd54d6">
+             <p id="32fe2d20-610f-4a4d-b024-ef0f2f6b0f6d">
               Associate
               <code>
                Anchor
@@ -440,13 +440,13 @@ panel</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="11c0659e-8cee-4059-a4a8-01815be9a6d4">
-             <pre id="0773cb44-d547-468d-9f27-ddc1b93045f9"><code class="language-python">from bootwrap import Panel, Anchor
+            <div id="21617abb-a282-4394-bc85-3c280624a4f6">
+             <pre id="25b5de8c-9e3c-4d6c-8f86-29e78cf53f3f"><code class="language-python">from bootwrap import Panel, Anchor
 Panel(
     Anchor("Google Search").link("https://www.google.com/")
 )</code></pre>
-             <div id="aac25e15-18bb-484d-8516-3b515afba50f">
-              <a href="https://www.google.com/" id="108f3622-665a-4d1b-bf26-06981347b04c">
+             <div id="7fcfd18b-b07f-4242-bdab-7c675bbc3474">
+              <a href="https://www.google.com/" id="cb7180bf-8df6-4b7f-a39c-c39ef1f75afa">
                Google Search
               </a>
              </div>
@@ -456,28 +456,28 @@ Panel(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="b2be7e2b-c3b5-45f0-b463-a52e09e56a84">
-        <div class="mt-3" id="f3cb860f-ae3e-4496-8bc2-5aca89107322">
-         <div id="371ca1ac-cbf6-4b73-99ec-bd9fbd3d3594">
+       <div class="tab-pane fade" id="5709e5f8-12ae-4f84-b147-fab22923f53a">
+        <div class="mt-3" id="a78eccbf-6aa1-41ca-bcf2-043ce618b959">
+         <div id="fc7baff8-642c-447d-a3ca-f1ed91841378">
           <div class="row">
            <div class="col-md">
-            <div id="1ca05b3e-0cff-48f5-a2fd-a27f0a7b685e">
-             <h1 id="66a3fe50-317d-42eb-a451-2491fff64b3f">
+            <div id="733b9005-161c-4565-b289-40ff7a8c4415">
+             <h1 id="7b26da0c-2db5-4641-90ae-5fb57ace68f9">
               Open Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="1d3452da-5da7-41f6-89a0-4ce2b3c38a75">
+            <div id="1609dae9-465d-45db-8927-931bb958c2d9">
             </div>
            </div>
           </div>
          </div>
-         <div id="99eb00c0-1a43-4b66-8c30-32910fa26873">
+         <div id="870fec4b-185b-48aa-bfe6-8a25afcfd535">
           <div class="row">
            <div class="col-md">
-            <div id="3f8b1f00-0c95-4866-859c-73c908678267">
-             <p id="eaf064d7-d1a8-41bb-ae75-90689643795d">
+            <div id="abd7294a-687a-4c77-867f-3fa4a9b37cc3">
+             <p id="a3a79001-35d2-4800-bcf5-864a7789451e">
               Use
               <code>
                Anchor
@@ -491,16 +491,16 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="0d847370-9291-4b8e-891f-44f528fd9e96">
-             <pre id="b13ea6c8-5877-4b73-92c0-46407ecf8614"><code class="language-python">from bootwrap import Panel, Dialog, Anchor
+            <div id="248b3169-2b47-4b39-8002-057720f70d16">
+             <pre id="363b18ee-69bb-4d9c-b174-1dc5a8d29376"><code class="language-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="dbb83a0b-a308-48dd-a58d-a109a5846b60">
-              <div class="modal" id="e456df40-06cd-46f2-b0c8-ae7c2c01f60f">
+             <div id="0f6a08a4-a7a7-4cd2-9a1f-8762b449183d">
+              <div class="modal" id="f61b06d6-5ce4-4ea1-99bd-e083f80a7854">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -516,7 +516,7 @@ Panel(dialog, anchor)</code></pre>
                 </div>
                </div>
               </div>
-              <a data-bs-toggle="modal" href="#e456df40-06cd-46f2-b0c8-ae7c2c01f60f" id="778ac694-096b-410c-acd6-845f1d7d9246" role="modal">
+              <a data-bs-toggle="modal" href="#f61b06d6-5ce4-4ea1-99bd-e083f80a7854" id="630bc78c-0472-4c3d-b1ff-cb95bfe56cdb" role="modal">
                Say Hello
               </a>
              </div>
@@ -526,28 +526,28 @@ Panel(dialog, anchor)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="640a5d46-789e-4301-a5e3-d56a442b970c">
-        <div class="mt-3" id="979d0303-62bd-4c41-a430-4dd40bea4ff0">
-         <div id="d58f0fa4-1461-4a21-8ec8-c90de56685bd">
+       <div class="tab-pane fade" id="09e47103-2bf3-41bd-8146-84aea215bec0">
+        <div class="mt-3" id="2885f2f3-a431-4aa5-9bf7-4d8daa0f8f60">
+         <div id="f1725144-73dd-440b-ae22-5db9643b624e">
           <div class="row">
            <div class="col-md">
-            <div id="28da4477-42cd-42b7-9363-fb8f5142a862">
-             <h1 id="5d807551-bcee-498a-bc43-bc3fa5d8b9a7">
+            <div id="5bf9f3e5-3d8e-4061-85c7-a3631105ce5e">
+             <h1 id="71f1245c-6728-4310-a96c-9883428a545e">
               Close Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="31d5f649-70d3-4f06-be90-c5941146dd76">
+            <div id="b20bfd4a-9172-4888-a216-50e5321c13cc">
             </div>
            </div>
           </div>
          </div>
-         <div id="26b0ad10-d882-4f4c-b0dd-7b181fcc9afe">
+         <div id="80991aa0-e4cc-4625-81a9-e60e8b9575b0">
           <div class="row">
            <div class="col-md">
-            <div id="c3996f31-e266-403c-a42e-a3091ef17374">
-             <p id="cc4c2ee9-f966-4950-b882-118e566ed0f0">
+            <div id="133d8398-0463-4839-8342-040708137012">
+             <p id="b0bada04-4842-4f2c-b17a-08972b80a602">
               Use
               <code>
                Anchor
@@ -561,8 +561,8 @@ Panel(dialog, anchor)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="489d5761-2426-4616-af48-b6cac5de5954">
-             <pre id="48e4a0d7-933e-4976-8614-2980fd60f34d"><code class="language-python">from bootwrap import Panel, Dialog, Anchor
+            <div id="bd049cdf-a3f5-4689-9257-adf966567d6b">
+             <pre id="32e69614-2309-41c2-893d-9a73c64fe66f"><code class="language-python">from bootwrap import Panel, Dialog, Anchor
 dialog = Dialog(
   "Greeting",
   "Hello World!",
@@ -570,8 +570,8 @@ dialog = Dialog(
 )
 anchor = Anchor("Say Hello").toggle(dialog)  
 Panel(dialog, anchor)</code></pre>
-             <div id="b67ef459-cda8-488d-830b-6adba52c9188">
-              <div class="modal" id="a56b1270-d2fa-410d-bf04-a917150c5a68">
+             <div id="94e182d5-4419-440f-ba4d-03b5f380f2e0">
+              <div class="modal" id="f3edd066-3417-406b-b76c-bb9dba432384">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -585,14 +585,14 @@ Panel(dialog, anchor)</code></pre>
                   Hello World!
                  </div>
                  <div class="modal-footer">
-                  <a data-bs-dismiss="modal" href="#" id="ebdd8584-8ec0-4fbd-8baf-be5b51707ae4">
+                  <a data-bs-dismiss="modal" href="#" id="c3058c01-b5a5-4333-8cbc-b9fd17061734">
                    Bye
                   </a>
                  </div>
                 </div>
                </div>
               </div>
-              <a data-bs-toggle="modal" href="#a56b1270-d2fa-410d-bf04-a917150c5a68" id="d00520f5-5318-4847-b456-c9dd9f9feb17" role="modal">
+              <a data-bs-toggle="modal" href="#f3edd066-3417-406b-b76c-bb9dba432384" id="f52b1a90-439a-40f5-bb22-8095b6c64505" role="modal">
                Say Hello
               </a>
              </div>
@@ -602,28 +602,28 @@ Panel(dialog, anchor)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="6450da26-7ace-4d62-92bf-8860e9901dbe">
-        <div class="mt-3" id="4b133daf-28c4-4ab0-a6f5-118b984e4642">
-         <div id="24d40c0f-3c39-44d2-9436-83b09f784a9b">
+       <div class="tab-pane fade" id="19184da1-eee8-473c-aaee-9993555fc45e">
+        <div class="mt-3" id="0f622c5f-5173-4c3e-9ec4-1bf78d2daddc">
+         <div id="3a7137aa-4273-4b31-aa60-a091683c56d3">
           <div class="row">
            <div class="col-md">
-            <div id="eb4218d2-d002-456e-9e4a-e598de2d188f">
-             <h1 id="a7266186-746f-43a0-a8d5-0a3dcd7432aa">
+            <div id="1e997209-d4d2-4ef2-a970-c11ed93ba71e">
+             <h1 id="2bb62523-1c17-48a1-999b-921f0f8419e9">
               Expand/Collapse Panel
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="f31a1981-1bf9-4c0b-9bbe-87c93fd4663f">
+            <div id="c4db6411-6a44-4b17-92a3-3e33f8428fac">
             </div>
            </div>
           </div>
          </div>
-         <div id="bac3062f-0402-4f1a-902f-e820a4a88ab0">
+         <div id="88a40703-f800-4e84-9290-aa0258344924">
           <div class="row">
            <div class="col-md">
-            <div id="457ae4fb-9b72-4fcb-9cf5-a64413f1f785">
-             <p id="7aa8bb68-f6a1-4541-9c8f-ebe081c3d95f">
+            <div id="22779a61-b4e5-481d-ba2e-4a39bd5eb136">
+             <p id="89687ddb-21f7-4d04-a15f-faf9f47b4f3f">
               Use
               <code>
                Anchor
@@ -637,8 +637,8 @@ Panel(dialog, anchor)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="084516d1-3a49-4737-9404-c67a219fe22d">
-             <pre id="d2001a8e-55bd-4c76-8933-56c8be44a415"><code class="language-python">from bootwrap import Panel, Anchor
+            <div id="a33b8fbe-1133-48ad-bd05-aa018c10d276">
+             <pre id="01988d25-9562-4bb7-9ba3-7d263c22b93a"><code class="language-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."
@@ -647,11 +647,11 @@ Panel(
   Anchor("Steve Jobs Quote").toggle(quote),
   quote
 )</code></pre>
-             <div id="ae38204f-3a62-4d25-bd4d-6b78393711f7">
-              <a data-bs-target="#9f31d0fe-27d2-4a33-aa73-e3e43c0023ed" data-bs-toggle="collapse" href="#9f31d0fe-27d2-4a33-aa73-e3e43c0023ed" id="4ecc4fd2-b9e6-410c-a07f-6b0e06a0e3ab" role="collapse">
+             <div id="3505574a-3bb9-41fb-acef-23df736ed073">
+              <a data-bs-target="#fd46653c-9c6c-4c2c-adfb-3ad4c517dffb" data-bs-toggle="collapse" href="#fd46653c-9c6c-4c2c-adfb-3ad4c517dffb" id="9159460e-8cdf-4b82-9ad0-82c655d96f16" role="collapse">
                Steve Jobs Quote
               </a>
-              <div class="collapse" id="9f31d0fe-27d2-4a33-aa73-e3e43c0023ed">
+              <div class="collapse" id="fd46653c-9c6c-4c2c-adfb-3ad4c517dffb">
                Sometimes life is going to hit you in the head with a brick. Don’t lose faith.
               </div>
              </div>
@@ -664,50 +664,50 @@ Panel(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="683e5446-de97-40e9-986b-53b8baf932ae">
-     <div id="a0df48cb-8748-463b-a9bd-c0ba2ea5e1d1">
+    <div class="tab-pane fade" id="a1d38c52-b3d4-4f88-84a7-bc3c63ea0ff2">
+     <div id="ec9f8e88-b9db-4bdb-abb5-586b2ed860d3">
       <hr/>
-      <ul class="nav" id="1683fa3b-eb90-464e-8edf-bf846e86e02f" role="tablist">
+      <ul class="nav" id="e88541a4-e7e3-4a2e-91cb-348aecfc92b5" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#73679e6f-5d5c-4c8e-9186-b3d7443127b0" data-bs-toggle="tab" href="#73679e6f-5d5c-4c8e-9186-b3d7443127b0" id="bac78715-f572-48b7-9f32-f31a5cda5d72" role="tab">
-         <span class="text-secondary" id="13332d9a-505d-400c-b6e0-b4e1d1404975">
+        <a class="nav-link active" data-bs-target="#c7e885ab-eb57-4cd6-929f-82e684f41a27" data-bs-toggle="tab" href="#c7e885ab-eb57-4cd6-929f-82e684f41a27" id="ac571872-d342-4c10-a276-3e6296b4b7ce" role="tab">
+         <span class="text-secondary" id="34dc85d2-1884-4ba3-967c-0a2829177cce">
           Badge
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#01908ec8-9b76-44e8-9257-8a8f0a4ebe0b" data-bs-toggle="tab" href="#01908ec8-9b76-44e8-9257-8a8f0a4ebe0b" id="ccef4115-e53e-41e2-afd8-03f11d4c0659" role="tab">
-         <span class="text-secondary" id="88d1029a-00ba-48d9-9e45-120f426b4d09">
+        <a class="nav-link" data-bs-target="#da6f00a8-c355-4c9e-a2f0-7660c3e20a7d" data-bs-toggle="tab" href="#da6f00a8-c355-4c9e-a2f0-7660c3e20a7d" id="0439c4bd-1e3a-4dc6-9ca5-3235cc39020b" role="tab">
+         <span class="text-secondary" id="a3260771-6f3b-4b5c-947b-7076b8674b9c">
           Appearance
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="73679e6f-5d5c-4c8e-9186-b3d7443127b0">
-        <div class="mt-5" id="f5cf8c72-d328-487d-80bc-c4c515c95967">
-         <div class="d-flex justify-content-between" id="e976a4b3-eb3a-4e6a-b6e7-21ef16eb9d91">
-          <h1 id="c09f9fcb-ec85-427e-b47f-d908cfbca2ea">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="c7e885ab-eb57-4cd6-929f-82e684f41a27">
+        <div class="mt-5" id="9f0cf8e8-7880-4f3a-9106-20b9c0512823">
+         <div class="d-flex justify-content-between" id="6947ba1c-c02c-4259-8c36-73ebc78c2305">
+          <h1 id="205062a6-2224-4400-9f98-a2cb73a7eaf1">
            Class
-           <span class="text-primary" id="8b7d7e78-7fcb-425b-a024-8c29a13e146c">
+           <span class="text-primary" id="274c5ffc-c1ff-4f58-88ff-ee1378d68204">
             Badge
            </span>
           </h1>
-          <div id="41817c0b-c99d-4e52-892c-da7c69185fce">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#185e7d65-7a37-4b66-98a8-5f094023a847" data-bs-toggle="collapse" id="2c793fce-03ec-4c31-975b-74b04e90b68e" onclick="return false;" type="button">
+          <div id="3e6fe520-4eab-42b4-afc3-9d72bebc5afa">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#877d9163-d6b5-4a49-a3a5-4b27c06847ec" data-bs-toggle="collapse" id="065e8ce8-172a-4ab2-9957-856cc1921266" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="88c3555e-919b-4096-b3d1-4a66fde7e95f">
+         <span class="text-muted" id="f9575a3a-0273-4c73-a28d-e2749bb813f8">
           A web component for a badge.
          </span>
-         <pre id="f4bec383-373f-493f-b4ed-bba5361b9eed"><code class="language-python">Badge(label)</code></pre>
-         <div class="ms-3 collapse" id="185e7d65-7a37-4b66-98a8-5f094023a847">
-          <h6 id="a14bf7c8-4e5e-4ea2-be6c-697aa1488e59">
+         <pre id="b2ee47bc-75a0-49c3-a151-223556bbf57f"><code class="language-python">Badge(label)</code></pre>
+         <div class="ms-3 collapse" id="877d9163-d6b5-4a49-a3a5-4b27c06847ec">
+          <h6 id="ac846b93-efd2-483e-84ba-37d4a18faded">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="69192951-5a8c-4f9a-bdf4-7e5e6aa0c686">
+          <table class="table table-sm bg-light" id="6da2bdfc-4671-4eb9-9b75-8e1cd744807c">
            <thead>
             <tr>
              <th scope="col">
@@ -740,43 +740,43 @@ Panel(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="16ae167a-809d-49b3-b6dc-7fc835e9ce5d">
-          <h6 id="5cffac72-9bcc-4bd2-8d68-29cb3176e6e9">
+         <div class="ms-3" id="4dcebb50-84f9-49f2-96e8-ea181d14d099">
+          <h6 id="878e1816-9fd5-472d-9786-ecb0b5933e6b">
            Example
           </h6>
-          <pre id="a30c5dce-287a-443e-b887-9d8feef35467"><code class="language-python">from bootwrap import Badge
+          <pre id="bea3e55c-d3ce-4713-be53-432ad30742d8"><code class="language-python">from bootwrap import Badge
 Badge('Some Badge').as_dark()
 </code></pre>
          </div>
-         <div class="ms-3" id="f114304c-ab8c-410f-9a9b-b594b491095b">
-          <span class="badge text-bg-dark" id="5952cae3-8d4f-4423-9653-31a48721d349">
+         <div class="ms-3" id="b1f08d61-2ae2-4599-867b-77a075baee39">
+          <span class="badge text-bg-dark" id="d8217bca-3b2b-4a2c-9838-8c370925e24e">
            Some Badge
           </span>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="01908ec8-9b76-44e8-9257-8a8f0a4ebe0b">
-        <div class="mt-3" id="1907a749-b765-431b-a34d-e12db5e552a5">
-         <div id="e2535c59-6e82-4b8a-96fa-b332f8edce8b">
+       <div class="tab-pane fade" id="da6f00a8-c355-4c9e-a2f0-7660c3e20a7d">
+        <div class="mt-3" id="44e96a75-fb76-40ff-a5b5-b9fa749760ad">
+         <div id="87e3f8b4-9a29-48bf-b256-b4151dc0f56d">
           <div class="row">
            <div class="col-md">
-            <div id="8d8e2025-8931-4bbb-894d-4478a05b8ca7">
-             <h1 id="225fe649-012f-4961-bf05-5299fa6b05ef">
+            <div id="aeab5d72-5095-4cfd-a229-5a696f26dd70">
+             <h1 id="548b538d-42a2-4a4d-afda-e18240c363e2">
               Appearance
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="3d9981b0-3fcb-46ce-af8c-c9e74dfc106b">
+            <div id="32a93c1c-6021-4ca7-9b0f-a37ef35f3dc5">
             </div>
            </div>
           </div>
          </div>
-         <div id="b47fcd34-7a24-472c-afda-7a0e08ab69fa">
+         <div id="422f4a09-c81a-4356-96b8-f703b72e62ae">
           <div class="row">
            <div class="col-md">
-            <div id="79476941-8fab-40b5-9495-1c60009a00cd">
-             <p id="bbf2bc45-de22-41c4-b6b1-ff2aa88a5375">
+            <div id="3a16beda-7663-4c97-995d-205ced4fe75d">
+             <p id="b88ed21b-903f-475f-a4c7-8160cb4842ec">
               Change
               <code>
                Badge
@@ -818,8 +818,8 @@ Badge('Some Badge').as_dark()
             </div>
            </div>
            <div class="col-md">
-            <div id="d4390d5d-fa57-4881-8166-c0c73d6eb9af">
-             <pre id="9e77b524-70e5-476f-addb-0f5cb6123247"><code class="language-python">from bootwrap import Panel, Badge
+            <div id="31ce8cf4-f78c-4185-b247-0f9e8a65f08d">
+             <pre id="fa15afd9-0ff4-478d-8c0d-d7c4e27d6e80"><code class="language-python">from bootwrap import Panel, Badge
 panel = Panel(
   Badge("Primary").as_primary(),
   Badge("Secondary").as_secondary(),
@@ -833,29 +833,29 @@ panel = Panel(
 for anchor in panel:
   anchor.mb(1)
 panel</code></pre>
-             <div id="6ae8264b-7021-4ea3-b63d-e1d610339142">
-              <span class="badge text-bg-primary mb-1" id="ad758bbe-b3e6-4be9-8b1a-4e21e10a88f2">
+             <div id="df3ae392-34eb-4d27-9344-ffe3e8452c83">
+              <span class="badge text-bg-primary mb-1" id="c8355a73-25a0-428c-971c-f143350765af">
                Primary
               </span>
-              <span class="badge text-bg-secondary mb-1" id="136cfa41-5119-4e2f-a1e9-dc525ec046b1">
+              <span class="badge text-bg-secondary mb-1" id="dd665bf8-9e5f-4cbe-8599-3d0d7080e092">
                Secondary
               </span>
-              <span class="badge text-bg-success mb-1" id="56ad961b-ec54-4cc1-bb0e-9e8b9fe465b3">
+              <span class="badge text-bg-success mb-1" id="74ccdc40-32ec-46c4-9b7e-a24704015bcb">
                Success
               </span>
-              <span class="badge text-bg-warning mb-1" id="1ea9a761-985d-4bdb-9931-507c343116fe">
+              <span class="badge text-bg-warning mb-1" id="4fc424c7-8622-4a50-af8b-b6eb2af6efbf">
                Warning
               </span>
-              <span class="badge text-bg-danger mb-1" id="44dbf3c5-20c5-48f6-b6a1-8f148193ff6f">
+              <span class="badge text-bg-danger mb-1" id="86667895-39a5-425b-a79a-ec57ec3ef7dc">
                Danger
               </span>
-              <span class="badge text-bg-info mb-1" id="219c27dc-fa1e-49ef-ab4d-6f87c6ffa85e">
+              <span class="badge text-bg-info mb-1" id="ecc6d550-10bc-47cb-b624-c6ed62313493">
                Info
               </span>
-              <span class="badge text-bg-light mb-1" id="a50d04a3-b621-4f64-be4a-cde825f8707a">
+              <span class="badge text-bg-light mb-1" id="7ae8edd8-163e-4920-a7be-7e4afb0a9afe">
                Light
               </span>
-              <span class="badge text-bg-dark mb-1" id="72397cb5-81f6-470a-a093-95c5713148b4">
+              <span class="badge text-bg-dark mb-1" id="820e173c-71b5-43f1-84d0-ec0c22489338">
                Dark
               </span>
              </div>
@@ -868,99 +868,99 @@ panel</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="9a37d77a-b13c-4b66-b6a4-e07019cda9c3">
-     <div id="31f36e2b-3449-46de-93f7-d69a149c4869">
+    <div class="tab-pane fade" id="2dfe11c3-44d7-45e6-92d4-820258d5ef71">
+     <div id="bebb3c6d-57af-48d9-9926-0f085f28770b">
       <hr/>
-      <ul class="nav" id="cf4cf66b-0b12-46df-b3bd-9f6f7efc4e4e" role="tablist">
+      <ul class="nav" id="69614e05-7a92-457c-9ab4-63ed9a299684" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#fe3940b6-2820-4e84-939f-c8ce81f06d51" data-bs-toggle="tab" href="#fe3940b6-2820-4e84-939f-c8ce81f06d51" id="259787a1-57ac-4f35-885a-56de056ef575" role="tab">
-         <span class="text-secondary" id="0a3457f0-5768-4ca7-aaf7-6a436ba2aae3">
+        <a class="nav-link active" data-bs-target="#953e64ba-ca8b-4615-92f0-e150a125f822" data-bs-toggle="tab" href="#953e64ba-ca8b-4615-92f0-e150a125f822" id="fd5d549b-c2a2-4857-bd05-154724feb8ad" role="tab">
+         <span class="text-secondary" id="39f403e6-cbac-4cb9-a820-65c9f7d766e7">
           Button
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#cb377ecf-9d45-4fc6-8244-629330fe617d" data-bs-toggle="tab" href="#cb377ecf-9d45-4fc6-8244-629330fe617d" id="ab0cc32f-5b57-41ed-9569-09c0f67a61f7" role="tab">
-         <span class="text-secondary" id="0ca9e49e-d3af-4c46-b347-312e95428289">
+        <a class="nav-link" data-bs-target="#47ffe5a4-f3a9-4fe3-9c84-83acf227908f" data-bs-toggle="tab" href="#47ffe5a4-f3a9-4fe3-9c84-83acf227908f" id="990bd60f-10ce-4b53-b7ff-a8c10521d0f0" role="tab">
+         <span class="text-secondary" id="3dc45965-8d5f-4c1b-882d-6c01904e19c4">
           Appearance
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#3c047865-5822-4841-b907-199406726366" data-bs-toggle="tab" href="#3c047865-5822-4841-b907-199406726366" id="30fe45df-3a02-4303-a326-6177dea5d730" role="tab">
-         <span class="text-secondary" id="41d261d0-7ca7-4fcc-814f-5d70ab0c6aef">
+        <a class="nav-link" data-bs-target="#60d20193-fe80-493a-aaa0-12de4e64013b" data-bs-toggle="tab" href="#60d20193-fe80-493a-aaa0-12de4e64013b" id="1a02afe4-128e-4923-80fc-6f0d9a9e74cb" role="tab">
+         <span class="text-secondary" id="96da5eb8-2b17-4baf-a56a-af2600646bda">
           Outline
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#a3da8f14-f5f6-4c6b-94c0-c217f2c72cbc" data-bs-toggle="tab" href="#a3da8f14-f5f6-4c6b-94c0-c217f2c72cbc" id="c600273a-9629-4380-9738-8e7140b2da87" role="tab">
-         <span class="text-secondary" id="bb6f7b4d-af70-4df8-b506-b9e7a2db1128">
+        <a class="nav-link" data-bs-target="#da09ac53-39af-4588-b66b-c4cc8fab4727" data-bs-toggle="tab" href="#da09ac53-39af-4588-b66b-c4cc8fab4727" id="8aa88c9b-48da-4965-b4ff-adb89a0a3977" role="tab">
+         <span class="text-secondary" id="531a3a93-54cd-49ea-bb9e-ba5e4797ae3f">
           Disable
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#b727a363-76e2-4330-9661-f86c13cf2030" data-bs-toggle="tab" href="#b727a363-76e2-4330-9661-f86c13cf2030" id="77beeb23-8f3f-44ff-b7ad-d3e3920f660d" role="tab">
-         <span class="text-secondary" id="b0d0e10e-be56-4f33-bdb7-c87a86df44c1">
+        <a class="nav-link" data-bs-target="#c8b41687-d134-4ed6-894a-6b83cf388e90" data-bs-toggle="tab" href="#c8b41687-d134-4ed6-894a-6b83cf388e90" id="b1789aab-2543-41e9-8361-21ca99f6c919" role="tab">
+         <span class="text-secondary" id="511fb283-289a-471f-bed0-81ca8cec82c3">
           Link Resource
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#84334d66-afdc-4571-a64e-3c9c6cb4a302" data-bs-toggle="tab" href="#84334d66-afdc-4571-a64e-3c9c6cb4a302" id="65b4b1d2-455d-4750-9ce9-e5ec37be146e" role="tab">
-         <span class="text-secondary" id="e4a06835-70c5-45dd-a879-e9e659e30c03">
+        <a class="nav-link" data-bs-target="#da243129-7562-4727-8d51-5b572690f8e9" data-bs-toggle="tab" href="#da243129-7562-4727-8d51-5b572690f8e9" id="1864e6b1-adb4-440d-b091-c37f172b3fe3" role="tab">
+         <span class="text-secondary" id="c06d3763-ba41-4cbd-9ad2-d42d280f4cfe">
           Open Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#917948e1-b5f5-4596-8d29-e0f90a960ee9" data-bs-toggle="tab" href="#917948e1-b5f5-4596-8d29-e0f90a960ee9" id="cd65fda2-fb91-459c-bb88-6527f5c9418f" role="tab">
-         <span class="text-secondary" id="9e7516ec-a4d7-4844-bb72-814c7dd47c4c">
+        <a class="nav-link" data-bs-target="#52a57df7-d86d-46c2-9f83-9a76d6ba8191" data-bs-toggle="tab" href="#52a57df7-d86d-46c2-9f83-9a76d6ba8191" id="f091ce7a-c73d-44a6-8788-da027c9205c4" role="tab">
+         <span class="text-secondary" id="25a66a07-2017-4c82-8c38-5f9cfa7c5ea8">
           Close Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#09fc5a45-40ba-4b05-a8ff-5cc9cb302366" data-bs-toggle="tab" href="#09fc5a45-40ba-4b05-a8ff-5cc9cb302366" id="cc3a7daa-42cc-4922-99fc-c41d6046dbb2" role="tab">
-         <span class="text-secondary" id="6679c3ce-d417-4213-b1d4-b140bc354791">
+        <a class="nav-link" data-bs-target="#c65a6bbf-4abf-4de7-9e8f-6c491b3e40a3" data-bs-toggle="tab" href="#c65a6bbf-4abf-4de7-9e8f-6c491b3e40a3" id="90ecf44e-71b6-4204-a704-883c3f6c1c47" role="tab">
+         <span class="text-secondary" id="cc8b7123-7a98-46ab-a863-22add8ea9145">
           Expand/Collapse Panel
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#e0a18eb7-417b-442b-b37e-577534b98509" data-bs-toggle="tab" href="#e0a18eb7-417b-442b-b37e-577534b98509" id="8e138374-7246-4120-a7f4-b4c9f184d6d1" role="tab">
-         <span class="text-secondary" id="ff875dea-4be3-43ec-b562-22f1907b811f">
+        <a class="nav-link" data-bs-target="#e0729482-2535-4736-b98f-3224417f3b52" data-bs-toggle="tab" href="#e0729482-2535-4736-b98f-3224417f3b52" id="1dadd176-f18c-4d80-9107-1893399ec7c2" role="tab">
+         <span class="text-secondary" id="83ad0fc4-b9ab-4fa1-9691-31aa97779d3d">
           Submit Action
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="fe3940b6-2820-4e84-939f-c8ce81f06d51">
-        <div class="mt-5" id="10401c8f-7a7a-4d86-8c68-69cbcc7bb850">
-         <div class="d-flex justify-content-between" id="99ca149b-467f-4fb8-b45e-c7a378debb84">
-          <h1 id="ff48534e-cc2d-41c1-b03f-610178eb5e97">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="953e64ba-ca8b-4615-92f0-e150a125f822">
+        <div class="mt-5" id="8c845120-e97b-4b26-82fe-c1c756ae706d">
+         <div class="d-flex justify-content-between" id="cf7d68d8-1ede-4d7a-ac7f-18fb59906d9b">
+          <h1 id="515c259d-d97f-490e-a659-d6575d768164">
            Class
-           <span class="text-primary" id="dca13a81-7d77-402d-abb0-db784e88db84">
+           <span class="text-primary" id="1c2d0ef9-280b-42a8-9cb0-fe441d0e3876">
             Button
            </span>
           </h1>
-          <div id="63206ad1-2ffc-4bea-b19a-11c400747caa">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#ec787c7d-d569-4f64-8531-ecb25cbd6aa5" data-bs-toggle="collapse" id="a9977c53-be96-47bd-a0b0-098a6d798fb1" onclick="return false;" type="button">
+          <div id="6bafe8a6-34b6-4433-9750-2d06d53b54b3">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#d39c7fa6-5b07-43db-99a2-a899a5baf36d" data-bs-toggle="collapse" id="707568cd-0117-4c4c-b4f2-1930ea611fcf" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="1a537679-715a-433f-845b-6922b59f400e">
+         <span class="text-muted" id="baf4587a-3d75-4c8b-a117-f3c9de74f8fa">
           A web component for a button.
          </span>
-         <pre id="cc5e9518-facc-4b98-b1db-2261c42ca295"><code class="language-python">Button(name)</code></pre>
-         <div class="ms-3 collapse" id="ec787c7d-d569-4f64-8531-ecb25cbd6aa5">
-          <h6 id="b2432c24-d95b-491a-8051-0c425c276d1f">
+         <pre id="4673ff96-5dcd-4ccc-8822-e2e8bdc9b65c"><code class="language-python">Button(name)</code></pre>
+         <div class="ms-3 collapse" id="d39c7fa6-5b07-43db-99a2-a899a5baf36d">
+          <h6 id="3ae65634-5793-4fff-ae1d-42bc65c4982f">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="2c09dcc3-8ca2-41d3-8577-c653980e4a0c">
+          <table class="table table-sm bg-light" id="ee8cb3f0-1978-43d0-b85f-eb059ee36545">
            <thead>
             <tr>
              <th scope="col">
@@ -993,7 +993,7 @@ panel</code></pre>
            </tbody>
           </table>
          </div>
-         <p id="c87b6180-74f7-4a28-8b32-614086551753">
+         <p id="f0c20a48-ef0b-42dc-a779-65b5e27cfa15">
           Without applying a stylized method
           <code>
            Button
@@ -1005,42 +1005,42 @@ panel</code></pre>
           </code>
           .
          </p>
-         <div class="ms-3" id="7083ec61-bd7a-424e-b947-012302dce547">
-          <h6 id="1bcbdb55-6cdd-4177-b9d5-96607abc2bb3">
+         <div class="ms-3" id="e0bc8a86-cdf1-44da-9f8b-57cf8c8f467f">
+          <h6 id="b4e2834c-5058-4d45-a34f-f6a153ee4575">
            Example
           </h6>
-          <pre id="53cbd0f3-7ac5-4d11-88be-6d679e8bf453"><code class="language-python">from bootwrap import Button
+          <pre id="2fca5f7e-5c6a-428b-80bf-0035f0f16ac9"><code class="language-python">from bootwrap import Button
 Button('Google Search').link('https://www.google.com/')
 </code></pre>
          </div>
-         <div class="ms-3" id="ec45dcfc-abce-4d2a-aefc-fa146974de5c">
-          <a class="btn" href="https://www.google.com/" id="cf40b435-41fc-43c5-b89c-ab38f1b02f3c" role="button">
+         <div class="ms-3" id="c3f5ae5d-3b40-4547-80b5-a8e0dbd6600c">
+          <a class="btn" href="https://www.google.com/" id="46590e64-549c-4247-897b-e2d82a629bfb" role="button">
            Google Search
           </a>
          </div>
-         <div class="mt-5" id="8f96a63f-c677-4b43-9553-d15a6197da0f">
-          <div class="d-flex justify-content-between" id="82ff6b62-28fd-43ad-87f2-adee7706dcb8">
-           <h4 id="80e4e2d2-4014-401f-bb1c-e36d1cc4f4ed">
+         <div class="mt-5" id="35a6ffc0-8f7a-40ff-8e5b-fdbd787da9c3">
+          <div class="d-flex justify-content-between" id="1190bbb2-cb2a-4d7a-a696-0eca9c1c5297">
+           <h4 id="bbdb578a-d79d-4ef3-b9bb-2fdd1e2ab08d">
             Method
-            <span class="text-primary" id="b10182df-c0ee-4535-b36c-f6bf380c8502">
+            <span class="text-primary" id="e4c1da05-4d20-4e29-a8d4-81d192e0f352">
              with_icon
             </span>
            </h4>
-           <div id="3d51761d-47fb-496b-83cb-9025c758fea0">
-            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#adc3abfa-d50c-4466-a57c-0f29d5fbb6b9" data-bs-toggle="collapse" id="e1cfad2a-552e-4869-b4e4-564341c47d98" onclick="return false;" type="button">
+           <div id="64db2355-5064-4d12-b54f-618746bf1700">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#396a6c35-c76f-4a6e-a98c-bb71456b17e7" data-bs-toggle="collapse" id="f59b2b33-2e8b-4a2a-9df4-2f0e20a4a582" onclick="return false;" type="button">
              Argument
             </button>
            </div>
           </div>
-          <span class="text-muted" id="c3c60262-18ef-4838-acd5-b376f28f9f9f">
+          <span class="text-muted" id="05f9f4d7-c312-4861-964b-ca89055db80e">
            Makes button with icon.
           </span>
-          <pre id="36f8b068-06b8-40d3-aa9a-94ed83833758"><code class="language-python">with_icon(icon, right_side=False)</code></pre>
-          <div class="ms-3 collapse" id="adc3abfa-d50c-4466-a57c-0f29d5fbb6b9">
-           <h6 id="1aa21010-c6b3-4555-bfea-ad6ce493873c">
+          <pre id="cd014167-163a-46e1-8269-48a2afc221e1"><code class="language-python">with_icon(icon, right_side=False)</code></pre>
+          <div class="ms-3 collapse" id="396a6c35-c76f-4a6e-a98c-bb71456b17e7">
+           <h6 id="703f8560-14ed-4d2a-9876-a5c7ebf07e8e">
             Arguments
            </h6>
-           <table class="table table-sm bg-light" id="d5e91ff8-15dd-4673-ad1a-ab84d87055a6">
+           <table class="table table-sm bg-light" id="a54072a2-20ef-47e5-98be-082f63b33851">
             <thead>
              <tr>
               <th scope="col">
@@ -1097,11 +1097,11 @@ Button('Google Search').link('https://www.google.com/')
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="479eaaf8-d7b2-4687-9e8b-89c3a8ad8135">
-           <h6 id="23f7440f-b6fb-49c8-badd-cfd26e5f7e93">
+          <div class="ms-3" id="e5cd8f45-fe83-4f07-8fb9-a67943fcd1a0">
+           <h6 id="cb5b7332-b5a8-4b9e-b4a9-4e38c64dc43f">
             Example
            </h6>
-           <pre id="140cda36-9582-45f5-b4b6-c980f11043a0"><code class="language-python">from bootwrap import Button, Icon, Panel
+           <pre id="51556ba1-d1a7-4978-bf48-1869eb5a8c4f"><code class="language-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")
@@ -1109,16 +1109,16 @@ btn_right = Button("Right").with_icon(ico_right, True).as_primary()
 Panel(btn_left, btn_right)
 </code></pre>
           </div>
-          <div class="ms-3" id="511a1a5a-31e3-40db-85d8-8efb87efccd7">
-           <div id="eb862d24-f4ef-4714-84c5-b406146b1e8f">
-            <button class="btn btn-primary" id="5b919fac-0721-41e3-aed4-952728f1e33b" onclick="return false;">
-             <i class="fa-solid fa-arrow-left" id="aa46055b-9652-4ad4-be9b-4cf3eac7be63">
+          <div class="ms-3" id="f6b76897-6a65-4bfd-bce6-35beeadcbb6c">
+           <div id="882d3516-dda4-448f-a23b-efdf2181d9b1">
+            <button class="btn btn-primary" id="67d6e620-58da-46f5-b059-0b7c3750d272" onclick="return false;">
+             <i class="fa-solid fa-arrow-left" id="19db0adf-8874-47fe-a2c5-cbee8982e5a6">
              </i>
              Left
             </button>
-            <button class="btn btn-primary" id="e02d78e4-4411-459b-9757-3b9d83219651" onclick="return false;">
+            <button class="btn btn-primary" id="a7007c31-48c8-48bd-8605-6c38657eab49" onclick="return false;">
              Right
-             <i class="fa-solid fa-arrow-right" id="9500cad2-0bb3-48a2-bd38-6b3a239d6893">
+             <i class="fa-solid fa-arrow-right" id="cde85fb7-4182-4d60-8e51-da80412c8e4a">
              </i>
             </button>
            </div>
@@ -1126,28 +1126,28 @@ Panel(btn_left, btn_right)
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="cb377ecf-9d45-4fc6-8244-629330fe617d">
-        <div class="mt-3" id="00255a21-99fa-45db-bfa3-a7c3765b43f7">
-         <div id="11f53431-5f66-4243-bc65-cb910c31265d">
+       <div class="tab-pane fade" id="47ffe5a4-f3a9-4fe3-9c84-83acf227908f">
+        <div class="mt-3" id="7992e05f-91d2-4bfb-975d-753a4f4cc617">
+         <div id="e4acac4c-bf55-4ff4-a709-b5670c260123">
           <div class="row">
            <div class="col-md">
-            <div id="3f0d7d8c-8ab9-4bd0-b90f-bd6d26f02447">
-             <h1 id="6a21f79e-6965-492c-b93b-413711974f05">
+            <div id="355f4005-7a42-410c-af94-bfd54a179cbc">
+             <h1 id="b9f54635-0cdb-4e01-a64b-ead678052c03">
               Appearance
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="6b8e472c-4515-40ce-a148-33063f81cdc0">
+            <div id="48964d36-6939-4b2a-bbd5-a71748956186">
             </div>
            </div>
           </div>
          </div>
-         <div id="80de1cde-e25b-4bb6-9d6e-4bafad367bd3">
+         <div id="c45f3f5f-06d3-48e6-b3ae-fd721ed0692e">
           <div class="row">
            <div class="col-md">
-            <div id="004f3b68-4880-4923-b579-f3a34de1a8ca">
-             <p id="c9593e70-0fca-4770-932e-238c3e8d08a7">
+            <div id="586bf7dd-97f5-462b-ae31-1027c899f33b">
+             <p id="210a546c-3f5a-4530-8da6-3c74e382eb2f">
               Change
               <code>
                Button
@@ -1189,8 +1189,8 @@ Panel(btn_left, btn_right)
             </div>
            </div>
            <div class="col-md">
-            <div id="e19526e8-f624-449a-b728-bac6c5eb37f7">
-             <pre id="7cea7495-1650-4446-a52f-075784cb9cac"><code class="language-python">from bootwrap import Panel, Button
+            <div id="5c691352-aeca-454d-90ac-13844fce7396">
+             <pre id="94e07cd7-b51a-4385-82e2-8c11f9527053"><code class="language-python">from bootwrap import Panel, Button
 panel = Panel(
   Button("Primary").link("#").as_primary(),
   Button("Secondary").link("#").as_secondary(),
@@ -1204,29 +1204,29 @@ panel = Panel(
 for anchor in panel:
   anchor.mb(1)
 panel</code></pre>
-             <div id="cb4bb99b-d2d6-498f-bc31-55df970f4c25">
-              <a class="mb-1 btn btn-primary" href="#" id="4afb56a2-0b45-411f-b9ff-c1f494031093" role="button">
+             <div id="d4530440-57be-4ca3-836f-634f6c7de85c">
+              <a class="mb-1 btn btn-primary" href="#" id="08afd5bf-7ce6-4444-8fdc-42d756e31c13" role="button">
                Primary
               </a>
-              <a class="mb-1 btn btn-secondary" href="#" id="6ff7aa8e-260d-4f31-b85c-47959ea7bc58" role="button">
+              <a class="mb-1 btn btn-secondary" href="#" id="574ad944-8840-4b3e-9f4d-88f8011e7ffb" role="button">
                Secondary
               </a>
-              <a class="mb-1 btn btn-success" href="#" id="a3858ac2-147a-410c-b9ba-4b282550067b" role="button">
+              <a class="mb-1 btn btn-success" href="#" id="12ea0926-42c4-4db4-98e3-62228f5c2ce2" role="button">
                Success
               </a>
-              <a class="mb-1 btn btn-warning" href="#" id="28f3bbbf-cd9e-4d5c-88d4-7902a04b495a" role="button">
+              <a class="mb-1 btn btn-warning" href="#" id="901136d6-db22-461d-bfcd-0094bf3acf37" role="button">
                Warning
               </a>
-              <a class="mb-1 btn btn-danger" href="#" id="b940e131-c49c-4f9f-833e-09f0f0a79122" role="button">
+              <a class="mb-1 btn btn-danger" href="#" id="a5c47653-10ed-46f5-ab2b-f86ec6cae6b3" role="button">
                Danger
               </a>
-              <a class="mb-1 btn btn-info" href="#" id="c0247ec8-8c78-4c06-8a1c-21c7b5c0fcbb" role="button">
+              <a class="mb-1 btn btn-info" href="#" id="95f72191-7499-4909-a7d1-914124aded98" role="button">
                Info
               </a>
-              <a class="mb-1 btn btn-light" href="#" id="07e29401-27bf-4bd0-b64a-3b93a07cbd30" role="button">
+              <a class="mb-1 btn btn-light" href="#" id="81df01e2-f479-41d1-aee5-82a66896e719" role="button">
                Light
               </a>
-              <a class="mb-1 btn btn-dark" href="#" id="888c0743-b443-4565-beac-1a78d49b9a44" role="button">
+              <a class="mb-1 btn btn-dark" href="#" id="0a4ab751-fee0-45be-b5c1-8098aaf07b84" role="button">
                Dark
               </a>
              </div>
@@ -1236,28 +1236,28 @@ panel</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="3c047865-5822-4841-b907-199406726366">
-        <div class="mt-3" id="305dbd42-c9a5-4864-96cf-fe7436c45e7d">
-         <div id="a8f7ecbd-1080-45c5-b71f-17757c72ef33">
+       <div class="tab-pane fade" id="60d20193-fe80-493a-aaa0-12de4e64013b">
+        <div class="mt-3" id="f6090bda-27ae-4daa-84a3-9baea20efd9e">
+         <div id="4a37d9d0-f3a3-4fbb-9d36-5e45a01708bf">
           <div class="row">
            <div class="col-md">
-            <div id="fd4e2cff-f0a6-458f-a986-14d3e1040145">
-             <h1 id="9ce77b84-460a-49cc-a2d4-f572b3c991c0">
+            <div id="143f7c22-5f32-47bc-8e2c-4f36b80673cb">
+             <h1 id="90e99cdb-df58-465d-99b0-30589ee95949">
               Outline
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="01a74171-cdb2-4faf-9cb1-a4de3c83e2c9">
+            <div id="1df53f2a-fcad-4ae4-9489-1f4891226a76">
             </div>
            </div>
           </div>
          </div>
-         <div id="34c39ff0-2fb6-46e4-8a56-345586ff13fb">
+         <div id="3d5332e2-310b-4dd9-a034-8d7973a6ff75">
           <div class="row">
            <div class="col-md">
-            <div id="50659349-a619-484b-ae46-098eb54adee9">
-             <p id="804b7bd6-52bc-4f29-ba60-a2051a04e8a5">
+            <div id="dbf52fce-de19-4c56-a9f9-e3988b4bdbd5">
+             <p id="ab73c772-2dd0-43c9-8e42-6fee7fb6dbf2">
               Make
               <code>
                Button
@@ -1271,8 +1271,8 @@ panel</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="a3a7103c-55d9-4840-88b8-9be7a86e7ba8">
-             <pre id="e9e6c13a-a16c-4df1-b5f4-7bbf0d47203a"><code class="language-python">from bootwrap import Panel, Button
+            <div id="eafb796b-b308-430e-9045-ea31722e348b">
+             <pre id="e367698b-a79d-4df2-90b5-2df3ba49e26b"><code class="language-python">from bootwrap import Panel, Button
 panel = Panel(
   Button("Primary").link("#").as_primary().as_outline(),
   Button("Secondary").link("#").as_secondary().as_outline(),
@@ -1286,29 +1286,29 @@ panel = Panel(
 for anchor in panel:
   anchor.mb(1)
 panel</code></pre>
-             <div id="bf4d8ef3-a2c7-4797-8481-609a94315b74">
-              <a class="mb-1 btn btn-outline-primary" href="#" id="c028a759-ca98-4773-95c9-c8e7638d707e" role="button">
+             <div id="f39914e3-c720-4f0b-bda4-6faf2d323a10">
+              <a class="mb-1 btn btn-outline-primary" href="#" id="9b1dd198-9eff-4e3d-b1f7-9a342ec87eab" role="button">
                Primary
               </a>
-              <a class="mb-1 btn btn-outline-secondary" href="#" id="6db9712d-827c-4d2e-bc98-f5b133990ebe" role="button">
+              <a class="mb-1 btn btn-outline-secondary" href="#" id="7cc5521c-a74d-4ccd-888c-314e433eb3a6" role="button">
                Secondary
               </a>
-              <a class="mb-1 btn btn-outline-success" href="#" id="e794f10a-b4e6-4807-bf16-461ff2616dd6" role="button">
+              <a class="mb-1 btn btn-outline-success" href="#" id="c52551ab-189f-4e4b-8e3b-d8c2708afd8f" role="button">
                Success
               </a>
-              <a class="mb-1 btn btn-outline-warning" href="#" id="d345d3df-18a4-4660-a08e-3a84f414a40e" role="button">
+              <a class="mb-1 btn btn-outline-warning" href="#" id="738afd7a-a18a-44ea-8a95-6e207b3b4ed3" role="button">
                Warning
               </a>
-              <a class="mb-1 btn btn-outline-danger" href="#" id="477c892e-2b30-470c-bde4-b7fb49f8cd8b" role="button">
+              <a class="mb-1 btn btn-outline-danger" href="#" id="e2ce676b-4647-46df-91df-3acb6f3a73d4" role="button">
                Danger
               </a>
-              <a class="mb-1 btn btn-outline-info" href="#" id="61a98393-5977-4ed1-9bac-78abea7013c2" role="button">
+              <a class="mb-1 btn btn-outline-info" href="#" id="dbdbc611-7534-4d80-9310-a90bd98b9d99" role="button">
                Info
               </a>
-              <a class="mb-1 btn btn-outline-light" href="#" id="8e193e44-20a1-44c8-92ab-f75fdb3cae15" role="button">
+              <a class="mb-1 btn btn-outline-light" href="#" id="1e686fab-fa95-4805-872a-a6c2fb0c3310" role="button">
                Light
               </a>
-              <a class="mb-1 btn btn-outline-dark" href="#" id="8e10c89e-a535-44e0-8ad2-5f3213543b94" role="button">
+              <a class="mb-1 btn btn-outline-dark" href="#" id="54c28ae6-09a3-42b0-b4ab-d328770bafaa" role="button">
                Dark
               </a>
              </div>
@@ -1318,28 +1318,28 @@ panel</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="a3da8f14-f5f6-4c6b-94c0-c217f2c72cbc">
-        <div class="mt-3" id="8c3cdf01-94d1-4ae1-8eb2-4bd00b27af76">
-         <div id="b3d06f04-acca-4786-b45e-3302f85af76a">
+       <div class="tab-pane fade" id="da09ac53-39af-4588-b66b-c4cc8fab4727">
+        <div class="mt-3" id="ef8c3d10-6eab-44e9-9c3c-e860a1145629">
+         <div id="a268d4c8-b10d-4374-820e-fa4b5bf5bfda">
           <div class="row">
            <div class="col-md">
-            <div id="225cca04-c0fc-484d-a317-12183ebc1188">
-             <h1 id="0a1a1ab0-5611-468c-8e96-eceda022b311">
+            <div id="b0079713-a0de-4b3f-9705-af08447f2f89">
+             <h1 id="4bdd538a-fa7e-4c5f-8f51-1bb7a40f1372">
               Disable
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="1c0ffeea-86cc-45e3-9f7d-0d75f6d48347">
+            <div id="a9276b73-c28f-4482-afbf-c991b01515f2">
             </div>
            </div>
           </div>
          </div>
-         <div id="efe573a5-6b34-4b54-b6b9-ec9dc93e5c9d">
+         <div id="78beaa97-27c8-4dcd-bf98-e02c67ac981c">
           <div class="row">
            <div class="col-md">
-            <div id="d0aa114b-6edd-4cf3-b8f8-2aa0be7d75cb">
-             <p id="1071ce93-b06f-48cd-b597-7926250f13eb">
+            <div id="c7ab2606-621b-480c-8b84-33a2a8180058">
+             <p id="70de5023-588e-49e7-8a52-4743dd812b9a">
               But default the
               <code>
                Button
@@ -1361,17 +1361,17 @@ panel</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="7552bfd5-20c1-48e0-b33a-b4077bffc07d">
-             <pre id="f4756b99-1046-4191-ab8f-286512f6106e"><code class="language-python">from bootwrap import Panel, Button
+            <div id="dbfd635f-dc13-40a9-ae8f-b52ea82fe84a">
+             <pre id="82ea8a13-79d0-4c7c-8008-6cedcf5f201f"><code class="language-python">from bootwrap import Panel, Button
 Panel(
   Button("Enabled").as_primary(),
   Button("Disabled").as_primary().as_disabled()
 )</code></pre>
-             <div id="31dc0be8-5c4b-415b-83db-6a8a444adda1">
-              <button class="btn btn-primary" id="5707b12d-8e44-4a9e-8a63-7378c90b96d5" onclick="return false;">
+             <div id="3c30e5da-5c00-4bb5-b593-5ba317211e6f">
+              <button class="btn btn-primary" id="273f5593-c14b-401b-95ae-eecf5a0661aa" onclick="return false;">
                Enabled
               </button>
-              <button class="btn btn-primary" disabled="" id="93ff5729-cf4f-453f-b563-efbeafe242c9" onclick="return false;">
+              <button class="btn btn-primary" disabled="" id="62e24bcb-3ef7-4366-b088-1fcc4ec572e9" onclick="return false;">
                Disabled
               </button>
              </div>
@@ -1381,28 +1381,28 @@ Panel(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="b727a363-76e2-4330-9661-f86c13cf2030">
-        <div class="mt-3" id="a5b2a85b-adae-4314-a5b3-f62decf58c8d">
-         <div id="ce37544d-d993-4509-81cd-52c32141c229">
+       <div class="tab-pane fade" id="c8b41687-d134-4ed6-894a-6b83cf388e90">
+        <div class="mt-3" id="32919b23-4221-4cf2-a680-5727499d6065">
+         <div id="bf44f752-3b63-4d4b-a66e-fbea267e7e49">
           <div class="row">
            <div class="col-md">
-            <div id="21d540b1-b71f-487d-8ef1-deab3547bc7b">
-             <h1 id="c831c582-a621-4279-a7c8-1b8bf522723e">
+            <div id="a2987b5d-e6df-4b41-87c4-d7fad0ce4f47">
+             <h1 id="e9097d60-a08c-4ee3-92fd-46d67bf0454b">
               Link Resource
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="16422dca-ef0e-4dc4-b1c2-a9593025ffc8">
+            <div id="28fdaeed-ecd9-4b47-a658-769ec2728468">
             </div>
            </div>
           </div>
          </div>
-         <div id="bba866f5-dffd-49a9-b5b0-29ce9db8add5">
+         <div id="07f98b8f-81be-425d-9441-3529761463a8">
           <div class="row">
            <div class="col-md">
-            <div id="e18a3fe0-4a02-4b48-b888-e6c2b72fbe0c">
-             <p id="608b79b1-6d3e-44b2-9b8b-3b7c3fee4d29">
+            <div id="e664b45b-0a89-4404-90ab-b94ad5053d80">
+             <p id="d50288bd-02e4-4603-94df-1481480248d1">
               Associate
               <code>
                Button
@@ -1416,13 +1416,13 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="880794a1-0270-408d-8b29-5f1802271005">
-             <pre id="47563767-1d97-4b2e-80d0-423a150ac94f"><code class="language-python">from bootwrap import Panel, Button
+            <div id="a90f1351-5eb0-4ce3-a818-52e801ddb079">
+             <pre id="6a792dc1-f7f4-4fe9-ab92-af18cb6c0d9f"><code class="language-python">from bootwrap import Panel, Button
 Panel(
     Button("Google Search").as_primary().link("https://www.google.com/")
 )</code></pre>
-             <div id="9142ef7c-166f-4f8b-bd11-7f8db00f59de">
-              <a class="btn btn-primary" href="https://www.google.com/" id="221a5aad-db42-462e-abcd-381afa1a3a27" role="button">
+             <div id="d94d1e21-fe14-4790-9330-f13c8947e8a5">
+              <a class="btn btn-primary" href="https://www.google.com/" id="1882dae5-124d-4681-8b79-0270d4fc24c2" role="button">
                Google Search
               </a>
              </div>
@@ -1432,28 +1432,28 @@ Panel(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="84334d66-afdc-4571-a64e-3c9c6cb4a302">
-        <div class="mt-3" id="b780172a-d769-4dce-91d5-6e8a1ae5f2b3">
-         <div id="7dfb8b94-aed2-42d0-b528-9527e7e71c00">
+       <div class="tab-pane fade" id="da243129-7562-4727-8d51-5b572690f8e9">
+        <div class="mt-3" id="12da252b-38c0-4e8c-bc2b-1d89bdc53705">
+         <div id="512effea-b9b4-4a93-bc9d-3877e8f2f86b">
           <div class="row">
            <div class="col-md">
-            <div id="82a2b7af-f493-4fe1-a565-c9573eaf081d">
-             <h1 id="45ae2919-8c25-4cb6-99bb-e8a11dadd193">
+            <div id="e4d0145d-4be4-4cd6-bb56-a603d172fb34">
+             <h1 id="7f9e7c2c-592c-4efc-be8b-c4170d26a293">
               Open Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="055802db-9687-4e40-9600-b3bdaa026b65">
+            <div id="b2b9f41a-2043-494f-8bb1-744010f02ac5">
             </div>
            </div>
           </div>
          </div>
-         <div id="ccf0fc70-e2fd-4096-aeb1-06040cf359a9">
+         <div id="9a7e63ae-987a-4bd9-a2cb-9e4e7bcf6b63">
           <div class="row">
            <div class="col-md">
-            <div id="7334eb31-9ff7-4827-bfed-0927637744c5">
-             <p id="361b48bc-ffd3-4f0f-a21a-2c803d7d5856">
+            <div id="0ee82de5-8055-4654-877e-9dae7354c13d">
+             <p id="deb3b887-31ce-4064-8e3d-eb3ba504a8b2">
               Use
               <code>
                Button
@@ -1467,16 +1467,16 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="fe641ed7-7d6f-4a1a-920e-72c67d3f4ff6">
-             <pre id="038e3757-3bf5-467b-8bce-5520fecdbbe3"><code class="language-python">from bootwrap import Panel, Dialog, Button
+            <div id="6860f5bb-c7ad-4896-8572-3a8a83344963">
+             <pre id="989836f8-9521-4187-aae2-d53df72b376d"><code class="language-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="05d449b7-7243-4d5e-a851-acaf89873003">
-              <div class="modal" id="38c3c80b-63bb-4cb1-b89b-6bafbd166e5d">
+             <div id="e6f61331-fb34-4b23-98ad-8667c74cb5db">
+              <div class="modal" id="5a8ad5f9-6861-4504-823f-dab7bd45372a">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -1492,7 +1492,7 @@ Panel(dialog, button)</code></pre>
                 </div>
                </div>
               </div>
-              <button class="btn btn-primary" data-bs-target="#38c3c80b-63bb-4cb1-b89b-6bafbd166e5d" data-bs-toggle="modal" id="f965e85f-f293-48bf-8a70-97d0c713b156" onclick="return false;" type="button">
+              <button class="btn btn-primary" data-bs-target="#5a8ad5f9-6861-4504-823f-dab7bd45372a" data-bs-toggle="modal" id="48e82a0d-04d7-4b3e-bfff-8c1fedfba7ac" onclick="return false;" type="button">
                Say Hello
               </button>
              </div>
@@ -1502,28 +1502,28 @@ Panel(dialog, button)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="917948e1-b5f5-4596-8d29-e0f90a960ee9">
-        <div class="mt-3" id="688dad2b-2899-438d-a1ae-4806df65585f">
-         <div id="fe614cdd-f27c-4f60-8111-81ad81d16ad7">
+       <div class="tab-pane fade" id="52a57df7-d86d-46c2-9f83-9a76d6ba8191">
+        <div class="mt-3" id="e4f5726e-0881-47b0-bf9d-34314f53fb85">
+         <div id="c89b8be5-2d6a-4fff-98f3-36ccf0fbb2b1">
           <div class="row">
            <div class="col-md">
-            <div id="55f27a46-31a4-4cf4-aebc-e5c5837e4c4c">
-             <h1 id="6695512a-8dff-4eac-90af-9f577c189e95">
+            <div id="851029b8-62be-4611-94b2-8c60b67a5601">
+             <h1 id="6a856087-c5dd-406e-ad9f-03f2c0377e33">
               Close Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="cd4c4619-aa05-4720-92e3-01813d9cebdd">
+            <div id="e954c804-96df-42ea-aeac-061523e58138">
             </div>
            </div>
           </div>
          </div>
-         <div id="01101b91-8173-486f-ab66-fe155915c5e2">
+         <div id="ca5c542e-e8f7-486a-a2d4-350c41c9a3e3">
           <div class="row">
            <div class="col-md">
-            <div id="ca3a63ee-ba79-4d8e-bbea-bfb45b370092">
-             <p id="dbf9e689-78cf-4a80-8e23-bc4c285655b6">
+            <div id="90d2b585-e599-4ad6-8a44-ae2dd038ce77">
+             <p id="70aec6fe-1295-4376-a831-821ef69b1e00">
               Use
               <code>
                Button
@@ -1537,8 +1537,8 @@ Panel(dialog, button)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="f079a5a5-031d-4eb6-9740-008bb7292905">
-             <pre id="96a35329-d478-499d-896e-8ac27f13c0a2"><code class="language-python">from bootwrap import Panel, Dialog, Button
+            <div id="06f12c23-0b51-4b58-857e-59420cbcefd8">
+             <pre id="bfbe1b86-b6d5-4f8d-b955-38b5aa174ac8"><code class="language-python">from bootwrap import Panel, Dialog, Button
 dialog = Dialog(
   "Greeting",
   "Hello World!",
@@ -1546,8 +1546,8 @@ dialog = Dialog(
 )
 button = Button("Say Hello").as_primary().toggle(dialog)  
 Panel(dialog, button)</code></pre>
-             <div id="1fe25fb7-7b1a-465c-8af7-d537146042dd">
-              <div class="modal" id="851789e1-1872-422b-b23b-4b12ddb5d0ec">
+             <div id="8ac7c7d7-4689-41d5-b749-141c29ef25d4">
+              <div class="modal" id="2705bc50-ac39-4659-a448-0d6c39d6f00d">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -1561,14 +1561,14 @@ Panel(dialog, button)</code></pre>
                   Hello World!
                  </div>
                  <div class="modal-footer">
-                  <button class="btn btn-primary" data-bs-dismiss="modal" id="a1a348ef-e8fa-49cc-b00d-fef5b95a7c5f" onclick="return false;" type="button">
+                  <button class="btn btn-primary" data-bs-dismiss="modal" id="4fa2383d-3bc4-44e0-b3de-cac52d9579da" onclick="return false;" type="button">
                    Bye
                   </button>
                  </div>
                 </div>
                </div>
               </div>
-              <button class="btn btn-primary" data-bs-target="#851789e1-1872-422b-b23b-4b12ddb5d0ec" data-bs-toggle="modal" id="4e87b16e-68ee-49ef-a55d-28fc0a5747b5" onclick="return false;" type="button">
+              <button class="btn btn-primary" data-bs-target="#2705bc50-ac39-4659-a448-0d6c39d6f00d" data-bs-toggle="modal" id="4b043182-bf2a-48c1-8af7-e30bf8c95318" onclick="return false;" type="button">
                Say Hello
               </button>
              </div>
@@ -1578,28 +1578,28 @@ Panel(dialog, button)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="09fc5a45-40ba-4b05-a8ff-5cc9cb302366">
-        <div class="mt-3" id="a42ee638-a346-419f-a003-1158917eaa87">
-         <div id="48fd6261-16bf-411b-87e7-8a92c1b26a6f">
+       <div class="tab-pane fade" id="c65a6bbf-4abf-4de7-9e8f-6c491b3e40a3">
+        <div class="mt-3" id="f9c59895-6746-4f9a-9d6a-40be1a98e4ba">
+         <div id="b7a33761-c7d5-4b5c-9005-819464b56e91">
           <div class="row">
            <div class="col-md">
-            <div id="220d7096-3e4d-4556-a76f-b74748632899">
-             <h1 id="541bef23-3fa3-482f-af99-11fc994b023b">
+            <div id="aa928f68-4274-4110-9acf-af98f26d557e">
+             <h1 id="c3a1b313-b7f8-41c7-99fe-91050ce5afbe">
               Expand/Collapse Panel
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="6493ab6f-15a8-4ff2-89a4-6ee7dc549c28">
+            <div id="7ef8bfda-4146-4e17-a5ff-522fca8a6c88">
             </div>
            </div>
           </div>
          </div>
-         <div id="2b402dec-ea1f-48f0-bff6-79ba47c98e63">
+         <div id="7c03d2b2-5aca-4e64-b325-bb125303c823">
           <div class="row">
            <div class="col-md">
-            <div id="ca5c16be-de84-47e9-b9ca-5e584a07ff37">
-             <p id="363e1a79-50c2-45d3-8235-adb10a2ecef7">
+            <div id="9ba4e12d-b5b2-4f9e-9696-90c32918c16a">
+             <p id="fd3599d5-4c66-4fc1-ae97-70d693a9f276">
               Use
               <code>
                Button
@@ -1613,8 +1613,8 @@ Panel(dialog, button)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="09612f73-31ec-4144-835c-eb2b81ee53b7">
-             <pre id="f081695d-89c7-4f5d-9f11-76e724993f56"><code class="language-python">from bootwrap import Panel, Button
+            <div id="655ce5d3-7f9f-4bed-9861-d31dc2b41719">
+             <pre id="08bd5a4b-1810-45c9-8f59-750c277fc274"><code class="language-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."
@@ -1623,11 +1623,11 @@ Panel(
   Button("Steve Jobs Quote").as_primary().toggle(quote),
   quote
 )</code></pre>
-             <div id="ea9af7b5-e63b-471b-88a4-6f2d65516037">
-              <button class="btn btn-primary" data-bs-target="#32cfac3b-274d-4675-8769-7058dd2009e1" data-bs-toggle="collapse" id="3ab76da8-9a42-41f3-a1c6-ad10b7531094" onclick="return false;" type="button">
+             <div id="db6ec6ba-b1a6-4967-9da6-b41e58d765c8">
+              <button class="btn btn-primary" data-bs-target="#e695d4d3-bb65-4b56-ab94-06d71a0d0b48" data-bs-toggle="collapse" id="f5bc4521-c4c4-4c39-8b1c-4e90167a2c04" onclick="return false;" type="button">
                Steve Jobs Quote
               </button>
-              <div class="collapse" id="32cfac3b-274d-4675-8769-7058dd2009e1">
+              <div class="collapse" id="e695d4d3-bb65-4b56-ab94-06d71a0d0b48">
                Sometimes life is going to hit you in the head with a brick. Don’t lose faith.
               </div>
              </div>
@@ -1637,28 +1637,28 @@ Panel(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="e0a18eb7-417b-442b-b37e-577534b98509">
-        <div class="mt-3" id="b2872849-5015-4921-abb4-7aacde9b77ab">
-         <div id="21897e17-1271-4ab5-a3d8-bea3ace49abd">
+       <div class="tab-pane fade" id="e0729482-2535-4736-b98f-3224417f3b52">
+        <div class="mt-3" id="ded86325-f299-429b-9e89-f9e4c5a820b4">
+         <div id="4228e759-549d-42b7-ae66-3883bac7ff17">
           <div class="row">
            <div class="col-md">
-            <div id="822739ff-027a-43b8-8c2c-04ea517966fd">
-             <h1 id="d71ea500-9d6f-4947-a799-89cf30d0fd63">
+            <div id="86986de9-7fde-4020-aba9-a20336a09680">
+             <h1 id="363f5c23-df92-423e-8ffb-b64ea078ffc8">
               Submit Action
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="cd9e9e41-54ea-4987-bb6c-110c816a39d1">
+            <div id="e7271ba2-f3ca-40fa-bcbf-e6e3dcc64508">
             </div>
            </div>
           </div>
          </div>
-         <div id="3bff8006-1408-410e-b95b-fd153bd4ce41">
+         <div id="3d4aead9-ad93-470e-b75e-92ed168d4495">
           <div class="row">
            <div class="col-md">
-            <div id="2f677000-639e-4207-99e7-b65e87f84dba">
-             <p id="4c5351dd-da32-496c-983e-c4f37ec9d579">
+            <div id="580c3f51-975a-4664-bc3b-0ebbc0233077">
+             <p id="acc23f9c-22b7-4c16-ae31-df8ad3cd1082">
               Use
               <code>
                Button
@@ -1669,7 +1669,7 @@ Panel(
               </code>
               function.
              </p>
-             <p id="c57b98cd-d2c1-4c22-bb53-a483acfa1dce">
+             <p id="b61fabc5-3e40-4568-8bf5-4bfbb88f01c1">
               <strong>
                Note:
               </strong>
@@ -1690,22 +1690,22 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="c3a9ad0e-cfc2-4c0e-89ad-ab3a254fd307">
-             <pre id="ba2cd90f-c42f-41ea-8e39-ae1481e4de0d"><code class="language-python">from bootwrap import Form, TextInput, Button
+            <div id="f7ea7a7b-c7c3-4c4b-a30e-f1cbedca66b2">
+             <pre id="da3ad8d6-365f-4864-80ce-37488dbfccf6"><code class="language-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="25679383-ae41-4181-9b63-90bd4107a7f5" method="POST">
+             <form enctype="multipart/form-data" id="15994149-0752-4251-8994-c988df3160e6" method="POST">
               <div class="form-group row">
-               <label class="col-sm-4 col-form-label d-flex align-items-center" for="0b8b0478-ba7d-410f-b698-6aefc017f576">
+               <label class="col-sm-4 col-form-label d-flex align-items-center" for="8a154650-3bdb-4c50-b31c-71abc0920c0e">
                 Email
                </label>
                <div class="col-sm-8 d-flex align-items-center">
-                <input class="form-control" id="0b8b0478-ba7d-410f-b698-6aefc017f576" name="email" type="email" value="my@email.com"/>
+                <input class="form-control" id="8a154650-3bdb-4c50-b31c-71abc0920c0e" name="email" type="email" value="my@email.com"/>
                </div>
               </div>
-              <button class="btn btn-primary" id="a72b7797-ed1a-4797-b1f2-dfcf9057ac27" type="submit">
+              <button class="btn btn-primary" id="423b71a1-e097-4eee-9347-a81c86eed97a" type="submit">
                Send
               </button>
              </form>
@@ -1718,57 +1718,57 @@ Form(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="0e4ce36e-cc66-4ec8-87db-f624b500f88f">
-     <div id="6de4dd93-9658-484d-988b-1ec03bc73f33">
+    <div class="tab-pane fade" id="82b58c9e-23bb-4a53-bb9b-508040e2a361">
+     <div id="8b00a32d-0a09-4427-a865-6080bfd0296c">
       <hr/>
-      <ul class="nav" id="7796a71d-2127-4d0e-a73c-571efa07c099" role="tablist">
+      <ul class="nav" id="0e9b792c-7f31-40e3-9e2d-e91b7e707460" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#d8f8c5f7-eac8-4824-9956-0364cb0a78ea" data-bs-toggle="tab" href="#d8f8c5f7-eac8-4824-9956-0364cb0a78ea" id="9a923feb-28e9-4ee1-b3fe-45b1065ca3da" role="tab">
-         <span class="text-secondary" id="5a6834b6-50b0-4098-9574-1555ae75d7d4">
+        <a class="nav-link active" data-bs-target="#29e27c0e-1e79-4639-af0f-7aa26166616b" data-bs-toggle="tab" href="#29e27c0e-1e79-4639-af0f-7aa26166616b" id="5cf2432a-eb5b-40ca-88a2-236dc2918105" role="tab">
+         <span class="text-secondary" id="810852bd-1cf1-4d60-8ed9-02050f671730">
           ButtonGroup
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#bf6372eb-3ef6-4e77-82d5-2abc9c9d8746" data-bs-toggle="tab" href="#bf6372eb-3ef6-4e77-82d5-2abc9c9d8746" id="05cbd649-8dc2-44be-ae1e-ccbf9d12c8e1" role="tab">
-         <span class="text-secondary" id="e789c263-a9e9-4f36-a999-e3132c6423eb">
+        <a class="nav-link" data-bs-target="#653c2e90-9279-4c59-bdc8-9e6cf28b929e" data-bs-toggle="tab" href="#653c2e90-9279-4c59-bdc8-9e6cf28b929e" id="f36a3201-ffef-4609-bb06-7ba01133e399" role="tab">
+         <span class="text-secondary" id="f67b5686-60a8-4a81-ab34-3e9bca1f849a">
           As check boxes
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#047e7558-5088-4333-96a3-857957ed2c01" data-bs-toggle="tab" href="#047e7558-5088-4333-96a3-857957ed2c01" id="2e078dca-bb96-4ec3-871f-8aac0e626317" role="tab">
-         <span class="text-secondary" id="34f36aac-0448-48a9-8c67-3c13238e4afb">
+        <a class="nav-link" data-bs-target="#77d697cc-fa15-4ff5-8216-f1a00cd990c5" data-bs-toggle="tab" href="#77d697cc-fa15-4ff5-8216-f1a00cd990c5" id="595d2282-5ad9-4a40-a10b-f74d5838b6b0" role="tab">
+         <span class="text-secondary" id="74fbf24f-4053-4025-80d6-b8df35706c4e">
           As radio buttons
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="d8f8c5f7-eac8-4824-9956-0364cb0a78ea">
-        <div class="mt-5" id="e7046111-0c06-4e3a-ba22-c95a2d899938">
-         <div class="d-flex justify-content-between" id="0a6d15b1-4bff-4941-8a60-76e7864af4c2">
-          <h1 id="4776f389-7840-48eb-a168-736eff7c0d20">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="29e27c0e-1e79-4639-af0f-7aa26166616b">
+        <div class="mt-5" id="f8f7ea5f-77c3-4bf9-8d65-a3d495b70f4f">
+         <div class="d-flex justify-content-between" id="5392b90f-db87-41ba-840a-60fc85f21529">
+          <h1 id="1f1724a5-669e-4386-8c09-cc51924149f9">
            Class
-           <span class="text-primary" id="52d0f27e-550b-4400-9bab-07bd251cba1d">
+           <span class="text-primary" id="f9003a98-5d27-4a2d-b8b7-88ba3cb28865">
             ButtonGroup
            </span>
           </h1>
-          <div id="a7f766c4-6de5-48fb-9df9-5627dcdc0004">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#6d7f395e-6aa9-48e5-ba3a-cc48b722a870" data-bs-toggle="collapse" id="045b4d87-3cd5-4748-a0bb-d70cd289ee2d" onclick="return false;" type="button">
+          <div id="eb29d005-7ecf-41aa-b754-1654e3b79d11">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#b50ff093-d1ba-4007-a9c0-cba001b52b55" data-bs-toggle="collapse" id="dd2f38a1-618d-4e76-ab0c-352a4e6b6ddd" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="47b7247b-801a-48ed-b663-e7746da318bb">
+         <span class="text-muted" id="953949a4-9158-40b1-8499-42d7fb34a0a1">
           A web component for a button group.
          </span>
-         <pre id="962e0ad7-5d9e-47c0-9a2b-003751e59756"><code class="language-python">ButtonGroup(*buttons)</code></pre>
-         <div class="ms-3 collapse" id="6d7f395e-6aa9-48e5-ba3a-cc48b722a870">
-          <h6 id="c27ab019-66a6-49ce-9125-dd44a8256904">
+         <pre id="3d204766-1e11-47f4-a908-22cc5d1df2ec"><code class="language-python">ButtonGroup(*buttons)</code></pre>
+         <div class="ms-3 collapse" id="b50ff093-d1ba-4007-a9c0-cba001b52b55">
+          <h6 id="b6067b02-fdcc-4362-a7c2-c24e237a4857">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="4f242910-1f08-4d13-852e-9098b4f42ca9">
+          <table class="table table-sm bg-light" id="56dc9646-b7d0-42ec-a486-2440aec00620">
            <thead>
             <tr>
              <th scope="col">
@@ -1805,15 +1805,15 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="22bfd243-0388-44ed-97c2-b2f3783215f0">
+         <p id="c0f3c4f3-16a6-47d3-aba7-c05c6305c7be">
           Group a series of buttons together on a single line or stack them in
     a vertical column.
          </p>
-         <div class="ms-3" id="64af0a53-3089-46a1-b54a-7b9b344b57f9">
-          <h6 id="7aec847c-c4de-4b4e-a57d-48ab18ef1a45">
+         <div class="ms-3" id="8d687ff4-b3c3-4d44-96ed-66b073ea9ba4">
+          <h6 id="d9aebd69-a032-47b0-8255-7c3759276a0e">
            Example
           </h6>
-          <pre id="11241089-ddc2-4bd1-9beb-8e38167b9c10"><code class="language-python">from bootwrap import Button, ButtonGroup
+          <pre id="8d45134f-f6e5-4729-95d7-4b2aed638681"><code class="language-python">from bootwrap import Button, ButtonGroup
 
 button1 = Button('One').as_success()
 button2 = Button('Two').as_warning()
@@ -1822,67 +1822,70 @@ button3 = Button('Three').as_danger()
 ButtonGroup(button1, button2, button3)
 </code></pre>
          </div>
-         <div class="ms-3" id="60a04976-cddd-4c72-82ab-6cc9e921dcba">
-          <div class="btn-group" id="35dc8427-f157-4bcb-a4cf-e1a6d4191af2" role="group">
-           <button class="btn btn-success" id="c4791ea6-934a-47db-a7c3-37b85e174e9f" onclick="return false;">
+         <div class="ms-3" id="b154bdf3-a596-48b8-b7bb-9d37e481b019">
+          <div class="btn-group" id="9dea21ca-1c3d-4cff-a4c5-111c86d2e045" role="group">
+           <button class="btn btn-success" id="878b5e31-b226-46b3-b2b1-6a2eab5522a2" onclick="return false;">
             One
            </button>
-           <button class="btn btn-warning" id="33d89c0f-8e4a-4148-bb6a-5210cffa8bb7" onclick="return false;">
+           <button class="btn btn-warning" id="ab70c6b0-f525-477d-a32a-2db4e95e159e" onclick="return false;">
             Two
            </button>
-           <button class="btn btn-danger" id="931b192a-587e-4275-bd70-2e402db05814" onclick="return false;">
+           <button class="btn btn-danger" id="a9e9ab37-d6ed-4ba7-bb3a-71c1a9148e44" onclick="return false;">
             Three
            </button>
           </div>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="bf6372eb-3ef6-4e77-82d5-2abc9c9d8746">
-        <div class="mt-3" id="17f48cee-a3f4-4eb7-bfaa-832f80740cb2">
-         <div id="31492e5e-e75f-41c7-bdd8-79be0f704cd8">
+       <div class="tab-pane fade" id="653c2e90-9279-4c59-bdc8-9e6cf28b929e">
+        <div class="mt-3" id="5ad915eb-c32c-4a97-a35c-9201948fc1d4">
+         <div id="2651e9d4-5353-41ed-ae20-c07f0ae6c20f">
           <div class="row">
            <div class="col-md">
-            <div id="3568b3bd-ea96-4e31-8b2c-d2fa16b96983">
-             <h1 id="72d75448-6e5e-48bf-a221-0f549f07674e">
+            <div id="f1b6bc3f-5443-4902-945b-a1e05a0bf0da">
+             <h1 id="408c283e-38e9-4949-ad25-c4de4a96d230">
               As check boxes
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="3e89ed8e-4ecb-4237-878a-feba67a652ca">
+            <div id="3a1c18eb-6e3b-4838-affb-8cbaf5accda7">
             </div>
            </div>
           </div>
          </div>
-         <div id="f5cc29f8-37c9-407c-bcdc-cbacbc3e783a">
+         <div id="f2243e79-388b-4433-8d2f-b3f4c48adacc">
           <div class="row">
            <div class="col-md">
-            <div id="1cb8dd2f-65b8-461c-9cce-593b9e0385fb">
-             <p id="7a0a6eb0-da62-4d29-9ea6-9a6d93891d20">
+            <div id="f2d10175-fb5b-409a-b5c7-ad994a95fdd2">
+             <p id="8e9c438c-b2ee-417b-95f0-be051c1f248b">
               Group a series of buttons together, which act as check boxes.
              </p>
             </div>
            </div>
            <div class="col-md">
-            <div id="60d90aee-4762-4d7d-9c84-fb89942e4ee6">
-             <pre id="eb756805-a2f3-4901-9191-e11f8334a82d"><code class="language-python">from bootwrap import CheckboxInput, ButtonGroup
+            <div id="cf81da1d-d0fe-4e18-95c0-a689b437bbcc">
+             <pre id="ceacc1f5-7274-48a5-b390-6afdbd36d710"><code class="language-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="69ea0bb5-406c-40f0-a250-d0e3893c699e" role="group">
-              <input autocomplete="off" class="btn-check" id="40708854-ac4b-49c2-b8d4-c93a7de959d4" name="opt1" type="checkbox"/>
-              <label class="btn btn-secondary" for="40708854-ac4b-49c2-b8d4-c93a7de959d4">
+             <div class="btn-group" id="f5cabcae-2aff-434d-92e5-2a086cd3a445" role="group">
+              <input autocomplete="off" class="btn-check" id="3ab36cfa-40f0-4f97-a3fd-4c885bca18a0" name="opt1" type="checkbox" value="true"/>
+              <input name="opt1" type="hidden" value="false"/>
+              <label class="btn btn-secondary" for="3ab36cfa-40f0-4f97-a3fd-4c885bca18a0">
                One
               </label>
-              <input autocomplete="off" class="btn-check" id="0289dad0-0225-4c18-80ea-beb218b1ac03" name="opt2" type="checkbox"/>
-              <label class="btn btn-secondary" for="0289dad0-0225-4c18-80ea-beb218b1ac03">
+              <input autocomplete="off" class="btn-check" id="c45ea674-da6c-4867-afca-34ba4cddd94a" name="opt2" type="checkbox" value="true"/>
+              <input name="opt2" type="hidden" value="false"/>
+              <label class="btn btn-secondary" for="c45ea674-da6c-4867-afca-34ba4cddd94a">
                Two
               </label>
-              <input autocomplete="off" class="btn-check" id="54eeeb7a-1c36-4c76-9625-a0abea095f7c" name="opt3" type="checkbox"/>
-              <label class="btn btn-secondary" for="54eeeb7a-1c36-4c76-9625-a0abea095f7c">
+              <input autocomplete="off" class="btn-check" id="5b4b2036-6c97-41e2-a3ee-915cc64bc5eb" name="opt3" type="checkbox" value="true"/>
+              <input name="opt3" type="hidden" value="false"/>
+              <label class="btn btn-secondary" for="5b4b2036-6c97-41e2-a3ee-915cc64bc5eb">
                Three
               </label>
              </div>
@@ -1892,52 +1895,55 @@ ButtonGroup(button1, button2, button3)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="047e7558-5088-4333-96a3-857957ed2c01">
-        <div class="mt-3" id="c71b60e4-e1ae-4872-a179-ab4bf5ebd1e1">
-         <div id="6d3ff9c5-d249-4cfb-a9c3-ce23b344878f">
+       <div class="tab-pane fade" id="77d697cc-fa15-4ff5-8216-f1a00cd990c5">
+        <div class="mt-3" id="d2a1ed36-7749-4a07-a0d9-9f0485b95763">
+         <div id="771672bf-b965-4ad3-bfb3-2bc1e78cf963">
           <div class="row">
            <div class="col-md">
-            <div id="202b364c-981b-4eb1-a94d-44ced8b82a91">
-             <h1 id="1923c45d-f93b-423d-bac3-13a3e7fe9dd7">
+            <div id="dc6c3d8c-617e-4456-acab-05a452c69f90">
+             <h1 id="c8ef1c77-6b20-401d-a6be-8e57f82d0898">
               As radio buttons
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="b9e123f6-13c6-4d90-8039-2d5424258999">
+            <div id="030caab5-3db6-4b7d-8dec-318e34b98cb7">
             </div>
            </div>
           </div>
          </div>
-         <div id="6643e9dc-f641-4a48-a112-454ed056e014">
+         <div id="1a4434f1-9779-4331-905a-a3eacb30d3bc">
           <div class="row">
            <div class="col-md">
-            <div id="be43c8e3-bf3b-4b5a-942a-752731709626">
-             <p id="24d98c58-4c62-48a6-80b9-15a871b4d1b8">
+            <div id="520b456b-82aa-4c00-b5c3-13df769837ff">
+             <p id="12d4ad3d-1567-48d2-a825-e9bf153640c3">
               Group a series of buttons together, which act as radio buttons.
              </p>
             </div>
            </div>
            <div class="col-md">
-            <div id="31a7abbf-4f5b-44ed-8233-50aa524f7201">
-             <pre id="b09d3432-eae2-45dd-941f-bc32c4ab828b"><code class="language-python">from bootwrap import CheckboxInput, ButtonGroup
+            <div id="e64d3bb8-7688-4763-b616-5ff7f82457f2">
+             <pre id="8b07b826-946c-495a-949f-7c82547db851"><code class="language-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="5a3907b8-a9a5-4b29-9b4a-efafaa10d5ab" role="group">
-              <input autocomplete="off" class="btn-check" id="1414db3d-822e-4761-8d18-73a109f37ec5" name="opt" type="radio" value="1"/>
-              <label class="btn btn-secondary" for="1414db3d-822e-4761-8d18-73a109f37ec5">
+             <div class="btn-group" id="0950fa36-6029-4572-a15a-e7d3986928a1" role="group">
+              <input autocomplete="off" class="btn-check" id="49b99622-043a-417d-8b89-7c98bbc14c47" name="opt" type="radio" value="1"/>
+              <input name="opt" type="hidden" value="false"/>
+              <label class="btn btn-secondary" for="49b99622-043a-417d-8b89-7c98bbc14c47">
                One
               </label>
-              <input autocomplete="off" class="btn-check" id="0499e4cb-7459-4331-8939-7399ac532009" name="opt" type="radio" value="2"/>
-              <label class="btn btn-secondary" for="0499e4cb-7459-4331-8939-7399ac532009">
+              <input autocomplete="off" class="btn-check" id="9925570f-ba78-4a79-a146-57ab8384efdd" name="opt" type="radio" value="2"/>
+              <input name="opt" type="hidden" value="false"/>
+              <label class="btn btn-secondary" for="9925570f-ba78-4a79-a146-57ab8384efdd">
                Two
               </label>
-              <input autocomplete="off" class="btn-check" id="454cf50f-d529-4448-b02e-b4936b7a3614" name="opt" type="radio" value="3"/>
-              <label class="btn btn-secondary" for="454cf50f-d529-4448-b02e-b4936b7a3614">
+              <input autocomplete="off" class="btn-check" id="e7541240-8dc1-4220-8817-20f502993171" name="opt" type="radio" value="3"/>
+              <input name="opt" type="hidden" value="false"/>
+              <label class="btn btn-secondary" for="e7541240-8dc1-4220-8817-20f502993171">
                Three
               </label>
              </div>
@@ -1950,50 +1956,50 @@ ButtonGroup(button1, button2, button3)</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="17f0939f-d8cd-4b88-a304-d3a6ec3cdd4f">
-     <div id="126ca285-d827-4c61-93bf-fcf7fd902ef7">
+    <div class="tab-pane fade" id="39dc3370-d745-467d-a103-445d5467b763">
+     <div id="6e714444-4163-433f-9b39-250d7539c547">
       <hr/>
-      <ul class="nav" id="603a38dd-6a67-48fc-adf9-24e525f0069b" role="tablist">
+      <ul class="nav" id="e96d7fa6-5426-433c-88bd-5f92151893d3" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#ec0cef82-8000-433b-b59a-fc4d17fdc065" data-bs-toggle="tab" href="#ec0cef82-8000-433b-b59a-fc4d17fdc065" id="06efd753-4823-4ae9-ab6b-fa5e0681b863" role="tab">
-         <span class="text-secondary" id="899ae500-680b-49a0-a6bd-8a466cdb6534">
+        <a class="nav-link active" data-bs-target="#c7f0b6f0-ec42-4e93-8ac2-049408ac4710" data-bs-toggle="tab" href="#c7f0b6f0-ec42-4e93-8ac2-049408ac4710" id="365caf75-70e0-4fe5-980f-4a3eb69b5586" role="tab">
+         <span class="text-secondary" id="9cbd1ee2-fb32-41f9-90a0-39f1cbaa1194">
           Deck
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#12fcedc7-b9b2-4028-842c-e36dc166d034" data-bs-toggle="tab" href="#12fcedc7-b9b2-4028-842c-e36dc166d034" id="5eea2a75-e31f-4b99-81e1-9d1a34016e79" role="tab">
-         <span class="text-secondary" id="39b85f89-d5be-4af5-bc2c-1f06c3e48d6a">
+        <a class="nav-link" data-bs-target="#6f267a23-46dc-4973-bef4-4716758c85cd" data-bs-toggle="tab" href="#6f267a23-46dc-4973-bef4-4716758c85cd" id="4551bcd8-fbc6-4dbb-a855-3bccc15c2e8d" role="tab">
+         <span class="text-secondary" id="5d55db57-a567-4bc8-bdd8-f4473b80b759">
           Deck.Card
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="ec0cef82-8000-433b-b59a-fc4d17fdc065">
-        <div class="mt-5" id="a0ade4ae-2508-45a8-872e-3ef3e37804bb">
-         <div class="d-flex justify-content-between" id="84e5e24d-9043-453c-9455-1fb8fdc8a1be">
-          <h1 id="d9b4d929-dbb9-4104-b7f8-e99cbf703b97">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="c7f0b6f0-ec42-4e93-8ac2-049408ac4710">
+        <div class="mt-5" id="dc3dfc06-16c6-4bf1-b257-4a2c192f072b">
+         <div class="d-flex justify-content-between" id="6316ba1a-0fd3-4ecd-b3a8-4ff97a3adc54">
+          <h1 id="c1292621-a7aa-4021-9e25-8d1ccc61fe5e">
            Class
-           <span class="text-primary" id="56f1897c-4efb-4df5-8d6c-8900c364e5c6">
+           <span class="text-primary" id="7b4f7450-cf69-4476-82fd-6d5038e65fb2">
             Deck
            </span>
           </h1>
-          <div id="c84d4431-d409-4a75-a0af-f383f1c21e81">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#e0208d8e-3d5e-4c8b-be97-1d70bdc2afc7" data-bs-toggle="collapse" id="751aa845-c4a8-4b52-9bc0-6ab6156a5dd4" onclick="return false;" type="button">
+          <div id="b60e3a7a-c235-452d-ac39-250a82e895a1">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#96de7064-85bd-449b-86cc-bcd907cae15b" data-bs-toggle="collapse" id="b0cd9167-485c-4c12-901f-fe1ff92a1498" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="f4862abe-f9bc-43e9-82be-7e3a9c64f4ec">
+         <span class="text-muted" id="151cdf2d-271c-40f7-b4ff-49fa22d37b9f">
           A web component for a deck of cards.
          </span>
-         <pre id="ad1513d9-46b9-49e0-9da6-5f4dac81a638"><code class="language-python">Deck(*cards)</code></pre>
-         <div class="ms-3 collapse" id="e0208d8e-3d5e-4c8b-be97-1d70bdc2afc7">
-          <h6 id="9387ecb8-162c-49b9-964f-ae252f2987c1">
+         <pre id="69f6b649-837e-45a3-9b15-d2ebcbeb8b1b"><code class="language-python">Deck(*cards)</code></pre>
+         <div class="ms-3 collapse" id="96de7064-85bd-449b-86cc-bcd907cae15b">
+          <h6 id="c8888966-d4cd-43a6-befc-e8c16cbb4d16">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="80d3c8a8-7bf4-46f0-a17e-5fd68ce567a2">
+          <table class="table table-sm bg-light" id="13a5513c-ffda-4bed-8e19-2529809b0201">
            <thead>
             <tr>
              <th scope="col">
@@ -2034,11 +2040,11 @@ ButtonGroup(button1, button2, button3)</code></pre>
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="7ffa5bea-641e-402f-9e6f-2f65c48d82db">
-          <h6 id="6f221639-ad37-474e-a218-eb3841434835">
+         <div class="ms-3" id="93c524e9-62a6-4abb-b3b7-442a9d7af3f6">
+          <h6 id="9cf83603-c1ef-434a-b06d-89da89c43f80">
            Example
           </h6>
-          <pre id="e6c0c5c5-5f6e-4b43-9df7-cb09191c4a5d"><code class="language-python">from bootwrap import Button, Deck, Image
+          <pre id="796579f6-d873-43a3-a08d-b9684d88d7d6"><code class="language-python">from bootwrap import Button, Deck, Image
 
 actions = [
     Button("Buy"),
@@ -2071,101 +2077,101 @@ Deck(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="5871dddc-1504-4f1e-ba9d-ebd0bb2a5492">
-          <div class="card-deck grid-container" id="599d5deb-abe7-47f8-b310-3e84fa534767">
-           <div class="card" id="69c5c8af-ee65-49ba-89e0-b5f01b0f825f">
+         <div class="ms-3" id="a406ca52-0cdb-4879-812e-1d9027faf4f2">
+          <div class="card-deck grid-container" id="908c69f0-65ae-416f-8dbc-41d14403ad24">
+           <div class="card" id="3e697f56-cca0-4985-92b0-2ca92ceb1d8f">
             <a onclick="location.href='https://www.google.com';">
-             <img class="mt-3 card-img-top" id="eb719664-47cc-4ac3-bd5a-8a79d38163e5" src="google-logo.png" width="128"/>
+             <img class="mt-3 card-img-top" id="1a14f7c8-ec97-45c9-9ca8-60c5ce9ce273" src="google-logo.png" width="128"/>
             </a>
             <div class="card-body" onclick="location.href='https://www.google.com';">
              <div class="text-right mb-2">
-              <small class="text-muted" id="cf7e8504-bced-4af5-996b-587d25eecdb4">
+              <small class="text-muted" id="7c3c5348-6241-452b-85a4-a16cda4ece9b">
                12:04:58 12/01/2021
               </small>
              </div>
-             <h5 class="card-title" id="55526c82-82ab-4dfd-86d9-360060b3137b">
+             <h5 class="card-title" id="5d21eeee-da6e-4c9b-82c5-8fb7a40df9ea">
               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="994db8cd-63a6-4695-8cb7-cb5b179f39d5" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="d2c05192-9a52-46df-8b6c-6d10597d4fb1" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="7788b179-8765-4bed-b1bd-9480c52eeb2c" onclick="return false;">
+               <button class="dropdown-item btn" id="cee7932c-29e0-470e-9fbb-d79b09f9a71b" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="2c0d8c6a-656f-4d43-8d3f-a669b4e019f2" onclick="return false;">
+               <button class="dropdown-item btn" id="39852dab-0413-4172-8366-bf78eb376857" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="88656adf-4e08-46d9-b989-6b073a53e396" onclick="return false;">
+               <button class="dropdown-item btn" id="086c29b3-a0e4-449b-9257-e3146e2fabf8" onclick="return false;">
                 Transfer
                </button>
               </div>
              </div>
             </div>
            </div>
-           <div class="card" id="b8227589-8d68-430e-80a1-9f5329731b22">
+           <div class="card" id="99bd873c-36f8-42ef-9b89-47c58725964c">
             <a onclick="location.href='https://www.linkedin.com';">
-             <img class="mt-3 card-img-top" id="4149886f-0bf4-4cd4-abaf-4078c2a79f72" src="linkedin-logo.png" width="128"/>
+             <img class="mt-3 card-img-top" id="8ef50b09-f63c-48e8-973a-c7b5a6b91b8f" src="linkedin-logo.png" width="128"/>
             </a>
             <div class="card-body" onclick="location.href='https://www.linkedin.com';">
              <div class="text-right mb-2">
-              <small class="text-muted" id="5c955769-e012-4b5d-aa3d-0ca6e73c1607">
+              <small class="text-muted" id="23d25937-b726-4ec7-a968-9f7a7e89c27b">
                12:04:58 12/01/2021
               </small>
              </div>
-             <h5 class="card-title" id="7202256b-3055-438f-bb1e-a8072083ae0d">
+             <h5 class="card-title" id="1e04a3ed-b91e-4ae7-a8b4-87b1f6932dd5">
               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="adea8a16-a8e1-443c-8129-48bf5223ed43" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="87e31c97-74f7-4fb0-bf99-24658dbdf345" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="7788b179-8765-4bed-b1bd-9480c52eeb2c" onclick="return false;">
+               <button class="dropdown-item btn" id="cee7932c-29e0-470e-9fbb-d79b09f9a71b" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="2c0d8c6a-656f-4d43-8d3f-a669b4e019f2" onclick="return false;">
+               <button class="dropdown-item btn" id="39852dab-0413-4172-8366-bf78eb376857" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="88656adf-4e08-46d9-b989-6b073a53e396" onclick="return false;">
+               <button class="dropdown-item btn" id="086c29b3-a0e4-449b-9257-e3146e2fabf8" onclick="return false;">
                 Transfer
                </button>
               </div>
              </div>
             </div>
            </div>
-           <div class="card" id="ef04472e-fba3-48e4-bfc0-475ca28fc28a">
+           <div class="card" id="247ae51d-6c95-40c2-9288-7dede0d42f25">
             <a onclick="location.href='https://www.amazon.com';">
-             <img class="mt-3 card-img-top" id="2de41224-48b3-4406-9cba-a321084dcc50" src="amazon-logo.png" width="128"/>
+             <img class="mt-3 card-img-top" id="0775bd1f-a12f-44a9-9ca5-9c038db91740" src="amazon-logo.png" width="128"/>
             </a>
             <div class="card-body" onclick="location.href='https://www.amazon.com';">
              <div class="text-right mb-2">
-              <small class="text-muted" id="e19053fa-bd31-4a35-94b2-1dd41f8cc3ac">
+              <small class="text-muted" id="668dabec-7315-4964-9fb3-db9f01d79053">
                12:04:58 12/01/2021
               </small>
              </div>
-             <h5 class="card-title" id="d1294335-cd61-47c5-97f1-60939d52fa46">
+             <h5 class="card-title" id="81ed82dc-34de-4273-86ba-eca6f75e6237">
               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="1b957cee-3dda-4935-a89c-879662bb1193" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="58a6144a-12bc-4137-9a4c-0f737aced796" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="7788b179-8765-4bed-b1bd-9480c52eeb2c" onclick="return false;">
+               <button class="dropdown-item btn" id="cee7932c-29e0-470e-9fbb-d79b09f9a71b" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="2c0d8c6a-656f-4d43-8d3f-a669b4e019f2" onclick="return false;">
+               <button class="dropdown-item btn" id="39852dab-0413-4172-8366-bf78eb376857" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="88656adf-4e08-46d9-b989-6b073a53e396" onclick="return false;">
+               <button class="dropdown-item btn" id="086c29b3-a0e4-449b-9257-e3146e2fabf8" onclick="return false;">
                 Transfer
                </button>
               </div>
@@ -2181,30 +2187,30 @@ Deck(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="12fcedc7-b9b2-4028-842c-e36dc166d034">
-        <div class="mt-5" id="9425b7f7-16ce-4b2d-acb8-697c6ce2f608">
-         <div class="d-flex justify-content-between" id="ac34a1de-8a33-4736-b6b4-e6f8100004c3">
-          <h1 id="0f9513d9-ecfe-49c0-878b-7b028de19432">
+       <div class="tab-pane fade" id="6f267a23-46dc-4973-bef4-4716758c85cd">
+        <div class="mt-5" id="098185e6-7429-4593-bb7e-e4f447a5b369">
+         <div class="d-flex justify-content-between" id="b44e67d6-6a30-4caf-9530-f1a888e75425">
+          <h1 id="97edeabf-03cf-4c99-b6e8-9e295c4cf002">
            Class
-           <span class="text-primary" id="f732b9f9-26c1-4891-a226-ad8ed7b07d6c">
+           <span class="text-primary" id="75f322e9-c867-43b2-ab66-5a5fb04cac8d">
             Deck.Card
            </span>
           </h1>
-          <div id="5c6a5280-abcb-468d-b2c9-819252c84206">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#50255768-0c07-4487-876a-48e7bbd01d96" data-bs-toggle="collapse" id="899be2b1-785a-4462-a965-3aefd7b15dc7" onclick="return false;" type="button">
+          <div id="eac6f289-2e60-4298-9e9d-2645b7ccdc1a">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#0f3ab97f-8149-44d8-a2df-46c4ef501fc5" data-bs-toggle="collapse" id="610abf7f-7c70-4423-ad36-91d2a95dc8c8" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="24bfb8a5-768e-4f9d-9097-1730a8a2d533">
+         <span class="text-muted" id="6ed981da-dab6-40f8-8fd1-d0fa650bf71b">
           A deck card.
          </span>
-         <pre id="38035f89-ea75-4e30-b3b1-18fbf0a6895d"><code class="language-python">Deck.Card(title, description=None, marker=None, figure=None)</code></pre>
-         <div class="ms-3 collapse" id="50255768-0c07-4487-876a-48e7bbd01d96">
-          <h6 id="4d902791-19d9-4491-861c-6e521e797b92">
+         <pre id="1eeacf33-ac71-4f44-939e-27ee14f16361"><code class="language-python">Deck.Card(title, description=None, marker=None, figure=None)</code></pre>
+         <div class="ms-3 collapse" id="0f3ab97f-8149-44d8-a2df-46c4ef501fc5">
+          <h6 id="ba7d1698-c7d0-4251-87e2-68f98d7bcf4a">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="186eeda9-64c2-4f46-a9bb-df7e4209723f">
+          <table class="table table-sm bg-light" id="b6698312-ee3b-488e-8829-8759b6c45d95">
            <thead>
             <tr>
              <th scope="col">
@@ -2282,11 +2288,11 @@ Deck(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="bc976acf-d668-4ac3-8c66-197c067f02ce">
-          <h6 id="b1455f98-9130-4f71-acdb-fda1c13bbe52">
+         <div class="ms-3" id="99ad1ad8-a460-4da0-9742-cc1cb23738db">
+          <h6 id="3b7d8ffd-2369-4308-bc4c-9ee88c94dddb">
            Example
           </h6>
-          <pre id="ba02d0a7-e0d8-495e-a1c2-2cb00f3eb631"><code class="language-python">from bootwrap import Button, Deck, Image
+          <pre id="1c0ca201-7e24-4408-b0da-9911edcab5fd"><code class="language-python">from bootwrap import Button, Deck, Image
 
 actions = [
     Button("Buy"),
@@ -2303,55 +2309,55 @@ Deck.Card(
     "https://www.google.com")
 </code></pre>
          </div>
-         <div class="ms-3" id="d4e470c8-4b77-464f-aa40-10089a634138">
-          <div class="card" id="3b58ad12-22d6-4bdf-86dc-c14c36081367">
+         <div class="ms-3" id="7260fe7c-6cbf-4e05-954d-67713af14d96">
+          <div class="card" id="cc37d992-8549-463d-950e-9f365844973e">
            <a onclick="location.href='https://www.google.com';">
-            <img class="mt-3 card-img-top" id="232cc7b6-9f84-4e08-8025-1e60792564ea" src="google-logo.png" width="128"/>
+            <img class="mt-3 card-img-top" id="c0948e9d-2dc4-4663-8ccb-46abe3b60c68" src="google-logo.png" width="128"/>
            </a>
            <div class="card-body" onclick="location.href='https://www.google.com';">
             <div class="text-right mb-2">
-             <small class="text-muted" id="41487856-e508-47cf-b0b7-fe190f9d1843">
+             <small class="text-muted" id="743298b3-4f92-4a9c-8113-2df0c963dc55">
               12:04:58 12/01/2021
              </small>
             </div>
-            <h5 class="card-title" id="ed93d351-e77f-4da7-8ae0-5e8bfae46583">
+            <h5 class="card-title" id="9a1ffbdc-b88a-4398-aee8-6e22129cc835">
              Google (NASDAQ: GOOGL)
             </h5>
             Price for a single Google share
            </div>
            <div class="card-footer text-right">
-            <button class="btn" id="00348334-0ea3-49d4-823f-4949adccc047" onclick="return false;">
+            <button class="btn" id="885d96a3-72cc-402f-a761-b694a49bc2dd" onclick="return false;">
              Buy
             </button>
-            <button class="btn" id="23c2d569-1cd8-47f1-9690-57c0a6807f3c" onclick="return false;">
+            <button class="btn" id="a8d6b46d-c2c2-4259-a799-0b304c782038" onclick="return false;">
              Sell
             </button>
-            <button class="btn" id="790d4027-25d2-4843-9d4e-344718ff6d0d" onclick="return false;">
+            <button class="btn" id="93427e73-ec61-41e6-8bbc-987fe6907bc9" onclick="return false;">
              Transfer
             </button>
            </div>
           </div>
          </div>
-         <div class="mt-5" id="0a69eae8-9efc-48f2-81c7-5b492af91a0f">
-          <div class="d-flex justify-content-between" id="76db81d2-687f-44d4-932e-3262dda8b8ae">
-           <h4 id="692c5266-3ba8-4fed-82f9-c32e31a3d4b8">
+         <div class="mt-5" id="a08dda96-ba61-43af-8f40-3c236a7f17a0">
+          <div class="d-flex justify-content-between" id="780c1db6-eadb-43e2-9c77-90916f8ad124">
+           <h4 id="0559c4cb-3985-48ac-8d00-5fcfc8527bf5">
             Method
-            <span class="text-primary" id="f9066502-f5fc-4999-98f6-9f4157a551d0">
+            <span class="text-primary" id="82dd68c1-9709-445e-8334-eb2aa4ac04e1">
              pack_actions
             </span>
            </h4>
-           <div id="94e5fa9c-ccb7-489a-9c02-8682dfe44df8">
+           <div id="721a910c-eda9-4524-a56f-496bab2c762f">
            </div>
           </div>
-          <span class="text-muted" id="d13f73d4-da7e-4ae1-b675-c20fd097d613">
+          <span class="text-muted" id="805f75b7-2ff0-4294-8fee-436af4f9dc4d">
            Makes item actions packed under a drop-down menu.
           </span>
-          <pre id="94ac3ced-e2e4-4142-b2b2-da343009c9e3"><code class="language-python">pack_actions()</code></pre>
-          <div class="ms-3" id="a04d3cc5-2d5a-42a2-8318-3018db29204e">
-           <h6 id="2ad91443-43e7-4839-a07c-71998bde76ed">
+          <pre id="ce44c9b7-da80-415a-b6ff-ad1a5b80e34e"><code class="language-python">pack_actions()</code></pre>
+          <div class="ms-3" id="c1ed5565-868b-42b2-ac0d-dd102b7d2a8f">
+           <h6 id="80392e51-2bdb-49ac-91dc-da3e59a85f74">
             Example
            </h6>
-           <pre id="b12d13a4-0d0a-4dda-9874-dc980390e800"><code class="language-python">from bootwrap import Button, Deck, Image
+           <pre id="ceaba8a8-407e-43df-950e-33b2981fbab9"><code class="language-python">from bootwrap import Button, Deck, Image
 
 actions = [
     Button("Buy"),
@@ -2368,34 +2374,34 @@ Deck.Card(
     "https://www.google.com")
 </code></pre>
           </div>
-          <div class="ms-3" id="bb538eec-663d-45d0-abf6-b1355f60e35b">
-           <div class="card" id="de3cd7aa-9cbc-4e3e-97ec-71225ba2412d">
+          <div class="ms-3" id="79bfb859-c79e-4981-a648-94f8825da14b">
+           <div class="card" id="05fa5042-81da-414f-af55-65a44555ac67">
             <a onclick="location.href='https://www.google.com';">
-             <img class="mt-3 card-img-top" id="4b198d1b-a77e-4829-9037-30dee9163751" src="google-logo.png" width="128"/>
+             <img class="mt-3 card-img-top" id="11723ae7-df18-41fc-adbc-976456dceccb" src="google-logo.png" width="128"/>
             </a>
             <div class="card-body" onclick="location.href='https://www.google.com';">
              <div class="text-right mb-2">
-              <small class="text-muted" id="2e04db38-3bf7-4bc6-a500-8ae38b1b62de">
+              <small class="text-muted" id="8816cdfa-4773-4ac3-b034-585eb39819e8">
                12:04:58 12/01/2021
               </small>
              </div>
-             <h5 class="card-title" id="9c7a0a27-2ae8-4961-9530-aca017aac8a2">
+             <h5 class="card-title" id="cd2a2489-5642-4bc1-bf3a-4e8c58c15672">
               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="bc294534-8fd1-4781-aa85-705c88cfb880" onclick="return false;" style="cursor: pointer">
+              <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="dfae5d4f-8716-4b6b-b9a6-6cc4380f4ec6" onclick="return false;" style="cursor: pointer">
               </i>
               <div class="dropdown-menu dropdown-menu-right">
-               <button class="dropdown-item btn" id="7ad9d168-8dab-4879-a3f3-f1e7e0f53750" onclick="return false;">
+               <button class="dropdown-item btn" id="0ad2d8d3-3de1-4f01-a5ed-e77459a8e655" onclick="return false;">
                 Buy
                </button>
-               <button class="dropdown-item btn" id="8cae8ecd-7ed2-478e-9aeb-cde1c19941ff" onclick="return false;">
+               <button class="dropdown-item btn" id="34208d48-7102-4bcf-8739-cd7f02b84f66" onclick="return false;">
                 Sell
                </button>
-               <button class="dropdown-item btn" id="0f0093bd-3e4e-4b1c-ad83-b843835eb6d4" onclick="return false;">
+               <button class="dropdown-item btn" id="e09ae63c-2127-4d75-ab1c-94c2adc18610" onclick="return false;">
                 Transfer
                </button>
               </div>
@@ -2409,57 +2415,57 @@ Deck.Card(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="a67674fa-408a-4201-9d55-be97e5faa7d8">
-     <div id="3c2a7220-510a-4766-a80d-c4caff69d896">
+    <div class="tab-pane fade" id="1eb85ec5-e7fc-4cea-a968-02024d628fe7">
+     <div id="dca8881d-9080-45c2-9793-28dd37705a66">
       <hr/>
-      <ul class="nav" id="9639a00b-7ff2-47f2-b3ce-6ffad5df7484" role="tablist">
+      <ul class="nav" id="92b79ab7-905e-4be6-aabd-532449e3a8d2" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#8eb1d13a-b90e-4cd7-ade8-3f8ea29ff406" data-bs-toggle="tab" href="#8eb1d13a-b90e-4cd7-ade8-3f8ea29ff406" id="1644b4bb-0e3e-4086-9013-c2a7bb7191d4" role="tab">
-         <span class="text-secondary" id="81ebf8f9-bfc5-46a7-9725-75c9cda40992">
+        <a class="nav-link active" data-bs-target="#93cb8f29-bf79-4e00-95f6-57fa38273dbc" data-bs-toggle="tab" href="#93cb8f29-bf79-4e00-95f6-57fa38273dbc" id="db4e6b72-8abc-4293-8adc-113056377063" role="tab">
+         <span class="text-secondary" id="4d8bb3cf-ba31-419e-9034-a7b2d92a1cae">
           Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#f8fbacf5-8fb4-4c64-84dd-31a9db7c200e" data-bs-toggle="tab" href="#f8fbacf5-8fb4-4c64-84dd-31a9db7c200e" id="d53a1f6d-54ad-4d25-9324-025f64e5f53d" role="tab">
-         <span class="text-secondary" id="65a07a47-2880-4628-b69f-0148ed2880f0">
+        <a class="nav-link" data-bs-target="#a7ffda42-1c0f-4875-8c43-3d4a8f0da69e" data-bs-toggle="tab" href="#a7ffda42-1c0f-4875-8c43-3d4a8f0da69e" id="b6f5cdbb-bb0f-411b-8eda-07b60dcfdc3a" role="tab">
+         <span class="text-secondary" id="1cbd3c31-f0d9-49dd-a00b-74d27a6bcfbe">
           Question Dialog
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#f9d3446c-ed35-4d71-86aa-417629d465f5" data-bs-toggle="tab" href="#f9d3446c-ed35-4d71-86aa-417629d465f5" id="4a50f455-0648-4c8b-bde8-584801f33311" role="tab">
-         <span class="text-secondary" id="d51ca697-40d1-4818-97c1-a428b861f9e2">
+        <a class="nav-link" data-bs-target="#d22737e1-d6ab-421a-96d6-af1723401547" data-bs-toggle="tab" href="#d22737e1-d6ab-421a-96d6-af1723401547" id="da9c0ba1-38f5-4c80-af09-10810dd5f6e7" role="tab">
+         <span class="text-secondary" id="72c03d58-5792-4d51-a3bd-05c2026f4b14">
           Complex Dialog
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="8eb1d13a-b90e-4cd7-ade8-3f8ea29ff406">
-        <div class="mt-5" id="71a267dc-a6a2-456b-bff7-d6e44f1ec9c1">
-         <div class="d-flex justify-content-between" id="9c87d743-98fd-443f-bfe3-a3c9d4fbdd81">
-          <h1 id="676ef21a-14d1-4fbf-a278-bb9f4c3a458e">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="93cb8f29-bf79-4e00-95f6-57fa38273dbc">
+        <div class="mt-5" id="f81ee0f5-953b-4c34-947e-c0cd058b1026">
+         <div class="d-flex justify-content-between" id="32466859-8b91-44b1-b6f8-3b241741f52e">
+          <h1 id="89f9e148-8136-431a-bfd8-58022f8b2cd6">
            Class
-           <span class="text-primary" id="c9fe7361-b515-482e-81e4-ce31b5350345">
+           <span class="text-primary" id="34c533fc-b07f-4dfe-898e-fa8600f5fec6">
             Dialog
            </span>
           </h1>
-          <div id="33f46527-2d95-4dcf-80ef-3dfbb54daad5">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#72d50808-abaa-4e66-89c9-4ca233547bc6" data-bs-toggle="collapse" id="46f80d26-4f9a-4e5b-93bc-f08160f64399" onclick="return false;" type="button">
+          <div id="45ca5294-228f-41b0-9ce6-bf914ba6d88b">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#4d70d364-1af9-4f9e-a166-931ee829087d" data-bs-toggle="collapse" id="258c5dfc-183a-4feb-aaa0-cf877b76bafc" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="ba9fe136-7a14-42c2-abcf-f2e77e2676a0">
+         <span class="text-muted" id="f280ab2d-38b2-4dd8-9c04-a91a8915de6f">
           A dialog.
          </span>
-         <pre id="0e6e7422-c828-4d60-9ba2-8a8016721a75"><code class="language-python">Dialog(title, content, *actions)</code></pre>
-         <div class="ms-3 collapse" id="72d50808-abaa-4e66-89c9-4ca233547bc6">
-          <h6 id="c58e4d82-5f34-414e-86be-09f4cda0373c">
+         <pre id="26d5c5f9-9b13-41e0-b394-957997b99e7c"><code class="language-python">Dialog(title, content, *actions)</code></pre>
+         <div class="ms-3 collapse" id="4d70d364-1af9-4f9e-a166-931ee829087d">
+          <h6 id="0112b297-0b94-45e4-b1dd-a51a50832f8e">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="15ec9eb5-ebfb-448b-8da1-0fdf9931ac3c">
+          <table class="table table-sm bg-light" id="3f1c28f7-d702-4d64-b094-bfba20effb01">
            <thead>
             <tr>
              <th scope="col">
@@ -2522,11 +2528,11 @@ Deck.Card(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="8aed25f9-dede-45d8-9046-81ea36407794">
-          <h6 id="320747b7-fea4-4417-9773-49ffa7f6d2e2">
+         <div class="ms-3" id="591fd8f0-efdb-4674-914a-d6dd0534e9ba">
+          <h6 id="5fc21c3a-82a0-4eda-ab7f-eca43c38e81a">
            Example
           </h6>
-          <pre id="d5d8fa6e-6cb3-4564-849b-ec2cf90bf63d"><code class="language-python">from bootwrap import Panel, Dialog, Button
+          <pre id="38b12bbf-2c86-4dee-a71e-81fc2dba36c8"><code class="language-python">from bootwrap import Panel, Dialog, Button
 
 dialog = Dialog(
     'Greeting',
@@ -2538,9 +2544,9 @@ button = Button('Say Hello').toggle(dialog)
 Panel(dialog, button)
 </code></pre>
          </div>
-         <div class="ms-3" id="dbb6bbb3-acb9-47b7-b4d5-65fd0bed51d6">
-          <div id="074d9d50-3592-4d8e-a6c1-18c3d8960532">
-           <div class="modal" id="edf9d716-aed0-4c85-9822-11d49c2dcb54">
+         <div class="ms-3" id="28021a36-ceb0-444c-82ce-88ffbc5b58ab">
+          <div id="531c6498-7409-41cd-a85c-d767364077d2">
+           <div class="modal" id="18dca6fc-f6ea-4edd-9041-73c08661f41c">
             <div class="modal-dialog" role="document">
              <div class="modal-content">
               <div class="modal-header">
@@ -2554,42 +2560,42 @@ Panel(dialog, button)
                Hello World!
               </div>
               <div class="modal-footer">
-               <button class="btn" data-bs-dismiss="modal" id="32b205fc-7d77-4a01-a60c-b1e483db6531" onclick="return false;" type="button">
+               <button class="btn" data-bs-dismiss="modal" id="7ad22fd2-e357-4ab4-adc7-c32c9a0bc2f5" onclick="return false;" type="button">
                 Bye
                </button>
               </div>
              </div>
             </div>
            </div>
-           <button class="btn" data-bs-target="#edf9d716-aed0-4c85-9822-11d49c2dcb54" data-bs-toggle="modal" id="022f0213-5308-4cc5-b34b-2ba78a59bd8e" onclick="return false;" type="button">
+           <button class="btn" data-bs-target="#18dca6fc-f6ea-4edd-9041-73c08661f41c" data-bs-toggle="modal" id="5bd009c8-1118-46b8-8ee2-dfc362035ac3" onclick="return false;" type="button">
             Say Hello
            </button>
           </div>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="f8fbacf5-8fb4-4c64-84dd-31a9db7c200e">
-        <div class="mt-3" id="b80e5daf-b8a3-4c31-97e9-565f3f5cc7ba">
-         <div id="62b959f7-c746-44b8-a36c-220394e8c354">
+       <div class="tab-pane fade" id="a7ffda42-1c0f-4875-8c43-3d4a8f0da69e">
+        <div class="mt-3" id="18e1a760-3dd7-40af-8078-0b5e28e4bfdb">
+         <div id="03346618-b043-4a3e-9d3c-085e27ed79e5">
           <div class="row">
            <div class="col-md">
-            <div id="41f10424-c68e-4ad4-8e6e-658bcd17b4d2">
-             <h1 id="7c2d223d-5a34-485c-b7f2-10dbd8a70c6c">
+            <div id="9a5005d5-40ce-454e-b887-144a72d7d7c4">
+             <h1 id="2c89445b-3cb5-4287-859c-7d4afb98acf3">
               Question Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="48cc0b51-c30b-48b2-bb2e-d5800127d006">
+            <div id="1d3db2fe-8758-4cc3-99c1-d8a17400dcfc">
             </div>
            </div>
           </div>
          </div>
-         <div id="e9026f85-fcb6-4ac5-8ec2-612e5ae194d9">
+         <div id="077f49a8-f719-4097-a9bf-b8dee219cf72">
           <div class="row">
            <div class="col-md">
-            <div id="c4410b5c-bdbe-48b7-8231-ee1c01509a57">
-             <p id="adbe0ca2-4e5e-4ba5-9d32-6447eadd7029">
+            <div id="27c3101e-f2f7-4d5a-9b85-49b65bf553f6">
+             <p id="f7bf1587-858a-436c-be88-e130fd1b2079">
               An example of how
               <code>
                Dialog
@@ -2609,8 +2615,8 @@ Panel(dialog, button)
             </div>
            </div>
            <div class="col-md">
-            <div id="7664d949-0d00-409d-b425-ad97824e2971">
-             <pre id="de166c5f-6034-4ca7-bd3c-96363239d048"><code class="language-python">from bootwrap import Panel, Dialog, Button
+            <div id="24292aa3-43bc-469d-ab5a-7d18be13b91a">
+             <pre id="7603bad7-7457-4ee5-a5cb-8a988d70706d"><code class="language-python">from bootwrap import Panel, Dialog, Button
 
 dialog = Dialog(
   "Delete File",
@@ -2622,8 +2628,8 @@ dialog = Dialog(
 button = Button("Delete").as_danger().toggle(dialog)   
 
 Panel(dialog, button)</code></pre>
-             <div id="5038c15e-1558-47b3-8fbb-2494cf8e6bf6">
-              <div class="modal" id="35dc7c82-a186-4b17-9a81-891e528b06d4">
+             <div id="e1e9301d-c946-4bf0-b436-9f2cfecf95a7">
+              <div class="modal" id="7342b5ee-c9bf-414f-99c3-5e700a567cc9">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -2637,17 +2643,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="e80333ca-47e4-446c-a627-03f34d6a0069" onclick="return false;" type="button">
+                  <button class="btn btn-danger" data-bs-dismiss="modal" id="59e641a3-83f1-45e3-90ab-269c5b9ef6bc" onclick="return false;" type="button">
                    Confirm
                   </button>
-                  <button class="btn" data-bs-dismiss="modal" id="0a0a5064-dfd5-4802-a0dc-c65f18e46072" onclick="return false;" type="button">
+                  <button class="btn" data-bs-dismiss="modal" id="8fffcc91-2b8a-4722-8dcf-2e065db027a6" onclick="return false;" type="button">
                    Cancel
                   </button>
                  </div>
                 </div>
                </div>
               </div>
-              <button class="btn btn-danger" data-bs-target="#35dc7c82-a186-4b17-9a81-891e528b06d4" data-bs-toggle="modal" id="81b06e77-308f-49d5-acc7-7d953a99876d" onclick="return false;" type="button">
+              <button class="btn btn-danger" data-bs-target="#7342b5ee-c9bf-414f-99c3-5e700a567cc9" data-bs-toggle="modal" id="d7a9fd2e-a447-4967-821c-18c3fb1e085f" onclick="return false;" type="button">
                Delete
               </button>
              </div>
@@ -2657,28 +2663,28 @@ Panel(dialog, button)</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="f9d3446c-ed35-4d71-86aa-417629d465f5">
-        <div class="mt-3" id="bc5ccf56-9ca0-4dd6-9c3d-d0a8db599cd0">
-         <div id="134b34b0-1652-4243-9d40-0c6549f7932a">
+       <div class="tab-pane fade" id="d22737e1-d6ab-421a-96d6-af1723401547">
+        <div class="mt-3" id="b6c279e4-1367-4e26-9ba5-9569af805f3f">
+         <div id="d686c972-e80d-4632-9c51-e6b168273de3">
           <div class="row">
            <div class="col-md">
-            <div id="0246d9b0-4dad-4ec9-920a-0fdcc4efa5cd">
-             <h1 id="c952eec2-fa41-4bad-bf9b-eed1880690fa">
+            <div id="cada4a7f-fde1-4263-a31e-8743a85af291">
+             <h1 id="96238bff-89b3-4d65-b4c3-5cb5d360bd15">
               Complex Dialog
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="cc7a4adc-65da-4b12-a2fc-310e4262f20a">
+            <div id="896b00d5-d883-4ced-bb45-531ab75ad40f">
             </div>
            </div>
           </div>
          </div>
-         <div id="fac63724-b63f-47d8-b196-e6e87a95b92f">
+         <div id="8fa2821f-e4dd-44bd-99c0-81c2a70f717f">
           <div class="row">
            <div class="col-md">
-            <div id="b39579bc-e87a-465b-9893-2f8576d1ef28">
-             <p id="a967852c-0e50-44a2-9c85-1228cfc177e4">
+            <div id="9a2db2a2-308e-42f3-8b85-91fd67d944d6">
+             <p id="9b552165-0578-43c9-981c-3e7448411484">
               An example of how
               <code>
                Dialog
@@ -2707,8 +2713,8 @@ Panel(dialog, button)</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="dc87d1c4-cc64-410e-a8e4-52ab77b4b933">
-             <pre id="34f802a1-b640-44b5-a2fa-0f1449571523"><code class="language-python">from bootwrap import Panel, Form, NumericInput, Dialog, Button
+            <div id="8b54a641-1d9c-404c-bb19-b0b63f9cb264">
+             <pre id="b7e7f361-571a-4b71-a4e5-b5ec69c6c7a4"><code class="language-python">from bootwrap import Panel, Form, NumericInput, Dialog, Button
 
 dialog = Dialog(
     "Buy Company Shares",
@@ -2726,8 +2732,8 @@ dialog = Dialog(
 button = Button("Buy Shares").as_primary().toggle(dialog)   
 
 Panel(dialog, button)</code></pre>
-             <div id="1ae2226d-e65b-4bb6-915c-f14ca90bac9d">
-              <div class="modal" id="adb78da7-bdae-46af-86b7-e33262ace069">
+             <div id="a3181c61-e153-41a7-8751-91871f6509b3">
+              <div class="modal" id="034575f9-a3ea-4b18-92b9-88731ef4fdd8">
                <div class="modal-dialog" role="document">
                 <div class="modal-content">
                  <div class="modal-header">
@@ -2738,19 +2744,19 @@ Panel(dialog, button)</code></pre>
                   </button>
                  </div>
                  <div class="modal-body">
-                  <form enctype="multipart/form-data" id="db10eb56-a762-46c3-8fde-7149ac3d6dbb" method="POST">
+                  <form enctype="multipart/form-data" id="d387230d-2296-427a-8c2f-10f0cbdd4cc4" method="POST">
                    <div class="form-group row">
-                    <label class="col-sm-4 col-form-label d-flex align-items-center" for="59ba9bea-bcdb-4884-a6af-0fb4008c3ad0">
+                    <label class="col-sm-4 col-form-label d-flex align-items-center" for="5b1e0f9d-e37c-4dd4-b1e7-223b63a83612">
                      Amount($)
                     </label>
                     <div class="col-sm-8 d-flex align-items-center">
-                     <input class="form-control" id="59ba9bea-bcdb-4884-a6af-0fb4008c3ad0" name="amount" placeholder="enter an amount for buying shares" type="number"/>
+                     <input class="form-control" id="5b1e0f9d-e37c-4dd4-b1e7-223b63a83612" name="amount" placeholder="enter an amount for buying shares" type="number"/>
                     </div>
                    </div>
-                   <button class="float-right btn" data-bs-dismiss="modal" id="e2012ff1-94f0-4d4b-af50-fc3d772e9742" onclick="return false;" type="button">
+                   <button class="float-right btn" data-bs-dismiss="modal" id="641f91e1-4410-4285-9e35-a537ead81074" onclick="return false;" type="button">
                     Cancel
                    </button>
-                   <button class="float-right me-2 btn btn-success" data-bs-dismiss="modal" id="433fb717-c90a-41da-b7a8-d8d0c9b189ab" onclick="return false;" type="button">
+                   <button class="float-right me-2 btn btn-success" data-bs-dismiss="modal" id="a3282dbf-1f2c-4c39-806f-c4bb45a1b1b4" onclick="return false;" type="button">
                     Buy
                    </button>
                   </form>
@@ -2758,7 +2764,7 @@ Panel(dialog, button)</code></pre>
                 </div>
                </div>
               </div>
-              <button class="btn btn-primary" data-bs-target="#adb78da7-bdae-46af-86b7-e33262ace069" data-bs-toggle="modal" id="71caf6aa-dc23-4fb8-942a-3161ad3362df" onclick="return false;" type="button">
+              <button class="btn btn-primary" data-bs-target="#034575f9-a3ea-4b18-92b9-88731ef4fdd8" data-bs-toggle="modal" id="2bbeb2f9-1027-4f7e-af9c-e2e4d98d7dc8" onclick="return false;" type="button">
                Buy Shares
               </button>
              </div>
@@ -2771,106 +2777,106 @@ Panel(dialog, button)</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="3d845cde-8cda-40e5-80b4-760c4ee88188">
-     <div id="def35d80-75a0-4f81-99db-f17b70d9fd86">
+    <div class="tab-pane fade" id="ffe22e44-60bf-4fda-b060-e8f8dca4d2c0">
+     <div id="27fd460b-afc6-4750-9c15-7b10762e4077">
       <hr/>
-      <ul class="nav" id="2294afac-c023-4baa-8d99-d084d85f1d6c" role="tablist">
+      <ul class="nav" id="6f0144d0-e88d-4828-b708-ba376c73ab29" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#cda94e7a-3636-4120-9b76-7acb1bd74c9c" data-bs-toggle="tab" href="#cda94e7a-3636-4120-9b76-7acb1bd74c9c" id="629dbc0e-0d71-415e-94bd-844a966c4592" role="tab">
-         <span class="text-secondary" id="09381dc9-d2e6-45fd-8515-584cb4835097">
+        <a class="nav-link active" data-bs-target="#e910f789-2d21-4a89-99d3-71aca10f974c" data-bs-toggle="tab" href="#e910f789-2d21-4a89-99d3-71aca10f974c" id="1d129249-c0c7-479b-994a-e78ae3ad034c" role="tab">
+         <span class="text-secondary" id="22cbd46b-70aa-4f08-9c10-88ce0f41a7ef">
           Form
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#cc6c62e3-86c9-4d17-86f1-da3b9254ec57" data-bs-toggle="tab" href="#cc6c62e3-86c9-4d17-86f1-da3b9254ec57" id="558cf3ef-b2b2-453c-b566-52e11e4cec22" role="tab">
-         <span class="text-secondary" id="66f01f87-45f1-4ff5-ab34-2762462101ed">
+        <a class="nav-link" data-bs-target="#9dcf6359-331e-45bb-8dff-d63b7c62583f" data-bs-toggle="tab" href="#9dcf6359-331e-45bb-8dff-d63b7c62583f" id="931ce73b-1b5f-46d7-b13d-a98b9e6f98c5" role="tab">
+         <span class="text-secondary" id="c0850c1e-2b29-4ea9-99f6-16702e339e52">
           CheckboxInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#c2fd257f-1daa-4b14-93eb-7c4065dc1845" data-bs-toggle="tab" href="#c2fd257f-1daa-4b14-93eb-7c4065dc1845" id="0df769dd-14dd-4694-9fd2-9448e6b2e608" role="tab">
-         <span class="text-secondary" id="fc53693f-8369-4be1-b3b9-00b21d710f4e">
+        <a class="nav-link" data-bs-target="#50eca9f0-6fbb-4372-a381-1a62947de02c" data-bs-toggle="tab" href="#50eca9f0-6fbb-4372-a381-1a62947de02c" id="7b39bae7-dc6b-41a5-bf9e-f482c9dfd14e" role="tab">
+         <span class="text-secondary" id="f52fc885-ce94-4224-89d7-20e99c48c8c1">
           TextInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#fa7181d0-143a-4095-9962-d2b2ff83db9e" data-bs-toggle="tab" href="#fa7181d0-143a-4095-9962-d2b2ff83db9e" id="e72aef2d-d280-472c-ad65-7b401de3e68a" role="tab">
-         <span class="text-secondary" id="79680877-5951-421f-bbf0-7eb42aa43dd5">
+        <a class="nav-link" data-bs-target="#9a2a0603-e7f8-46ba-9f52-4e831df37bce" data-bs-toggle="tab" href="#9a2a0603-e7f8-46ba-9f52-4e831df37bce" id="3877afff-1562-4e50-9c27-06d5f10dffdc" role="tab">
+         <span class="text-secondary" id="f0686ac9-8f29-49fc-80a6-14cd58bead2a">
           NumericInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#1022fda7-d45e-4c31-8582-2602f15aeaab" data-bs-toggle="tab" href="#1022fda7-d45e-4c31-8582-2602f15aeaab" id="2f0f6a4e-6f3b-4cfa-bc56-6a2e699640ec" role="tab">
-         <span class="text-secondary" id="bd2c1b48-2873-4b5d-926c-a1bb402e562e">
+        <a class="nav-link" data-bs-target="#eb15ee1c-8bee-4fee-84ce-f168d50cfce8" data-bs-toggle="tab" href="#eb15ee1c-8bee-4fee-84ce-f168d50cfce8" id="d3a00a4b-60d5-42df-a5ca-6fdf43f9cb8e" role="tab">
+         <span class="text-secondary" id="00624aae-125f-455a-999f-9062022618a6">
           SelectInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#76e24ab5-8954-4e4b-9267-ad0095760401" data-bs-toggle="tab" href="#76e24ab5-8954-4e4b-9267-ad0095760401" id="fc314e7d-ada0-4dfc-92ee-da141f8b217f" role="tab">
-         <span class="text-secondary" id="5d7f8b6f-b20a-4c45-a06c-6f9e2238a321">
+        <a class="nav-link" data-bs-target="#643ef479-76ed-4216-80d5-ef688befb662" data-bs-toggle="tab" href="#643ef479-76ed-4216-80d5-ef688befb662" id="4f7cb31f-c0cb-4119-b94f-d43994c22090" role="tab">
+         <span class="text-secondary" id="99d76f2f-4eb4-43d2-a4f7-0bd037ad62c1">
           SelectInput.Option
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#3a19a6c1-5e7e-4d48-a92e-d4e04233fdad" data-bs-toggle="tab" href="#3a19a6c1-5e7e-4d48-a92e-d4e04233fdad" id="3e9c862a-d581-40a0-b4b2-f0cb0fcb9229" role="tab">
-         <span class="text-secondary" id="bb32e4d5-0ba8-4606-b990-4e44c00b90bd">
+        <a class="nav-link" data-bs-target="#93503f0c-c22c-48f1-9a84-ceee1dea13f7" data-bs-toggle="tab" href="#93503f0c-c22c-48f1-9a84-ceee1dea13f7" id="c0873fb1-b0d1-4607-9afe-d809b84d2453" role="tab">
+         <span class="text-secondary" id="1753793b-a9b3-402b-8e4f-c2fa9f724d12">
           JsonInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#21146b4f-14b7-4df0-8897-9bbf2060baeb" data-bs-toggle="tab" href="#21146b4f-14b7-4df0-8897-9bbf2060baeb" id="d223efe5-dca3-4cfd-9ab1-ba2b4434022c" role="tab">
-         <span class="text-secondary" id="be66ccc1-f95a-45bb-b560-2d8814d42376">
+        <a class="nav-link" data-bs-target="#0df672b3-dbc7-4e1f-ba78-d8fbf8039e4d" data-bs-toggle="tab" href="#0df672b3-dbc7-4e1f-ba78-d8fbf8039e4d" id="d2908ab7-3acb-4862-b377-98b7b09d8500" role="tab">
+         <span class="text-secondary" id="d9e01684-3d5e-4301-83e7-2b54fbbb4ef9">
           HiddenInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#e1a7a09d-ca44-4ac3-8ff5-99d4e1af4b04" data-bs-toggle="tab" href="#e1a7a09d-ca44-4ac3-8ff5-99d4e1af4b04" id="e5a004c1-d7c3-4890-86d7-c8674ba44453" role="tab">
-         <span class="text-secondary" id="2a6116dc-55d1-40f8-9e92-6f2ef8e11dd0">
+        <a class="nav-link" data-bs-target="#1ddd8dea-8929-4f62-b7c0-940009cc5fbd" data-bs-toggle="tab" href="#1ddd8dea-8929-4f62-b7c0-940009cc5fbd" id="34e36ea8-17f5-4a88-a7d3-6d3f37f99792" role="tab">
+         <span class="text-secondary" id="2dea6a61-02e5-4573-9c76-5eda8d62b8b1">
           FileInput
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#67ed4ae6-dcf3-4cfa-b816-93459cd47752" data-bs-toggle="tab" href="#67ed4ae6-dcf3-4cfa-b816-93459cd47752" id="3d994063-1196-46b1-b862-e70d1f0d4338" role="tab">
-         <span class="text-secondary" id="be04014e-e0fd-40a7-b722-37d1615b577c">
+        <a class="nav-link" data-bs-target="#1ca50ae1-8f98-4d53-b29f-b4b51ab19abe" data-bs-toggle="tab" href="#1ca50ae1-8f98-4d53-b29f-b4b51ab19abe" id="2e8aa4e0-bd20-4c01-91c5-ccef47c7c8ff" role="tab">
+         <span class="text-secondary" id="a9f32d74-79d3-4cd7-b0d7-1d41f0c92b04">
           InputGroup
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="cda94e7a-3636-4120-9b76-7acb1bd74c9c">
-        <div class="mt-5" id="87628d1e-2465-4379-a5cb-8094243f6bba">
-         <div class="d-flex justify-content-between" id="0e093c0b-6a09-4e5c-8d89-13c782fb6547">
-          <h1 id="cad9460b-9c0d-44cd-bf9c-69a5f5ddaf17">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="e910f789-2d21-4a89-99d3-71aca10f974c">
+        <div class="mt-5" id="88e4546c-1be4-4e97-898b-356c9928dc4d">
+         <div class="d-flex justify-content-between" id="7c205e87-c4a4-477f-aa24-d723c3ae61a8">
+          <h1 id="0d0be8ce-858f-4065-9c23-7a1a88a06f21">
            Class
-           <span class="text-primary" id="b4af6f57-e133-4cb9-96b7-4ac39a628ec0">
+           <span class="text-primary" id="21155bb2-e788-4c08-aac0-b844b2ea27e3">
             Form
            </span>
           </h1>
-          <div id="a765495f-8395-40fc-a62e-53ac4d47e18a">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#5a066c6a-14fc-4607-841e-7d894dfeefb4" data-bs-toggle="collapse" id="9d156ea8-43bd-4f7f-956e-8866e51dae4d" onclick="return false;" type="button">
+          <div id="524a75aa-1870-440f-9119-f4e19f07aebb">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#c650bcd7-492e-41ec-a5b2-b51964a1b7a6" data-bs-toggle="collapse" id="3d36c904-5ac8-48b1-a5bc-cd866f8c1010" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="0566b468-5c26-41fc-b949-3d30b6e7afe8">
+         <span class="text-muted" id="9c599c70-7a5b-47ad-88d3-cd70e30dda87">
           A web component for a form.
          </span>
-         <pre id="e6cd861d-7576-44ad-be1d-529a2e28b262"><code class="language-python">Form(*components)</code></pre>
-         <div class="ms-3 collapse" id="5a066c6a-14fc-4607-841e-7d894dfeefb4">
-          <h6 id="7c736c8c-dce5-4f92-a5c2-0686aef7af47">
+         <pre id="cd18e551-fd65-470c-b8b6-a350f25af2f7"><code class="language-python">Form(*components)</code></pre>
+         <div class="ms-3 collapse" id="c650bcd7-492e-41ec-a5b2-b51964a1b7a6">
+          <h6 id="4159be02-6f59-47af-a4e7-0d869689b516">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="d256de42-73e6-481b-9d15-1b38238e3b25">
+          <table class="table table-sm bg-light" id="efa66d62-debb-44b1-bba9-82687103f081">
            <thead>
             <tr>
              <th scope="col">
@@ -2908,7 +2914,7 @@ Panel(dialog, button)</code></pre>
            </tbody>
           </table>
          </div>
-         <p id="60a594c5-5b03-433f-978c-91f1bc67a4bc">
+         <p id="0b377d49-62aa-48bc-9eaa-15f6f047ffa6">
           Use the
           <code>
            on_submit(href)
@@ -2916,11 +2922,11 @@ Panel(dialog, button)</code></pre>
           function to specify URL where entered
     information should to be sent for processing.
          </p>
-         <div class="ms-3" id="a9c09af2-410a-42d8-b168-0ee8aef757bc">
-          <h6 id="b92e1ffd-df18-4baa-8b9c-42812aa78092">
+         <div class="ms-3" id="10d0eac8-0c34-4343-8ab2-43cba4bf01e4">
+          <h6 id="39ad5789-047c-4990-8adb-e38767f8b5bc">
            Example
           </h6>
-          <pre id="1da53651-6090-43ce-b955-ea3e95e1d623"><code class="language-python">from bootwrap import Form
+          <pre id="12d133dc-bcb0-47f9-9608-fcbac3331cfb"><code class="language-python">from bootwrap import Form
 
 Form(
     # here should be an enumeration  of
@@ -2929,32 +2935,32 @@ Form(
 ).on_submit('go/to/this/url')
 </code></pre>
          </div>
-         <div class="mt-5" id="9cd192fc-9f5b-43b9-bc73-9e8ecbac51f0">
-          <div class="d-flex justify-content-between" id="e457c15b-34f7-4484-8777-1265dfd1f660">
-           <h4 id="82eac6f1-c1ba-4640-8e8c-f0efe7d7d708">
+         <div class="mt-5" id="5560be52-864e-4dd4-ac84-9b2464c1a513">
+          <div class="d-flex justify-content-between" id="090f444e-6371-43ad-b301-46b132b02623">
+           <h4 id="3f3069c5-5b63-4827-b62a-f07cdb1a9305">
             Method
-            <span class="text-primary" id="ebb8ed8c-f380-47aa-8bff-d8a7419ac41f">
+            <span class="text-primary" id="88acfcc5-3f1e-4e6f-81dc-a98f2ff949f3">
              on_submit
             </span>
            </h4>
-           <div id="0c69db37-b695-40f2-893a-325186edb01e">
-            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#5a337401-b897-496d-8a15-7a277f545999" data-bs-toggle="collapse" id="b66255d1-7d5b-4fe4-9417-3e0db6d01a12" onclick="return false;" type="button">
+           <div id="8862da9b-0eb6-463e-b396-77c6a8e21bb4">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#9596d3bc-a61e-40e9-9478-0bca508b625c" data-bs-toggle="collapse" id="bb25d614-46eb-43da-8a3a-90b56e5bfa57" onclick="return false;" type="button">
              Argument
             </button>
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#296333a8-5a1c-4c8f-9beb-bd01bd3e2619" data-bs-toggle="collapse" id="bda5d0fc-0c90-4831-85b0-1fcf193017f5" onclick="return false;" type="button">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#ef1bd2eb-55d8-458a-a159-e56f1734e962" data-bs-toggle="collapse" id="5babf9b4-bdeb-4568-89ed-7f91b00a8336" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="033a7429-6f45-443e-9c0d-dfdec5ebb89b">
+          <span class="text-muted" id="563fbdc1-cde5-4f16-8827-0a62911ef2e6">
            Sets the submit URL, for the POST request.
           </span>
-          <pre id="caf22edd-285d-4aa1-a077-a5b7a6141fee"><code class="language-python">on_submit(href)</code></pre>
-          <div class="ms-3 collapse" id="5a337401-b897-496d-8a15-7a277f545999">
-           <h6 id="e9e664cf-0429-4058-a4fc-addbd6e09630">
+          <pre id="998cea12-e9e2-4d06-b60d-aa95ddafa69c"><code class="language-python">on_submit(href)</code></pre>
+          <div class="ms-3 collapse" id="9596d3bc-a61e-40e9-9478-0bca508b625c">
+           <h6 id="f56dda3e-b425-45e7-a68e-3feaf1881cec">
             Arguments
            </h6>
-           <table class="table table-sm bg-light" id="f4e9dd17-e8e4-4677-be33-2d0f346b18e6">
+           <table class="table table-sm bg-light" id="f9ce624c-2833-454f-97c4-9174ca5b105e">
             <thead>
              <tr>
               <th scope="col">
@@ -2987,11 +2993,11 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3 collapse" id="296333a8-5a1c-4c8f-9beb-bd01bd3e2619">
-           <h6 id="398e50f6-a30f-4718-80a5-58b5ccd01b9a">
+          <div class="ms-3 collapse" id="ef1bd2eb-55d8-458a-a159-e56f1734e962">
+           <h6 id="9e08ca16-81b5-4146-9e9a-396c8417437f">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="81b660a1-7cee-4399-ad1b-83d97a3d3e77">
+           <table class="table table-sm bg-light" id="da8a0d8b-53c3-4d10-88d2-d7caa84c4b4a">
             <thead>
              <tr>
               <th scope="col">
@@ -3024,11 +3030,11 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="56e74e59-c6ff-42f2-85fe-937f3a49ef21">
-           <h6 id="7aea46aa-2fe1-44ea-be7b-6eb526ca564c">
+          <div class="ms-3" id="c6671a8e-321a-466d-ba08-a87ac5e408ee">
+           <h6 id="fac8e28b-5d3c-4a20-9bdc-60d1cccbfd99">
             Example
            </h6>
-           <pre id="ccbc5313-1264-461f-843a-e8d15d091a2a"><code class="language-python">from bootwrap import Form
+           <pre id="a1fb7421-45d7-4c4d-a728-d0c6989c5269"><code class="language-python">from bootwrap import Form
 
 Form(...).on_submit('go/to/this/url')
 </code></pre>
@@ -3036,30 +3042,30 @@ Form(...).on_submit('go/to/this/url')
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="cc6c62e3-86c9-4d17-86f1-da3b9254ec57">
-        <div class="mt-5" id="332fe96e-7c58-4469-8fbb-bce4b22bb010">
-         <div class="d-flex justify-content-between" id="58dcf96f-528a-46cb-a54e-a4dbb434440f">
-          <h1 id="e279ee78-a748-422b-bd09-5785f4119249">
+       <div class="tab-pane fade" id="9dcf6359-331e-45bb-8dff-d63b7c62583f">
+        <div class="mt-5" id="02e29ea6-0a57-4368-9cc9-de4274faf08f">
+         <div class="d-flex justify-content-between" id="45b508f5-dd0c-4a87-9c24-0303faa954a0">
+          <h1 id="1b4e6748-09b6-42cb-ae7b-4448ff8966a9">
            Class
-           <span class="text-primary" id="f3e6502e-1ff7-498b-8893-840c20de3231">
+           <span class="text-primary" id="f37cdc50-58d2-402f-89c1-86e0c7707907">
             CheckboxInput
            </span>
           </h1>
-          <div id="f762fb73-b17c-4acc-a8b3-38b6ae1446e0">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#ac0b3be0-658d-492e-843d-4261007a780e" data-bs-toggle="collapse" id="9f145777-b89b-41d0-a414-6faafa3fc2e3" onclick="return false;" type="button">
+          <div id="c514311d-8d25-4bd8-a3b5-04b25f1b4224">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#14a05321-a3b5-40e0-afbe-30d88a1d2f3a" data-bs-toggle="collapse" id="4b2ae6dc-0827-4bfd-9065-843c901a94c4" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="e5dbb0cc-5932-4b7b-a6fe-a017645c4241">
+         <span class="text-muted" id="3594589a-9109-40fd-879b-b5c069ad7ead">
           A checkbox input.
          </span>
-         <pre id="37d99559-fcf8-4b64-9732-b15af5e56d0f"><code class="language-python">CheckboxInput(label, name, checked=False)</code></pre>
-         <div class="ms-3 collapse" id="ac0b3be0-658d-492e-843d-4261007a780e">
-          <h6 id="84bbef8c-85f7-4479-9ee7-34ccf7b72938">
+         <pre id="1cd71cb3-9628-4b9f-b4aa-ba550f891b2f"><code class="language-python">CheckboxInput(label, name, checked=False)</code></pre>
+         <div class="ms-3 collapse" id="14a05321-a3b5-40e0-afbe-30d88a1d2f3a">
+          <h6 id="feca359a-ca3b-4f0e-a457-e07eefee6f4f">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="bd5bad10-ea7b-492a-abca-c422d818f949">
+          <table class="table table-sm bg-light" id="3e04bc74-c6f9-41b1-9fde-a32259e57767">
            <thead>
             <tr>
              <th scope="col">
@@ -3122,7 +3128,7 @@ Form(...).on_submit('go/to/this/url')
            </tbody>
           </table>
          </div>
-         <p id="e6d1d780-75f2-45cd-9fdc-e5062c6707c2">
+         <p id="7950a3f0-92f7-4c4f-9616-ad757fd55396">
           Use the
           <code>
            as_disabled()
@@ -3134,11 +3140,11 @@ Form(...).on_submit('go/to/this/url')
           </code>
           component.
          </p>
-         <div class="ms-3" id="4e006ac0-804f-42f0-b893-8095dbe32e19">
-          <h6 id="790588dd-20ba-4652-b10f-5e90d74c3a8b">
+         <div class="ms-3" id="06cb4937-f50f-4f98-9623-f709fb9ff409">
+          <h6 id="c2177880-ecd0-43f3-9fce-e58a89ab9342">
            Example
           </h6>
-          <pre id="f048e71b-25de-475f-830b-ce3ba70b2d4c"><code class="language-python">from bootwrap import Form, CheckboxInput
+          <pre id="abf66a12-a4ba-431c-9c6f-c48d56cb04ee"><code class="language-python">from bootwrap import Form, CheckboxInput
 
 Form(
     CheckboxInput('One', 'opt1'),
@@ -3148,57 +3154,61 @@ Form(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="325881a9-6181-48ca-ae63-83b561218118">
-          <form enctype="multipart/form-data" id="90517c56-9567-4ef0-9c63-87feb7baf609" method="POST">
+         <div class="ms-3" id="0ce2ec78-be86-4097-9b95-9a231445827b">
+          <form enctype="multipart/form-data" id="90d13ac5-23a9-4f0e-8ca4-e03c6e59b1c3" method="POST">
            <div class="form-check">
-            <input autocomplete="off" class="form-check-input" id="8025458a-df32-40c4-ab3f-26cc1133db4a" name="opt1" type="checkbox"/>
-            <label class="form-check-label" for="8025458a-df32-40c4-ab3f-26cc1133db4a">
+            <input autocomplete="off" class="form-check-input" id="b8a5e61d-f864-420c-a92a-8c060733b3e9" name="opt1" type="checkbox" value="true"/>
+            <input name="opt1" type="hidden" value="false"/>
+            <label class="form-check-label" for="b8a5e61d-f864-420c-a92a-8c060733b3e9">
              One
             </label>
            </div>
            <div class="form-check">
-            <input autocomplete="off" checked="" class="form-check-input" id="f29a5017-60e7-4e06-86c4-1fc47b3007ae" name="opt2" type="checkbox"/>
-            <label class="form-check-label" for="f29a5017-60e7-4e06-86c4-1fc47b3007ae">
+            <input autocomplete="off" checked="" class="form-check-input" id="de118c37-c848-44e6-a403-389e1b1a67d4" name="opt2" type="checkbox" value="true"/>
+            <input name="opt2" type="hidden" value="false"/>
+            <label class="form-check-label" for="de118c37-c848-44e6-a403-389e1b1a67d4">
              Two
             </label>
            </div>
            <div class="form-check">
-            <input autocomplete="off" class="form-check-input" disabled="" id="07babc6a-c895-44ac-a50e-d96f99f4b87e" name="opt3" type="checkbox"/>
-            <label class="form-check-label" for="07babc6a-c895-44ac-a50e-d96f99f4b87e">
+            <input autocomplete="off" class="form-check-input" disabled="" id="a0b45a45-101f-4ef3-94f6-9adc0a1d2485" name="opt3" type="checkbox" value="true"/>
+            <input name="opt3" type="hidden" value="false"/>
+            <label class="form-check-label" for="a0b45a45-101f-4ef3-94f6-9adc0a1d2485">
              Three
             </label>
            </div>
            <div class="form-check">
-            <input autocomplete="off" checked="" class="form-check-input" disabled="" id="6ea8855d-1d17-43ce-99df-a2548a1093e9" name="opt4" type="checkbox"/>
-            <label class="form-check-label" for="6ea8855d-1d17-43ce-99df-a2548a1093e9">
+            <input autocomplete="off" checked="" class="form-check-input" disabled="" id="af987ac9-e32f-40ad-be98-d8f22cc38965" name="opt4" type="checkbox" value="true"/>
+            <input name="opt4" type="hidden" value="false"/>
+            <label class="form-check-label" for="af987ac9-e32f-40ad-be98-d8f22cc38965">
              Four
             </label>
            </div>
           </form>
          </div>
-         <div class="mt-5" id="ed9b0eac-5657-4d2a-9d05-2b5bbf5f4d4e">
-          <div class="d-flex justify-content-between" id="a4833c4c-7686-459e-a7ab-127c7634acb6">
-           <h4 id="f8d6d3f2-1f35-4860-b8f8-440701cb11ea">
+         <div class="mt-5" id="2e936f4a-e00f-4348-a9bf-0213217d1bd2">
+          <div class="d-flex justify-content-between" id="e0be9aea-8576-44d6-afe3-1db3bb7dacf1">
+           <h4 id="0b52c434-2e50-4a0c-919d-f3f30d024214">
             Method
-            <span class="text-primary" id="35b3cebd-bb6f-4d56-8da5-0644e2546b7a">
+            <span class="text-primary" id="d4a61496-f8cc-4df1-b38f-f24ad3a8e3a8">
              as_button
             </span>
            </h4>
-           <div id="4ad90996-c391-4ce7-8c94-b360ce222d57">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#3265b0f3-d196-41b4-80f6-d88c67a67423" data-bs-toggle="collapse" id="13e40a5e-7365-4d1e-8cf0-45a55c5083c0" onclick="return false;" type="button">
+           <div id="8fd12c41-eff5-4e4c-ad70-bdd1b835cd4c">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#8a4416a4-a838-48fc-8578-a32501791716" data-bs-toggle="collapse" id="dfbc7454-a970-4659-8971-3644bff0ecd7" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="7038fa9e-2dd8-49e6-a69f-ea458638bdee">
+          <span class="text-muted" id="618849c7-9199-4d43-98e6-74de3edb8a78">
            Sets the "button"-style to the check box.
           </span>
-          <pre id="d702a58e-ea5f-4368-8d88-fea35cf65f53"><code class="language-python">as_button()</code></pre>
-          <div class="ms-3 collapse" id="3265b0f3-d196-41b4-80f6-d88c67a67423">
-           <h6 id="f5200958-79e6-4dc4-bf31-0d7e037a5ac8">
+          <pre id="c94b3a39-4ac5-4cf2-9d9b-83c885858d53"><code class="language-python">as_button()</code></pre>
+          <div class="ms-3 collapse" id="8a4416a4-a838-48fc-8578-a32501791716">
+           <h6 id="d59dd5e2-25f9-46e4-8ce7-c3f43135c151">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="3f52d74d-221c-4205-afd1-8be989378ae3">
+           <table class="table table-sm bg-light" id="d92af788-b2d7-4ef5-9908-827898f7cc4b">
             <thead>
              <tr>
               <th scope="col">
@@ -3231,11 +3241,11 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="b92c3487-3a87-4b75-b3b6-9ee917141e51">
-           <h6 id="1f28a34d-85f7-4ec2-b74c-befc380bda65">
+          <div class="ms-3" id="b26ad815-4d4c-45c0-afae-88e3cfbcdd9c">
+           <h6 id="62633c55-efa8-4035-8859-102bbba6a4b9">
             Example
            </h6>
-           <pre id="78dbf083-e4d7-474c-870a-89f63318f390"><code class="language-python">from bootwrap import Form, CheckboxInput
+           <pre id="356f8e65-5b33-45d6-a2a8-385d87a49e21"><code class="language-python">from bootwrap import Form, CheckboxInput
 
 Form(
     CheckboxInput('One', 'opt1').as_button().as_primary().as_outline(),
@@ -3245,50 +3255,54 @@ Form(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="f178ff16-c8a4-4416-bc1d-c90ff532d75c">
-           <form enctype="multipart/form-data" id="6dc6acbd-a275-4869-bfbb-8a019253c4eb" method="POST">
-            <input autocomplete="off" class="btn-check" id="35779e3b-c041-4946-8031-e4c029deade9" name="opt1" type="checkbox"/>
-            <label class="btn btn-outline-primary" for="35779e3b-c041-4946-8031-e4c029deade9">
+          <div class="ms-3" id="50577706-0b3f-4d6e-9ae7-53fe4f07234d">
+           <form enctype="multipart/form-data" id="2b91ef62-23e4-4d9c-ab58-c17e6de97585" method="POST">
+            <input autocomplete="off" class="btn-check" id="2ccd14b8-5627-4a18-98fc-5e3843d7a611" name="opt1" type="checkbox" value="true"/>
+            <input name="opt1" type="hidden" value="false"/>
+            <label class="btn btn-outline-primary" for="2ccd14b8-5627-4a18-98fc-5e3843d7a611">
              One
             </label>
-            <input autocomplete="off" checked="" class="btn-check" id="b2e93be1-2e0e-4150-9d25-7108c029c88d" name="opt2" type="checkbox"/>
-            <label class="btn" for="b2e93be1-2e0e-4150-9d25-7108c029c88d">
+            <input autocomplete="off" checked="" class="btn-check" id="0986b484-6f1e-431c-aa6a-2b35f3dd795c" name="opt2" type="checkbox" value="true"/>
+            <input name="opt2" type="hidden" value="false"/>
+            <label class="btn" for="0986b484-6f1e-431c-aa6a-2b35f3dd795c">
              Two
             </label>
-            <input autocomplete="off" class="btn-check" disabled="" id="887426f4-d3c7-4619-9752-c4a6c7c73b53" name="opt3" type="checkbox"/>
-            <label class="btn" for="887426f4-d3c7-4619-9752-c4a6c7c73b53">
+            <input autocomplete="off" class="btn-check" disabled="" id="11a6d327-646d-4089-80b2-adce21b5a843" name="opt3" type="checkbox" value="true"/>
+            <input name="opt3" type="hidden" value="false"/>
+            <label class="btn" for="11a6d327-646d-4089-80b2-adce21b5a843">
              Three
             </label>
-            <input autocomplete="off" checked="" class="btn-check" disabled="" id="0d9ed5ae-72c4-4f2a-a319-3dcd73ed086d" name="opt4" type="checkbox"/>
-            <label class="btn" for="0d9ed5ae-72c4-4f2a-a319-3dcd73ed086d">
+            <input autocomplete="off" checked="" class="btn-check" disabled="" id="4f1eaa9c-0b92-4eb3-a82d-52d38c841dbe" name="opt4" type="checkbox" value="true"/>
+            <input name="opt4" type="hidden" value="false"/>
+            <label class="btn" for="4f1eaa9c-0b92-4eb3-a82d-52d38c841dbe">
              Four
             </label>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="6162d6d1-8e48-48f6-ba60-7a5b60fdd382">
-          <div class="d-flex justify-content-between" id="32c431da-3dea-4530-94eb-5b549a4a1c89">
-           <h4 id="cbf1874c-ec30-4f8b-a822-2441d62e14c6">
+         <div class="mt-5" id="61d255c6-e15c-4cc7-9838-288ba20cef32">
+          <div class="d-flex justify-content-between" id="71b4ada7-e7ad-42f3-aff7-bd063ef8adfc">
+           <h4 id="0590e9d7-b65a-4b10-bc3f-17116ce00a06">
             Method
-            <span class="text-primary" id="649fe217-2fa1-4652-b2bf-ecf7814eb8f5">
+            <span class="text-primary" id="a3a2e462-af2a-4ee5-bd63-dc2ded998f93">
              as_radio
             </span>
            </h4>
-           <div id="e684cd5f-06e8-458d-816b-5a41f67951b9">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#e7bbdbd0-204e-4f83-9229-bf8dd368ced3" data-bs-toggle="collapse" id="73d49dae-2211-4a19-abbf-f3d7a4a3582e" onclick="return false;" type="button">
+           <div id="85981c51-754a-4f0f-85bd-75c9b6e071d5">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#f5acf4ba-df30-4abe-b63e-ac853aaa5a96" data-bs-toggle="collapse" id="9fcb84ac-372c-4b53-a247-6314e3544071" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="0da54941-f2f0-44e0-afa1-f42073e9fc90">
+          <span class="text-muted" id="47799850-fd82-408a-894f-9b4f8955f035">
            Makes a chack box as radio button.
           </span>
-          <pre id="f585d078-de18-4c90-9ea4-6c23d92fdacb"><code class="language-python">as_radio(value)</code></pre>
-          <div class="ms-3 collapse" id="e7bbdbd0-204e-4f83-9229-bf8dd368ced3">
-           <h6 id="00d568ae-0a70-463e-a465-e02ad98da4d7">
+          <pre id="e4477ccc-9f41-46b6-991e-6925c8d2687f"><code class="language-python">as_radio(value)</code></pre>
+          <div class="ms-3 collapse" id="f5acf4ba-df30-4abe-b63e-ac853aaa5a96">
+           <h6 id="82adea8d-cc1d-4692-8fd3-05364c739d0a">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="7db98282-0420-4324-a9c7-86e125a05a9e">
+           <table class="table table-sm bg-light" id="ec17c186-1f21-45a7-8ff2-823efb35729a">
             <thead>
              <tr>
               <th scope="col">
@@ -3321,11 +3335,11 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="f81a23d7-abc6-4c94-b46b-3171b922ba9b">
-           <h6 id="df4c58a8-28e0-485e-94f9-8710c9377d1b">
+          <div class="ms-3" id="a407e6d0-b119-423a-abad-41a958cc36be">
+           <h6 id="d9fc563d-9dcf-4ec8-96ce-59afb029ade5">
             Example
            </h6>
-           <pre id="3aa3bd3b-7f98-44e5-8937-0b4a116254aa"><code class="language-python">from bootwrap import Form, CheckboxInput
+           <pre id="ffe7c8d3-e5af-4415-8181-be3b3cd92f95"><code class="language-python">from bootwrap import Form, CheckboxInput
 
 Form(
     CheckboxInput('One', 'opt').as_radio(1),
@@ -3335,58 +3349,62 @@ Form(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="f5e62cda-440f-455c-b9db-62ba49d18b75">
-           <form enctype="multipart/form-data" id="c6629479-56b7-42f0-a6d8-0a96bb12cdaf" method="POST">
+          <div class="ms-3" id="8b75ee56-370e-4284-ad05-2ad209ccf9c2">
+           <form enctype="multipart/form-data" id="50767d71-9d6a-48bb-a709-3a049a1242e7" method="POST">
             <div class="form-check">
-             <input autocomplete="off" class="form-check-input" id="1aba19b6-975c-4042-b9d0-6d8ee7ee7bf5" name="opt" type="radio" value="1"/>
-             <label class="form-check-label" for="1aba19b6-975c-4042-b9d0-6d8ee7ee7bf5">
+             <input autocomplete="off" class="form-check-input" id="be73e987-3212-4148-8133-f54886e667e0" name="opt" type="radio" value="1"/>
+             <input name="opt" type="hidden" value="false"/>
+             <label class="form-check-label" for="be73e987-3212-4148-8133-f54886e667e0">
               One
              </label>
             </div>
             <div class="form-check">
-             <input autocomplete="off" checked="" class="form-check-input" id="f0263c75-1388-45e3-bcf9-0ebad1f7de8e" name="opt" type="radio" value="2"/>
-             <label class="form-check-label" for="f0263c75-1388-45e3-bcf9-0ebad1f7de8e">
+             <input autocomplete="off" checked="" class="form-check-input" id="2fdfeb71-e130-4546-9080-4effcc9c8fba" name="opt" type="radio" value="2"/>
+             <input name="opt" type="hidden" value="false"/>
+             <label class="form-check-label" for="2fdfeb71-e130-4546-9080-4effcc9c8fba">
               Two
              </label>
             </div>
             <div class="form-check">
-             <input autocomplete="off" class="form-check-input" disabled="" id="73620e11-0d85-429a-b1ca-359ae6d67f62" name="opt" type="radio" value="3"/>
-             <label class="form-check-label" for="73620e11-0d85-429a-b1ca-359ae6d67f62">
+             <input autocomplete="off" class="form-check-input" disabled="" id="f86c50e1-332f-4f0b-8b66-ce18911f4a04" name="opt" type="radio" value="3"/>
+             <input name="opt" type="hidden" value="false"/>
+             <label class="form-check-label" for="f86c50e1-332f-4f0b-8b66-ce18911f4a04">
               Three
              </label>
             </div>
             <div class="form-check">
-             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="dea3a896-9d9b-470f-8cc6-8f00edbf243b" name="opt" type="radio" value="4"/>
-             <label class="form-check-label" for="dea3a896-9d9b-470f-8cc6-8f00edbf243b">
+             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="d5506863-3f8f-4dda-80fe-b37cb7482438" name="opt" type="radio" value="4"/>
+             <input name="opt" type="hidden" value="false"/>
+             <label class="form-check-label" for="d5506863-3f8f-4dda-80fe-b37cb7482438">
               Four
              </label>
             </div>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="d0ef627a-1190-4608-baf1-242b005803c5">
-          <div class="d-flex justify-content-between" id="31aea869-0954-4a56-adbe-c39361aa999c">
-           <h4 id="ed880f58-a799-47d4-a18e-5d73a81fd875">
+         <div class="mt-5" id="4cdceb82-522c-4808-8332-d5c8e9117e90">
+          <div class="d-flex justify-content-between" id="a8a5372e-1870-4b28-8058-1e22ab1ddaac">
+           <h4 id="4c07b926-99cd-4b45-a258-bfe283ee9da9">
             Method
-            <span class="text-primary" id="3d7df18e-b9c6-482e-a525-8a582172c774">
+            <span class="text-primary" id="30b364f7-5af3-433c-890b-62505f19fa18">
              as_switch
             </span>
            </h4>
-           <div id="d7d78bc8-650d-49bc-a8b2-92bbdb708293">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#b1c5a22f-ed08-454f-84da-06e54c6d10f6" data-bs-toggle="collapse" id="82aeac18-090a-4e8f-b6fb-b50023210346" onclick="return false;" type="button">
+           <div id="abc1b8ba-4c81-48fb-b3f7-5d084a8643e3">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#5ef7d072-397f-42ad-8c6a-5899ed2f1da6" data-bs-toggle="collapse" id="7d279f97-1173-4659-8c89-2a4096d0c148" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="a0d88ba7-505a-40af-a786-002d49db7af7">
+          <span class="text-muted" id="f006adeb-49e6-4832-8ced-8ca1d5d602a2">
            Sets the "switch"-style to the check box.
           </span>
-          <pre id="5496d7cd-ad0c-4335-bb71-2badaca7e768"><code class="language-python">as_switch()</code></pre>
-          <div class="ms-3 collapse" id="b1c5a22f-ed08-454f-84da-06e54c6d10f6">
-           <h6 id="caaff083-abe7-41d3-890a-ea546bb89ede">
+          <pre id="056b7b45-7a2e-4d21-8ffb-44dd15c2c0a9"><code class="language-python">as_switch()</code></pre>
+          <div class="ms-3 collapse" id="5ef7d072-397f-42ad-8c6a-5899ed2f1da6">
+           <h6 id="392bac5a-c9ed-40e8-84cc-c667ac80e51b">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="86263b78-1596-44f2-89ba-f2d065893766">
+           <table class="table table-sm bg-light" id="aa66e860-57c3-48d6-b98a-f8ba99f20535">
             <thead>
              <tr>
               <th scope="col">
@@ -3419,11 +3437,11 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="4f6dca8d-c1a0-4133-8d1a-0895238b4a3e">
-           <h6 id="4e79098c-ea93-4ffb-afce-d48a199e0ad5">
+          <div class="ms-3" id="0d1815fb-9286-4ed1-bb61-96faaf600dad">
+           <h6 id="aadd91ab-8bfc-40dd-82d6-f5a25342f1e6">
             Example
            </h6>
-           <pre id="7a8e85bd-0ee9-4201-843d-5293c9d22834"><code class="language-python">from bootwrap import Form, CheckboxInput
+           <pre id="2e6afbe4-1d03-4106-b2b6-3a906365cf05"><code class="language-python">from bootwrap import Form, CheckboxInput
 
 Form(
     CheckboxInput('One', 'opt1').as_switch(),
@@ -3433,58 +3451,62 @@ Form(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="658799e6-e203-4028-a13b-3a6310b9714a">
-           <form enctype="multipart/form-data" id="10c324da-969b-49ab-8611-06d9749d7196" method="POST">
+          <div class="ms-3" id="0dadedbd-cd81-4c7c-bedb-f668ef285fc7">
+           <form enctype="multipart/form-data" id="d102e6f9-4310-4926-8ea7-e20d2dfe6032" method="POST">
             <div class="form-check form-switch">
-             <input autocomplete="off" class="form-check-input" id="82d66c38-8906-44a2-98c1-d791d56d0b07" name="opt1" type="checkbox"/>
-             <label class="form-check-label" for="82d66c38-8906-44a2-98c1-d791d56d0b07">
+             <input autocomplete="off" class="form-check-input" id="a5a1f42a-870e-477d-b4ca-427a875123b0" name="opt1" type="checkbox" value="true"/>
+             <input name="opt1" type="hidden" value="false"/>
+             <label class="form-check-label" for="a5a1f42a-870e-477d-b4ca-427a875123b0">
               One
              </label>
             </div>
             <div class="form-check form-switch">
-             <input autocomplete="off" checked="" class="form-check-input" id="b2422b7d-b8b5-4272-867c-036915bd5f01" name="opt2" type="checkbox"/>
-             <label class="form-check-label" for="b2422b7d-b8b5-4272-867c-036915bd5f01">
+             <input autocomplete="off" checked="" class="form-check-input" id="eae94861-3b1b-44d2-bd01-83e4736ec4dd" name="opt2" type="checkbox" value="true"/>
+             <input name="opt2" type="hidden" value="false"/>
+             <label class="form-check-label" for="eae94861-3b1b-44d2-bd01-83e4736ec4dd">
               Two
              </label>
             </div>
             <div class="form-check form-switch">
-             <input autocomplete="off" class="form-check-input" disabled="" id="c1128a88-6cd7-4a83-80aa-609f6f449c3e" name="opt3" type="checkbox"/>
-             <label class="form-check-label" for="c1128a88-6cd7-4a83-80aa-609f6f449c3e">
+             <input autocomplete="off" class="form-check-input" disabled="" id="6f2a2e14-014c-4cdb-9ae0-c8ec5f22f28f" name="opt3" type="checkbox" value="true"/>
+             <input name="opt3" type="hidden" value="false"/>
+             <label class="form-check-label" for="6f2a2e14-014c-4cdb-9ae0-c8ec5f22f28f">
               Three
              </label>
             </div>
             <div class="form-check form-switch">
-             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="2b6be0bf-a908-474f-b6c1-0bbe66dffbbd" name="opt4" type="checkbox"/>
-             <label class="form-check-label" for="2b6be0bf-a908-474f-b6c1-0bbe66dffbbd">
+             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="a80d29fd-089b-4df5-a6ca-45be63acb914" name="opt4" type="checkbox" value="true"/>
+             <input name="opt4" type="hidden" value="false"/>
+             <label class="form-check-label" for="a80d29fd-089b-4df5-a6ca-45be63acb914">
               Four
              </label>
             </div>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="538bfa0b-a432-497e-bd85-feca9be8e6ba">
-          <div class="d-flex justify-content-between" id="d100678b-0119-4761-8933-efed6aef02c6">
-           <h4 id="a69639f5-049a-4e6c-be3c-1cca54ac81e1">
+         <div class="mt-5" id="f2a729c5-829e-42db-8eaa-44c06336d8cf">
+          <div class="d-flex justify-content-between" id="32bb420c-b864-43c1-b5ca-714fa431adc8">
+           <h4 id="724b13f3-e97e-4bb8-95fc-71e9aae212f5">
             Method
-            <span class="text-primary" id="94c89071-7868-46b6-9ceb-cdb0d4ddba1f">
+            <span class="text-primary" id="a25267b2-7171-46f3-b56c-884e7daa1523">
              inline
             </span>
            </h4>
-           <div id="cfd24970-279e-44d3-9233-9485e5f72cf1">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#bd18584d-58d4-4113-b564-5b4f19fc4e38" data-bs-toggle="collapse" id="955ebea9-7cc7-4291-a987-853e24f4e3d3" onclick="return false;" type="button">
+           <div id="a743c106-7f73-486a-a2ba-ff4d8d0531f8">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#bb7b7e09-676f-462c-a7a9-f6d39ef8fd56" data-bs-toggle="collapse" id="6e661dbb-27e9-46ae-836a-d5fe3ad73bdb" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="5a2a9d3e-2f93-40fb-b123-63528288f9e2">
+          <span class="text-muted" id="01e3b059-b8e4-4094-9e07-ed88d774eb15">
            Sets the check box in line.
           </span>
-          <pre id="46184e16-c20a-45f3-a7f2-5aea866c2cbc"><code class="language-python">inline()</code></pre>
-          <div class="ms-3 collapse" id="bd18584d-58d4-4113-b564-5b4f19fc4e38">
-           <h6 id="36a8507a-602b-4662-98f8-f2f6c414857d">
+          <pre id="e9236bde-9246-4ada-b19b-9bcbf29a8177"><code class="language-python">inline()</code></pre>
+          <div class="ms-3 collapse" id="bb7b7e09-676f-462c-a7a9-f6d39ef8fd56">
+           <h6 id="545877ef-97b5-4396-9175-e46bef6cfd32">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="c51d35d9-cab6-4388-94e8-711a1b228db4">
+           <table class="table table-sm bg-light" id="27971012-4c95-46b3-8bbd-aaf744032d85">
             <thead>
              <tr>
               <th scope="col">
@@ -3517,11 +3539,11 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="ceee66f3-db32-4c3d-9ce8-3269d0b0624d">
-           <h6 id="cb6e5b9e-87bf-4b04-ae4d-05c0366485a1">
+          <div class="ms-3" id="e581dcb7-d91e-4834-bcbd-29377d2a98d0">
+           <h6 id="f62ffdb8-6fa1-4ca4-a3d3-04fa8820c75f">
             Example
            </h6>
-           <pre id="55834b32-4ca7-4293-8b12-ee7c562856db"><code class="language-python">from bootwrap import Form, CheckboxInput
+           <pre id="e1894b42-b843-4d9a-9860-880a60b659ca"><code class="language-python">from bootwrap import Form, CheckboxInput
 
 Form(
     CheckboxInput('One', 'opt1').inline(),
@@ -3531,61 +3553,175 @@ Form(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="c9d451cf-9eab-447b-87e5-6781f7cdcd90">
-           <form enctype="multipart/form-data" id="1f71a0b5-c8b4-413a-8301-ed69ba479141" method="POST">
+          <div class="ms-3" id="ae666831-dd61-4544-ae34-caba1fb3a8fb">
+           <form enctype="multipart/form-data" id="faeffddd-54ec-40e0-81aa-800992fb826a" method="POST">
             <div class="form-check form-check-inline">
-             <input autocomplete="off" class="form-check-input" id="f8b4ece5-84ba-4cec-9687-9f961e6e64b6" name="opt1" type="checkbox"/>
-             <label class="form-check-label" for="f8b4ece5-84ba-4cec-9687-9f961e6e64b6">
+             <input autocomplete="off" class="form-check-input" id="539b5e18-e596-4d79-b3f8-871bb9a813f8" name="opt1" type="checkbox" value="true"/>
+             <input name="opt1" type="hidden" value="false"/>
+             <label class="form-check-label" for="539b5e18-e596-4d79-b3f8-871bb9a813f8">
               One
              </label>
             </div>
             <div class="form-check form-check-inline">
-             <input autocomplete="off" checked="" class="form-check-input" id="9d190035-6047-4d59-a0d3-b90c9dc32379" name="opt2" type="checkbox"/>
-             <label class="form-check-label" for="9d190035-6047-4d59-a0d3-b90c9dc32379">
+             <input autocomplete="off" checked="" class="form-check-input" id="3ace867b-2752-4f97-a1c1-6647b32b2ba4" name="opt2" type="checkbox" value="true"/>
+             <input name="opt2" type="hidden" value="false"/>
+             <label class="form-check-label" for="3ace867b-2752-4f97-a1c1-6647b32b2ba4">
               Two
              </label>
             </div>
             <div class="form-check form-check-inline">
-             <input autocomplete="off" class="form-check-input" disabled="" id="ea8edfaf-5d77-44a2-b3e3-228d282d87d4" name="opt3" type="checkbox"/>
-             <label class="form-check-label" for="ea8edfaf-5d77-44a2-b3e3-228d282d87d4">
+             <input autocomplete="off" class="form-check-input" disabled="" id="20830cbd-ee4d-4c13-b72e-dd7672c2bdd2" name="opt3" type="checkbox" value="true"/>
+             <input name="opt3" type="hidden" value="false"/>
+             <label class="form-check-label" for="20830cbd-ee4d-4c13-b72e-dd7672c2bdd2">
               Three
              </label>
             </div>
             <div class="form-check form-check-inline">
-             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="ce0808eb-1ab1-4623-9ee9-e0b753a93926" name="opt4" type="checkbox"/>
-             <label class="form-check-label" for="ce0808eb-1ab1-4623-9ee9-e0b753a93926">
+             <input autocomplete="off" checked="" class="form-check-input" disabled="" id="0111e6dc-9177-4315-b449-222659bfb271" name="opt4" type="checkbox" value="true"/>
+             <input name="opt4" type="hidden" value="false"/>
+             <label class="form-check-label" for="0111e6dc-9177-4315-b449-222659bfb271">
               Four
              </label>
             </div>
            </form>
           </div>
          </div>
+         <div class="mt-5" id="efcf0b66-feed-44df-8d4c-631b6cc5af31">
+          <div class="d-flex justify-content-between" id="d20901b4-f670-4fec-be99-0bc350ccf163">
+           <h4 id="910ad3a4-2aa6-489f-9ffa-29ab5eab574b">
+            Method
+            <span class="text-primary" id="35ab139c-8bd6-42e4-86bb-125dbc792ae7">
+             label_on_left
+            </span>
+           </h4>
+           <div id="39c5d721-c420-4048-a57f-0e67c473f458">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#5932ca05-3256-45bb-a658-586d8409844f" data-bs-toggle="collapse" id="5e75360f-1885-4f7f-8efb-d99b99381a3a" onclick="return false;" type="button">
+             Returns
+            </button>
+           </div>
+          </div>
+          <span class="text-muted" id="97130102-6b09-4c4f-b0ee-25be79668ca7">
+           Makes an input label showing on left.
+          </span>
+          <pre id="e4df34e3-b183-4c58-a30c-0a7740778fc6"><code class="language-python">label_on_left()</code></pre>
+          <div class="ms-3 collapse" id="5932ca05-3256-45bb-a658-586d8409844f">
+           <h6 id="c1e590f7-2f60-420b-81ff-81b104d0a85d">
+            Returns
+           </h6>
+           <table class="table table-sm bg-light" id="4137004f-5209-4db4-9081-d7117cd0ebbf">
+            <thead>
+             <tr>
+              <th scope="col">
+               Name
+              </th>
+              <th scope="col">
+               Type
+              </th>
+              <th scope="col">
+               Description
+              </th>
+             </tr>
+            </thead>
+            <tbody>
+             <tr>
+              <td scope="row">
+               <i style="white-space: nowrap">
+                obj
+               </i>
+              </td>
+              <td>
+               <code style="white-space: nowrap">
+                self
+               </code>
+              </td>
+              <td>
+               The instance of this class.
+              </td>
+             </tr>
+            </tbody>
+           </table>
+          </div>
+          <div class="ms-3" id="ff0b25c3-f659-48f4-a339-742d2fadbd8e">
+           <h6 id="8812b270-eb90-4816-ac19-e31a2c9392c6">
+            Example
+           </h6>
+           <pre id="a350ed69-bb73-4dc9-8ffa-4d14f0be7771"><code class="language-python">from bootwrap import Form, CheckboxInput
+
+Form(
+    CheckboxInput('One', 'opt1').label_on_left(),
+    CheckboxInput('Two', 'opt2', True).label_on_left().as_switch(),
+    CheckboxInput('Three', 'opt3').label_on_left().as_disabled(),
+    CheckboxInput('Four', 'opt4', True).label_on_left().as_disabled()
+)
+</code></pre>
+          </div>
+          <div class="ms-3" id="bd25b288-1863-4e44-b633-21c73e68a55d">
+           <form enctype="multipart/form-data" id="3c6f142d-511d-4f0d-a0ac-f072ff27665b" method="POST">
+            <div class="form-group row">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="b52c3682-d751-40ca-97ee-b9033cba437e">
+              One
+             </label>
+             <div class="col-sm-8 d-flex align-items-center">
+              <input autocomplete="off" class="form-check-input" id="b52c3682-d751-40ca-97ee-b9033cba437e" name="opt1" type="checkbox" value="true"/>
+              <input name="opt1" type="hidden" value="false"/>
+             </div>
+            </div>
+            <div class="form-group row">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="c09f116c-8495-4230-b8cd-77510beb497e">
+              Two
+             </label>
+             <div class="col-sm-8 d-flex align-items-center">
+              <input autocomplete="off" checked="" class="form-check-input" id="c09f116c-8495-4230-b8cd-77510beb497e" name="opt2" type="checkbox" value="true"/>
+              <input name="opt2" type="hidden" value="false"/>
+             </div>
+            </div>
+            <div class="form-group row">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="176427a2-2cbf-4469-a1e7-9bfb5900c303">
+              Three
+             </label>
+             <div class="col-sm-8 d-flex align-items-center">
+              <input autocomplete="off" class="form-check-input" disabled="" id="176427a2-2cbf-4469-a1e7-9bfb5900c303" name="opt3" type="checkbox" value="true"/>
+              <input name="opt3" type="hidden" value="false"/>
+             </div>
+            </div>
+            <div class="form-group row">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="43f150cd-cf7c-4de3-b5bd-530605d39b86">
+              Four
+             </label>
+             <div class="col-sm-8 d-flex align-items-center">
+              <input autocomplete="off" checked="" class="form-check-input" disabled="" id="43f150cd-cf7c-4de3-b5bd-530605d39b86" name="opt4" type="checkbox" value="true"/>
+              <input name="opt4" type="hidden" value="false"/>
+             </div>
+            </div>
+           </form>
+          </div>
+         </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="c2fd257f-1daa-4b14-93eb-7c4065dc1845">
-        <div class="mt-5" id="d8f22b8c-7234-46de-bbbd-1c94e0d28b5c">
-         <div class="d-flex justify-content-between" id="472b89d9-a647-4a4a-b3ad-bb115957a6cb">
-          <h1 id="fbce9c5d-600f-44d9-b007-244e5b2f0dd8">
+       <div class="tab-pane fade" id="50eca9f0-6fbb-4372-a381-1a62947de02c">
+        <div class="mt-5" id="0035340a-91f2-40e2-b711-6c972e654535">
+         <div class="d-flex justify-content-between" id="7a8a3025-3f30-45cc-adc1-d494f216d253">
+          <h1 id="e1e7030e-189c-48e8-9d07-797cb67ab770">
            Class
-           <span class="text-primary" id="b546b16a-d270-4436-9edf-c1b9ea00fc53">
+           <span class="text-primary" id="8398f03a-216d-4f4c-9452-30a087955186">
             TextInput
            </span>
           </h1>
-          <div id="a344faae-5960-480b-bb8a-da37eda98d71">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#2010f527-fa34-4b8e-816e-1366326a9df1" data-bs-toggle="collapse" id="46c819a0-220f-4c26-b7ea-dd64dcc19042" onclick="return false;" type="button">
+          <div id="b9d55fdb-a812-44b4-b74b-ba32c2b9806c">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#4044f5e2-8a5d-4d6c-84c9-45bc0417ae61" data-bs-toggle="collapse" id="de3337c8-2ac7-485e-abc2-0ac7f189aabb" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="9c55ab19-e2cc-4b0f-8288-974ffb2957e8">
+         <span class="text-muted" id="8c4e65d6-c387-4984-9cad-7c5fac38ac66">
           A text input.
          </span>
-         <pre id="7e3ea328-6f62-4351-b220-f01a613def4a"><code class="language-python">TextInput(label, name, value=None, placeholder=None)</code></pre>
-         <div class="ms-3 collapse" id="2010f527-fa34-4b8e-816e-1366326a9df1">
-          <h6 id="fbf1ce6c-0c5a-4f6f-9ac0-ef79bbc4546c">
+         <pre id="33449e86-8c94-4c57-b464-1eb755d01258"><code class="language-python">TextInput(label, name, value=None, placeholder=None)</code></pre>
+         <div class="ms-3 collapse" id="4044f5e2-8a5d-4d6c-84c9-45bc0417ae61">
+          <h6 id="85463a6e-9227-491f-97ce-0fdc448e1ae9">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="cbde2e1e-7913-4eeb-b9c4-bfa0e8377a32">
+          <table class="table table-sm bg-light" id="b7f9df0f-cff6-4d07-882a-9e729a0cf63c">
            <thead>
             <tr>
              <th scope="col">
@@ -3663,7 +3799,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="a9ab2748-7cb3-49a6-be8c-9014a5fed7fc">
+         <p id="f44526ad-916e-49dc-9a21-aece6a79e303">
           Use the
           <code>
            as_disabled()
@@ -3675,11 +3811,11 @@ Form(
           </code>
           component.
          </p>
-         <div class="ms-3" id="02699e1f-ab71-4f2a-8dab-5cfba80a0552">
-          <h6 id="01e2032b-a943-431d-aa2d-ceb66bc13695">
+         <div class="ms-3" id="b6f8c6a8-7cbd-4cf0-9e3e-f6ffea23149d">
+          <h6 id="35e0fdb5-bbbc-40bc-98b5-76972dfeada3">
            Example
           </h6>
-          <pre id="7b2b0f8f-06e5-4ecd-b2a0-b6a910e4a3ca"><code class="language-python">from bootwrap import Form, TextInput
+          <pre id="f5eac40d-56dd-4259-b2ba-c359d74690c8"><code class="language-python">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Text1', 'text'),
@@ -3689,65 +3825,65 @@ Form(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="78beb9e4-b0a0-4c0c-a332-2f3af1ed45b1">
-          <form enctype="multipart/form-data" id="a8185f9b-7f4e-4c41-87bb-a27863f30716" method="POST">
+         <div class="ms-3" id="8632ecb9-12fd-47b1-8ff5-acf43ab34d64">
+          <form enctype="multipart/form-data" id="f488bbf0-5d2c-40fa-8ccf-4fa299eb9765" method="POST">
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="ed303ee2-d9b0-4c02-b90b-c4a15dfe4d85">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="08bdde5e-0329-4b61-9a00-051701a9aa5a">
              Text1
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="ed303ee2-d9b0-4c02-b90b-c4a15dfe4d85" name="text" type="text"/>
+             <input class="form-control" id="08bdde5e-0329-4b61-9a00-051701a9aa5a" 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="a9f14d0d-093c-4e3a-bb95-faa95cd37642">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="57d6820b-31ee-400b-abf7-02234e14a087">
              Text2
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="a9f14d0d-093c-4e3a-bb95-faa95cd37642" name="text" placeholder="type here" type="text"/>
+             <input class="form-control" id="57d6820b-31ee-400b-abf7-02234e14a087" 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="78c37c1c-9d73-4b3d-b7d3-1f58f8ca8ee5">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="527f56ae-19cb-49b1-977f-d439aeec271d">
              Text3
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="78c37c1c-9d73-4b3d-b7d3-1f58f8ca8ee5" name="text" type="text" value="Hello World!"/>
+             <input class="form-control" id="527f56ae-19cb-49b1-977f-d439aeec271d" 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="0e46ce2d-4324-441f-b342-dd66f366fece">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="9c048e57-217c-4617-b947-49fbe9379562">
              Text4
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" disabled="" id="0e46ce2d-4324-441f-b342-dd66f366fece" name="text" type="text"/>
+             <input class="form-control" disabled="" id="9c048e57-217c-4617-b947-49fbe9379562" name="text" type="text"/>
             </div>
            </div>
           </form>
          </div>
-         <div class="mt-5" id="626fb297-bf29-4be9-a4c7-06ab32d5923a">
-          <div class="d-flex justify-content-between" id="a817877e-370e-45ee-beca-3480802141cf">
-           <h4 id="02218ace-fd2f-41ec-b997-e81592ff4512">
+         <div class="mt-5" id="aa59f569-b86d-443c-879a-6bfde8c223ae">
+          <div class="d-flex justify-content-between" id="dd0fd8af-8d6d-4a87-802e-c49349950774">
+           <h4 id="2c96fe91-0e78-4073-a815-1336c90030b4">
             Method
-            <span class="text-primary" id="21f97c9e-0801-4295-aa9f-d0175c2a3850">
+            <span class="text-primary" id="d3c95041-609d-4840-af89-e7103e6835cf">
              for_email
             </span>
            </h4>
-           <div id="bb18b003-d8f4-4dcb-b7ff-374738914d90">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#7163bab9-412d-4636-80ba-deaef79bb6bc" data-bs-toggle="collapse" id="e939b8b6-c48e-4f43-85d3-5a60691f835d" onclick="return false;" type="button">
+           <div id="7d8aa0cf-c0ec-4a2c-a46d-e269d3a34f3e">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#7af6d80d-156e-4cd0-9373-1c4edb26a8ba" data-bs-toggle="collapse" id="1f8273ca-7cc5-43a9-bdbb-e89fed2d5cb2" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="d8cde216-ee9a-4723-8ffd-7598d4c22616">
+          <span class="text-muted" id="c06d17ff-e036-4030-a06c-99d68b91fe6e">
            Configuring input for entering email.
           </span>
-          <pre id="90097f97-9266-4f1f-8165-494c3ef5a98f"><code class="language-python">for_email()</code></pre>
-          <div class="ms-3 collapse" id="7163bab9-412d-4636-80ba-deaef79bb6bc">
-           <h6 id="bcea6305-b050-4f39-85f2-ff6f1a230611">
+          <pre id="f7ea24b7-7872-43e3-b7ec-18a973b75e5d"><code class="language-python">for_email()</code></pre>
+          <div class="ms-3 collapse" id="7af6d80d-156e-4cd0-9373-1c4edb26a8ba">
+           <h6 id="5b9f81ad-c96f-43b6-8a24-b3a19e68e68a">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="e4f8a36d-a03f-41ab-a972-f239d1d776ab">
+           <table class="table table-sm bg-light" id="827b804e-ca14-4313-8e58-6c6525a5ea25">
             <thead>
              <tr>
               <th scope="col">
@@ -3780,53 +3916,53 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="6c16c792-a55b-4848-af34-1317f38db356">
-           <h6 id="83ddbc28-af30-4bff-ad71-94b953a50269">
+          <div class="ms-3" id="87843a3a-36a9-4f25-b720-cfa2965349bd">
+           <h6 id="7fa9664e-aedb-4175-9c60-0504522dba93">
             Example
            </h6>
-           <pre id="53101ba7-d723-4307-a449-d72594213b35"><code class="language-python">from bootwrap import Form, TextInput
+           <pre id="4791c529-bad0-4941-b90d-49d7c7902fa4"><code class="language-python">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Email', 'email', 'my@email.com').for_email()
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="70a9ec8b-585b-4549-8ba2-cbeadadd1689">
-           <form enctype="multipart/form-data" id="83997c6e-22b0-481f-8246-4a567e67f52a" method="POST">
+          <div class="ms-3" id="b84baa4e-ab20-4869-8b5e-7963ec78dbb1">
+           <form enctype="multipart/form-data" id="2974c830-d24d-41c6-81bb-18593efb8de5" method="POST">
             <div class="form-group row">
-             <label class="col-sm-4 col-form-label d-flex align-items-center" for="a965310e-e9dd-40b0-a75d-4f8f9463749e">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="d24b1ac7-77cf-45ed-a3ef-75b0dcb9c41a">
               Email
              </label>
              <div class="col-sm-8 d-flex align-items-center">
-              <input class="form-control" id="a965310e-e9dd-40b0-a75d-4f8f9463749e" name="email" type="email" value="my@email.com"/>
+              <input class="form-control" id="d24b1ac7-77cf-45ed-a3ef-75b0dcb9c41a" name="email" type="email" value="my@email.com"/>
              </div>
             </div>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="6a27fe5f-f773-4f6b-98c4-c05a5e01a5b7">
-          <div class="d-flex justify-content-between" id="d4d15f2e-33c0-4b17-bb7d-3566a2c0e4e8">
-           <h4 id="5f43a6a5-05c7-46da-931b-95db58ed7312">
+         <div class="mt-5" id="c2483b7d-f332-4773-bc57-d88468da218f">
+          <div class="d-flex justify-content-between" id="8347ca32-13f9-4fc8-baa8-7308cdc7481a">
+           <h4 id="13655d30-cd80-47ec-9721-d2b1c1aa02aa">
             Method
-            <span class="text-primary" id="edfd63c3-4dd1-4c40-9bfb-566b3af99244">
+            <span class="text-primary" id="ec3695e5-98cb-4b2d-9bbb-e37f82341a99">
              for_password
             </span>
            </h4>
-           <div id="1d23ee3e-a2da-469d-9daa-50398f3c7c7c">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#437dbe8c-2f34-4777-bb2f-096194484ac4" data-bs-toggle="collapse" id="29f8ace8-a51d-426e-8f5d-3f220cd458df" onclick="return false;" type="button">
+           <div id="f002f171-cb1d-4ac4-983d-ebc457de7156">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#c9c09de8-9f00-4725-914b-ed785eee335f" data-bs-toggle="collapse" id="409c6fb4-f083-4cea-a5e6-f08c1f244436" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="f7a1aac6-f8e7-428b-b239-1a9198af6a67">
+          <span class="text-muted" id="98bcaf16-3d9a-46f8-99a7-9287216f29bc">
            Configuring input for entering password.
           </span>
-          <pre id="07679ab0-a66f-42b7-abd8-054ca40a5a31"><code class="language-python">for_password()</code></pre>
-          <div class="ms-3 collapse" id="437dbe8c-2f34-4777-bb2f-096194484ac4">
-           <h6 id="cf540abd-75ad-4022-a4cb-4c089602684e">
+          <pre id="5446dc15-862c-4731-8758-6ee9f6ec0096"><code class="language-python">for_password()</code></pre>
+          <div class="ms-3 collapse" id="c9c09de8-9f00-4725-914b-ed785eee335f">
+           <h6 id="105dc0e2-c4fa-48b9-87f0-3934803b33f0">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="a7dbb01b-6e52-45b4-8917-3ef3cc3f3c58">
+           <table class="table table-sm bg-light" id="a781e1a3-87e7-4323-858b-6172106ab519">
             <thead>
              <tr>
               <th scope="col">
@@ -3859,56 +3995,56 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="2c6904b9-dd67-4f15-8e05-103a07a3d19f">
-           <h6 id="28373958-2ebc-42f4-9584-cc9ec5e00b67">
+          <div class="ms-3" id="0442e238-8254-4ab2-992c-29e4f23fb8d3">
+           <h6 id="00fda790-696e-4cb9-bfc7-1f3f38d8f03f">
             Example
            </h6>
-           <pre id="ce37f857-d78f-4870-8053-3e9aa06143e2"><code class="language-python">from bootwrap import Form, TextInput
+           <pre id="48c53d0b-3387-4be1-942d-9b5fb245b5ae"><code class="language-python">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Password', 'password', '********').for_password()
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="190707a8-5668-4776-9326-b95fdec3edd9">
-           <form enctype="multipart/form-data" id="896db7e3-8bc0-4d09-8a52-c69c6efd8ba8" method="POST">
+          <div class="ms-3" id="5ec27dc2-98e0-48ca-85aa-a33c8d4daa36">
+           <form enctype="multipart/form-data" id="1db00358-e547-4b93-a276-11122be8ce06" method="POST">
             <div class="form-group row">
-             <label class="col-sm-4 col-form-label d-flex align-items-center" for="d58bd61c-7cc1-4653-95a2-0ea2eab87dd9">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="9e20d88c-2ae9-4839-b78f-a6c2f66d92ba">
               Password
              </label>
              <div class="col-sm-8 d-flex align-items-center">
-              <input class="form-control" id="d58bd61c-7cc1-4653-95a2-0ea2eab87dd9" name="password" type="password" value="********"/>
+              <input class="form-control" id="9e20d88c-2ae9-4839-b78f-a6c2f66d92ba" name="password" type="password" value="********"/>
              </div>
             </div>
            </form>
           </div>
          </div>
-         <div class="mt-5" id="aee899de-8026-499b-b3dd-702195cdd076">
-          <div class="d-flex justify-content-between" id="f4190c65-5999-442d-a885-d305d3a91ba7">
-           <h4 id="9f7b56ed-d91e-4e6a-9a99-eb8c0b4b97a4">
+         <div class="mt-5" id="af199f18-c64c-43ac-aecc-2590f4a3b0a6">
+          <div class="d-flex justify-content-between" id="67504066-1fa4-406c-a628-2963e5c5b764">
+           <h4 id="0a0c9fcc-2959-4f53-869a-b0d558abe1d9">
             Method
-            <span class="text-primary" id="bc15f2a1-dffe-4507-a5e7-2d0cb3016d9c">
+            <span class="text-primary" id="44ba6843-8b90-43df-ae23-c9c767fc900e">
              with_multirows
             </span>
            </h4>
-           <div id="5786c87f-01fc-4f7e-8025-18e6e593898a">
-            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#5163a848-86aa-4235-b99e-12f39cf8bb92" data-bs-toggle="collapse" id="9e0f0542-5442-4ff3-8e80-bdd1e62190db" onclick="return false;" type="button">
+           <div id="7e1d32d2-2289-4d8c-83a8-b28f79ada465">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#0da3d81d-82aa-4088-8d99-a01c1d8bf47a" data-bs-toggle="collapse" id="3cd63695-2e10-4bf7-953b-16bd61d74dcf" onclick="return false;" type="button">
              Argument
             </button>
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#99ed2d7f-4d75-4921-bd2f-52a20101f2da" data-bs-toggle="collapse" id="bc9f4383-d4fb-4bdd-a02d-8e8c03249889" onclick="return false;" type="button">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#c7777392-e37c-47ad-8e93-72364e457e5c" data-bs-toggle="collapse" id="8e755d25-74cf-4acb-88d3-4a44bcd33bf0" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="8038d9d0-d65e-4798-bc10-50160d1a53d3">
+          <span class="text-muted" id="12986678-47ac-4a03-97ec-fffb7de4a444">
            Sets the number of rows.
           </span>
-          <pre id="c68d89f8-efcb-4aee-8bfc-7e82f980fe8e"><code class="language-python">with_multirows(n)</code></pre>
-          <div class="ms-3 collapse" id="5163a848-86aa-4235-b99e-12f39cf8bb92">
-           <h6 id="6df3c45f-3681-45d7-a6d2-e56dbfa34a46">
+          <pre id="d0d628ab-2de3-4683-8758-0e21a19e1509"><code class="language-python">with_multirows(n)</code></pre>
+          <div class="ms-3 collapse" id="0da3d81d-82aa-4088-8d99-a01c1d8bf47a">
+           <h6 id="5e8c1d07-2efe-4f65-8721-7e071f0d4d60">
             Arguments
            </h6>
-           <table class="table table-sm bg-light" id="1a3b7c73-887b-4ee5-9a5c-819874517343">
+           <table class="table table-sm bg-light" id="152c508c-c732-4773-b6fc-af239e05f7cf">
             <thead>
              <tr>
               <th scope="col">
@@ -3941,11 +4077,11 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3 collapse" id="99ed2d7f-4d75-4921-bd2f-52a20101f2da">
-           <h6 id="831a0f5d-58ad-415a-a8e6-aaeb6e20b9ed">
+          <div class="ms-3 collapse" id="c7777392-e37c-47ad-8e93-72364e457e5c">
+           <h6 id="84a4ed47-c463-4826-8766-a4e2b4d4848e">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="9eb113c6-b602-406b-b85c-ad473e0b095d">
+           <table class="table table-sm bg-light" id="253da0a7-011a-405c-a0af-763049c736d7">
             <thead>
              <tr>
               <th scope="col">
@@ -3978,25 +4114,25 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="40ccb574-0851-411a-b7a3-50408746bab3">
-           <h6 id="37247763-2ffd-471e-b991-f6052cbe43b4">
+          <div class="ms-3" id="bc5b6d65-6431-4173-96da-b301cfec368d">
+           <h6 id="6c474bb6-935d-44a8-ae78-9da10b4c0f84">
             Example
            </h6>
-           <pre id="8ff08152-3c81-4bb6-8e7e-c80316398ceb"><code class="language-python">from bootwrap import Form, TextInput
+           <pre id="b111f871-93b0-422a-a794-03559d4afd7c"><code class="language-python">from bootwrap import Form, TextInput
 
 Form(
     TextInput('Text', 'text').with_multirows(3)
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="05035cea-a48a-4673-9a26-c00037bc29ae">
-           <form enctype="multipart/form-data" id="343ccb85-adea-4ff5-9c42-719bec4dc3d9" method="POST">
+          <div class="ms-3" id="7d22ff1f-8482-4581-bb4d-33b77ed145d5">
+           <form enctype="multipart/form-data" id="8062bbb2-f30f-4306-9235-ba8843bb00f7" method="POST">
             <div class="form-group row">
-             <label class="col-sm-4 col-form-label d-flex align-items-center" for="1513eadf-58ca-4cc7-ab13-91590be025a4">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="7039f515-5bc0-47c0-b0a0-b98f379d878d">
               Text
              </label>
              <div class="col-sm-8 d-flex align-items-center">
-              <textarea class="form-control" id="1513eadf-58ca-4cc7-ab13-91590be025a4" name="text" rows="3">
+              <textarea class="form-control" id="7039f515-5bc0-47c0-b0a0-b98f379d878d" name="text" rows="3">
                     
                 </textarea>
              </div>
@@ -4006,30 +4142,30 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="fa7181d0-143a-4095-9962-d2b2ff83db9e">
-        <div class="mt-5" id="ee0f6378-aed0-4a65-87e5-7f52c655364f">
-         <div class="d-flex justify-content-between" id="535c5036-a7ca-4b14-acf3-9304f5496f8e">
-          <h1 id="be56f308-fc4a-4770-9cee-e2f77221f27e">
+       <div class="tab-pane fade" id="9a2a0603-e7f8-46ba-9f52-4e831df37bce">
+        <div class="mt-5" id="dd5c0846-d66e-4bb8-ab59-9cf2dd8c24d5">
+         <div class="d-flex justify-content-between" id="018e14e7-ab8b-423c-bd3c-8adaae78205c">
+          <h1 id="3b98cbb5-cd12-4bb6-84f8-3f611c1243a5">
            Class
-           <span class="text-primary" id="ba0da1a5-5aa2-46e1-97bb-caed8453f3a4">
+           <span class="text-primary" id="f089ddf6-bb86-467c-aef1-ff3419e6e7c5">
             NumericInput
            </span>
           </h1>
-          <div id="7d1289c7-7700-4b9e-9e7b-b29d16e58b40">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#9cbb573e-efba-4833-89ae-4202067a31b7" data-bs-toggle="collapse" id="af0aede1-ded8-4764-8d3e-6774d5523b15" onclick="return false;" type="button">
+          <div id="02bf1d6e-13df-4a64-8e3b-ba0793c45fa7">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#2e103d1a-5385-42b5-ab2e-00d17ef4074b" data-bs-toggle="collapse" id="c3a4b7b8-c360-41fe-b4b9-9aec131c5c7c" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="5fb08804-ca0b-4b56-96da-09b1378fe9e3">
+         <span class="text-muted" id="0d933388-10b9-41db-ac6c-ef2065529a3a">
           A numeric input.
          </span>
-         <pre id="cd8d03e4-49d8-49ad-8c78-bd7510d37492"><code class="language-python">NumericInput(label, name, value=None, placeholder=None)</code></pre>
-         <div class="ms-3 collapse" id="9cbb573e-efba-4833-89ae-4202067a31b7">
-          <h6 id="a4da97c7-9914-4492-a241-229f03a96c06">
+         <pre id="03b61f55-6733-4905-b882-69472a13fc8e"><code class="language-python">NumericInput(label, name, value=None, placeholder=None)</code></pre>
+         <div class="ms-3 collapse" id="2e103d1a-5385-42b5-ab2e-00d17ef4074b">
+          <h6 id="c821c957-ec24-4cc4-a18f-a63640eceade">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="11407a50-86ce-4307-9b8f-0f1612670857">
+          <table class="table table-sm bg-light" id="a67b5677-fc45-4063-9b26-6365f1d10012">
            <thead>
             <tr>
              <th scope="col">
@@ -4107,7 +4243,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="f0138762-286d-426d-ba11-b0db0d245fe6">
+         <p id="3ac09296-199c-42e0-9852-66a655af55bf">
           Use the
           <code>
            as_disabled()
@@ -4119,11 +4255,11 @@ Form(
           </code>
           component.
          </p>
-         <div class="ms-3" id="9e6987d0-1b61-422a-ab97-18818123fa8f">
-          <h6 id="b964aea0-c576-448e-8fea-b3f2ef924eed">
+         <div class="ms-3" id="77aa4f52-b4a5-4d41-b0ba-75dc9d6fa527">
+          <h6 id="561af137-12a9-48bc-ad4e-de15d961450f">
            Example
           </h6>
-          <pre id="41d95155-9ec3-422e-a1f5-fefb175a2a2a"><code class="language-python">from bootwrap import Form, NumericInput
+          <pre id="faccd6be-3995-4ef2-97ab-0c3e9f6dd0b4"><code class="language-python">from bootwrap import Form, NumericInput
 
 Form(
     NumericInput('Number1', 'number'),
@@ -4133,68 +4269,68 @@ Form(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="eacb03f1-a279-4317-9858-c060ff38ed32">
-          <form enctype="multipart/form-data" id="688cd2f9-e6e9-401c-8744-eb851f9b858c" method="POST">
+         <div class="ms-3" id="6555278e-045a-4062-822e-ccb589c2a4b2">
+          <form enctype="multipart/form-data" id="312faecb-cfa8-444e-b40d-b976fb41a460" method="POST">
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="dac0d074-4517-4125-bac7-5963dff1360c">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="4f664b14-c2a3-4e55-a353-1891b2c67e75">
              Number1
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="dac0d074-4517-4125-bac7-5963dff1360c" name="number" type="number"/>
+             <input class="form-control" id="4f664b14-c2a3-4e55-a353-1891b2c67e75" 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="959ed9e3-0126-45d5-9be5-d51b660531ce">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="5a0843cc-282d-48f1-9bbc-c840ca1647eb">
              Number2
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="959ed9e3-0126-45d5-9be5-d51b660531ce" name="number" placeholder="type here" type="number"/>
+             <input class="form-control" id="5a0843cc-282d-48f1-9bbc-c840ca1647eb" 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="a2569d5e-2696-4cf7-9286-c42de582d82a">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="f66eb42b-c838-4f09-9002-0748961852a7">
              Number3
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" id="a2569d5e-2696-4cf7-9286-c42de582d82a" name="number" type="number" value="123"/>
+             <input class="form-control" id="f66eb42b-c838-4f09-9002-0748961852a7" 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="03fd5a5c-33e0-49eb-bbf3-6df922b07c6b">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="025d5b16-ea5f-4376-bd26-d0b39bc91bf6">
              Number4
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <input class="form-control" disabled="" id="03fd5a5c-33e0-49eb-bbf3-6df922b07c6b" name="number" type="number"/>
+             <input class="form-control" disabled="" id="025d5b16-ea5f-4376-bd26-d0b39bc91bf6" name="number" type="number"/>
             </div>
            </div>
           </form>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="1022fda7-d45e-4c31-8582-2602f15aeaab">
-        <div class="mt-5" id="974cd25e-20a8-4e9f-b182-eab679b9f072">
-         <div class="d-flex justify-content-between" id="dae6e53e-ae8c-41ed-86b7-9571ef4b3616">
-          <h1 id="aa6adb79-aa5b-47bb-9bc7-607905539c9b">
+       <div class="tab-pane fade" id="eb15ee1c-8bee-4fee-84ce-f168d50cfce8">
+        <div class="mt-5" id="fbe0096f-186f-4988-bbd3-23ac47fdf027">
+         <div class="d-flex justify-content-between" id="940d07aa-9ea4-451b-b11a-d272cba2e23e">
+          <h1 id="435f821b-0314-4f8f-9412-2669a6f88936">
            Class
-           <span class="text-primary" id="80296235-e099-44af-8210-28d7d9bb5275">
+           <span class="text-primary" id="9943e850-7342-4e41-ba13-1f095f140172">
             SelectInput
            </span>
           </h1>
-          <div id="c845658b-e0e2-4842-8520-3a43f4925059">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#cc39dc79-a934-4d33-b755-3fbbb61a7e1c" data-bs-toggle="collapse" id="f499da8c-5722-48aa-8392-4fb4b22dd03c" onclick="return false;" type="button">
+          <div id="b1ad4e86-ec10-4821-8bb9-69b603ed3923">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#e75ce7ea-680c-42e0-9d0a-51d907e5ec71" data-bs-toggle="collapse" id="5901daf7-0d7c-4821-b452-96f542ad7b14" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="00ab1f0a-d1df-4b7a-a229-fe819d9c13e1">
+         <span class="text-muted" id="0fa1e9b8-bd50-43a8-8fac-ff0ac48e9968">
           A select input.
          </span>
-         <pre id="cc814932-9d90-4b92-92c5-fdd8ad4611aa"><code class="language-python">SelectInput(label, name, value=None, options=None)</code></pre>
-         <div class="ms-3 collapse" id="cc39dc79-a934-4d33-b755-3fbbb61a7e1c">
-          <h6 id="8c2d996e-24c1-468f-8ebd-06b9def66b48">
+         <pre id="b6b3e891-a139-4600-bf1d-0216b8d34b16"><code class="language-python">SelectInput(label, name, value=None, options=None)</code></pre>
+         <div class="ms-3 collapse" id="e75ce7ea-680c-42e0-9d0a-51d907e5ec71">
+          <h6 id="1fc2bfbf-1ae9-4150-af98-ea6d57acb1ea">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="6878eec5-a072-42a6-8855-aab8e8a02b04">
+          <table class="table table-sm bg-light" id="215fe0c6-d96a-4a4c-bf62-2e6abd0a51c0">
            <thead>
             <tr>
              <th scope="col">
@@ -4272,7 +4408,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="31cdc33a-a1b6-4c8c-a388-6723b45340a2">
+         <p id="d4bdaf32-7ec8-40e7-a342-6c4819d088ca">
           Use the
           <code>
            as_disabled()
@@ -4284,11 +4420,11 @@ Form(
           </code>
           component.
          </p>
-         <div class="ms-3" id="e85e2ee0-2180-42cf-8529-3dbeb009138c">
-          <h6 id="30ef920d-dbb6-485d-a669-e576efab09b6">
+         <div class="ms-3" id="56eb69d9-4c4b-45f5-a807-35a36b7bcf55">
+          <h6 id="1fc4c127-03f2-46e5-8cf0-fd7fca603dbc">
            Example
           </h6>
-          <pre id="47dd2b07-1d8d-45b8-93e2-3d5183369f84"><code class="language-python">from bootwrap import Form, SelectInput
+          <pre id="6d649ac6-a0db-45c0-8e02-c85990a9cf4c"><code class="language-python">from bootwrap import Form, SelectInput
 
 options = [
     SelectInput.Option('One', 1),
@@ -4302,39 +4438,39 @@ Form(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="625931ee-f150-4423-a18c-0157dbb8d051">
-          <form enctype="multipart/form-data" id="638500a8-4bfd-43bc-9a59-4d03bb4b3023" method="POST">
+         <div class="ms-3" id="cca8dd74-b9f9-47e3-87ee-a085033fefc1">
+          <form enctype="multipart/form-data" id="3d3c981c-91a6-418e-ad43-2d9bc7361f20" method="POST">
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="60a8c5d8-f069-4c3a-a9a0-1ef7d553d36d">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="357dce15-30ce-4422-b983-3257cff3d9f5">
              Selector1
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <select autocomplete="off" class="form-control" id="60a8c5d8-f069-4c3a-a9a0-1ef7d553d36d" name="choice">
-              <option id="e1ba4e6e-d7ad-4735-a318-f4bad48050fe" value="1">
+             <select autocomplete="off" class="form-control" id="357dce15-30ce-4422-b983-3257cff3d9f5" name="choice">
+              <option id="904b9010-07d0-4709-bc4a-4c7ee4beed8f" value="1">
                One
               </option>
-              <option id="52a0c749-db61-4cf9-9138-fc34914431fa" selected="" value="2">
+              <option id="3fc6d475-88f4-4561-a784-0e55984118ab" selected="" value="2">
                Two
               </option>
-              <option disabled="" id="0bd31788-d8c2-41a3-855e-8cdd3d7aeabc" value="3">
+              <option disabled="" id="bce8f206-2195-4209-afa2-927ade424787" 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="52aae1f3-b0e2-495e-a522-9548281d582f">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="d6ba5357-2b2e-4899-a05c-7b1a7cb0c273">
              Selector2
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <select autocomplete="off" class="form-control" disabled="" id="52aae1f3-b0e2-495e-a522-9548281d582f" name="choice">
-              <option id="e1ba4e6e-d7ad-4735-a318-f4bad48050fe" value="1">
+             <select autocomplete="off" class="form-control" disabled="" id="d6ba5357-2b2e-4899-a05c-7b1a7cb0c273" name="choice">
+              <option id="904b9010-07d0-4709-bc4a-4c7ee4beed8f" value="1">
                One
               </option>
-              <option id="52a0c749-db61-4cf9-9138-fc34914431fa" selected="" value="2">
+              <option id="3fc6d475-88f4-4561-a784-0e55984118ab" selected="" value="2">
                Two
               </option>
-              <option disabled="" id="0bd31788-d8c2-41a3-855e-8cdd3d7aeabc" value="3">
+              <option disabled="" id="bce8f206-2195-4209-afa2-927ade424787" value="3">
                Three
               </option>
              </select>
@@ -4342,29 +4478,29 @@ Form(
            </div>
           </form>
          </div>
-         <div class="mt-5" id="45b5bacd-c5a3-4c88-9ddf-b2567c3e79b7">
-          <div class="d-flex justify-content-between" id="602c44a3-6b52-41d5-a8d2-9ef10fadd70b">
-           <h4 id="f6bec86a-722a-48ab-b78b-cf5db69de611">
+         <div class="mt-5" id="5125df6c-d9fe-42df-886d-a6c5ec0b7522">
+          <div class="d-flex justify-content-between" id="709b3261-b7c4-4080-9d32-24c923a7a38e">
+           <h4 id="58f541d3-6503-4672-a1fc-158bdd413a19">
             Method
-            <span class="text-primary" id="a5bd4c34-2217-4df6-abab-eac55b1111e2">
+            <span class="text-primary" id="f06118f1-5198-4453-8fe9-6c6523e8a708">
              as_radio
             </span>
            </h4>
-           <div id="978acd11-afc6-4328-8a70-8bd4d525d07d">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#be6e74c4-1a38-4971-8089-98aae4488b87" data-bs-toggle="collapse" id="952eeeea-606a-4e50-b46b-f4b416febbf6" onclick="return false;" type="button">
+           <div id="b89cab7f-5918-4627-98c5-1ebad9c98efb">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#eb04edfe-52d7-464e-868d-b16faa1aea14" data-bs-toggle="collapse" id="575dd5fb-57ac-4c7b-ab39-f6e5aa70fc7e" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="195b5732-c881-49c0-b456-e7d1c5312b89">
+          <span class="text-muted" id="cb98bed4-0887-4174-85fc-833877f252bc">
            Makes selection in a form of radio buttons.
           </span>
-          <pre id="6b6effda-b7db-42f0-869b-0e780d2adae7"><code class="language-python">as_radio()</code></pre>
-          <div class="ms-3 collapse" id="be6e74c4-1a38-4971-8089-98aae4488b87">
-           <h6 id="b4c6fc65-90ad-4b08-8653-20154af8052e">
+          <pre id="87a8855f-b6ae-4425-bd5f-2da7caa0105d"><code class="language-python">as_radio()</code></pre>
+          <div class="ms-3 collapse" id="eb04edfe-52d7-464e-868d-b16faa1aea14">
+           <h6 id="c77ade09-e198-41dc-8cb9-968ad2ec9867">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="7d0196c6-fb96-40ad-9650-076f73e875af">
+           <table class="table table-sm bg-light" id="affa4221-f3e8-423f-83a2-39b2dc40237f">
             <thead>
              <tr>
               <th scope="col">
@@ -4397,11 +4533,11 @@ Form(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="7a795e0e-b12c-4ad0-9a82-3ecdab3c8e0a">
-           <h6 id="f9c33bd6-d9f3-4dba-a41f-7f561d55f764">
+          <div class="ms-3" id="acc04b2b-b60f-4189-9daa-81c0c00de415">
+           <h6 id="48889353-ad33-4bf9-92fd-f3de88cbc30c">
             Example
            </h6>
-           <pre id="b47d5521-3af8-4815-b181-deacb013e543"><code class="language-python">from bootwrap import Form, SelectInput
+           <pre id="8e5c037a-4d29-43a9-bf6b-386e75d0576b"><code class="language-python">from bootwrap import Form, SelectInput
 
 options = [
     SelectInput.Option('One', 1),
@@ -4414,28 +4550,28 @@ Form(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="48892700-8c99-459b-ba48-13f1ee7e43ef">
-           <form enctype="multipart/form-data" id="0f905184-7af0-489e-979e-c3b66ca2e502" method="POST">
+          <div class="ms-3" id="e2778cb2-cabd-4ba0-9843-422bbebeed23">
+           <form enctype="multipart/form-data" id="1514d818-c50d-4bb3-a88a-7b2aa4408713" method="POST">
             <div class="form-group row">
-             <label class="col-sm-4 col-form-label d-flex align-items-center" for="0f491e35-4599-48e0-838a-b63d17a1c9d2">
+             <label class="col-sm-4 col-form-label d-flex align-items-center" for="41fcf21b-597b-4643-bc4a-a22dc83a0d8e">
               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="350d9e21-d9c3-4552-a68a-8c34d47f646a" name="choice" type="radio" value="1"/>
-               <label class="form-check-label me-1" for="350d9e21-d9c3-4552-a68a-8c34d47f646a">
+               <input autocomplete="off" class="form-check-input" id="e6859f57-6016-4117-908a-d3c625a3dca8" name="choice" type="radio" value="1"/>
+               <label class="form-check-label me-1" for="e6859f57-6016-4117-908a-d3c625a3dca8">
                 One
                </label>
               </div>
               <div class="form-check me-3">
-               <input autocomplete="off" checked="" class="form-check-input" id="7468278b-4bc8-4591-87bf-bb5fdf3c7906" name="choice" type="radio" value="2"/>
-               <label class="form-check-label me-1" for="7468278b-4bc8-4591-87bf-bb5fdf3c7906">
+               <input autocomplete="off" checked="" class="form-check-input" id="80a9d89d-2fe7-4892-996a-ca089f6d2ed2" name="choice" type="radio" value="2"/>
+               <label class="form-check-label me-1" for="80a9d89d-2fe7-4892-996a-ca089f6d2ed2">
                 Two
                </label>
               </div>
               <div class="form-check me-3">
-               <input autocomplete="off" class="form-check-input" disabled="" id="c63f7180-c236-4541-803d-2282361fb3fe" name="choice" type="radio" value="3"/>
-               <label class="form-check-label me-1" for="c63f7180-c236-4541-803d-2282361fb3fe">
+               <input autocomplete="off" class="form-check-input" disabled="" id="28cd4ffc-8f54-4d8e-b690-01165fde8e27" name="choice" type="radio" value="3"/>
+               <label class="form-check-label me-1" for="28cd4ffc-8f54-4d8e-b690-01165fde8e27">
                 Three
                </label>
               </div>
@@ -4446,34 +4582,34 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="76e24ab5-8954-4e4b-9267-ad0095760401">
-        <div class="mt-5" id="1c600b97-0205-447f-9bf2-9df98bbd9b54">
-         <div class="d-flex justify-content-between" id="4c7b5a09-12ff-4485-bb59-bd651ae5103d">
-          <h1 id="5e56b669-9f1e-4b95-85c9-b80a88899473">
+       <div class="tab-pane fade" id="643ef479-76ed-4216-80d5-ef688befb662">
+        <div class="mt-5" id="53a7528f-376c-4e84-8500-7987d1a01166">
+         <div class="d-flex justify-content-between" id="0abbd716-4e1b-400b-99cf-e89989a18e0d">
+          <h1 id="08d501be-a218-4c9d-8c1a-696d79209740">
            Class
-           <span class="text-primary" id="7d8b0d63-1c81-4158-b40c-a6133973868c">
+           <span class="text-primary" id="af17adaa-2966-48fe-8bef-c0e002ff57b2">
             SelectInput.Option
            </span>
           </h1>
-          <div id="06037883-1c4c-4ec9-9dd9-a2ed1548b451">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#fe396108-4c44-4ad5-b261-be91bdabed68" data-bs-toggle="collapse" id="d0b40d88-ef96-4bdc-8ca8-2979aae978f7" onclick="return false;" type="button">
+          <div id="a534a6b6-9fd2-49cf-aafe-dfed55e72c86">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#ee05c50d-a699-47f9-9c95-ac891b6dab4d" data-bs-toggle="collapse" id="96f4fec5-0a2e-4288-b944-4f8ff75a16d5" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="e4bbd096-9b2f-4898-9bfd-eb756a5308a8">
+         <span class="text-muted" id="92ff9919-3576-42d0-9047-3a4016bb03ba">
           An option used by
           <code>
            SelectInput
           </code>
           .
          </span>
-         <pre id="edd2dd42-c421-4316-835f-d41d8cb565e5"><code class="language-python">SelectInput.Option(name, value, disabled=False)</code></pre>
-         <div class="ms-3 collapse" id="fe396108-4c44-4ad5-b261-be91bdabed68">
-          <h6 id="b39630b9-eb9e-4b23-b4c4-1a35cfb16d53">
+         <pre id="29d60051-e9b3-40cf-9abe-8efd17737683"><code class="language-python">SelectInput.Option(name, value, disabled=False)</code></pre>
+         <div class="ms-3 collapse" id="ee05c50d-a699-47f9-9c95-ac891b6dab4d">
+          <h6 id="9ab0bf35-ae29-4fa1-887e-ec2378c09e70">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="16030d63-ad20-4f5d-bd3c-3c140b56682d">
+          <table class="table table-sm bg-light" id="5ef8ff57-15b3-406a-bcdd-a279e652570b">
            <thead>
             <tr>
              <th scope="col">
@@ -4540,65 +4676,65 @@ Form(
            </tbody>
           </table>
          </div>
-         <div class="mt-5" id="2e2a7e8f-35de-44ca-8006-848e6c59c4c3">
-          <h4 id="8f96938c-4e2e-4abd-a51d-0002a1c227ae">
+         <div class="mt-5" id="11e8c4ee-000e-4eec-9684-a75ed314a974">
+          <h4 id="b916d424-eee2-4dbd-9fdf-9810b2b8c9f4">
            Property
-           <span class="text-primary" id="ce3be9e5-cdd1-415a-b3a4-0ad564cdb841">
+           <span class="text-primary" id="39eb75af-3210-432f-bc1f-a661cf357421">
             disabled
            </span>
           </h4>
-          <span class="text-muted" id="fcc139cd-6789-4b85-97b8-d22975ca316d">
+          <span class="text-muted" id="a7e7d11a-171a-4012-b5b1-74bd4382a982">
            None
           </span>
          </div>
-         <div class="mt-5" id="41e56f91-ffc9-4e49-90c6-a5f0172b02c6">
-          <h4 id="0507d761-bd1b-4bdc-b9df-ff24b3718750">
+         <div class="mt-5" id="5e78bddb-6f92-4f12-adf5-caf4e16dc9c7">
+          <h4 id="08efc157-9547-46de-b089-78472a2d9f3d">
            Property
-           <span class="text-primary" id="2b07ff1c-2111-4f88-abee-90e5f6426552">
+           <span class="text-primary" id="ab137d5f-14c8-4356-9692-ed58cacb89bf">
             name
            </span>
           </h4>
-          <span class="text-muted" id="0a79a99a-cfa7-4c5f-b27a-38984f6f575e">
+          <span class="text-muted" id="08ca394b-e182-4466-a51e-3d9123d9030f">
            None
           </span>
          </div>
-         <div class="mt-5" id="5cc77abe-2f14-4382-8e69-cd912712c0b8">
-          <h4 id="3af2ecf5-44fc-4115-abb4-51c595d68e45">
+         <div class="mt-5" id="9798e31a-8bd8-4242-8974-780cdec20a46">
+          <h4 id="14a26242-0625-453c-8c53-1ef81cc2a93b">
            Property
-           <span class="text-primary" id="5cd820c1-b1f8-4930-aa1f-216a8c590bf1">
+           <span class="text-primary" id="7517a83c-ce84-4c45-96c5-e0ceeb7d00dc">
             value
            </span>
           </h4>
-          <span class="text-muted" id="8956e559-37d8-4413-a509-737d51332e6b">
+          <span class="text-muted" id="10132d65-d2f3-4093-8dfd-4b362f09f4b1">
            None
           </span>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="3a19a6c1-5e7e-4d48-a92e-d4e04233fdad">
-        <div class="mt-5" id="bdb2733e-6b30-4159-a930-35d2c530de56">
-         <div class="d-flex justify-content-between" id="4a567b92-bb05-41f6-ae3f-1db7fbf3b9ca">
-          <h1 id="e99f4dc8-6f4e-49f1-b215-0563be02af2b">
+       <div class="tab-pane fade" id="93503f0c-c22c-48f1-9a84-ceee1dea13f7">
+        <div class="mt-5" id="32b81d13-e772-408b-a83b-772730edd7ef">
+         <div class="d-flex justify-content-between" id="5265bae6-f676-49de-ba2f-545fcc574a93">
+          <h1 id="1d28328b-26b1-49d3-9988-20daff95a4ac">
            Class
-           <span class="text-primary" id="a07456c6-5a1c-411d-b678-60533f7f062c">
+           <span class="text-primary" id="8e79d5e1-3bfb-42d4-a212-420bbe578b10">
             JsonInput
            </span>
           </h1>
-          <div id="91ce7130-51d2-4bb9-8177-e9134a39d437">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#3721577c-3f53-4e7b-a0c4-aa121dfc3399" data-bs-toggle="collapse" id="78825141-7c53-439e-bb23-cffcbc6ddb15" onclick="return false;" type="button">
+          <div id="da9f0acd-99c4-40dd-918f-9cc597d80e4a">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#d688af79-2e9e-4890-b5c0-36675fc63f63" data-bs-toggle="collapse" id="a8bd419b-218a-4e51-92be-254caa10e65a" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="ed1108ba-b27b-4747-b72c-d91fd22b7f6e">
+         <span class="text-muted" id="adfd3c70-52e7-4b61-a5b2-b7d466811180">
           A JSON input.
          </span>
-         <pre id="94e5e856-7b74-4aa1-bf86-4bad9b6d539d"><code class="language-python">JsonInput(label, name, value=None)</code></pre>
-         <div class="ms-3 collapse" id="3721577c-3f53-4e7b-a0c4-aa121dfc3399">
-          <h6 id="c1548f1e-23b5-472b-8493-d49dc42529fe">
+         <pre id="419fe113-f337-4005-aec2-4c604c9e33a3"><code class="language-python">JsonInput(label, name, value=None)</code></pre>
+         <div class="ms-3 collapse" id="d688af79-2e9e-4890-b5c0-36675fc63f63">
+          <h6 id="b0cd9d97-1660-468c-8c3f-fdbf56312cb8">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="cd220911-a149-4a7b-af86-fef12a4b72a8">
+          <table class="table table-sm bg-light" id="24e0fd5b-097f-4584-b604-021ce477fecc">
            <thead>
             <tr>
              <th scope="col">
@@ -4661,11 +4797,11 @@ Form(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="771a4893-ff5f-4ec4-8162-6e0b241eb322">
-          <h6 id="ab7df4be-f839-42ac-af58-ced5174ff4ea">
+         <div class="ms-3" id="3b951151-a7ad-4c08-b742-bf725e96ae8b">
+          <h6 id="6b3dfa30-6382-49ac-b81e-42677156b71e">
            Example
           </h6>
-          <pre id="49f0c80f-4e8f-4a04-b3b4-ac1188aa981e"><code class="language-python">from bootwrap import Form, JsonInput
+          <pre id="9c53e66c-c011-4d37-bc32-65221ebb4f77"><code class="language-python">from bootwrap import Form, JsonInput
 
 Form(
     JsonInput('JSON Config', 'code', '{"hello": "world enable"}'),
@@ -4674,54 +4810,54 @@ Form(
 
 </code></pre>
          </div>
-         <div class="ms-3" id="0aedb146-9364-494e-8708-8a59efa4242c">
-          <form enctype="multipart/form-data" id="67eebd39-88e2-4f9d-ac73-98b16519abb8" method="POST">
+         <div class="ms-3" id="31716955-6b8b-41d8-9ea0-44a648e68d26">
+          <form enctype="multipart/form-data" id="00548653-c7fe-4ecf-af56-be9efca1de45" method="POST">
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="95099e4b-186b-4033-8be0-ad950f9df9a1">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="caf63854-25b6-4e0c-aa0d-242d2e0bc8d8">
              JSON Config
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <pre class="w-100" contenteditable="true" onkeyup="javascript:$('#95099e4b-186b-4033-8be0-ad950f9df9a1').val($(this).text())"><code class="language-json">{"hello": "world enable"}</code></pre>
-             <input id="95099e4b-186b-4033-8be0-ad950f9df9a1" name="code" type="hidden" value='{"hello": "world enable"}'/>
+             <pre class="w-100" contenteditable="true" onkeyup="javascript:$('#caf63854-25b6-4e0c-aa0d-242d2e0bc8d8').val($(this).text())"><code class="language-json">"{\"hello\": \"world enable\"}"</code></pre>
+             <input id="caf63854-25b6-4e0c-aa0d-242d2e0bc8d8" name="code" type="hidden" value='"{\"hello\": \"world enable\"}"'/>
             </div>
            </div>
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="06f1b02f-3c8c-4279-b80f-71628b70a8a3">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="beedbfc7-6c2a-4447-81cf-d7fda3348273">
              JSON Config
             </label>
             <div class="col-sm-8 d-flex align-items-center">
-             <pre class="w-100" contenteditable="false" onkeyup="javascript:$('#06f1b02f-3c8c-4279-b80f-71628b70a8a3').val($(this).text())"><code class="language-json">{"hello": "world disable"}</code></pre>
-             <input id="06f1b02f-3c8c-4279-b80f-71628b70a8a3" name="code" type="hidden" value='{"hello": "world disable"}'/>
+             <pre class="w-100" contenteditable="false" onkeyup="javascript:$('#beedbfc7-6c2a-4447-81cf-d7fda3348273').val($(this).text())"><code class="language-json">"{\"hello\": \"world disable\"}"</code></pre>
+             <input id="beedbfc7-6c2a-4447-81cf-d7fda3348273" name="code" type="hidden" value='"{\"hello\": \"world disable\"}"'/>
             </div>
            </div>
           </form>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="21146b4f-14b7-4df0-8897-9bbf2060baeb">
-        <div class="mt-5" id="181c838d-990a-4116-8623-f319c67bf985">
-         <div class="d-flex justify-content-between" id="1ca3e1b3-6477-43c1-816c-22d0dca2d425">
-          <h1 id="c236f27c-53a8-4e2a-9d9a-0f9f7eb901c7">
+       <div class="tab-pane fade" id="0df672b3-dbc7-4e1f-ba78-d8fbf8039e4d">
+        <div class="mt-5" id="e3c5d11c-dfad-490f-b377-973dece66947">
+         <div class="d-flex justify-content-between" id="c83d2c3b-03bd-48db-9685-45169ca71e2d">
+          <h1 id="e3b63c83-a1cd-407a-b1b3-f9bb93d369b3">
            Class
-           <span class="text-primary" id="1e92a148-c1d0-496e-9ac5-f8ae7f7ac09f">
+           <span class="text-primary" id="ee6d1187-d322-4c00-91ad-cfc2f123bd10">
             HiddenInput
            </span>
           </h1>
-          <div id="51138b6d-0bde-47f5-b9da-421bed36782c">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#9d69a45e-26f2-46a8-a103-910db4c1d7dd" data-bs-toggle="collapse" id="2acc3c92-9a7b-46f8-8d6e-0d0b09064ddf" onclick="return false;" type="button">
+          <div id="88efb25f-2604-48e3-81bc-6254908fd45f">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#ce417fd8-60dd-4467-ae60-1d7ea8dd0354" data-bs-toggle="collapse" id="337b5f97-fc59-4f8e-ab78-580f81c9744d" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="a3df3ea0-5778-4981-87cc-e8d21dc8bc0c">
+         <span class="text-muted" id="f07c5e25-60b7-4a23-854a-cb665ce3fafd">
           A hidden input.
          </span>
-         <pre id="4353620e-9c4b-486c-ac4e-602915301675"><code class="language-python">HiddenInput(name, value=None)</code></pre>
-         <div class="ms-3 collapse" id="9d69a45e-26f2-46a8-a103-910db4c1d7dd">
-          <h6 id="ec028faa-89fd-4099-a6e3-961d6369b624">
+         <pre id="3deed9a0-4b15-44a1-ba5f-b218140dbc3f"><code class="language-python">HiddenInput(name, value=None)</code></pre>
+         <div class="ms-3 collapse" id="ce417fd8-60dd-4467-ae60-1d7ea8dd0354">
+          <h6 id="733e102a-ccca-437e-a919-244c7c116caf">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="fbee9fe1-5a52-4950-a591-7ed9c81273b9">
+          <table class="table table-sm bg-light" id="7df0a5a1-62c0-4b75-87ac-04f9b75f5d32">
            <thead>
             <tr>
              <th scope="col">
@@ -4769,11 +4905,11 @@ Form(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="e1646855-dc4f-40ef-b4bc-943624603da2">
-          <h6 id="a2475b4a-3008-420c-ba45-0dae14bf1685">
+         <div class="ms-3" id="f6efe314-b444-4054-9ff9-25352e651812">
+          <h6 id="e5735ca1-6d75-4faf-a73b-f63d6eaeeb10">
            Example
           </h6>
-          <pre id="f9fd3b6d-d3f5-4a19-b986-02142c13151c"><code class="language-python">from bootwrap import Form, SelectInput
+          <pre id="b76ca19a-7edd-459b-a00f-12700e64a7f0"><code class="language-python">from bootwrap import Form, SelectInput
 
 Form(
     HiddenInput('token', '123')
@@ -4782,30 +4918,30 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="e1a7a09d-ca44-4ac3-8ff5-99d4e1af4b04">
-        <div class="mt-5" id="c3f5f7b2-aebb-4abf-8348-4bc101270ce1">
-         <div class="d-flex justify-content-between" id="a25d38f9-2baf-439d-8fcb-d79f79923403">
-          <h1 id="39dc0c2a-c9a4-428d-9849-2389865b07e5">
+       <div class="tab-pane fade" id="1ddd8dea-8929-4f62-b7c0-940009cc5fbd">
+        <div class="mt-5" id="f4b814a2-0bde-43a7-901c-c018bfba0d27">
+         <div class="d-flex justify-content-between" id="bb886930-5ae2-4148-90b5-59790e455145">
+          <h1 id="e08db949-e819-42c7-a033-cd0df9fe27ed">
            Class
-           <span class="text-primary" id="68ef64dd-9d5f-4710-9ab6-c1e7e7c22780">
+           <span class="text-primary" id="50d54cd3-a175-4099-ab0d-9e8d2e53a15e">
             FileInput
            </span>
           </h1>
-          <div id="0f97091c-fe6c-4edd-bb4c-532928f98e35">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#6da81c6f-19d6-439d-adde-6ce1f4fea3d0" data-bs-toggle="collapse" id="25562b65-a153-414b-af1e-c3824bc12101" onclick="return false;" type="button">
+          <div id="48e25083-896f-4b95-9945-6d88556c0dba">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#7d91625c-aab5-4f3e-9a24-3aa8e6369f2f" data-bs-toggle="collapse" id="780753ea-29e9-413c-b0fb-21878051865b" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="45fe1e3a-74b9-4cef-96c2-16b3d52c3782">
+         <span class="text-muted" id="55a42b44-13b1-49fd-abf5-3aa568747238">
           A file input.
          </span>
-         <pre id="bfb6c1a6-d3c9-44d1-bda8-c7aa1a13ce78"><code class="language-python">FileInput(label, name)</code></pre>
-         <div class="ms-3 collapse" id="6da81c6f-19d6-439d-adde-6ce1f4fea3d0">
-          <h6 id="a94b07a4-d58a-4969-a0ac-0da2aaac081c">
+         <pre id="3c99a358-6460-4adf-af92-c8c21fd9c372"><code class="language-python">FileInput(label, name)</code></pre>
+         <div class="ms-3 collapse" id="7d91625c-aab5-4f3e-9a24-3aa8e6369f2f">
+          <h6 id="587dfbf6-8ce9-4478-ad46-b6d6fbe43b4d">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="62c1ee97-bf4f-4c9b-bfca-3dda35ddc02e">
+          <table class="table table-sm bg-light" id="4f094a65-8e3c-4a1a-84cc-816cecf05997">
            <thead>
             <tr>
              <th scope="col">
@@ -4853,7 +4989,7 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="a09831c4-3d36-4d54-8285-21a195f82734">
+         <p id="00c10131-d901-483a-b744-359e03a7dda8">
           Use the
           <code>
            as_disabled()
@@ -4865,11 +5001,11 @@ Form(
           </code>
           component.
          </p>
-         <div class="ms-3" id="a4ef13f0-4f3d-4e95-902d-daad0ab3e251">
-          <h6 id="f2188718-e848-4254-a29d-29c1cd3c1634">
+         <div class="ms-3" id="29d2029c-8487-43bd-88ec-4944f950005d">
+          <h6 id="cb7f7c75-99f8-4297-96e3-d3eea7521cc4">
            Example
           </h6>
-          <pre id="cbafb034-87d2-4811-a547-d15f7ffa56bf"><code class="language-python">from bootwrap import Form, FileInput
+          <pre id="07da26f0-7133-44a6-99c7-55ac96e4e572"><code class="language-python">from bootwrap import Form, FileInput
 
 Form(
     FileInput('File', 'file'),
@@ -4877,10 +5013,10 @@ Form(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="fa7a432e-42ed-418e-8c01-9925d4321cc7">
-          <form enctype="multipart/form-data" id="2d6da07c-4642-487a-a4c6-a993b6847e21" method="POST">
+         <div class="ms-3" id="c384310f-df3c-4288-9022-0456277503c4">
+          <form enctype="multipart/form-data" id="c1634824-d02c-44e6-865f-3bcff1f1a19a" method="POST">
            <div class="form-group row">
-            <label class="col-sm-4 col-form-label d-flex align-items-center" for="79616586-a48f-49a8-be2a-a8de1c07996f">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="39cb53a5-5b89-46de-ae78-18d26a6b26a5">
              File
             </label>
             <div class="col-sm-8 d-flex align-items-center">
@@ -4891,13 +5027,13 @@ Form(
                <span class="btn btn-secondary" onclick="$(this).parent().find('input[type=file]').click();">
                 Browse
                </span>
-               <input id="79616586-a48f-49a8-be2a-a8de1c07996f" name="file" onchange="$(this).parent().parent().find('.form-control').htms($(this).val().split(/[\|/]/).pop());" style="display: none;" type="file"/>
+               <input id="39cb53a5-5b89-46de-ae78-18d26a6b26a5" 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="10cd892c-6f84-469b-b569-8a9b77a8cd3f">
+            <label class="col-sm-4 col-form-label d-flex align-items-center" for="ec10d3d5-26b8-4c42-ad93-b472ec2590e5">
              File
             </label>
             <div class="col-sm-8 d-flex align-items-center">
@@ -4908,7 +5044,7 @@ Form(
                <span class="btn btn-secondary disabled" onclick="$(this).parent().find('input[type=file]').click();">
                 Browse
                </span>
-               <input disabled="" id="10cd892c-6f84-469b-b569-8a9b77a8cd3f" name="file" onchange="$(this).parent().parent().find('.form-control').htms($(this).val().split(/[\|/]/).pop());" style="display: none;" type="file"/>
+               <input disabled="" id="ec10d3d5-26b8-4c42-ad93-b472ec2590e5" name="file" onchange="$(this).parent().parent().find('.form-control').htms($(this).val().split(/[\|/]/).pop());" style="display: none;" type="file"/>
               </div>
              </div>
             </div>
@@ -4917,30 +5053,30 @@ Form(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="67ed4ae6-dcf3-4cfa-b816-93459cd47752">
-        <div class="mt-5" id="69c8d61f-8bc3-4eb4-b8b1-fab91acbffc5">
-         <div class="d-flex justify-content-between" id="f6621071-28ef-42b5-8e11-10cf9abec5d8">
-          <h1 id="d59a6431-7fac-4f40-9874-9d007d8ce4a8">
+       <div class="tab-pane fade" id="1ca50ae1-8f98-4d53-b29f-b4b51ab19abe">
+        <div class="mt-5" id="6045c4a0-ad2a-47bd-bc8b-1e5cb10f3c3a">
+         <div class="d-flex justify-content-between" id="0daf78ed-a3d1-44d1-bab3-aaaeb4fd8932">
+          <h1 id="e5ff34d1-6a31-493e-a75b-398ffd2d54e4">
            Class
-           <span class="text-primary" id="2d220e06-980c-4d18-9861-508f22aa4d73">
+           <span class="text-primary" id="8405d6de-1722-4307-8aa1-3ca62b929927">
             InputGroup
            </span>
           </h1>
-          <div id="a61f1444-4f7f-4d13-8d09-9b38852ed3a6">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#acd433aa-8499-4288-a98b-4a7978ec0f8f" data-bs-toggle="collapse" id="e4dc0fc6-65c4-410e-906f-c5c38c4700ae" onclick="return false;" type="button">
+          <div id="a27de27a-6624-4241-8499-c20021892ae6">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#498c07a2-1cc2-40c8-b7ad-ca2abad4d7a2" data-bs-toggle="collapse" id="cc02f4bf-fb56-484a-88fa-6b84d72d1305" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="1526fd6e-7837-473a-bb66-793c552f5857">
+         <span class="text-muted" id="7a72eff7-e1e0-48f5-9fe4-d0f8da6ef5cd">
           A web component for an input group.
          </span>
-         <pre id="70a9c1be-d0da-40fb-b347-116b8ebdf729"><code class="language-python">InputGroup(*inputs)</code></pre>
-         <div class="ms-3 collapse" id="acd433aa-8499-4288-a98b-4a7978ec0f8f">
-          <h6 id="b57cc501-2166-49fe-ba87-10f61b2465a8">
+         <pre id="d9deb5e3-b1b1-48c8-992c-c9b897c3a746"><code class="language-python">InputGroup(*inputs)</code></pre>
+         <div class="ms-3 collapse" id="498c07a2-1cc2-40c8-b7ad-ca2abad4d7a2">
+          <h6 id="75705acf-8d3d-47f9-9434-126b33eedf9f">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="387ef30c-2183-4a2b-a61d-c7d2f1553ead">
+          <table class="table table-sm bg-light" id="da0c1d08-bb8f-4585-aade-57e0709246df">
            <thead>
             <tr>
              <th scope="col">
@@ -4977,14 +5113,14 @@ Form(
            </tbody>
           </table>
          </div>
-         <p id="36a5ead4-3460-488d-9c0a-fe930da48f08">
+         <p id="f132a869-0100-4f93-b728-e76064a43379">
           Grous together a series of input components
          </p>
-         <div class="ms-3" id="bb02b793-67e1-45f9-b923-6c2498f9e659">
-          <h6 id="87beeab3-c528-44b3-9b65-2cfdbc7a2514">
+         <div class="ms-3" id="b520d4ed-f814-4347-b382-8c8653d28948">
+          <h6 id="96bf6686-56ca-4cbd-ae8b-69ac21d09d6a">
            Example
           </h6>
-          <pre id="5963a4c8-f41e-4845-aff7-1881c24b8c2e"><code class="language-python">from bootwrap import Text, TextInput, NumericInput, InputGroup, Form
+          <pre id="cc9c7519-66f8-4e24-b6cd-2d530544ce48"><code class="language-python">from bootwrap import Text, TextInput, NumericInput, InputGroup, Form
 
 at = Text("@")
 username = TextInput(None, 'username', placeholder='type username')
@@ -5011,35 +5147,35 @@ ig4 = InputGroup(login, at, password).mb(2)
 Form(ig1,ig2,ig3,ig4)
 </code></pre>
          </div>
-         <div class="ms-3" id="027ec14c-d1b2-4f03-ad26-469809a75095">
-          <form enctype="multipart/form-data" id="37c547fe-7336-4a11-ab3b-6357f680e30f" method="POST">
-           <div class="mb-2 input-group" id="a474db30-9c0c-4788-8700-0c3b40eecfa1" role="group">
-            <span class="input-group-text" id="d7f7f9a3-3891-4b61-a170-e8d69678284e">
+         <div class="ms-3" id="c60fdfe0-6ffb-4240-b0d1-0800dce8dba6">
+          <form enctype="multipart/form-data" id="108a1df5-5e20-42f1-96dd-0b7493552168" method="POST">
+           <div class="mb-2 input-group" id="55e62873-cc7a-479b-aad9-8eb113177d8e" role="group">
+            <span class="input-group-text" id="d2f73a5d-aff3-4448-9e63-7a0231a19f02">
              @
             </span>
-            <input class="form-control" id="2f330c57-9fdd-4d78-9580-9ea035c67716" name="username" placeholder="type username" type="text"/>
+            <input class="form-control" id="708065d8-81cc-48df-be53-13d8a07738c7" name="username" placeholder="type username" type="text"/>
            </div>
-           <div class="mb-2 input-group" id="20dc69e0-ba83-4836-a092-d216d610f088" role="group">
-            <input class="form-control" id="5348982d-9630-440c-b300-607e0881c05b" name="recipient" placeholder="Recipient username" type="text"/>
-            <span class="input-group-text" id="26b248fd-7779-48c3-9cd2-ab5f03301c17">
+           <div class="mb-2 input-group" id="be06f610-47d8-4814-996d-db7e711f6f4d" role="group">
+            <input class="form-control" id="c4b3fc10-59e8-4b8d-9438-15fbc3fe6a4a" name="recipient" placeholder="Recipient username" type="text"/>
+            <span class="input-group-text" id="cca979d6-0e46-4d06-a741-c0153da92590">
              @example.com
             </span>
            </div>
-           <div class="mb-2 input-group" id="dc7846b6-97bb-4e1f-9307-7b310bf9dce4" role="group">
-            <span class="input-group-text" id="13a262e1-f90b-4ca9-b31f-fa9ab08647af">
+           <div class="mb-2 input-group" id="a7bf458e-707e-49c0-ab24-725962e8a948" role="group">
+            <span class="input-group-text" id="3aa29abd-7480-48dd-9452-3098f9397551">
              $
             </span>
-            <input class="form-control" id="79e9b968-8844-4cf9-9772-a937f5310244" name="amount" placeholder="Amount (to the nearest dollar)" type="number"/>
-            <span class="input-group-text" id="13374924-5979-42e8-9c78-d910800068c9">
+            <input class="form-control" id="504d5ac7-3f5b-434a-b015-d13b78a64898" name="amount" placeholder="Amount (to the nearest dollar)" type="number"/>
+            <span class="input-group-text" id="3379bc15-562a-4006-a8c1-18eb0ef6a464">
              .00
             </span>
            </div>
-           <div class="mb-2 input-group" id="82c8023b-b1ad-40d4-9ea9-e2f37b32c166" role="group">
-            <input class="form-control" id="19b78b2f-1d2d-4199-9fea-4c02b3012ea7" name="login" placeholder="Login" type="text"/>
-            <span class="input-group-text" id="c3bdde78-074e-4ecb-96bb-343930b271ea">
+           <div class="mb-2 input-group" id="7a1ab49c-a6b3-4b58-9c96-3a0ba7114438" role="group">
+            <input class="form-control" id="a3530f61-b038-47fe-b68f-ee2064f2288d" name="login" placeholder="Login" type="text"/>
+            <span class="input-group-text" id="8d3f77c1-0c0a-44f8-809c-0b29e98cedee">
              @
             </span>
-            <input class="form-control" id="eb08de50-917a-45b8-8e31-b9e9c6540a6f" name="password" placeholder="Password" type="password"/>
+            <input class="form-control" id="838f58c8-5435-436a-8ec5-ce5a3c64dc21" name="password" placeholder="Password" type="password"/>
            </div>
           </form>
          </div>
@@ -5048,50 +5184,50 @@ Form(ig1,ig2,ig3,ig4)
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="94bd6d16-6066-4dda-a7a9-862caca19305">
-     <div id="9f11dc37-0131-436a-b588-7038474d26ac">
+    <div class="tab-pane fade" id="35ba166e-0f34-4f9a-a26f-49fc6347bb7e">
+     <div id="b9448d3f-6063-4b91-97e8-82e1997ca2a9">
       <hr/>
-      <ul class="nav" id="782e2fa1-93ad-4f34-a635-d18ad7e2f9c9" role="tablist">
+      <ul class="nav" id="b1758f82-58ca-4042-a353-c0ff30c8a1cf" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#369f1288-e611-4d38-84a2-00cef48bd344" data-bs-toggle="tab" href="#369f1288-e611-4d38-84a2-00cef48bd344" id="779f8e13-7bcb-474b-bdc2-529a8d58db07" role="tab">
-         <span class="text-secondary" id="5f46a994-d3a9-45cc-b339-a0c37ac55356">
+        <a class="nav-link active" data-bs-target="#12313053-f798-4237-953e-3e17624ce917" data-bs-toggle="tab" href="#12313053-f798-4237-953e-3e17624ce917" id="20837205-3124-4b36-a510-6322400e97a8" role="tab">
+         <span class="text-secondary" id="d2f70340-79d3-4ff7-9169-425b08ad339b">
           Icon
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#d8157bb2-9e97-4484-a128-679d495cf82e" data-bs-toggle="tab" href="#d8157bb2-9e97-4484-a128-679d495cf82e" id="567aa383-608c-481a-95e2-3434a3af6008" role="tab">
-         <span class="text-secondary" id="be96bc00-ba95-4475-9ca5-2cf5f58bfff1">
+        <a class="nav-link" data-bs-target="#f49d5671-fb98-41b0-ae55-07bd38000f37" data-bs-toggle="tab" href="#f49d5671-fb98-41b0-ae55-07bd38000f37" id="606ac033-895b-4ae2-abd8-b803bc947cea" role="tab">
+         <span class="text-secondary" id="5a6162a8-8731-4189-bfb6-5a0349d5b8c6">
           Spinner
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="369f1288-e611-4d38-84a2-00cef48bd344">
-        <div class="mt-5" id="ce6d09dd-21c6-4031-a346-a5387577d40a">
-         <div class="d-flex justify-content-between" id="76d6ad6d-6dfb-4e71-8b61-e2523309d2ed">
-          <h1 id="5286523b-8764-4052-b059-6b6dad86bbf4">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="12313053-f798-4237-953e-3e17624ce917">
+        <div class="mt-5" id="455a612f-60cf-4e5f-b52d-2b8762d7d494">
+         <div class="d-flex justify-content-between" id="292f0b62-3be5-46d0-9c36-80d4c9a1e5f1">
+          <h1 id="9506d5e4-c4eb-48f6-8dbe-ed9f667b4768">
            Class
-           <span class="text-primary" id="12f55cb3-bd69-415d-a1cb-b7c2fd5d0d9f">
+           <span class="text-primary" id="4d30723d-b4a2-42c5-94b9-b0c9dd2a882c">
             Icon
            </span>
           </h1>
-          <div id="5bff564b-a41e-49a7-b56f-d7e6378c4210">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#d23c715b-de6c-4194-8557-3812c0b3f67a" data-bs-toggle="collapse" id="3d76a4b1-4e25-466a-84fe-13436f88c7c2" onclick="return false;" type="button">
+          <div id="a48b7787-bd84-4aea-ab53-0018b0019e2e">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#d71c96ab-ce95-42cc-b7a7-da5404ecd0fb" data-bs-toggle="collapse" id="bdb58635-2bf3-4abf-969b-30ea5d9eed65" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="d1c4d74e-ed79-41c1-a5e8-89b05be8bcba">
+         <span class="text-muted" id="3ab4eeab-51e8-480f-a772-4099e6790908">
           An icon.
          </span>
-         <pre id="552e6397-a5f1-4bde-a33e-0b023b568704"><code class="language-python">Icon(name)</code></pre>
-         <div class="ms-3 collapse" id="d23c715b-de6c-4194-8557-3812c0b3f67a">
-          <h6 id="4592c872-0c69-443b-84df-461a88393f23">
+         <pre id="1e81add2-8ade-4709-8a09-872bf777718d"><code class="language-python">Icon(name)</code></pre>
+         <div class="ms-3 collapse" id="d71c96ab-ce95-42cc-b7a7-da5404ecd0fb">
+          <h6 id="6d892c8f-c95d-4d12-9d6b-a959255f89ec">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="8b719de3-8081-47d2-8727-bd7585fc7b7f">
+          <table class="table table-sm bg-light" id="ceda6805-88ae-4b9b-899e-526270b3a0b8">
            <thead>
             <tr>
              <th scope="col">
@@ -5124,11 +5260,11 @@ Form(ig1,ig2,ig3,ig4)
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="4c410c1e-0f37-49b4-912e-12c40abfd263">
-          <h6 id="3bceb413-343e-47ea-87ce-f25e8e281d99">
+         <div class="ms-3" id="e11e4c17-e5da-44f2-b101-44c38c316389">
+          <h6 id="51bd9023-9e47-49f3-a7a1-1d1085456b32">
            Example
           </h6>
-          <pre id="407b3d9e-e2c2-42e4-87c5-019ca61db54e"><code class="language-python">from bootwrap import Icon, Panel
+          <pre id="7f84f385-439d-4865-8c45-63fdf95c5471"><code class="language-python">from bootwrap import Icon, Panel
 
 Panel(
     Icon("fas fa-folder"),
@@ -5143,51 +5279,51 @@ Panel(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="01dea864-eae6-4112-aae2-4dc261fb0111">
-          <div id="9ed3cf63-1868-4455-a163-128ffa2fa77f">
-           <i class="fas fa-folder" id="2152768e-5412-47d5-a49d-f121c44c7ede">
+         <div class="ms-3" id="ec891109-319c-45fb-8065-e0deaff27442">
+          <div id="63236c77-ad7c-42a6-a9cf-3abe45c2abf4">
+           <i class="fas fa-folder" id="ea1718f5-1066-492b-80a3-fe7fca1f8280">
            </i>
-           <i class="fas fa-folder text-primary" id="dc8f87e3-459f-454d-8a66-d7a9eec0ca9f">
+           <i class="fas fa-folder text-primary" id="569633e2-69f5-40dc-9770-b34ecf21daab">
            </i>
-           <i class="fas fa-folder text-secondary" id="cb96db39-a264-408c-9d2a-d7afe31c1552">
+           <i class="fas fa-folder text-secondary" id="fd08ee5c-c8f8-4c40-8ea6-e37f196cc4ff">
            </i>
-           <i class="fas fa-folder text-success" id="f858f7c0-accb-4fde-b5a3-645053a42c40">
+           <i class="fas fa-folder text-success" id="999bc903-1833-4768-ac0b-179cd88d705f">
            </i>
-           <i class="fas fa-folder text-warning" id="1b268c41-ffa9-4419-8d55-ceb6a721fb28">
+           <i class="fas fa-folder text-warning" id="aeba8152-eddb-4aec-ab1d-7246998eb65b">
            </i>
-           <i class="fas fa-folder text-danger" id="aaa88a6f-3bbc-4685-bee5-1e3f3783deb9">
+           <i class="fas fa-folder text-danger" id="1197c102-c75c-41b4-a8f2-a6cc65fa90cc">
            </i>
-           <i class="fas fa-folder text-info" id="1b774392-2a72-4a82-851e-77f73744c363">
+           <i class="fas fa-folder text-info" id="1114c298-bf48-4247-9cf2-0c7e2507d67f">
            </i>
-           <i class="fas fa-folder text-light" id="ccc93b5b-1e26-40e5-ae8e-20ca0f77c597">
+           <i class="fas fa-folder text-light" id="9dbabaf9-b5fd-4467-b319-c55c2847ac8e">
            </i>
-           <i class="fas fa-folder text-dark" id="4d4e08af-dbc1-49ef-942b-9424554dfd18">
+           <i class="fas fa-folder text-dark" id="7fe51742-f1d6-438f-ba12-d4d997f42b0e">
            </i>
           </div>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="d8157bb2-9e97-4484-a128-679d495cf82e">
-        <div class="mt-5" id="e33c789c-a5ea-4304-be91-78a6cbe0c89c">
-         <div class="d-flex justify-content-between" id="e5ba972c-bf1f-4698-b994-ee63554e00ef">
-          <h1 id="e0038600-d312-43bf-b78d-e9fd76a784ad">
+       <div class="tab-pane fade" id="f49d5671-fb98-41b0-ae55-07bd38000f37">
+        <div class="mt-5" id="1d9ba56b-7e43-4b1d-90c0-88850cbf8529">
+         <div class="d-flex justify-content-between" id="72131062-4821-4e1b-a083-948239d0400e">
+          <h1 id="5683269e-3a7e-46cf-b5f6-78c1efc7065e">
            Class
-           <span class="text-primary" id="55b917f6-eecc-4744-ac72-6cc930a2a791">
+           <span class="text-primary" id="04942a2b-0d3e-420f-8b9b-4cc1c92d46df">
             Spinner
            </span>
           </h1>
-          <div id="066e0f47-b555-402e-9f1b-e01d9f29a38e">
+          <div id="26ab20d6-8ec4-440e-b73e-697b8cab0f49">
           </div>
          </div>
-         <span class="text-muted" id="d7e4e108-de83-4a10-9de5-0a8c0f5ce5a1">
+         <span class="text-muted" id="a81fd283-2764-4af3-af4c-54d8d988b430">
           A spinner icon.
          </span>
-         <pre id="99a58c60-6765-484c-b78f-d92f8abb504b"><code class="language-python">Spinner()</code></pre>
-         <div class="ms-3" id="d3a48075-34a4-46ff-a563-eea927eb7eb3">
-          <h6 id="fa31077e-c609-4308-ad1e-ec6827a32653">
+         <pre id="d7db513f-ea66-4410-ad3a-8f2a83181d34"><code class="language-python">Spinner()</code></pre>
+         <div class="ms-3" id="cc3c05dc-c4f9-4a78-94f3-e290b5cc0ad7">
+          <h6 id="d1edac0d-afde-4018-a8c0-45c5228e60cb">
            Example
           </h6>
-          <pre id="eb3f9933-d9c1-41a2-93c4-a3a51b9ec4fd"><code class="language-python">from bootwrap import Spinner, Panel
+          <pre id="4de217ee-8819-4be8-98d9-1eab35ab2198"><code class="language-python">from bootwrap import Spinner, Panel
 
 Panel(
     Spinner(),
@@ -5202,9 +5338,9 @@ Panel(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="b4401e2c-d765-44a8-83d7-448906736549">
-          <div id="84438570-6277-40f6-8355-3fda028b5297">
-           <span class="spinner" id="427e695b-89e7-428e-adeb-260cda70ff88">
+         <div class="ms-3" id="b14734da-53ec-4310-ae07-e7a8f0a16003">
+          <div id="8f849820-e4cc-49bc-b90e-1a53ce1565ff">
+           <span class="spinner" id="3ed8f49a-2ad5-4293-905c-b0acc5506d11">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5223,7 +5359,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-primary" id="05e52f69-de7b-477e-af37-4b4cb0b64902">
+           <span class="spinner text-primary" id="c3189262-227f-4f07-b999-42686c88034c">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5242,7 +5378,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-secondary" id="c1e06b60-0e43-48c8-8dbf-1e50bbaef5d2">
+           <span class="spinner text-secondary" id="2b559c04-6d0d-4079-94a6-5d01e1bcf5a6">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5261,7 +5397,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-success" id="1f17dcae-dd57-4126-97a9-010b6d0d92b0">
+           <span class="spinner text-success" id="c3506283-e216-48ea-b2cf-04c3fb873da1">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5280,7 +5416,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-warning" id="21e88907-1a51-4311-b413-5cebd011f62b">
+           <span class="spinner text-warning" id="dc0c3c60-694a-4e15-ad16-c7e09345880b">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5299,7 +5435,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-danger" id="6c85ca3f-ed2a-41c4-a1ea-5e4bf2325b91">
+           <span class="spinner text-danger" id="7b3ce2ff-05ec-45fd-886a-82575428dbf1">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5318,7 +5454,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-info" id="d1eac39a-4bb2-409c-b3ed-7f7ec97760e1">
+           <span class="spinner text-info" id="01ee9591-270e-4253-9014-c83e4d817526">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5337,7 +5473,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-light" id="726a462a-1c31-489a-be1d-569cb0a2f920">
+           <span class="spinner text-light" id="20648e23-97fc-44b9-b880-749288086559">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5356,7 +5492,7 @@ Panel(
                     animation: spinner-border .75s linear infinite;
                 }
            </style>
-           <span class="spinner text-dark" id="eccfe6d8-eee9-4da6-a46c-12056722e147">
+           <span class="spinner text-dark" id="e299cad1-fe35-424f-9cb8-6f389bcdd9ef">
            </span>
            <style>
             @keyframes spinner-border {
@@ -5382,30 +5518,30 @@ Panel(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="eae874f4-60dd-4493-a80a-ecdf5140ed2a">
-     <div class="mt-5" id="0b1adcc7-e42d-4c6e-82fc-93f15f9d8031">
-      <div class="d-flex justify-content-between" id="4028c8dd-44da-4bad-9c8b-f9546bc3af02">
-       <h1 id="b4ab5bfc-7eef-48e4-a84e-c3cbb64f6591">
+    <div class="tab-pane fade" id="2ba3809b-560b-4825-915a-a8164d380b0b">
+     <div class="mt-5" id="5be5cd12-7c15-406d-ae26-46e4e2d2e7f3">
+      <div class="d-flex justify-content-between" id="fbebd37e-aa66-40c3-b3b1-0003a1938823">
+       <h1 id="74f5e0ae-a6cc-4dc0-9aca-5349ce1b42cf">
         Class
-        <span class="text-primary" id="3181d99d-545e-4d7a-ba9d-7bc05a872970">
+        <span class="text-primary" id="c799cfe0-a4df-441b-91cf-63f17b6845eb">
          Image
         </span>
        </h1>
-       <div id="e213549c-b9fa-4b64-827b-6b13d565b8c1">
-        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#7610fa4b-485a-4f40-920b-fa06b886a364" data-bs-toggle="collapse" id="aa486661-2cb4-49f3-8374-4b71d4b37cbf" onclick="return false;" type="button">
+       <div id="d45b2cc6-25af-4492-9b1a-ed24bed15100">
+        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#52eba472-f6b2-4e38-a2b7-71416908d463" data-bs-toggle="collapse" id="499d6506-3433-4abc-b304-88c5313361d4" onclick="return false;" type="button">
          Argument
         </button>
        </div>
       </div>
-      <span class="text-muted" id="3fec163e-ef52-4779-afed-76efd70ca5f0">
+      <span class="text-muted" id="5f3e1c95-fd5c-4a49-b858-5c7f6c13dd78">
        A web component for an image.
       </span>
-      <pre id="b83c392b-6a81-4cfb-bd01-19965333d5d8"><code class="language-python">Image(src, width=None, height=None, alt=None)</code></pre>
-      <div class="ms-3 collapse" id="7610fa4b-485a-4f40-920b-fa06b886a364">
-       <h6 id="f7a4d755-d08c-445e-aa62-a39092ae2f9e">
+      <pre id="a5382f0e-8198-4351-a3d6-0000c943bd91"><code class="language-python">Image(src, width=None, height=None, alt=None)</code></pre>
+      <div class="ms-3 collapse" id="52eba472-f6b2-4e38-a2b7-71416908d463">
+       <h6 id="152f595e-d986-44ca-946e-f93b2e73f6e2">
         Arguments
        </h6>
-       <table class="table table-sm bg-light" id="b12911c2-b147-4eb8-9240-b33a415245fc">
+       <table class="table table-sm bg-light" id="bf63f6cd-9a2e-4e95-9fa6-48fb5117c6f3">
         <thead>
          <tr>
           <th scope="col">
@@ -5483,64 +5619,64 @@ Panel(
         </tbody>
        </table>
       </div>
-      <div class="ms-3" id="4f791573-3d92-4de1-b52d-72451fb9bfe9">
-       <h6 id="673aefe5-1a11-436e-997b-dc269c3df713">
+      <div class="ms-3" id="edd7754c-0efe-4c68-8a92-c7d8bf709064">
+       <h6 id="a6e1f10c-255a-413f-b6a5-8c8fa860d8fe">
         Example
        </h6>
-       <pre id="9abb1cdf-23b8-4e8b-9970-d4c4b988c66e"><code class="language-python">from bootwrap import Image
+       <pre id="6b723e8f-c8e2-4856-8843-1a62e06002d6"><code class="language-python">from bootwrap import Image
 
 Image("logo.png")
 </code></pre>
       </div>
-      <div class="ms-3" id="2567de3e-7b78-427d-8ad3-26fc7310e80b">
-       <img id="5e33c7ac-5921-4703-b455-5f90c2dc84af" src="logo.png"/>
+      <div class="ms-3" id="cd47105d-7c04-4cfc-9fd6-1ab1222912e7">
+       <img id="717620ae-be08-44ec-bccd-7fc23ca85221" src="logo.png"/>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="2b471f6e-00fb-4570-a9ad-2efe105cc74e">
-     <div id="754c322a-0ce8-450b-bfa6-48e2681624f8">
+    <div class="tab-pane fade" id="a92dd6b3-bbfb-46e6-a3a2-709f91fd5af1">
+     <div id="d2e5df48-ca44-4829-bf67-a3b4cf285559">
       <hr/>
-      <ul class="nav" id="0f28ea37-2398-4456-83a8-42acd98bfd46" role="tablist">
+      <ul class="nav" id="2db144a0-3fc6-4fcf-b54b-a15cc6a13491" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#c78e63b7-07a3-4e7f-b464-54df9fd8431f" data-bs-toggle="tab" href="#c78e63b7-07a3-4e7f-b464-54df9fd8431f" id="1e4095b1-f867-416c-b175-f5c82bf30710" role="tab">
-         <span class="text-secondary" id="4ebfb935-f17e-4ffd-876a-2b56a0b14733">
+        <a class="nav-link active" data-bs-target="#1d89f612-c5a3-4548-a230-d0d2d5ed3fdd" data-bs-toggle="tab" href="#1d89f612-c5a3-4548-a230-d0d2d5ed3fdd" id="16124ff1-9661-4ecb-8d77-4dd13bc63f6c" role="tab">
+         <span class="text-secondary" id="263affa4-1cc5-45a4-bda4-60db7e933260">
           Javascript
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#50c806d4-3b58-4536-9191-8a512497b569" data-bs-toggle="tab" href="#50c806d4-3b58-4536-9191-8a512497b569" id="0d57d6c6-2728-4a6a-b4bf-727bddc3bf22" role="tab">
-         <span class="text-secondary" id="d043e8ff-51c2-4f8a-b15e-4fb64541bc14">
+        <a class="nav-link" data-bs-target="#519aaab5-59dc-48d6-acd6-8decab6cb7d4" data-bs-toggle="tab" href="#519aaab5-59dc-48d6-acd6-8decab6cb7d4" id="b5dc3e7c-16ed-4245-a5ea-3d07fbf15682" role="tab">
+         <span class="text-secondary" id="10f8a937-d34c-4141-a44e-562deb973aef">
           jQuery
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="c78e63b7-07a3-4e7f-b464-54df9fd8431f">
-        <div class="mt-5" id="f02f99a9-ca9a-40e4-ae05-bbbca01f27e6">
-         <div class="d-flex justify-content-between" id="046907b1-f9ec-4eb5-9c4b-8f6e44f5f1d9">
-          <h1 id="7c114e74-1cea-4d61-b776-3d6c3064d98f">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="1d89f612-c5a3-4548-a230-d0d2d5ed3fdd">
+        <div class="mt-5" id="f16ee84e-f3bc-4d54-9a79-ab962bb854ea">
+         <div class="d-flex justify-content-between" id="99b5aff1-e35e-4d47-be76-f61b0880bab0">
+          <h1 id="e8018063-378f-414a-a282-4b04501bc91d">
            Class
-           <span class="text-primary" id="4dd7cb2a-8874-42da-9abb-b1e9db2ec7fa">
+           <span class="text-primary" id="72bf35f8-0bbe-4feb-9e73-cfe3e497a3e0">
             Javascript
            </span>
           </h1>
-          <div id="7d0dca0f-bb50-40e9-abf2-bd5fc440cea5">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#69abc337-3f1f-49ff-bc88-cf517c1a8f88" data-bs-toggle="collapse" id="f40d084f-09fd-411c-8efd-470f4c2fd48d" onclick="return false;" type="button">
+          <div id="9b89a7b6-3f74-46fd-91b5-7575e66f33ee">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#a0b39dbe-aafc-4a0c-8166-4cf692b75927" data-bs-toggle="collapse" id="3d267bc9-cda4-4a53-8c7c-03e9e0058c78" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="1b3bd7b5-13d9-4e47-8dfb-337e92cd2f1c">
+         <span class="text-muted" id="b4a1ce36-3097-4899-ba62-e88cf904fe14">
           A web component for a javascript.
          </span>
-         <pre id="b3352de3-90dd-40cb-8c72-554f22300364"><code class="language-python">Javascript(src=None, script=None, submap=None)</code></pre>
-         <div class="ms-3 collapse" id="69abc337-3f1f-49ff-bc88-cf517c1a8f88">
-          <h6 id="c045ac4d-18bb-4a63-be09-5b8460176e79">
+         <pre id="d76dc9d8-2055-4348-9cc2-26c9fd1a2431"><code class="language-python">Javascript(src=None, script=None, submap=None)</code></pre>
+         <div class="ms-3 collapse" id="a0b39dbe-aafc-4a0c-8166-4cf692b75927">
+          <h6 id="f1a81f36-5b86-4993-a728-95b751ecafe3">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="10c7f889-b2df-4b42-92a0-5a1855eccc5b">
+          <table class="table table-sm bg-light" id="4bebab93-0044-497d-954c-ddcd33cab9b9">
            <thead>
             <tr>
              <th scope="col">
@@ -5605,11 +5741,11 @@ Image("logo.png")
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="6142ce18-7624-46cb-a78f-3f8afd564569">
-          <h6 id="e2432fb9-4c4e-438a-b234-718d9b7d7e79">
+         <div class="ms-3" id="369ed765-7b6b-46a7-9788-e0c8d0492bf5">
+          <h6 id="17b553ff-1399-45ec-9cd4-8c512b93bad5">
            Example
           </h6>
-          <pre id="4885c2ca-3661-4c1d-85c1-e1c747351fd9"><code class="language-python">from bootwrap import Page, Javascript
+          <pre id="0c0195ab-d7d0-4fc7-b45a-37632a67d767"><code class="language-python">from bootwrap import Page, Javascript
 
 my_page = Page(
     ...
@@ -5622,28 +5758,28 @@ my_page = Page(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="50c806d4-3b58-4536-9191-8a512497b569">
-        <div class="mt-3" id="1e664185-b1fb-4ebe-8b26-981190e527ae">
-         <div id="ae8dca7e-4393-4411-a02b-a28d5dafbd18">
+       <div class="tab-pane fade" id="519aaab5-59dc-48d6-acd6-8decab6cb7d4">
+        <div class="mt-3" id="8c0d5b4d-9edd-4823-80e7-13ae6602104c">
+         <div id="9725ee38-c957-40f3-a145-19f27478b4b2">
           <div class="row">
            <div class="col-md">
-            <div id="d04c3313-4959-4a2d-8b4e-78c5518c5154">
-             <h1 id="424fbf9e-0d73-4735-b642-f52954873722">
+            <div id="8658afff-35ac-470b-aa6c-eb1ec733698f">
+             <h1 id="0c5af2d6-89a0-44f7-b360-88e781456c2b">
               jQuery
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="88692c96-3c63-4fd8-9f67-7f88924fba4c">
+            <div id="33ef60f7-e64a-4e1f-b5a2-72fd6fcb3e69">
             </div>
            </div>
           </div>
          </div>
-         <div id="a67e546a-d34d-47b2-aa9b-5ec118080bd9">
+         <div id="8f41d27e-ccff-456c-b660-1d4b99203ecd">
           <div class="row">
            <div class="col-md">
-            <div id="771bc586-2908-47f4-9ee5-92d56828c831">
-             <p id="bb9d884a-2cbf-4572-8012-9b35ddb3ec2c">
+            <div id="3bf09a84-0fde-4bef-82c7-5c43fc025237">
+             <p id="b4c3c423-4986-4774-8a35-bec89ee4bcae">
               Use
               <code>
                Javascript
@@ -5653,8 +5789,8 @@ my_page = Page(
             </div>
            </div>
            <div class="col-md">
-            <div id="4b1a3997-7a68-4f24-982a-f98722d8e1f3">
-             <pre id="ec90b335-5e14-472d-9821-e088183a4420"><code class="language-python">from bootwrap import Panel, Javascript, Button, Text
+            <div id="471a73b4-a1c6-4101-83d1-fc3180bf943e">
+             <pre id="6a7282a1-4aff-43cc-ad82-81db2a1a885f"><code class="language-python">from bootwrap import Panel, Javascript, Button, Text
 
 label = Text("Answer:").as_strong()
 answer = Text("unknown").me(2).ms(2)
@@ -5679,25 +5815,25 @@ action = Javascript(
 Panel(
   label, answer, btn_yes, btn_no, action
 )</code></pre>
-             <div id="8bc01cc6-be60-42c6-acf1-f59175dfd525">
-              <strong id="65bb3cf6-8c0c-46ea-804c-cacf7a0b8629">
+             <div id="ffefccf2-df76-4395-8813-b98bac7f753c">
+              <strong id="34554d4d-af7c-413b-8e4f-387f1db5e04d">
                Answer:
               </strong>
-              <span class="me-2 ms-2" id="6c3158df-173a-4a25-9eb1-20e552db4d72">
+              <span class="me-2 ms-2" id="80c4eaa9-323f-4b91-86a6-6bbab0e489c2">
                unknown
               </span>
-              <button class="btn btn-success" id="3ddbcd27-d002-4c3c-8d65-05ef15fd265b" onclick="return false;">
+              <button class="btn btn-success" id="421d4eed-18f7-4554-b1ce-422f503f2135" onclick="return false;">
                Yes
               </button>
-              <button class="btn btn-danger" id="ea46b839-ba83-4453-b112-f5db16084b37" onclick="return false;">
+              <button class="btn btn-danger" id="074ac141-8f95-4fb1-9dc6-f7a044535a81" onclick="return false;">
                No
               </button>
               <script type="application/javascript">
-               $("#3ddbcd27-d002-4c3c-8d65-05ef15fd265b").on("click",function(){
-      $("#6c3158df-173a-4a25-9eb1-20e552db4d72").text("Yes");
+               $("#421d4eed-18f7-4554-b1ce-422f503f2135").on("click",function(){
+      $("#80c4eaa9-323f-4b91-86a6-6bbab0e489c2").text("Yes");
     });
-    $("#ea46b839-ba83-4453-b112-f5db16084b37").on("click",function(){
-      $("#6c3158df-173a-4a25-9eb1-20e552db4d72").text("No");
+    $("#074ac141-8f95-4fb1-9dc6-f7a044535a81").on("click",function(){
+      $("#80c4eaa9-323f-4b91-86a6-6bbab0e489c2").text("No");
     });
               </script>
              </div>
@@ -5710,30 +5846,30 @@ Panel(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="3afab468-a13a-4dd8-b55d-0b836a6c85ef">
-     <div class="mt-5" id="fa91ac39-3e93-48a6-ade4-7bb2069019b2">
-      <div class="d-flex justify-content-between" id="36fadcf8-ab91-442d-8c3a-6dcf7097c164">
-       <h1 id="7a259436-bae4-4d07-ae4d-7fa6a58e4eb5">
+    <div class="tab-pane fade" id="c7abbd56-a2ac-4bad-a834-96bcc7954dfe">
+     <div class="mt-5" id="bffacfb1-709f-4b52-98e7-5c9e37d2b631">
+      <div class="d-flex justify-content-between" id="b56f09e4-2d12-403b-8fc0-bcd4bd977610">
+       <h1 id="d43b741f-f6d3-482b-b955-759213b9e530">
         Class
-        <span class="text-primary" id="b3599479-467e-4b52-86f7-0f554abd6999">
+        <span class="text-primary" id="564d8dc9-7c96-43b1-971c-5ac81182bf4c">
          Link
         </span>
        </h1>
-       <div id="8228c918-fe4c-4adf-b85a-58fb03df9500">
-        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#08d99931-7fa0-4d0a-8c2e-e9a761a08966" data-bs-toggle="collapse" id="9bb33bac-a3b0-483c-861b-73775c1bdd26" onclick="return false;" type="button">
+       <div id="17e4f1a4-1b94-4659-a5c8-2012e6775682">
+        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#44836708-9eeb-4db8-a152-c0b1c1033f67" data-bs-toggle="collapse" id="56a2980c-86ef-48e7-a89b-dd89111d7ca6" onclick="return false;" type="button">
          Argument
         </button>
        </div>
       </div>
-      <span class="text-muted" id="eca81138-69fd-457a-b7e0-60eced69c082">
+      <span class="text-muted" id="bfe463d9-6afe-4611-922a-c1b53848b581">
        A web component for an external resource link.
       </span>
-      <pre id="c837d42a-5e2a-4958-abf3-6324ba7ba8b1"><code class="language-python">Link(href, rel='stylesheet', ctype='text/css')</code></pre>
-      <div class="ms-3 collapse" id="08d99931-7fa0-4d0a-8c2e-e9a761a08966">
-       <h6 id="3878bbba-9a58-4d25-ae0a-c62c145dd9f8">
+      <pre id="99934190-b5d2-4d0b-aa9e-700e6b337898"><code class="language-python">Link(href, rel='stylesheet', ctype='text/css')</code></pre>
+      <div class="ms-3 collapse" id="44836708-9eeb-4db8-a152-c0b1c1033f67">
+       <h6 id="ee10649c-e0dc-417e-a712-bdf0ff0f6a17">
         Arguments
        </h6>
-       <table class="table table-sm bg-light" id="b9a987fb-ecdf-40b3-a5cb-5f438d9b62d0">
+       <table class="table table-sm bg-light" id="9e776e03-6c41-4623-85c8-3fabc6c053e8">
         <thead>
          <tr>
           <th scope="col">
@@ -5799,15 +5935,15 @@ Panel(
         </tbody>
        </table>
       </div>
-      <p id="83cf28d5-cc49-4919-b3b1-e5316c9476f4">
+      <p id="762990a9-c188-4c73-be8a-2d464a7e955e">
        See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link
     for more information.
       </p>
-      <div class="ms-3" id="6676f1ef-67bf-4f67-902c-103be430388a">
-       <h6 id="67dc4b92-4c81-4022-98bc-f1bdb9cf8a2a">
+      <div class="ms-3" id="8ffcfd1a-51b4-498e-a1c8-d0b4f09c4f8c">
+       <h6 id="db169241-e4c2-481b-9002-e9ac2133e61c">
         Example
        </h6>
-       <pre id="02aa8e06-e586-41ba-b11a-607f0e1b1a2c"><code class="language-python">from bootwrap import Page, Link
+       <pre id="1b1f7cf2-00e6-44c7-b7f9-a4644cffc5df"><code class="language-python">from bootwrap import Page, Link
 
 my_page = Page(
     ...
@@ -5820,50 +5956,50 @@ my_page = Page(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="b137127a-7e5a-4aaf-bbf7-7dfe1c566c18">
-     <div id="bdd0e574-b0c5-49ea-bad4-c78b39188bed">
+    <div class="tab-pane fade" id="6c1f08a1-4c11-4721-892b-c6be695451e6">
+     <div id="6cbbb805-6944-4f41-a3ae-1745b9589804">
       <hr/>
-      <ul class="nav" id="7dd02d11-f8cc-4956-af03-62cc6ef8022a" role="tablist">
+      <ul class="nav" id="049b82c9-8485-480e-b116-33e093fe122c" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#886df948-dedf-40ba-8482-8698dd33e290" data-bs-toggle="tab" href="#886df948-dedf-40ba-8482-8698dd33e290" id="ceea747c-2e26-42c7-80c2-53650c0c039a" role="tab">
-         <span class="text-secondary" id="b71340be-a2cd-4fa4-a614-708413383e93">
+        <a class="nav-link active" data-bs-target="#28a511a6-7012-4c40-99ee-f415adb2d0f0" data-bs-toggle="tab" href="#28a511a6-7012-4c40-99ee-f415adb2d0f0" id="d2650cf2-ab4a-4963-8711-1835fc0d7f39" role="tab">
+         <span class="text-secondary" id="2dd73777-0dfc-4ee1-89c3-3f939c79c493">
           List
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#c93432a7-03fc-4c6f-8e8a-22ea3275b906" data-bs-toggle="tab" href="#c93432a7-03fc-4c6f-8e8a-22ea3275b906" id="27fbd2c5-01ea-4a93-bde2-4f3c0238073f" role="tab">
-         <span class="text-secondary" id="f3183e2d-e254-4d49-a93d-78314b168415">
+        <a class="nav-link" data-bs-target="#323a1b98-982c-4ed7-b14b-b55a26a050de" data-bs-toggle="tab" href="#323a1b98-982c-4ed7-b14b-b55a26a050de" id="d6573c85-e1bb-4480-bf6f-2e5b4fba5f80" role="tab">
+         <span class="text-secondary" id="ff869d9d-f0f7-4ab3-be08-54d46dc34e27">
           List.Item
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="886df948-dedf-40ba-8482-8698dd33e290">
-        <div class="mt-5" id="032454d1-1b1c-4e7b-85c4-638328bbcd77">
-         <div class="d-flex justify-content-between" id="8e14cb29-597e-486b-b600-510ec9829022">
-          <h1 id="ad2a0f7c-8ba1-41e7-ad52-83cf6641d962">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="28a511a6-7012-4c40-99ee-f415adb2d0f0">
+        <div class="mt-5" id="57ffbba1-b65f-4433-a84c-e7f95a448c3a">
+         <div class="d-flex justify-content-between" id="f92016cf-5294-4b00-872d-8f5e9b795081">
+          <h1 id="1ba7299f-f6e8-44cd-bdbc-1b9580361da5">
            Class
-           <span class="text-primary" id="2d7cd0e4-d086-49e8-a512-5a58561fe203">
+           <span class="text-primary" id="66c8f60c-c263-47ad-864b-363f55e68361">
             List
            </span>
           </h1>
-          <div id="04e2b30a-233f-475c-a4df-a0d804808295">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#7bda6e0c-a1be-4aad-903e-97fcfb0981d0" data-bs-toggle="collapse" id="6651dd13-74de-4d9f-966b-ea2a1a2f2e25" onclick="return false;" type="button">
+          <div id="f2b7f7cc-ec93-4395-b34a-14941f2b1791">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#87936da2-2efd-40d1-aca5-76704c120205" data-bs-toggle="collapse" id="d4f91f93-9d7d-4778-aa3b-0c4493521988" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="90084e4e-7bd0-4e09-9c2a-ad3c746ccbcf">
+         <span class="text-muted" id="dc5d65e6-5378-4fea-a8ad-0cfa0f5029e5">
           A web component for a list of items.
          </span>
-         <pre id="07977c01-45ef-4129-97a5-0ff220032968"><code class="language-python">List(*items)</code></pre>
-         <div class="ms-3 collapse" id="7bda6e0c-a1be-4aad-903e-97fcfb0981d0">
-          <h6 id="43d05386-5a33-4589-8983-9747ceb3be4d">
+         <pre id="32d99af4-dce4-4e04-a195-47fff9125da8"><code class="language-python">List(*items)</code></pre>
+         <div class="ms-3 collapse" id="87936da2-2efd-40d1-aca5-76704c120205">
+          <h6 id="f02205e8-3dc4-4ca3-926d-6017c142c53c">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="323ead67-1f89-4d55-a928-4611f96e0650">
+          <table class="table table-sm bg-light" id="9ff591ed-efce-41ef-8e9e-2ba3f6ff9129">
            <thead>
             <tr>
              <th scope="col">
@@ -5904,11 +6040,11 @@ my_page = Page(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="0f80f8cc-3e23-4c45-9311-d381f003723a">
-          <h6 id="2f8c68ad-c906-4b1c-bc04-0b92c4f890df">
+         <div class="ms-3" id="40ba84fd-7ca9-4eb1-9037-74c44cc437ea">
+          <h6 id="814087a7-1148-4500-9e85-65bab2164d4b">
            Example
           </h6>
-          <pre id="b71f0a4d-9c2f-4f08-a3a3-13890956df2e"><code class="language-python">from bootwrap import Button, List, Image
+          <pre id="8ccfe8c2-dade-424d-88b5-9d69472184c7"><code class="language-python">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy").as_success(),
@@ -5941,17 +6077,17 @@ List(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="053f70b1-51d4-4184-ab68-e5fb744ac3b1">
-          <div class="list-group" id="e88187ae-cac8-4cd9-a8fd-e9c2bc7bbb0e">
-           <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="97b104f0-1b14-4c80-8de9-00619c94564c">
+         <div class="ms-3" id="50d32129-5b9f-4399-9104-0df4cc3448e7">
+          <div class="list-group" id="90b6f111-35ee-4c22-b6b5-e13351cf30f4">
+           <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="26210414-ad0d-4bfa-babd-183b43cec05a">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="9ff5d029-1b36-4b1b-b3d4-0c40c9d8cdbe" src="google-logo.png" width="32"/>
+             <img height="32" id="3b257c59-feaf-45ae-9435-3e0f5e9862ef" 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="7d43ebe4-304c-4a34-a536-df023fafe0cc">
+               <h5 id="8a188458-24c0-4445-b434-787ddc1e4413">
                 Google (NASDAQ: GOOGL)
                </h5>
-               <small id="5041f522-bcb2-4045-91cf-5a0462459940">
+               <small id="adc68baf-0b64-4870-a284-2fda90f1d74b">
                 12:04:58 12/01/2021
                </small>
               </div>
@@ -5959,16 +6095,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="ae8afe93-e425-472a-9eb5-bf6c1b37fbd9" onclick="return false;" style="cursor: pointer">
+               <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="dd4ff685-c045-486f-9b69-a8c43b8f901e" onclick="return false;" style="cursor: pointer">
                </i>
                <div class="dropdown-menu dropdown-menu-right">
-                <button class="dropdown-item btn btn-success" id="40fc8890-85c4-4db0-9ece-c6e9fc587660" onclick="return false;">
+                <button class="dropdown-item btn btn-success" id="a41892b9-e7a7-44f2-b0cb-872de39e754e" onclick="return false;">
                  Buy
                 </button>
-                <button class="dropdown-item btn" id="9e833c0e-9be4-4aeb-84eb-ac28731d5e84" onclick="return false;">
+                <button class="dropdown-item btn" id="b697772f-7ec9-404c-b460-5a29e5c1a073" onclick="return false;">
                  Sell
                 </button>
-                <button class="dropdown-item btn" id="dbd02b9b-2168-46f7-be67-fa97eb44fe2f" onclick="return false;">
+                <button class="dropdown-item btn" id="a538e056-645a-49d7-8007-5201a4cfccfb" onclick="return false;">
                  Transfer
                 </button>
                </div>
@@ -5976,15 +6112,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="a1d42c0b-9638-4b5d-926b-91108319a554">
+           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.linkedin.com" id="8639026b-29a4-4ee2-909f-9620d1e5e7b0">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="16ad0700-09e4-4378-9774-eaa50b32422e" src="linkedin-logo.png" width="32"/>
+             <img height="32" id="8ab6d7c2-11de-45b0-9053-61c702c3b43b" 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="0f43ffac-5350-48e6-bee9-ad9476f4a51e">
+               <h5 id="5cbb3bea-28f4-482c-9222-31d214fdc964">
                 LinkedIn (NASDAQ: LNKD)
                </h5>
-               <small id="94ab7377-850d-42c1-912f-b64f5f5cad0a">
+               <small id="9830d993-29a4-47dc-8a2e-1cc80331d0ad">
                 12:04:58 12/01/2021
                </small>
               </div>
@@ -5992,16 +6128,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="f209c9d7-cf1c-4fff-af84-b400fa4af218" onclick="return false;" style="cursor: pointer">
+               <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="4e6fff47-b231-412e-b7e4-177c8604af63" onclick="return false;" style="cursor: pointer">
                </i>
                <div class="dropdown-menu dropdown-menu-right">
-                <button class="dropdown-item btn btn-success" id="40fc8890-85c4-4db0-9ece-c6e9fc587660" onclick="return false;">
+                <button class="dropdown-item btn btn-success" id="a41892b9-e7a7-44f2-b0cb-872de39e754e" onclick="return false;">
                  Buy
                 </button>
-                <button class="dropdown-item btn" id="9e833c0e-9be4-4aeb-84eb-ac28731d5e84" onclick="return false;">
+                <button class="dropdown-item btn" id="b697772f-7ec9-404c-b460-5a29e5c1a073" onclick="return false;">
                  Sell
                 </button>
-                <button class="dropdown-item btn" id="dbd02b9b-2168-46f7-be67-fa97eb44fe2f" onclick="return false;">
+                <button class="dropdown-item btn" id="a538e056-645a-49d7-8007-5201a4cfccfb" onclick="return false;">
                  Transfer
                 </button>
                </div>
@@ -6009,15 +6145,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="f8a5bfff-af51-4f45-9dea-08a27f441db3">
+           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.amazon.com" id="aae67426-1466-459a-93a1-2965e3b0ec75">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="3dce7c5b-8d51-4164-9ffa-ace34d2feb49" src="amazon-logo.png" width="32"/>
+             <img height="32" id="fead7b5d-e1d8-4fbb-9e20-57868d2d746d" 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="7a829b67-382b-4380-b78d-583db1ad6b18">
+               <h5 id="71ba5d92-a0c6-4546-beba-c757db9d7512">
                 Amazon (NASDAQ: AMZN)
                </h5>
-               <small id="0756074f-9e12-4cb2-8d04-d737796e4caa">
+               <small id="ec0d5558-b591-4351-930f-af4947f22c38">
                 12:04:58 12/01/2021
                </small>
               </div>
@@ -6025,16 +6161,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="55201b5e-5a7b-4f26-a12c-9d79feabc522" onclick="return false;" style="cursor: pointer">
+               <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="522ce6a7-2fb2-4ffd-8168-2845c82d35d4" onclick="return false;" style="cursor: pointer">
                </i>
                <div class="dropdown-menu dropdown-menu-right">
-                <button class="dropdown-item btn btn-success" id="40fc8890-85c4-4db0-9ece-c6e9fc587660" onclick="return false;">
+                <button class="dropdown-item btn btn-success" id="a41892b9-e7a7-44f2-b0cb-872de39e754e" onclick="return false;">
                  Buy
                 </button>
-                <button class="dropdown-item btn" id="9e833c0e-9be4-4aeb-84eb-ac28731d5e84" onclick="return false;">
+                <button class="dropdown-item btn" id="b697772f-7ec9-404c-b460-5a29e5c1a073" onclick="return false;">
                  Sell
                 </button>
-                <button class="dropdown-item btn" id="dbd02b9b-2168-46f7-be67-fa97eb44fe2f" onclick="return false;">
+                <button class="dropdown-item btn" id="a538e056-645a-49d7-8007-5201a4cfccfb" onclick="return false;">
                  Transfer
                 </button>
                </div>
@@ -6046,30 +6182,30 @@ List(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="c93432a7-03fc-4c6f-8e8a-22ea3275b906">
-        <div class="mt-5" id="3277c621-3843-4797-adc9-4561ffcef4f4">
-         <div class="d-flex justify-content-between" id="af31f94d-145d-40d5-8bb7-7381fe41571c">
-          <h1 id="4926bb36-a9e9-4cef-987a-e424dc2364ed">
+       <div class="tab-pane fade" id="323a1b98-982c-4ed7-b14b-b55a26a050de">
+        <div class="mt-5" id="b110ee6b-6b89-4d33-b24f-e7a4e7b8aae4">
+         <div class="d-flex justify-content-between" id="ef34100e-df96-4af8-848f-ca16abb6d864">
+          <h1 id="a59a4c7f-c21b-4edd-9d17-c7c8c81d3e67">
            Class
-           <span class="text-primary" id="47103ed4-c263-480f-8ca7-8687813ddf5c">
+           <span class="text-primary" id="c71c428d-0cf5-4e9a-b24f-79b429fee6bf">
             List.Item
            </span>
           </h1>
-          <div id="72157628-8c5d-435c-9b12-759617c1f403">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#5b6f4ef4-0264-43ae-884b-fcbbe77eff34" data-bs-toggle="collapse" id="58546b2e-2985-45cb-8cd0-7e1ceeac5981" onclick="return false;" type="button">
+          <div id="4704ba07-48a8-40ce-94e1-5994b7e482ea">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#d3cb21a6-ac94-4d39-ac14-4ca5e74a1c88" data-bs-toggle="collapse" id="23411b58-34c5-4e3e-8fa0-81063e2d5fcc" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="12420dcc-e818-4dc6-ade6-9805764b4884">
+         <span class="text-muted" id="c43ba0a1-c30b-49a5-9e82-845394e56b48">
           A list item.
          </span>
-         <pre id="06c44275-df5c-4142-9ef1-b1985201a04d"><code class="language-python">List.Item(title, description=None, marker=None, figure=None)</code></pre>
-         <div class="ms-3 collapse" id="5b6f4ef4-0264-43ae-884b-fcbbe77eff34">
-          <h6 id="c231e427-40ee-4100-bb14-bb616f2f8c9f">
+         <pre id="9fa01ee1-3ac2-4df5-b1f9-eec5b8b9dee0"><code class="language-python">List.Item(title, description=None, marker=None, figure=None)</code></pre>
+         <div class="ms-3 collapse" id="d3cb21a6-ac94-4d39-ac14-4ca5e74a1c88">
+          <h6 id="d1abeb03-0be7-4366-9fb9-8415dcc91156">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="b2fa677e-5888-48dc-a222-e404f68a21c5">
+          <table class="table table-sm bg-light" id="db78fd1c-cea0-4851-9102-331fb98550ef">
            <thead>
             <tr>
              <th scope="col">
@@ -6147,11 +6283,11 @@ List(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="4bf0e840-fbbc-43fa-803d-f81c51eeff60">
-          <h6 id="d1cd57d9-4359-446e-a370-f4163e5577b0">
+         <div class="ms-3" id="35a9c8e2-e2a1-4ad8-ab5f-a0173b778025">
+          <h6 id="ad8ebd40-ffd7-4d4c-afa8-7ad7ceb90b7e">
            Example
           </h6>
-          <pre id="662b1107-0707-4e9d-a6e5-9418faeee12c"><code class="language-python">from bootwrap import Button, List, Image
+          <pre id="59989160-429b-49c4-aaa8-1d8223173618"><code class="language-python">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy"),
@@ -6169,30 +6305,30 @@ List(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="f139719f-e572-4420-bb36-47f71ed57352">
-          <div class="list-group" id="c5938cb1-5ba7-45e3-9ade-682c8aec594d">
-           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="b21cca93-dd7a-4022-8c55-9c6ed42c4d00">
+         <div class="ms-3" id="97051d3a-e59c-40ca-bf1f-83ce53bb57b8">
+          <div class="list-group" id="404a41e3-c274-4ade-a9fa-bdc0baa24626">
+           <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="ff4336c1-5d2d-42b9-ac8f-273bbcc26923">
             <div class="d-flex w-100 justify-content-between">
-             <img height="32" id="f44a94c1-cf8c-4441-afb0-c2334b5c12a2" src="google-logo.png" width="32"/>
+             <img height="32" id="3a5b5edb-601a-4275-affd-932a875a1d03" 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="4302a81c-2126-4f0f-b110-40632cf23d10">
+               <h5 id="a07c3772-11f6-49df-9664-827222c711ab">
                 Google (NASDAQ: GOOGL)
                </h5>
-               <small id="7875b6c8-8140-43bb-a819-0e4604c92819">
+               <small id="15650561-4ac6-4f3b-b5b5-d08d6835f866">
                 12:04:58 12/01/2021
                </small>
               </div>
               Price for a single Google share
              </div>
              <div class="d-flex align-items-start">
-              <button class="ms-1 btn" id="ecdd3005-187f-476e-8638-e644c14a4db0" onclick="return false;">
+              <button class="ms-1 btn" id="8c69ee07-d8ac-466d-a534-a627d1639805" onclick="return false;">
                Buy
               </button>
-              <button class="ms-1 btn" id="b09c0316-090d-47cd-ba06-6b31e83aee65" onclick="return false;">
+              <button class="ms-1 btn" id="b0332dca-c006-4ff6-85f9-e3628301bc9e" onclick="return false;">
                Sell
               </button>
-              <button class="ms-1 btn" id="f99d3acb-c84d-43f8-9841-aed682e1d0d9" onclick="return false;">
+              <button class="ms-1 btn" id="794915c3-205d-42cc-9d40-9a18e22eed9c" onclick="return false;">
                Transfer
               </button>
              </div>
@@ -6200,26 +6336,26 @@ List(
            </a>
           </div>
          </div>
-         <div class="mt-5" id="2cf24292-b673-4b4e-8255-95411a439996">
-          <div class="d-flex justify-content-between" id="3d440944-3dbf-4cd9-ab41-4030882f32d4">
-           <h4 id="8233865e-a5ec-4ff8-bb6d-e337bb98db37">
+         <div class="mt-5" id="ac85df29-0905-4a87-8db2-c01090b38f2c">
+          <div class="d-flex justify-content-between" id="22a60672-55ac-47d9-a53a-697a42f9fb27">
+           <h4 id="5fa66e23-5789-47ec-9cec-4e3254c2a9d5">
             Method
-            <span class="text-primary" id="9a2f7f71-6a6b-4a17-88db-a1c14b56f21d">
+            <span class="text-primary" id="3056452d-a5f8-4963-b0ff-3f83a98bba36">
              as_selected
             </span>
            </h4>
-           <div id="f54e22e5-40a2-464a-9759-504b36af4aea">
+           <div id="1b092ef3-41fc-4ced-ab52-b0b12bb0480e">
            </div>
           </div>
-          <span class="text-muted" id="e9b38c19-8c89-431f-aa71-8061fafbcbbe">
+          <span class="text-muted" id="a9107daf-438e-4a98-888f-25449a6b86b7">
            Makes a list item selected.
           </span>
-          <pre id="0fb881d2-5936-4559-8d7c-dcde1eca2999"><code class="language-python">as_selected()</code></pre>
-          <div class="ms-3" id="fed52e47-b676-4173-a5b4-b0c357c1159b">
-           <h6 id="1d3619e2-7aca-485e-8951-1e951a44b89b">
+          <pre id="8ce9722c-2d3e-4e93-b298-ef30607b628e"><code class="language-python">as_selected()</code></pre>
+          <div class="ms-3" id="70433f66-64d4-4bdf-8b07-2c90255e7650">
+           <h6 id="1d54291d-11db-4d6d-bc80-91aaf24e7270">
             Example
            </h6>
-           <pre id="de176351-264c-412b-8ac3-909f316bbe47"><code class="language-python">from bootwrap import Button, List, Image
+           <pre id="2f4a99fe-6915-456a-9d82-f739dbc76e63"><code class="language-python">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy"),
@@ -6238,30 +6374,30 @@ List(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="9ea92c9d-065e-43a3-bfc9-215bb40f3211">
-           <div class="list-group" id="ccf74bb1-8375-4024-9004-44dbe1d27f6c">
-            <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="3c44fa07-310a-428a-92ae-54d6dd385bee">
+          <div class="ms-3" id="de1d4dae-c714-436d-95d3-27c6fb03c923">
+           <div class="list-group" id="a4d3f9d6-b369-41d3-a657-69b0b0ab4ea3">
+            <a class="list-group-item list-group-item-action flex-column align-items-start active" href="https://www.google.com" id="c70696c7-ce16-41e3-b9d4-b68dbbbf1a90">
              <div class="d-flex w-100 justify-content-between">
-              <img height="32" id="c13d4f27-5177-4ecb-b1d8-a90afea94502" src="google-logo.png" width="32"/>
+              <img height="32" id="4d27792b-f681-4681-b457-d8c1135d690e" 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="c8474bb9-6e3e-438c-a65c-41d2ee7f0146">
+                <h5 id="0928ec83-c29e-4995-aa42-97dcd0c82fee">
                  Google (NASDAQ: GOOGL)
                 </h5>
-                <small id="d3bc1116-2661-40c5-a06a-d4eeb88265c2">
+                <small id="f6f91a2a-c8b1-4956-a3fc-c030c56fae2e">
                  12:04:58 12/01/2021
                 </small>
                </div>
                Price for a single Google share
               </div>
               <div class="d-flex align-items-start">
-               <button class="ms-1 btn" id="b009386b-f75d-4193-b72e-ca96dba6228f" onclick="return false;">
+               <button class="ms-1 btn" id="cef01499-13b1-4952-aa6c-c9747e1a205c" onclick="return false;">
                 Buy
                </button>
-               <button class="ms-1 btn" id="c1bb9934-548c-421a-ac8c-b94da2ccfa8a" onclick="return false;">
+               <button class="ms-1 btn" id="336d81dd-5868-4097-be2f-fbbbd4e4b07e" onclick="return false;">
                 Sell
                </button>
-               <button class="ms-1 btn" id="888f00e3-dc73-4a8c-a38a-2d1bffd8adc9" onclick="return false;">
+               <button class="ms-1 btn" id="80455359-2374-46f4-b7c2-7052bece2e94" onclick="return false;">
                 Transfer
                </button>
               </div>
@@ -6270,26 +6406,26 @@ List(
            </div>
           </div>
          </div>
-         <div class="mt-5" id="30d11cf4-8fbf-4730-a0f1-e854b652340f">
-          <div class="d-flex justify-content-between" id="93ba8184-f69b-46f8-b127-3d2a22c77795">
-           <h4 id="4c2185b4-f19b-48f2-b64c-31a3925c5a06">
+         <div class="mt-5" id="122d95a7-c130-4d32-b612-8129302fc0d5">
+          <div class="d-flex justify-content-between" id="f598de76-b06d-42c8-8579-e6189cd4731a">
+           <h4 id="38158b53-6135-47f4-9842-a7e5449241ad">
             Method
-            <span class="text-primary" id="7247629d-1adb-45fe-bdfe-c2f0198b6f68">
+            <span class="text-primary" id="6b3091d7-45db-4e6c-8ff9-140a3eee10e3">
              pack_actions
             </span>
            </h4>
-           <div id="68309b40-7e6b-4bd3-834d-2241320c2230">
+           <div id="cb837bb1-3af5-4231-8d52-454bdba687ad">
            </div>
           </div>
-          <span class="text-muted" id="f4122521-bff5-40fc-bc0c-91e6abcf790c">
+          <span class="text-muted" id="4badf541-58c1-45dd-9358-5b51af84f92b">
            Makes item actions packed under a drop-down menu.
           </span>
-          <pre id="8ecf7374-0c18-436c-911d-15328009540f"><code class="language-python">pack_actions()</code></pre>
-          <div class="ms-3" id="269e2901-20ca-40c7-b503-7c2bb16b6400">
-           <h6 id="e3e18a76-7afd-47fb-98a9-9f8f732be8ed">
+          <pre id="9541fc62-5991-4ea4-b637-935e8fb44583"><code class="language-python">pack_actions()</code></pre>
+          <div class="ms-3" id="fa5a9024-899a-4cd8-998f-924ce2bc33e5">
+           <h6 id="817a7122-fa27-4ad4-83ef-8f2ecddd7548">
             Example
            </h6>
-           <pre id="8a53eae8-55d6-4161-9447-be3afb0617e0"><code class="language-python">from bootwrap import Button, List, Image
+           <pre id="a26ab153-42fe-43be-ba83-3dfd0b13856f"><code class="language-python">from bootwrap import Button, List, Image
 
 actions = [
     Button("Buy"),
@@ -6308,17 +6444,17 @@ List(
 )
 </code></pre>
           </div>
-          <div class="ms-3" id="b7f7d5ad-6e76-49ec-983b-8ad3cb4f54a6">
-           <div class="list-group" id="438cc9aa-709a-48b1-a10b-8eaa80aa245c">
-            <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="e1407e90-a4c5-4fa5-bd71-e080a83efc9f">
+          <div class="ms-3" id="e1b95e74-1a7c-49de-887b-a191dc7699ab">
+           <div class="list-group" id="88dfdd9e-e0f2-4861-9a57-d30ae146e235">
+            <a class="list-group-item list-group-item-action flex-column align-items-start" href="https://www.google.com" id="03ffa891-0eba-476f-a46c-bdbacb8c7582">
              <div class="d-flex w-100 justify-content-between">
-              <img height="32" id="bdd7a07e-2a6f-4ef3-8d22-bea718877411" src="google-logo.png" width="32"/>
+              <img height="32" id="589aaa0d-9ab6-41d1-92bf-191c14f6775b" 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="6cc6c63b-8ef4-443a-a933-4f1148e74c72">
+                <h5 id="7c417337-b5e5-4485-bbe6-95aac574e29c">
                  Google (NASDAQ: GOOGL)
                 </h5>
-                <small id="38b5c0ea-2053-4222-8a72-303eee7f5a1b">
+                <small id="b4b2d3fd-8a53-4c0b-86d8-3034a7a072f5">
                  12:04:58 12/01/2021
                 </small>
                </div>
@@ -6326,16 +6462,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="131883e6-0d12-4ec8-aaa6-0cf224e27732" onclick="return false;" style="cursor: pointer">
+                <i class="btn fas fa-ellipsis-v" data-bs-toggle="dropdown" id="c09bcf3e-1539-4357-b5a8-63eb84e9f6dd" onclick="return false;" style="cursor: pointer">
                 </i>
                 <div class="dropdown-menu dropdown-menu-right">
-                 <button class="dropdown-item btn" id="24d7513a-a494-41f9-94a6-9b268a70f449" onclick="return false;">
+                 <button class="dropdown-item btn" id="9d181020-8466-4a43-be35-15a0c4932b5b" onclick="return false;">
                   Buy
                  </button>
-                 <button class="dropdown-item btn" id="27b986cc-3b8e-428f-8f79-52c2bb5c68fa" onclick="return false;">
+                 <button class="dropdown-item btn" id="08dc88d0-96c3-4cf2-a3ee-4c42d3db66d8" onclick="return false;">
                   Sell
                  </button>
-                 <button class="dropdown-item btn" id="c8ab2d81-37ba-42af-a35b-ef275b02fdb2" onclick="return false;">
+                 <button class="dropdown-item btn" id="d37c439a-3464-4d29-9b29-48a38193ddfc" onclick="return false;">
                   Transfer
                  </button>
                 </div>
@@ -6351,50 +6487,50 @@ List(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="03400682-e2dd-4428-b712-1d694f6aa40d">
-     <div id="122dc699-71eb-4d02-8698-c6231852b78f">
+    <div class="tab-pane fade" id="88f47bd6-b9c0-4bef-8d1f-0024cd8c04a8">
+     <div id="add8d94e-ec6d-4fec-b19a-cd33b20611b2">
       <hr/>
-      <ul class="nav" id="a08be707-6f86-4ff5-87d4-28b4a97c9ea9" role="tablist">
+      <ul class="nav" id="a1fe55fe-4008-40a9-9f55-3e9e27736bd5" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#020dabb6-6325-42b0-b5c2-4ee5d3808145" data-bs-toggle="tab" href="#020dabb6-6325-42b0-b5c2-4ee5d3808145" id="93849a1a-dc71-42e7-91a8-00c83ce83f9f" role="tab">
-         <span class="text-secondary" id="b1ef100e-a66f-4aee-a18f-1e4c0c1488eb">
+        <a class="nav-link active" data-bs-target="#abf0511b-35c7-40ea-8e6e-800f0b35843b" data-bs-toggle="tab" href="#abf0511b-35c7-40ea-8e6e-800f0b35843b" id="6222c948-bd84-4842-acd1-04a11cc2a7f2" role="tab">
+         <span class="text-secondary" id="26e1b2aa-2c8c-47a8-83a4-a8fe1ffc7ac2">
           Navigation
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#60c651d7-a040-4f8b-8735-b0d16b79e1af" data-bs-toggle="tab" href="#60c651d7-a040-4f8b-8735-b0d16b79e1af" id="091bdfca-7a8f-40e4-8fd4-2933ce389056" role="tab">
-         <span class="text-secondary" id="571ce591-9ad0-4241-a770-35c3d873de93">
+        <a class="nav-link" data-bs-target="#fd61be08-8235-44d5-acd0-ee6a3e615497" data-bs-toggle="tab" href="#fd61be08-8235-44d5-acd0-ee6a3e615497" id="fee3b3f6-01b6-463a-826b-f3bfffa43d73" role="tab">
+         <span class="text-secondary" id="21024053-1cf9-4ff4-9fdd-415c13a77396">
           Navigation.Item
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="020dabb6-6325-42b0-b5c2-4ee5d3808145">
-        <div class="mt-5" id="eb88c6c4-a8fc-4cd2-8558-21819f2246a4">
-         <div class="d-flex justify-content-between" id="672d6dfb-a990-4322-84d5-828ff28ee3a5">
-          <h1 id="51721bf3-fd9e-4ea8-b32a-8a03fc9617b3">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="abf0511b-35c7-40ea-8e6e-800f0b35843b">
+        <div class="mt-5" id="8709140e-0724-49dd-b0e0-07a7b394c5a1">
+         <div class="d-flex justify-content-between" id="a682527e-bc3d-422e-b462-ca616c04537c">
+          <h1 id="bc32f1e6-d334-4924-918e-8a8a34eb72a6">
            Class
-           <span class="text-primary" id="566b35eb-7edc-4e4f-90d8-1238f7ca12f1">
+           <span class="text-primary" id="448ceed0-25c8-4f8d-bf25-85f1bb481f0c">
             Navigation
            </span>
           </h1>
-          <div id="ffb6952f-053a-4319-bd06-fb4193579609">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#1891f2dc-e9e1-4ef7-b22a-8969ac1faa78" data-bs-toggle="collapse" id="3078f5c6-c5c9-49ac-8c7d-760440eedc42" onclick="return false;" type="button">
+          <div id="a19e81cf-c027-44c0-b22b-cafa7309df9f">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#45973386-0b05-4fc5-99e8-009887f9058f" data-bs-toggle="collapse" id="271bf396-0f93-4bbe-8268-01a85bcff949" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="ff9a3fa6-c866-4c99-b45d-362f1f2e6524">
+         <span class="text-muted" id="f3e2187c-2f1a-479a-aa47-342e0258447a">
           A web component for navigation.
          </span>
-         <pre id="5275da82-4acb-41ad-9e69-da9a5362cc74"><code class="language-python">Navigation(*items)</code></pre>
-         <div class="ms-3 collapse" id="1891f2dc-e9e1-4ef7-b22a-8969ac1faa78">
-          <h6 id="0a7e1112-6fec-4ee5-88c2-23d5c44152cd">
+         <pre id="2ef47c97-f1d1-4d1e-8b13-f42930c63b95"><code class="language-python">Navigation(*items)</code></pre>
+         <div class="ms-3 collapse" id="45973386-0b05-4fc5-99e8-009887f9058f">
+          <h6 id="a51b8108-9c04-4f3f-9ead-4b1885957dfc">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="98db10e5-3912-423e-8d82-ebc05df06fd0">
+          <table class="table table-sm bg-light" id="b59a7e29-3dbe-466f-892f-5836b6d8aad3">
            <thead>
             <tr>
              <th scope="col">
@@ -6431,11 +6567,11 @@ List(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="3e76c6d6-4353-40be-a8bf-cb2bd77fbb62">
-          <h6 id="a1854f3b-58fe-497e-9403-390e7faf94ec">
+         <div class="ms-3" id="8ba9edf4-88c2-47e0-921d-078df2e8f0ed">
+          <h6 id="af2d6ef9-e2cc-4405-a8be-7ac6f4b5401b">
            Example
           </h6>
-          <pre id="cc6a9716-8293-43ee-92a6-77c00c15a020"><code class="language-python">from bootwrap import Navigation
+          <pre id="57b943bb-dfc9-4839-b3ca-30cc78f4bf2c"><code class="language-python">from bootwrap import Navigation
 
 Navigation(
     Navigation.Item('Chapter 1', 'Text 1', True),
@@ -6444,59 +6580,59 @@ Navigation(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="83b1f4da-d78f-4059-83bb-168a8bd538a8">
-          <ul class="nav" id="c1a3e7f5-d037-4f71-ba73-ed4b23d774d0" role="tablist">
+         <div class="ms-3" id="e9ad06d3-7245-43f5-a0ba-e9319e1c3fb5">
+          <ul class="nav" id="06b32057-bc1e-4611-a2ef-be308ad16301" role="tablist">
            <li class="nav-item">
-            <a class="nav-link active" data-bs-target="#63a06341-d4ff-4691-b0c8-d5482a3ed6ff" data-bs-toggle="tab" href="#63a06341-d4ff-4691-b0c8-d5482a3ed6ff" id="509fb2e1-60cb-40aa-94ff-52a8b0c42fb2" role="tab">
+            <a class="nav-link active" data-bs-target="#31f2591a-ba3e-458f-a58f-95c62a3fae3c" data-bs-toggle="tab" href="#31f2591a-ba3e-458f-a58f-95c62a3fae3c" id="a4d33ad3-c29c-4a88-b7fc-b3531c44118d" role="tab">
              Chapter 1
             </a>
            </li>
            <li class="nav-item">
-            <a class="nav-link" data-bs-target="#490c5e4d-21fa-46f1-9764-a43fec44ada3" data-bs-toggle="tab" href="#490c5e4d-21fa-46f1-9764-a43fec44ada3" id="20c39b52-fbaf-4148-85f2-c238c2d6e282" role="tab">
+            <a class="nav-link" data-bs-target="#e874d5da-468d-458a-bf79-6793b36cfec4" data-bs-toggle="tab" href="#e874d5da-468d-458a-bf79-6793b36cfec4" id="617311b1-3b11-4e1a-bee7-754a3c224c65" role="tab">
              Chapter 2
             </a>
            </li>
            <li class="nav-item">
-            <a class="nav-link" data-bs-target="#6dc786df-63f5-48c5-bae4-3f9bb8faf625" data-bs-toggle="tab" href="#6dc786df-63f5-48c5-bae4-3f9bb8faf625" id="906dc535-8cd2-407f-a766-e6faf06c8c92" role="tab">
+            <a class="nav-link" data-bs-target="#128aa2dc-ba63-49c8-99cc-a01d1de38f05" data-bs-toggle="tab" href="#128aa2dc-ba63-49c8-99cc-a01d1de38f05" id="0a31fb2c-cb13-4c33-abb7-953d7e5a4df4" role="tab">
              Chapter 3
             </a>
            </li>
           </ul>
-          <div class="tab-content">
-           <div class="tab-pane fade active show" id="63a06341-d4ff-4691-b0c8-d5482a3ed6ff">
+          <div class="tab-content w-100">
+           <div class="tab-pane fade active show" id="31f2591a-ba3e-458f-a58f-95c62a3fae3c">
             Text 1
            </div>
-           <div class="tab-pane fade" id="490c5e4d-21fa-46f1-9764-a43fec44ada3">
+           <div class="tab-pane fade" id="e874d5da-468d-458a-bf79-6793b36cfec4">
             Text 2
            </div>
-           <div class="tab-pane fade" id="6dc786df-63f5-48c5-bae4-3f9bb8faf625">
+           <div class="tab-pane fade" id="128aa2dc-ba63-49c8-99cc-a01d1de38f05">
             Text 3
            </div>
           </div>
          </div>
-         <div class="mt-5" id="c8ada250-937e-4940-ab3b-c6f21d5dd8d6">
-          <div class="d-flex justify-content-between" id="f9e1ca4e-09d5-4a05-a48a-8989cb9a46ae">
-           <h4 id="4dd44242-69fc-442e-b892-c517c262c18a">
+         <div class="mt-5" id="cc622a69-1b3b-492c-8b62-a0578f032eed">
+          <div class="d-flex justify-content-between" id="eaf797a4-bbf4-4764-80c6-ffab4a635de8">
+           <h4 id="b162b8dc-a73d-49ab-b0da-11dbe6184b0b">
             Method
-            <span class="text-primary" id="49f167c6-e90a-45bc-baa4-946cd340601c">
+            <span class="text-primary" id="c8cecd95-0a99-4839-99e5-adee530cb372">
              as_pills
             </span>
            </h4>
-           <div id="4364e1d4-8ee6-479c-bb5c-8269585ce271">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#a0511c64-a2cc-4b19-aae5-499db60176db" data-bs-toggle="collapse" id="a3a7f23a-95fb-48db-92b9-81b6387f995b" onclick="return false;" type="button">
+           <div id="ce912978-65a8-47f6-83c0-69a7f29189de">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#fe6cde34-a738-4459-9cb4-7321a20eef94" data-bs-toggle="collapse" id="65bdaad4-47b0-4587-9c0f-d40304b8d3e2" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="7bbf2f4a-fe61-4f9d-9ddd-b9bf3000d16e">
+          <span class="text-muted" id="51d457af-225c-4ebf-9843-e986e3b8b07a">
            Makes the navigation controls looks like buttons.
           </span>
-          <pre id="76c7b247-7f5c-46f8-a49b-2502cb33d7ad"><code class="language-python">as_pills()</code></pre>
-          <div class="ms-3 collapse" id="a0511c64-a2cc-4b19-aae5-499db60176db">
-           <h6 id="32b006e3-33d0-4f13-9833-d531cace5617">
+          <pre id="75e33bf7-f05e-4f31-9323-252328d557a3"><code class="language-python">as_pills()</code></pre>
+          <div class="ms-3 collapse" id="fe6cde34-a738-4459-9cb4-7321a20eef94">
+           <h6 id="fdab7d10-c9b3-4dda-a479-a75a217593e2">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="59c9aae0-05cf-4ed6-a8ed-b24ba5ada031">
+           <table class="table table-sm bg-light" id="66c19fa9-70e2-458f-841c-6918243a6cd9">
             <thead>
              <tr>
               <th scope="col">
@@ -6529,11 +6665,11 @@ Navigation(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="32603136-57d3-489e-bffd-8ec0a627dbf4">
-           <h6 id="164ec285-7654-4962-a109-d712428039a2">
+          <div class="ms-3" id="b3a0df1c-b652-446f-b007-ca970c023552">
+           <h6 id="e1c37eeb-db49-4c3a-a9b3-d342f68722a9">
             Example
            </h6>
-           <pre id="61417c5f-b622-4c10-a819-64c9ff7bfe83"><code class="language-python">from bootwrap import Navigation
+           <pre id="d31d8bbc-30f0-49cb-b64c-10ee0fd79213"><code class="language-python">from bootwrap import Navigation
 
 Navigation(
     Navigation.Item('Chapter 1', 'Text 1', True),
@@ -6542,60 +6678,60 @@ Navigation(
 ).as_pills()
 </code></pre>
           </div>
-          <div class="ms-3" id="cad991f6-286f-446b-8a70-434b41ed2a2c">
-           <ul class="nav nav-pills" id="2341e306-be1e-432f-865b-4c4e5603b971" role="tablist">
+          <div class="ms-3" id="70dc636c-83e8-42ee-b888-cc5b48ed0f24">
+           <ul class="nav nav-pills" id="1804b614-ec9b-43b2-bdde-fbf37a3d2dd2" role="tablist">
             <li class="nav-item">
-             <a class="nav-link active" data-bs-target="#8eaab1f2-d873-462f-8975-3a3a1120f671" data-bs-toggle="tab" href="#8eaab1f2-d873-462f-8975-3a3a1120f671" id="a3a4133a-eb16-427d-97bf-94c8ea57c020" role="tab">
+             <a class="nav-link active" data-bs-target="#18a1157f-1b23-4045-a580-15ef28e78287" data-bs-toggle="tab" href="#18a1157f-1b23-4045-a580-15ef28e78287" id="59e2a350-a475-47fc-a626-264215784e56" role="tab">
               Chapter 1
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-bs-target="#743fb29d-1ec9-497d-900b-2597159bb613" data-bs-toggle="tab" href="#743fb29d-1ec9-497d-900b-2597159bb613" id="e42ebe9a-cd53-4a70-aa04-2b5158e5ee1d" role="tab">
+             <a class="nav-link" data-bs-target="#12c614c0-5738-450c-bf6f-ef2901b43008" data-bs-toggle="tab" href="#12c614c0-5738-450c-bf6f-ef2901b43008" id="3dacef51-f8c8-4239-bea2-a8084172a990" role="tab">
               Chapter 2
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-bs-target="#021595d3-3037-4d22-8809-937c8937e062" data-bs-toggle="tab" href="#021595d3-3037-4d22-8809-937c8937e062" id="33da78c2-10ca-488d-a435-f4a5b3e4cc02" role="tab">
+             <a class="nav-link" data-bs-target="#f3632b6b-7d14-4bee-9523-e07402b29a96" data-bs-toggle="tab" href="#f3632b6b-7d14-4bee-9523-e07402b29a96" id="8e545aba-8f6b-49ba-aaed-42a0574fada8" role="tab">
               Chapter 3
              </a>
             </li>
            </ul>
-           <div class="tab-content">
-            <div class="tab-pane fade active show" id="8eaab1f2-d873-462f-8975-3a3a1120f671">
+           <div class="tab-content w-100">
+            <div class="tab-pane fade active show" id="18a1157f-1b23-4045-a580-15ef28e78287">
              Text 1
             </div>
-            <div class="tab-pane fade" id="743fb29d-1ec9-497d-900b-2597159bb613">
+            <div class="tab-pane fade" id="12c614c0-5738-450c-bf6f-ef2901b43008">
              Text 2
             </div>
-            <div class="tab-pane fade" id="021595d3-3037-4d22-8809-937c8937e062">
+            <div class="tab-pane fade" id="f3632b6b-7d14-4bee-9523-e07402b29a96">
              Text 3
             </div>
            </div>
           </div>
          </div>
-         <div class="mt-5" id="0a6b17f2-b818-4aeb-a310-8c7f46042604">
-          <div class="d-flex justify-content-between" id="2535aac3-d49b-4f00-93ea-20b086318e62">
-           <h4 id="eff095bc-5802-4c08-afc1-a7579b457002">
+         <div class="mt-5" id="454572d9-1eef-458f-8e67-226fc5f830d2">
+          <div class="d-flex justify-content-between" id="c7aeef72-0419-4c27-ad68-0dd327c8107c">
+           <h4 id="810063e4-d75b-47ed-a17d-ac1fc7a69880">
             Method
-            <span class="text-primary" id="2c7b08c6-7938-4ded-8b43-5a9a7385b63e">
+            <span class="text-primary" id="82aceae7-37c2-4c8c-9439-4a2b9f6ff6c2">
              as_tabs
             </span>
            </h4>
-           <div id="8e3617b0-f78c-4695-bfea-61336e58f35f">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#62018d9f-526f-4026-ad6f-adf855c44403" data-bs-toggle="collapse" id="c27b54e6-f8b3-4add-a44c-602d7a0c02a0" onclick="return false;" type="button">
+           <div id="1ed12064-a4ba-4300-9972-89e0a4b11d6a">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#c2c0ae86-9573-4be6-9204-3907728ba3b9" data-bs-toggle="collapse" id="146a22fe-6e0e-4373-9864-ea7906d2ce93" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="39917e3f-8c06-4437-8c86-3488c09aa8ed">
+          <span class="text-muted" id="7b240bec-629b-4d00-9846-565f0bba96b2">
            Makes the navigation controls looks like buttons.
           </span>
-          <pre id="68ee9b9e-c916-4bd1-9ebf-59432accc317"><code class="language-python">as_tabs()</code></pre>
-          <div class="ms-3 collapse" id="62018d9f-526f-4026-ad6f-adf855c44403">
-           <h6 id="c880d9c9-a935-42ae-85d0-58a1e7284b96">
+          <pre id="52532938-70d7-4e58-a079-f27ca1909f92"><code class="language-python">as_tabs()</code></pre>
+          <div class="ms-3 collapse" id="c2c0ae86-9573-4be6-9204-3907728ba3b9">
+           <h6 id="30c6c6fb-1d0b-48cc-97e8-fd3928ea3589">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="d08c1bed-3b73-4d91-bcba-8fbd4f2ad4b8">
+           <table class="table table-sm bg-light" id="a806f7b9-2ed3-4360-875e-f2deaf6cbda8">
             <thead>
              <tr>
               <th scope="col">
@@ -6628,11 +6764,11 @@ Navigation(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="11b15430-2ef0-4e57-89f9-150f6fa8ef5b">
-           <h6 id="dc2c52d6-cbbf-4576-81f0-ef90ccef0f75">
+          <div class="ms-3" id="abb20536-d342-48a0-b97d-c4ebb772de0d">
+           <h6 id="4b553bb5-ccba-4694-b94e-b64e2d17730a">
             Example
            </h6>
-           <pre id="787e37a9-b575-40b2-84f2-0ae8bf1d6055"><code class="language-python">from bootwrap import Navigation
+           <pre id="3dc2c437-20cf-4d71-9719-8cafbdfd9039"><code class="language-python">from bootwrap import Navigation
 
 Navigation(
     Navigation.Item('Chapter 1', 'Text 1', True),
@@ -6641,60 +6777,60 @@ Navigation(
 ).as_tabs()
 </code></pre>
           </div>
-          <div class="ms-3" id="252ffd6d-838e-4ee2-ab84-d785e4d87afd">
-           <ul class="nav nav-tabs" id="cf90c6d4-d4a1-4f60-8d62-3d6a9a9a649a" role="tablist">
+          <div class="ms-3" id="81496a84-c7a0-49ce-88ce-f984fb413293">
+           <ul class="nav nav-tabs" id="8483524e-75e6-455a-b0dc-e00e6bc245f2" role="tablist">
             <li class="nav-item">
-             <a class="nav-link active" data-bs-target="#0bf7d1b7-0f37-412c-ba97-ef6727ad0459" data-bs-toggle="tab" href="#0bf7d1b7-0f37-412c-ba97-ef6727ad0459" id="e8b13c65-8493-49bf-b906-e07f32ddb164" role="tab">
+             <a class="nav-link active" data-bs-target="#dd60e128-01c8-4a95-9670-e3c8643d32f9" data-bs-toggle="tab" href="#dd60e128-01c8-4a95-9670-e3c8643d32f9" id="7f3c7551-bfca-495b-9d74-850183e88a1e" role="tab">
               Chapter 1
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-bs-target="#9c9d73ed-95c8-4f53-870c-2cef5b667c56" data-bs-toggle="tab" href="#9c9d73ed-95c8-4f53-870c-2cef5b667c56" id="63f151f0-ba08-41fa-b824-db2098973a7a" role="tab">
+             <a class="nav-link" data-bs-target="#d2b80dee-9fd8-4f39-b486-0d19c18de42a" data-bs-toggle="tab" href="#d2b80dee-9fd8-4f39-b486-0d19c18de42a" id="dd9d584a-2882-4dad-bc7c-6fc1b965ab4a" role="tab">
               Chapter 2
              </a>
             </li>
             <li class="nav-item">
-             <a class="nav-link" data-bs-target="#28763b67-b5da-4b9a-b55d-3c7a12915c85" data-bs-toggle="tab" href="#28763b67-b5da-4b9a-b55d-3c7a12915c85" id="7680e7da-8c20-4961-bc34-33c07944a244" role="tab">
+             <a class="nav-link" data-bs-target="#6d127b9b-c7f6-4f82-aa22-60490fad58f6" data-bs-toggle="tab" href="#6d127b9b-c7f6-4f82-aa22-60490fad58f6" id="c8bf1ba9-79a8-4656-9761-73373e891dcd" role="tab">
               Chapter 3
              </a>
             </li>
            </ul>
-           <div class="tab-content">
-            <div class="tab-pane fade active show" id="0bf7d1b7-0f37-412c-ba97-ef6727ad0459">
+           <div class="tab-content w-100">
+            <div class="tab-pane fade active show" id="dd60e128-01c8-4a95-9670-e3c8643d32f9">
              Text 1
             </div>
-            <div class="tab-pane fade" id="9c9d73ed-95c8-4f53-870c-2cef5b667c56">
+            <div class="tab-pane fade" id="d2b80dee-9fd8-4f39-b486-0d19c18de42a">
              Text 2
             </div>
-            <div class="tab-pane fade" id="28763b67-b5da-4b9a-b55d-3c7a12915c85">
+            <div class="tab-pane fade" id="6d127b9b-c7f6-4f82-aa22-60490fad58f6">
              Text 3
             </div>
            </div>
           </div>
          </div>
-         <div class="mt-5" id="e7778b14-dd9a-441f-a845-dd32584f1674">
-          <div class="d-flex justify-content-between" id="22bbb770-19d5-4f8b-a8ab-f774abc19558">
-           <h4 id="de8fd0c1-b045-4a35-87cb-0f10f6adf1ac">
+         <div class="mt-5" id="caf6b3d3-97d4-4a38-b64a-7edbe4b07a64">
+          <div class="d-flex justify-content-between" id="e930a568-268c-4ece-93eb-1206199c1704">
+           <h4 id="b230087e-7c86-43cc-b7d6-c5615656ac41">
             Method
-            <span class="text-primary" id="0f5c0aa6-41e3-4c1e-b3a0-af2147bd2803">
+            <span class="text-primary" id="fa19a380-3c28-4a9e-90f6-9aa6e1055d4e">
              as_vertical
             </span>
            </h4>
-           <div id="7a4823e3-445e-4ba6-b47f-4db223be0348">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#64adca94-1ce1-4bbf-9ca0-271a8e7fd24c" data-bs-toggle="collapse" id="e8e6eb55-72c7-4e56-94e8-6ebe6d11923a" onclick="return false;" type="button">
+           <div id="d46858be-2f7b-4534-b8b7-261c1651b05e">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#435ea8e5-297e-450b-8c9c-b6c5ab40b89b" data-bs-toggle="collapse" id="cb4a3776-bfec-492e-b3e7-c1df82b48660" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="ca54ae13-8f78-4988-8874-e33bb9631034">
+          <span class="text-muted" id="6ed88fd0-1f6e-4093-a185-10390edae0cc">
            Makes the navigation vertical.
           </span>
-          <pre id="c4be0529-f0ab-4575-af19-519aab1a4f40"><code class="language-python">as_vertical()</code></pre>
-          <div class="ms-3 collapse" id="64adca94-1ce1-4bbf-9ca0-271a8e7fd24c">
-           <h6 id="bb7b4084-d284-4724-9866-8c647e0cb751">
+          <pre id="5d60c65c-0a18-4097-8bdb-7165a7272843"><code class="language-python">as_vertical()</code></pre>
+          <div class="ms-3 collapse" id="435ea8e5-297e-450b-8c9c-b6c5ab40b89b">
+           <h6 id="0f82a6f6-6bf3-42c1-bd8d-e1b82ce3857f">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="779b18bc-04f5-41e3-93f8-a25aec94bb41">
+           <table class="table table-sm bg-light" id="8241440f-5198-4a23-b342-ec390cae3fd2">
             <thead>
              <tr>
               <th scope="col">
@@ -6727,46 +6863,46 @@ Navigation(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="e5a87e2c-2c62-4e1f-ae2f-9ff29e0f4ab1">
-           <h6 id="a6dc2fad-c26f-473b-8a3e-638f48f7b2d4">
+          <div class="ms-3" id="0e4ee4f1-dcba-4f5f-80f7-3477c6473b4a">
+           <h6 id="7d4f0cba-7613-4636-8fe0-1c21c5fd6740">
             Example
            </h6>
-           <pre id="fb0fa872-da38-49ec-a8aa-8cfe3d561c96"><code class="language-python">from bootwrap import Navigation
+           <pre id="92e92dab-dbdf-4c93-b7f5-629d0a69dd1c"><code class="language-python">from bootwrap import Navigation
 
 Navigation(
-    Navigation.Item('Chapter 1', 'Text 1', True),
-    Navigation.Item('Chapter 2', 'Text 2'),
-    Navigation.Item('Chapter 3', 'Text 3')
-).as_vertical()
+    Navigation.Item('Chapter1', 'Text 1', True),
+    Navigation.Item('Chapter2', 'Text 2'),
+    Navigation.Item('Chapter3', 'Text 3')
+).as_vertical().as_pills()
 </code></pre>
           </div>
-          <div class="ms-3" id="1f0cff6b-796b-4ec6-9cb2-7404fa204aa9">
+          <div class="ms-3" id="d29877de-872d-412e-9f3c-beaf931df56f">
            <div class="d-flex">
-            <ul class="nav flex-column" id="1f777087-ccf9-4ce9-834d-fa3b7072ed7d" role="tablist">
+            <ul class="nav flex-column nav-pills" id="f39a0ba4-f114-4d78-9e42-d9b4be5d997c" role="tablist">
              <li class="nav-item">
-              <a class="nav-link active" data-bs-target="#09d7b4d1-5128-4b47-84fd-0ce17b9491b5" data-bs-toggle="tab" href="#09d7b4d1-5128-4b47-84fd-0ce17b9491b5" id="9f0e99c5-f6a5-462f-8b69-d200f0c8bea0" role="tab">
-               Chapter 1
+              <a class="nav-link active" data-bs-target="#f873b7d8-eff7-4799-b96a-999d9ca5535f" data-bs-toggle="tab" href="#f873b7d8-eff7-4799-b96a-999d9ca5535f" id="1a0aeeed-cc7d-436b-ab60-0e65bae58cab" role="tab">
+               Chapter1
               </a>
              </li>
              <li class="nav-item">
-              <a class="nav-link" data-bs-target="#5e7b0051-ad33-4e9f-b185-eb769d26e5d1" data-bs-toggle="tab" href="#5e7b0051-ad33-4e9f-b185-eb769d26e5d1" id="e1b01ea1-ff7d-430d-86aa-0eb5e72d4399" role="tab">
-               Chapter 2
+              <a class="nav-link" data-bs-target="#b984a405-f16c-45a7-bf4d-8beb60ba293e" data-bs-toggle="tab" href="#b984a405-f16c-45a7-bf4d-8beb60ba293e" id="e0bf7b84-b3a3-4a33-9dcc-d679bb002ddc" role="tab">
+               Chapter2
               </a>
              </li>
              <li class="nav-item">
-              <a class="nav-link" data-bs-target="#8e2ecd38-4b5f-4bbf-8a6a-5c0e16d209d7" data-bs-toggle="tab" href="#8e2ecd38-4b5f-4bbf-8a6a-5c0e16d209d7" id="fbd2e981-b300-4c14-9cf5-039b06c7ff09" role="tab">
-               Chapter 3
+              <a class="nav-link" data-bs-target="#9bc3dd7f-bc09-404e-90da-abd98b2e2609" data-bs-toggle="tab" href="#9bc3dd7f-bc09-404e-90da-abd98b2e2609" id="801e9246-a4d1-4d68-b2a3-a39d80f3ead2" role="tab">
+               Chapter3
               </a>
              </li>
             </ul>
-            <div class="tab-content">
-             <div class="tab-pane fade active show" id="09d7b4d1-5128-4b47-84fd-0ce17b9491b5">
+            <div class="tab-content w-100">
+             <div class="tab-pane fade active show" id="f873b7d8-eff7-4799-b96a-999d9ca5535f">
               Text 1
              </div>
-             <div class="tab-pane fade" id="5e7b0051-ad33-4e9f-b185-eb769d26e5d1">
+             <div class="tab-pane fade" id="b984a405-f16c-45a7-bf4d-8beb60ba293e">
               Text 2
              </div>
-             <div class="tab-pane fade" id="8e2ecd38-4b5f-4bbf-8a6a-5c0e16d209d7">
+             <div class="tab-pane fade" id="9bc3dd7f-bc09-404e-90da-abd98b2e2609">
               Text 3
              </div>
             </div>
@@ -6775,52 +6911,52 @@ Navigation(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="60c651d7-a040-4f8b-8735-b0d16b79e1af">
-        <div class="mt-5" id="3f40ad9d-c6c5-4e47-a37c-ff85bf7fd7cf">
-         <div class="d-flex justify-content-between" id="f72cf49e-edf1-42bf-be19-794665f8a154">
-          <h1 id="7cbb8adf-8453-4781-bf00-9aa16599c272">
+       <div class="tab-pane fade" id="fd61be08-8235-44d5-acd0-ee6a3e615497">
+        <div class="mt-5" id="4c466264-cae6-4fc2-8ff2-2dd9f6d9ecc1">
+         <div class="d-flex justify-content-between" id="d590af3d-2feb-48e1-ae5f-738bd60f4271">
+          <h1 id="d583cb8a-93af-4855-b79b-d573e33d9ea6">
            Class
-           <span class="text-primary" id="4893934b-8c7b-4492-b67f-820e50ad1b95">
+           <span class="text-primary" id="38326995-e41d-4373-9ccb-99fa49b19068">
             Navigation.Item
            </span>
           </h1>
-          <div id="bb342ef6-d5a6-4792-8224-dbce91d35050">
+          <div id="c05dc59d-44ef-466e-998d-e347f7414f5e">
           </div>
          </div>
-         <span class="text-muted" id="5dec96fe-1963-4405-bea5-a62d44125c5c">
+         <span class="text-muted" id="a38ad98f-57b1-4f26-a8bf-81a16bf30de9">
           None
          </span>
-         <pre id="f93e13ff-6299-42f8-84e4-35453c73f6cb"><code class="language-python">Navigation.Item(name, content, active=False)</code></pre>
-         <div class="mt-5" id="b34dad92-c1ba-472d-9b83-fdcf2d87937b">
-          <h4 id="7f6e1986-c3cc-4070-8902-0e72e5dec58d">
+         <pre id="7b2a4560-f26b-4b3b-b750-59a969d074f5"><code class="language-python">Navigation.Item(name, content, active=False)</code></pre>
+         <div class="mt-5" id="c394088a-ae1b-4f37-9431-f28964f6cc36">
+          <h4 id="997d0715-8e21-4adf-be0b-276d911fb62c">
            Property
-           <span class="text-primary" id="c4d3a138-6594-4ab5-b3c8-5d21ae7c9fd3">
+           <span class="text-primary" id="e1195e5d-81b9-46f6-8aa9-1e4323f0bbe8">
             active
            </span>
           </h4>
-          <span class="text-muted" id="f8459a48-a67e-49d3-9618-4c38a4e8501e">
+          <span class="text-muted" id="1a17fbf8-a97e-4c8e-8461-8b48278235ad">
            None
           </span>
          </div>
-         <div class="mt-5" id="42b74398-abba-41f9-a61b-e186a11a217e">
-          <h4 id="cda0e615-7cd8-4375-b1ca-e48756d109fd">
+         <div class="mt-5" id="a5f58d7f-1004-4588-b6e4-53772d9ea3b4">
+          <h4 id="a237b2e8-cc73-42e9-a70e-ab58e94452e9">
            Property
-           <span class="text-primary" id="cad2bb02-3b87-4d59-895e-4affb4724175">
+           <span class="text-primary" id="055ef38a-1d0f-4781-a3d4-3b06e237e142">
             content
            </span>
           </h4>
-          <span class="text-muted" id="9c3d2c34-37cc-4663-a0e7-a69f65279a19">
+          <span class="text-muted" id="5663292f-4f0e-4f05-8bf2-97428cba9b1b">
            None
           </span>
          </div>
-         <div class="mt-5" id="3b7f17f0-499b-4664-aafe-b64b41c922e6">
-          <h4 id="93a9bbfd-cc56-4817-8b22-3dc2aed3bf62">
+         <div class="mt-5" id="620b8bd2-ac51-4fcf-925b-df1d16eba2dc">
+          <h4 id="4d89055f-ff84-42e8-b47a-9798a2815e88">
            Property
-           <span class="text-primary" id="7f208224-a30d-4919-bdcb-234c3d7ae1de">
+           <span class="text-primary" id="e4cc2278-64b5-4fc9-9076-1ae82e8277ff">
             name
            </span>
           </h4>
-          <span class="text-muted" id="3d746cba-98fa-4ff6-9718-f5cdf873c5e8">
+          <span class="text-muted" id="31eb5b3f-b2e7-4422-997b-1e781b5e58cf">
            None
           </span>
          </div>
@@ -6829,57 +6965,57 @@ Navigation(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="486b0c01-2d84-4973-97a3-c08a62aaf89d">
-     <div id="4a4cbc72-498e-4681-b322-0b4d36f50a29">
+    <div class="tab-pane fade" id="850c7063-1719-4e74-b552-fb60bfc3d355">
+     <div id="0e17f4bd-c3f0-4805-82bd-d05dc1941caa">
       <hr/>
-      <ul class="nav" id="4b14959b-6527-421e-ba79-4c3f8a0e0bc0" role="tablist">
+      <ul class="nav" id="e4ec1981-7600-4470-b8c3-756f6252811f" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#a98cb224-ab3d-40e0-8e63-f9186f69f2c8" data-bs-toggle="tab" href="#a98cb224-ab3d-40e0-8e63-f9186f69f2c8" id="9865a96c-3d89-4ce1-9e7d-bc7072e5ce64" role="tab">
-         <span class="text-secondary" id="8309f29c-f5a9-4f8e-93f4-996cdc118c9d">
+        <a class="nav-link active" data-bs-target="#feec1a9d-850a-4512-b51b-8a26d787f8df" data-bs-toggle="tab" href="#feec1a9d-850a-4512-b51b-8a26d787f8df" id="9e33fda1-887e-4c1b-9d5c-41be6485d86b" role="tab">
+         <span class="text-secondary" id="98068c8f-0411-48fd-b750-eea0d3ff8233">
           Panel
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#037987d5-40dd-467f-b8bd-a252b750909b" data-bs-toggle="tab" href="#037987d5-40dd-467f-b8bd-a252b750909b" id="11fd3c6c-515d-4bbe-b8bf-f0b4dd878387" role="tab">
-         <span class="text-secondary" id="e3366c56-e32a-4983-9d11-02a17f7d2baf">
+        <a class="nav-link" data-bs-target="#9f6e90ca-3439-4fce-9464-cf91fc4dea5c" data-bs-toggle="tab" href="#9f6e90ca-3439-4fce-9464-cf91fc4dea5c" id="242a38a7-cc5a-45c2-ad25-1a5d7b87a943" role="tab">
+         <span class="text-secondary" id="8bb95727-2af8-4fbe-96cd-b52e82c07399">
           Appearance
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#4a0b1ce9-3068-4500-bd6e-7239541d1c17" data-bs-toggle="tab" href="#4a0b1ce9-3068-4500-bd6e-7239541d1c17" id="4cd75c76-5ca6-42d8-a5b0-95e8017d7dbb" role="tab">
-         <span class="text-secondary" id="692d61d2-228b-4928-9b1e-c2351a25399a">
+        <a class="nav-link" data-bs-target="#30a2e862-40f1-473d-aa29-0db3c0e8c2a7" data-bs-toggle="tab" href="#30a2e862-40f1-473d-aa29-0db3c0e8c2a7" id="cd491e54-9eea-439f-bd28-99b4286c03cd" role="tab">
+         <span class="text-secondary" id="bffe41de-84e2-4d13-8780-b6f744c6d1fa">
           Outline
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="a98cb224-ab3d-40e0-8e63-f9186f69f2c8">
-        <div class="mt-5" id="6fa3e7d6-955a-4801-b361-6cd7ccab6fce">
-         <div class="d-flex justify-content-between" id="bab186c4-ade2-4b6d-8719-ab24c3b28b44">
-          <h1 id="6a9f3e53-a804-47fb-9f3c-8e210c2ed028">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="feec1a9d-850a-4512-b51b-8a26d787f8df">
+        <div class="mt-5" id="b6be59ef-b711-482b-99f9-54a1b5939434">
+         <div class="d-flex justify-content-between" id="b4b7e02a-272c-43fc-a062-fdd7110c4517">
+          <h1 id="8df25172-f236-4fa9-a92f-a42e23e36e48">
            Class
-           <span class="text-primary" id="132c7b92-9987-4811-afea-9050b1160fdd">
+           <span class="text-primary" id="182381df-e489-4d42-a84c-6f2f0fae5215">
             Panel
            </span>
           </h1>
-          <div id="7afc0389-d0d8-467a-9503-69de08a58101">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#98e2c3d8-6579-48f3-9e5b-3fb6042d424c" data-bs-toggle="collapse" id="80a73f9b-c160-4daa-83e2-6f62ce01da1b" onclick="return false;" type="button">
+          <div id="140ac421-4e60-4e8e-87d0-617642ea6a34">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#2eadc568-b21d-4b39-a90c-c1e7a1769cd9" data-bs-toggle="collapse" id="596b6043-0bf0-480c-8f54-7d836f2061df" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="e05180ac-a756-4e64-ac66-8fe2b2344bab">
+         <span class="text-muted" id="e7997943-0b10-4bb2-8743-679ae61d4a32">
           A web component for a panel.
          </span>
-         <pre id="61814716-cc05-4577-88a6-29509c59ec35"><code class="language-python">Panel(*components)</code></pre>
-         <div class="ms-3 collapse" id="98e2c3d8-6579-48f3-9e5b-3fb6042d424c">
-          <h6 id="4a92a466-951b-4f05-bc00-1fe6d15aa710">
+         <pre id="5bcb33a2-f7a9-4176-aa39-c6b5c8d577da"><code class="language-python">Panel(*components)</code></pre>
+         <div class="ms-3 collapse" id="2eadc568-b21d-4b39-a90c-c1e7a1769cd9">
+          <h6 id="f90ac175-4954-413e-80a5-8ca4f550743a">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="d0f061e1-7d95-45a5-8f19-dde0687aebf0">
+          <table class="table table-sm bg-light" id="75debc54-49a7-4273-ba16-82f80269083f">
            <thead>
             <tr>
              <th scope="col">
@@ -6916,11 +7052,11 @@ Navigation(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="e73414e2-9e99-45fa-b88d-32dad61f4fa9">
-          <h6 id="c5077e2a-847e-4955-8530-46f91d0bf35e">
+         <div class="ms-3" id="c5c37af8-5b61-4578-afbe-40d43f0adc8c">
+          <h6 id="a8d77d6e-43f5-4191-81d4-342f7850beb2">
            Example
           </h6>
-          <pre id="c58b6289-7e79-4920-bc54-6b28060be15d"><code class="language-python">from bootwrap import Text, Panel
+          <pre id="c3a3702c-8cd4-4ef4-a580-cc0cae54271e"><code class="language-python">from bootwrap import Text, Panel
 
 comp1 = Text("Component 1").as_outline().ms(1)
 comp2 = Text("Component 2").as_outline().ms(1)
@@ -6929,45 +7065,45 @@ comp3 = Text("Component 3").as_outline().ms(1)
 Panel(comp1, comp2, comp3)
 </code></pre>
          </div>
-         <div class="ms-3" id="10b98f9b-aa98-4234-b190-e1db563a341a">
-          <div id="3018f57f-c18a-46ab-bbec-b3472a6a4da4">
-           <span class="ms-1 border" id="3bef3377-f437-4df1-a5a9-9efdb963cf45">
+         <div class="ms-3" id="b7cd2d75-7dd5-45a5-80b5-3110791af201">
+          <div id="57f55702-cd82-49de-b72d-59e3b63a4c94">
+           <span class="ms-1 border" id="9cdcb2c8-2ddf-4a77-a90f-879cd121ba71">
             Component 1
            </span>
-           <span class="ms-1 border" id="8a2379a9-fd4b-4e7c-8894-1a829764f47b">
+           <span class="ms-1 border" id="acc94b83-04fa-4a50-87a8-31736c622d00">
             Component 2
            </span>
-           <span class="ms-1 border" id="04a9a045-59c2-4afa-a962-5403e36a0da6">
+           <span class="ms-1 border" id="fd730ed1-6d2a-48ea-828b-d0007ef13a67">
             Component 3
            </span>
           </div>
          </div>
-         <div class="mt-5" id="7e0b0323-1233-4052-b624-215646474bc0">
-          <div class="d-flex justify-content-between" id="220d28f2-e3d9-432f-a82c-67a9848a62cf">
-           <h4 id="1cb5ead5-0b33-412d-b3ef-2ac9293ba772">
+         <div class="mt-5" id="498dc412-6b6e-4c9f-b49c-1f1e41af8b55">
+          <div class="d-flex justify-content-between" id="a6e1ec6a-827c-461d-a7fb-c17a9d1669f7">
+           <h4 id="7bc3ecf8-99f0-4b55-bc49-b53722a73748">
             Method
-            <span class="text-primary" id="90e5b634-0ab4-460b-9f89-9793fbd42a3e">
+            <span class="text-primary" id="81f7b0d5-c30c-45f9-8a41-8cf9f83bbf11">
              align_items
             </span>
            </h4>
-           <div id="4d22ec9a-0b3c-45e0-90c9-ff13a8f2fd62">
-            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#eb028da5-53f8-484d-bbd6-bbf2b585c27d" data-bs-toggle="collapse" id="0ca323ba-c8ee-49d5-8ede-ce6b4aeefae3" onclick="return false;" type="button">
+           <div id="4c800ef4-da7f-4028-83af-b790aaabe9d6">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#d6576282-1ec4-4325-ae1d-e9a5931487ce" data-bs-toggle="collapse" id="26425a07-545c-411e-81e8-4805e94c3907" onclick="return false;" type="button">
              Argument
             </button>
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#ade1e8d4-0a2d-4785-9133-1e601059fd14" data-bs-toggle="collapse" id="165ed5e7-4d3b-4778-a233-552b10d540f4" onclick="return false;" type="button">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#7d68cd9a-7f5a-42c5-bd7e-d8cd93795b85" data-bs-toggle="collapse" id="69051ccb-5bf7-427b-97c3-0f0501b13936" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="d3c6a2ab-1a4e-4667-8c5a-ae01c58bdb18">
+          <span class="text-muted" id="7014060d-1e15-4efe-85af-104ea090883c">
            Align panel items.
           </span>
-          <pre id="fcc1e6a1-678b-487e-b9ca-58bf68e96124"><code class="language-python">align_items(style)</code></pre>
-          <div class="ms-3 collapse" id="eb028da5-53f8-484d-bbd6-bbf2b585c27d">
-           <h6 id="9f8c033e-4385-417d-930d-f157330a6a00">
+          <pre id="079394d1-175d-444f-b44e-86eb363b0166"><code class="language-python">align_items(style)</code></pre>
+          <div class="ms-3 collapse" id="d6576282-1ec4-4325-ae1d-e9a5931487ce">
+           <h6 id="f0708037-e199-47e0-a16b-7341df1c2036">
             Arguments
            </h6>
-           <table class="table table-sm bg-light" id="bbcc9f21-f080-4163-ac72-eb2ff23f4209">
+           <table class="table table-sm bg-light" id="f30b21f9-8765-4eac-a8ec-5ae85f6eb000">
             <thead>
              <tr>
               <th scope="col">
@@ -7001,11 +7137,11 @@ Panel(comp1, comp2, comp3)
             </tbody>
            </table>
           </div>
-          <div class="ms-3 collapse" id="ade1e8d4-0a2d-4785-9133-1e601059fd14">
-           <h6 id="857c66d5-a5cf-4612-9120-dbc44d7b5f2b">
+          <div class="ms-3 collapse" id="7d68cd9a-7f5a-42c5-bd7e-d8cd93795b85">
+           <h6 id="50b70c9d-c73b-4708-a5c6-43f15f2041a8">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="fd769489-6b3d-487e-b451-403092035613">
+           <table class="table table-sm bg-light" id="92379cd5-f5ca-44b6-ba91-54cf201f44e2">
             <thead>
              <tr>
               <th scope="col">
@@ -7038,11 +7174,11 @@ Panel(comp1, comp2, comp3)
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="3d2e92d5-e055-4ca7-8d49-ca8cf4d350f1">
-           <h6 id="93d0eba0-f670-4a3c-ae03-f98294e25aa2">
+          <div class="ms-3" id="a3e9a559-2890-468c-97bc-964109676ccd">
+           <h6 id="d88ce0b8-4f84-4c62-89c3-5a8c02286d8d">
             Example
            </h6>
-           <pre id="e6b1b9be-3f60-47d1-998f-e362e3cfdbf0"><code class="language-python">from bootwrap import Text, Panel, Image
+           <pre id="6e012d5e-a091-49a4-b956-7abca52bc2fb"><code class="language-python">from bootwrap import Text, Panel, Image
 
 image  = Image("logo.png", height="200px")
 comp1 = Text("Component 1").as_light().as_outline().p(2).m(2)
@@ -7064,19 +7200,19 @@ Panel(
 ).vertical()
 </code></pre>
           </div>
-          <div class="ms-3" id="5afd8420-c415-4f14-adf9-dfdbb8f48f6b">
-           <div id="c135d5b4-6767-40e5-b474-5234186ca599">
+          <div class="ms-3" id="d061d40d-dd66-4f5e-bd55-289d91a2988a">
+           <div id="b32c56ab-85ad-4e1b-9e92-ea7032618c1e">
             <div class="row">
              <div class="col-md">
-              <div class="d-flex align-items-start mt-1 bg-dark" id="69a8197c-2e29-4d5f-9f3f-1c73a0c90176">
-               <img height="200px" id="3897e3d5-da76-4a0b-aac5-d98b74c629ec" src="logo.png"/>
-               <span class="p-2 m-2 text-light border border-light" id="c20ee835-7457-49be-b4a2-0961dbb366aa">
+              <div class="d-flex align-items-start mt-1 bg-dark" id="bdf8c265-6400-484f-8504-c8d851c3803f">
+               <img height="200px" id="4006b98f-7657-4722-893b-324a57c0614b" src="logo.png"/>
+               <span class="p-2 m-2 text-light border border-light" id="ed19b830-d3bf-4281-bb1b-e1bc09186ad2">
                 Component 1
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="70c0d5e0-dee9-4ca8-954e-fbeaa2303569">
+               <span class="p-2 m-2 text-light border border-light" id="f2c024f6-6447-44e9-9cfe-4a5e0a7a5693">
                 Component 2
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="64fc20f6-f276-42c8-8c47-298047c82612">
+               <span class="p-2 m-2 text-light border border-light" id="b4a5bf8e-7a2b-4926-b641-091608d0466f">
                 Component 3
                </span>
               </div>
@@ -7084,15 +7220,15 @@ Panel(
             </div>
             <div class="row">
              <div class="col-md">
-              <div class="d-flex align-items-end mt-1 bg-dark" id="b906289a-ca4c-4fab-8ba5-ce67fa684cf3">
-               <img height="200px" id="3897e3d5-da76-4a0b-aac5-d98b74c629ec" src="logo.png"/>
-               <span class="p-2 m-2 text-light border border-light" id="c20ee835-7457-49be-b4a2-0961dbb366aa">
+              <div class="d-flex align-items-end mt-1 bg-dark" id="62841aab-60e9-449c-879e-63331eeb1114">
+               <img height="200px" id="4006b98f-7657-4722-893b-324a57c0614b" src="logo.png"/>
+               <span class="p-2 m-2 text-light border border-light" id="ed19b830-d3bf-4281-bb1b-e1bc09186ad2">
                 Component 1
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="70c0d5e0-dee9-4ca8-954e-fbeaa2303569">
+               <span class="p-2 m-2 text-light border border-light" id="f2c024f6-6447-44e9-9cfe-4a5e0a7a5693">
                 Component 2
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="64fc20f6-f276-42c8-8c47-298047c82612">
+               <span class="p-2 m-2 text-light border border-light" id="b4a5bf8e-7a2b-4926-b641-091608d0466f">
                 Component 3
                </span>
               </div>
@@ -7100,15 +7236,15 @@ Panel(
             </div>
             <div class="row">
              <div class="col-md">
-              <div class="d-flex align-items-center mt-1 bg-dark" id="ce95c36b-fce8-42d8-bee6-ff31245cf01b">
-               <img height="200px" id="3897e3d5-da76-4a0b-aac5-d98b74c629ec" src="logo.png"/>
-               <span class="p-2 m-2 text-light border border-light" id="c20ee835-7457-49be-b4a2-0961dbb366aa">
+              <div class="d-flex align-items-center mt-1 bg-dark" id="2c314a17-b7b6-4cb5-9e27-528f3653c192">
+               <img height="200px" id="4006b98f-7657-4722-893b-324a57c0614b" src="logo.png"/>
+               <span class="p-2 m-2 text-light border border-light" id="ed19b830-d3bf-4281-bb1b-e1bc09186ad2">
                 Component 1
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="70c0d5e0-dee9-4ca8-954e-fbeaa2303569">
+               <span class="p-2 m-2 text-light border border-light" id="f2c024f6-6447-44e9-9cfe-4a5e0a7a5693">
                 Component 2
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="64fc20f6-f276-42c8-8c47-298047c82612">
+               <span class="p-2 m-2 text-light border border-light" id="b4a5bf8e-7a2b-4926-b641-091608d0466f">
                 Component 3
                </span>
               </div>
@@ -7116,15 +7252,15 @@ Panel(
             </div>
             <div class="row">
              <div class="col-md">
-              <div class="d-flex align-items-baseline mt-1 bg-dark" id="34b0b41f-0f7e-42fc-be30-68dffc829e51">
-               <img height="200px" id="3897e3d5-da76-4a0b-aac5-d98b74c629ec" src="logo.png"/>
-               <span class="p-2 m-2 text-light border border-light" id="c20ee835-7457-49be-b4a2-0961dbb366aa">
+              <div class="d-flex align-items-baseline mt-1 bg-dark" id="b3d06ee3-2850-4d56-83cb-7fa1dc6a0f43">
+               <img height="200px" id="4006b98f-7657-4722-893b-324a57c0614b" src="logo.png"/>
+               <span class="p-2 m-2 text-light border border-light" id="ed19b830-d3bf-4281-bb1b-e1bc09186ad2">
                 Component 1
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="70c0d5e0-dee9-4ca8-954e-fbeaa2303569">
+               <span class="p-2 m-2 text-light border border-light" id="f2c024f6-6447-44e9-9cfe-4a5e0a7a5693">
                 Component 2
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="64fc20f6-f276-42c8-8c47-298047c82612">
+               <span class="p-2 m-2 text-light border border-light" id="b4a5bf8e-7a2b-4926-b641-091608d0466f">
                 Component 3
                </span>
               </div>
@@ -7132,15 +7268,15 @@ Panel(
             </div>
             <div class="row">
              <div class="col-md">
-              <div class="d-flex align-items-stretch mt-1 bg-dark" id="38f6380f-136f-4bca-ab0a-9b221816e3df">
-               <img height="200px" id="3897e3d5-da76-4a0b-aac5-d98b74c629ec" src="logo.png"/>
-               <span class="p-2 m-2 text-light border border-light" id="c20ee835-7457-49be-b4a2-0961dbb366aa">
+              <div class="d-flex align-items-stretch mt-1 bg-dark" id="75b39c5c-2d91-4b5b-af54-b47edcc4c898">
+               <img height="200px" id="4006b98f-7657-4722-893b-324a57c0614b" src="logo.png"/>
+               <span class="p-2 m-2 text-light border border-light" id="ed19b830-d3bf-4281-bb1b-e1bc09186ad2">
                 Component 1
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="70c0d5e0-dee9-4ca8-954e-fbeaa2303569">
+               <span class="p-2 m-2 text-light border border-light" id="f2c024f6-6447-44e9-9cfe-4a5e0a7a5693">
                 Component 2
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="64fc20f6-f276-42c8-8c47-298047c82612">
+               <span class="p-2 m-2 text-light border border-light" id="b4a5bf8e-7a2b-4926-b641-091608d0466f">
                 Component 3
                </span>
               </div>
@@ -7149,29 +7285,29 @@ Panel(
            </div>
           </div>
          </div>
-         <div class="mt-5" id="2589247e-2049-49b9-b8c8-2911524dfca0">
-          <div class="d-flex justify-content-between" id="e6312a5a-a2a4-4c8c-bd87-e151a8f7d322">
-           <h4 id="ac75a906-8338-4c7b-bb71-f052a64db086">
+         <div class="mt-5" id="b9701fb5-a192-4d5d-91c5-0b71c9b775d5">
+          <div class="d-flex justify-content-between" id="465e7cc0-8511-4cbf-a2f3-9e64b9529e08">
+           <h4 id="c5b4f94c-1def-4c5d-a459-46db00e2b408">
             Method
-            <span class="text-primary" id="ae9c6127-8d60-407f-a0cc-4a1f4e905b76">
+            <span class="text-primary" id="5acc3230-d617-45d6-9cf3-d02d23b49f8a">
              as_collapse
             </span>
            </h4>
-           <div id="83451f0f-d343-49d6-9369-66496bb4cb74">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#4e94c24d-c67c-47f1-bee4-00a9fa4d0012" data-bs-toggle="collapse" id="e2aa7549-2f54-42ab-b2b9-127ee7905e50" onclick="return false;" type="button">
+           <div id="674aeb2a-848a-4075-b68f-91e128ec90bd">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#a57d678e-f063-4e70-acb8-bd077c73c066" data-bs-toggle="collapse" id="f44ceeb5-4abe-4b9b-bdf4-a24b7679166a" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="d7fe8e0a-f35a-4626-93a7-1d7f66cb068b">
+          <span class="text-muted" id="f3c377e3-c5b3-4b41-86ec-2d97824d2cd4">
            Makes the panel collapsed.
           </span>
-          <pre id="45747ccf-bb94-4d59-9b76-91bea7b9d074"><code class="language-python">as_collapse()</code></pre>
-          <div class="ms-3 collapse" id="4e94c24d-c67c-47f1-bee4-00a9fa4d0012">
-           <h6 id="ae71db0c-2eeb-4ac4-91f7-1e600ae2ca83">
+          <pre id="e4dc4c53-b7f2-4a6c-b3ef-1ed0f9acf84a"><code class="language-python">as_collapse()</code></pre>
+          <div class="ms-3 collapse" id="a57d678e-f063-4e70-acb8-bd077c73c066">
+           <h6 id="95910dec-b340-4e83-a96b-2e75b0e61bc0">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="d9a6ed62-234d-4572-8f50-3d9208396ec4">
+           <table class="table table-sm bg-light" id="ce22726f-9036-4dc4-b5d7-79ef3d35a8c9">
             <thead>
              <tr>
               <th scope="col">
@@ -7205,30 +7341,30 @@ Panel(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="db543795-6ac0-4b86-9f73-9b4358198735">
-          <div class="d-flex justify-content-between" id="f4672df3-be86-4bd2-8b2c-09c55a60e7e0">
-           <h4 id="a6637449-a3da-477f-82be-23f9da7aabde">
+         <div class="mt-5" id="283954e0-3481-4173-830a-5e8a7374decb">
+          <div class="d-flex justify-content-between" id="3581c437-71f3-44c6-8e5f-241eefc0c17b">
+           <h4 id="669e191d-18fb-4b13-83a9-0f4c414bc534">
             Method
-            <span class="text-primary" id="51b1c89f-4b1d-4b32-8ae4-ddb7184d22da">
+            <span class="text-primary" id="ffd432f1-42d5-432d-95fe-d38bc87c973d">
              horizontal
             </span>
            </h4>
-           <div id="6a35c592-c951-4fd3-b9b7-de5fa2570d83">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#417c105b-f4cb-45c8-9939-c1bdecbd7490" data-bs-toggle="collapse" id="72334cd0-226c-4c2c-9ffb-e58be311f664" onclick="return false;" type="button">
+           <div id="4cea38e3-6964-45a8-9a1b-08729deaaf28">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#9846b434-d4b9-4978-96a4-d50bc7227ade" data-bs-toggle="collapse" id="d9fb542b-682d-499f-8c82-cacdb154b545" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="83ef615d-617a-4f46-8921-740eb0282ea1">
+          <span class="text-muted" id="4b87d6fb-8f4b-4692-8df4-3d7e92423676">
            Makes the panel with the horizontal arrangement of encapsulating
         elements
           </span>
-          <pre id="a395093b-3096-44bf-83f5-d52930165cae"><code class="language-python">horizontal()</code></pre>
-          <div class="ms-3 collapse" id="417c105b-f4cb-45c8-9939-c1bdecbd7490">
-           <h6 id="34aca381-bd25-452a-a9be-604a4f916e27">
+          <pre id="a0d35aed-01d4-4b3e-a468-88edca131bbd"><code class="language-python">horizontal()</code></pre>
+          <div class="ms-3 collapse" id="9846b434-d4b9-4978-96a4-d50bc7227ade">
+           <h6 id="9a6e96b8-3aa1-4557-8223-6f8a9e29649e">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="35fa1ab3-134f-4eb6-be50-aa68d07146d1">
+           <table class="table table-sm bg-light" id="fd3a5f84-919d-429e-b2bf-007015d357a5">
             <thead>
              <tr>
               <th scope="col">
@@ -7261,11 +7397,11 @@ Panel(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="13d6cc2e-273f-404c-85fa-81ed52525669">
-           <h6 id="3b25c0aa-78d1-4dac-a9b3-d066a9ba6010">
+          <div class="ms-3" id="043f2402-4957-4c5c-b893-2d83f83d9581">
+           <h6 id="cc2ed2b9-629f-4452-b96b-5f9d9f104a05">
             Example
            </h6>
-           <pre id="b9c3ce3d-766d-459e-816f-2a1650c0dfb1"><code class="language-python">from bootwrap import Text, Panel
+           <pre id="72f58860-2431-4909-947c-0043eace9a09"><code class="language-python">from bootwrap import Text, Panel
 
 comp1 = Text("Component 1").as_outline()
 comp2 = Text("Component 2").as_outline()
@@ -7274,21 +7410,21 @@ comp3 = Text("Component 3").as_outline()
 Panel(comp1, comp2, comp3).horizontal()
 </code></pre>
           </div>
-          <div class="ms-3" id="701cbf61-c737-458c-9da4-2787be3631e1">
-           <div id="6107029c-6527-429f-845e-5c0020dc28e8">
+          <div class="ms-3" id="0f0f075c-8b33-4174-8a67-e97fd0768221">
+           <div id="05cc96a3-b55f-43ee-8794-855e579d26f2">
             <div class="row">
              <div class="col-md">
-              <span class="border" id="5ed224f4-ac78-4432-8228-64d3d5048151">
+              <span class="border" id="9a356b60-56be-4e36-894c-69728e0a35b7">
                Component 1
               </span>
              </div>
              <div class="col-md">
-              <span class="border" id="3bd9c9eb-7d5f-4300-8b7e-deabe7a35684">
+              <span class="border" id="84ec324c-341c-4e9a-9e08-a335f64b2b9f">
                Component 2
               </span>
              </div>
              <div class="col-md">
-              <span class="border" id="f3fa9489-dc93-483d-970a-7b8eff083cbc">
+              <span class="border" id="ac5f2d59-2f89-4662-97bf-bcc7ed458d58">
                Component 3
               </span>
              </div>
@@ -7296,32 +7432,32 @@ Panel(comp1, comp2, comp3).horizontal()
            </div>
           </div>
          </div>
-         <div class="mt-5" id="2a9403d4-58db-46cf-89e4-7b79d37b9ad9">
-          <div class="d-flex justify-content-between" id="09d55968-bafc-4d6b-bae6-c6242376b189">
-           <h4 id="9f9f908f-7764-439d-be79-48b89b615e9a">
+         <div class="mt-5" id="869b9600-7854-4034-abc6-d9a98fd6801d">
+          <div class="d-flex justify-content-between" id="3dfe82d3-a328-43e6-a094-c15c5f614a7f">
+           <h4 id="a0fe2362-6cda-435c-aaca-073b07425c23">
             Method
-            <span class="text-primary" id="f118927f-dda7-431f-9d1d-314da91d5a5a">
+            <span class="text-primary" id="ff7527cd-237a-491b-a919-8370679fbd78">
              justify_content
             </span>
            </h4>
-           <div id="0b215275-31b9-4d9a-9895-59ee00fc5286">
-            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#34d64b69-c8d8-413c-90c5-55122bd65062" data-bs-toggle="collapse" id="967bc8a8-2cc3-47f0-8aba-8eb45e3d419b" onclick="return false;" type="button">
+           <div id="a6269cc6-b5ce-4e1d-a19d-af6e5c5c918a">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#fbddd47c-9c65-4cac-93e4-162c4fb316ca" data-bs-toggle="collapse" id="600afc64-7f40-423f-bc31-f7f09bd07964" onclick="return false;" type="button">
              Argument
             </button>
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#dbbec806-ae1a-4d8e-baf8-2928437e06c7" data-bs-toggle="collapse" id="b2137cf4-c7ee-4671-a230-da674d29019f" onclick="return false;" type="button">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#6985169e-ddc8-4912-b392-2b76485e4d4d" data-bs-toggle="collapse" id="b746b0b5-b3d6-466c-98a9-ae36c6018094" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="4540bc16-6631-4a50-ac62-d1ad40bee915">
+          <span class="text-muted" id="41c1db2c-3f1b-4065-82ad-e356fcfbd27d">
            Justifies panel content.
           </span>
-          <pre id="611c7042-5fa5-4714-9cb6-2caf2c6b77a7"><code class="language-python">justify_content(style)</code></pre>
-          <div class="ms-3 collapse" id="34d64b69-c8d8-413c-90c5-55122bd65062">
-           <h6 id="c8a38d90-1136-48e7-8238-fc85b16d9752">
+          <pre id="1bd41cc3-c4fd-4e72-a82c-b1461ed369ea"><code class="language-python">justify_content(style)</code></pre>
+          <div class="ms-3 collapse" id="fbddd47c-9c65-4cac-93e4-162c4fb316ca">
+           <h6 id="72462174-ef22-423f-adfd-2ec5b7726132">
             Arguments
            </h6>
-           <table class="table table-sm bg-light" id="d6fab4d9-628f-450f-b54f-0dc5b14ec651">
+           <table class="table table-sm bg-light" id="f0e6f6d7-28b3-432a-8d1f-bc543f32d530">
             <thead>
              <tr>
               <th scope="col">
@@ -7355,11 +7491,11 @@ Panel(comp1, comp2, comp3).horizontal()
             </tbody>
            </table>
           </div>
-          <div class="ms-3 collapse" id="dbbec806-ae1a-4d8e-baf8-2928437e06c7">
-           <h6 id="d6b7c5a6-1511-47e0-9aa8-e5e18f1b1574">
+          <div class="ms-3 collapse" id="6985169e-ddc8-4912-b392-2b76485e4d4d">
+           <h6 id="19748380-6942-498c-b5da-23ad45d77ef2">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="e6ad9374-3d46-436c-93e3-49c8287b24e5">
+           <table class="table table-sm bg-light" id="1965126f-1df7-43d5-829b-d181667a3d12">
             <thead>
              <tr>
               <th scope="col">
@@ -7392,11 +7528,11 @@ Panel(comp1, comp2, comp3).horizontal()
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="749863c7-c541-4455-a6fe-1fc3b34dbaee">
-           <h6 id="f81bd850-f545-4e07-a66b-c677ac15cbb4">
+          <div class="ms-3" id="22afff4e-2dad-4a2e-b317-3555a0c87656">
+           <h6 id="437cf331-d089-42e1-bb65-1f38b52e5126">
             Example
            </h6>
-           <pre id="90be1a60-0f89-4099-83b8-3490cbbafdcf"><code class="language-python">from bootwrap import Text, Panel
+           <pre id="46350835-77cd-4b68-bb37-447ec91f392a"><code class="language-python">from bootwrap import Text, Panel
 
 comp1 = Text("Component 1").as_light().as_outline().p(2).m(2)
 comp2 = Text("Component 2").as_light().as_outline().p(2).m(2)
@@ -7419,18 +7555,18 @@ Panel(
 ).vertical()
 </code></pre>
           </div>
-          <div class="ms-3" id="a1a4a191-2606-46fa-86a7-a2c1eec54c77">
-           <div id="6d4b99e2-5c13-487e-a8a7-2a250c705a11">
+          <div class="ms-3" id="1382eb5a-3298-4da9-9cb4-83e98fb215a3">
+           <div id="0f44eedc-3f55-4b01-aacf-81be8271a6bd">
             <div class="row">
              <div class="col-md">
-              <div class="d-flex justify-content-start mt-1 bg-dark" id="2e983c65-96f4-4a39-b5cc-fa47dbe2e99e">
-               <span class="p-2 m-2 text-light border border-light" id="77599718-e85b-4918-a664-81e536c7f69d">
+              <div class="d-flex justify-content-start mt-1 bg-dark" id="1ecc4aa0-e407-49e1-8610-d4467719bf39">
+               <span class="p-2 m-2 text-light border border-light" id="e5d1c3b0-c419-4eed-b89c-c5a0d5670194">
                 Component 1
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="55578735-be57-4e23-b4a0-531fd0348d1e">
+               <span class="p-2 m-2 text-light border border-light" id="272ef47e-fba9-422b-8f8f-3fbcdcc6463c">
                 Component 2
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="e6509535-ac9c-4d33-b9b2-491b9184d89f">
+               <span class="p-2 m-2 text-light border border-light" id="90865876-22d2-4fa4-89fa-583c4e625fd9">
                 Component 3
                </span>
               </div>
@@ -7438,14 +7574,14 @@ Panel(
             </div>
             <div class="row">
              <div class="col-md">
-              <div class="d-flex justify-content-end mt-1 bg-dark" id="e3ee4f31-3dc0-4fbf-b6c0-ffe2e9335ce0">
-               <span class="p-2 m-2 text-light border border-light" id="77599718-e85b-4918-a664-81e536c7f69d">
+              <div class="d-flex justify-content-end mt-1 bg-dark" id="d5294a77-5107-4307-8837-22c3c49acb95">
+               <span class="p-2 m-2 text-light border border-light" id="e5d1c3b0-c419-4eed-b89c-c5a0d5670194">
                 Component 1
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="55578735-be57-4e23-b4a0-531fd0348d1e">
+               <span class="p-2 m-2 text-light border border-light" id="272ef47e-fba9-422b-8f8f-3fbcdcc6463c">
                 Component 2
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="e6509535-ac9c-4d33-b9b2-491b9184d89f">
+               <span class="p-2 m-2 text-light border border-light" id="90865876-22d2-4fa4-89fa-583c4e625fd9">
                 Component 3
                </span>
               </div>
@@ -7453,14 +7589,14 @@ Panel(
             </div>
             <div class="row">
              <div class="col-md">
-              <div class="d-flex justify-content-center mt-1 bg-dark" id="ca35d852-2f8c-45bd-beef-4f59af94a08f">
-               <span class="p-2 m-2 text-light border border-light" id="77599718-e85b-4918-a664-81e536c7f69d">
+              <div class="d-flex justify-content-center mt-1 bg-dark" id="00e56cf6-9897-4387-be3d-6c3f3bd78ede">
+               <span class="p-2 m-2 text-light border border-light" id="e5d1c3b0-c419-4eed-b89c-c5a0d5670194">
                 Component 1
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="55578735-be57-4e23-b4a0-531fd0348d1e">
+               <span class="p-2 m-2 text-light border border-light" id="272ef47e-fba9-422b-8f8f-3fbcdcc6463c">
                 Component 2
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="e6509535-ac9c-4d33-b9b2-491b9184d89f">
+               <span class="p-2 m-2 text-light border border-light" id="90865876-22d2-4fa4-89fa-583c4e625fd9">
                 Component 3
                </span>
               </div>
@@ -7468,14 +7604,14 @@ Panel(
             </div>
             <div class="row">
              <div class="col-md">
-              <div class="d-flex justify-content-between mt-1 bg-dark" id="2c9c4270-93f0-42a2-8817-20ea9b42742f">
-               <span class="p-2 m-2 text-light border border-light" id="77599718-e85b-4918-a664-81e536c7f69d">
+              <div class="d-flex justify-content-between mt-1 bg-dark" id="8e481654-38dd-43ea-85e3-3e8ab84fe4f8">
+               <span class="p-2 m-2 text-light border border-light" id="e5d1c3b0-c419-4eed-b89c-c5a0d5670194">
                 Component 1
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="55578735-be57-4e23-b4a0-531fd0348d1e">
+               <span class="p-2 m-2 text-light border border-light" id="272ef47e-fba9-422b-8f8f-3fbcdcc6463c">
                 Component 2
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="e6509535-ac9c-4d33-b9b2-491b9184d89f">
+               <span class="p-2 m-2 text-light border border-light" id="90865876-22d2-4fa4-89fa-583c4e625fd9">
                 Component 3
                </span>
               </div>
@@ -7483,14 +7619,14 @@ Panel(
             </div>
             <div class="row">
              <div class="col-md">
-              <div class="d-flex justify-content-around mt-1 bg-dark" id="492cd858-155f-4aec-85be-9f987d9b635f">
-               <span class="p-2 m-2 text-light border border-light" id="77599718-e85b-4918-a664-81e536c7f69d">
+              <div class="d-flex justify-content-around mt-1 bg-dark" id="e58258cd-54f0-4e0c-9aec-74f57c7fcfb2">
+               <span class="p-2 m-2 text-light border border-light" id="e5d1c3b0-c419-4eed-b89c-c5a0d5670194">
                 Component 1
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="55578735-be57-4e23-b4a0-531fd0348d1e">
+               <span class="p-2 m-2 text-light border border-light" id="272ef47e-fba9-422b-8f8f-3fbcdcc6463c">
                 Component 2
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="e6509535-ac9c-4d33-b9b2-491b9184d89f">
+               <span class="p-2 m-2 text-light border border-light" id="90865876-22d2-4fa4-89fa-583c4e625fd9">
                 Component 3
                </span>
               </div>
@@ -7498,14 +7634,14 @@ Panel(
             </div>
             <div class="row">
              <div class="col-md">
-              <div class="d-flex justify-content-evenly mt-1 bg-dark" id="25bcc402-d7e5-4867-9771-90f201d01da7">
-               <span class="p-2 m-2 text-light border border-light" id="77599718-e85b-4918-a664-81e536c7f69d">
+              <div class="d-flex justify-content-evenly mt-1 bg-dark" id="40b32eda-4b19-482b-9235-749e4e064e3f">
+               <span class="p-2 m-2 text-light border border-light" id="e5d1c3b0-c419-4eed-b89c-c5a0d5670194">
                 Component 1
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="55578735-be57-4e23-b4a0-531fd0348d1e">
+               <span class="p-2 m-2 text-light border border-light" id="272ef47e-fba9-422b-8f8f-3fbcdcc6463c">
                 Component 2
                </span>
-               <span class="p-2 m-2 text-light border border-light" id="e6509535-ac9c-4d33-b9b2-491b9184d89f">
+               <span class="p-2 m-2 text-light border border-light" id="90865876-22d2-4fa4-89fa-583c4e625fd9">
                 Component 3
                </span>
               </div>
@@ -7514,30 +7650,30 @@ Panel(
            </div>
           </div>
          </div>
-         <div class="mt-5" id="1bdde2b3-979b-4099-8f4d-0cb6b2bb7577">
-          <div class="d-flex justify-content-between" id="37ef8347-bd45-440a-8edb-92d72e3fbacd">
-           <h4 id="d613e6b9-a748-47f4-928b-f535819e6ac9">
+         <div class="mt-5" id="dfe6b984-66ec-472c-aeb0-d1fa5153e8b5">
+          <div class="d-flex justify-content-between" id="346344fc-e4f2-47fe-aa4f-2a7d4ea80650">
+           <h4 id="b6c5768e-d011-4874-a7f5-e5c8ded513dc">
             Method
-            <span class="text-primary" id="20ae82c9-07ba-4b98-a3bd-0645c9d9c7fb">
+            <span class="text-primary" id="879ec6ed-3421-4e00-b6fc-2e3fd37af477">
              vertical
             </span>
            </h4>
-           <div id="ef508994-e223-4f66-9ea0-d25b03553c8b">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#7ff01527-2d82-498c-b2d4-5caefbc68951" data-bs-toggle="collapse" id="2a09b936-8469-473d-b789-a424d417e7e0" onclick="return false;" type="button">
+           <div id="77afd877-86d1-4274-81ab-a09661297587">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#3e370d74-238e-4b39-a7c4-c676be86cd6d" data-bs-toggle="collapse" id="9e0f4eaf-cd52-4faf-adb7-db307e33ac39" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="ce46fd3e-8cf8-4845-be2b-52e93053df0a">
+          <span class="text-muted" id="3022a632-867d-4fb0-b75e-61e627503176">
            Makes the panel with the vertical arrangement of encapsulating
         elements
           </span>
-          <pre id="8541cabc-6c5d-42b6-b254-99f4e9a2e99a"><code class="language-python">vertical()</code></pre>
-          <div class="ms-3 collapse" id="7ff01527-2d82-498c-b2d4-5caefbc68951">
-           <h6 id="e828a509-8cc9-471a-ae23-f4ecdcdf9fe7">
+          <pre id="43834536-9d26-47a5-bad5-9ebe39122c64"><code class="language-python">vertical()</code></pre>
+          <div class="ms-3 collapse" id="3e370d74-238e-4b39-a7c4-c676be86cd6d">
+           <h6 id="b3d11976-1729-4cc8-a968-92dc30edfc1e">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="63cf21b4-ef7b-4fde-b72c-01422e5e65d7">
+           <table class="table table-sm bg-light" id="01914963-da46-4566-9fa4-0906b09000f8">
             <thead>
              <tr>
               <th scope="col">
@@ -7570,11 +7706,11 @@ Panel(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="71481499-973e-492d-9b7a-1c0c542d462d">
-           <h6 id="51164753-64ab-4076-b038-c0a3b36a2d2c">
+          <div class="ms-3" id="a2d13300-125c-4f76-a0ca-e94169793d34">
+           <h6 id="f630ad21-e0b7-4b70-bc29-59369cfd1c27">
             Example
            </h6>
-           <pre id="b4a59604-57ce-4ed5-8d53-6d070e176148"><code class="language-python">from bootwrap import Text, Panel
+           <pre id="2a8b07b2-d299-4192-ab80-2cb86a706b49"><code class="language-python">from bootwrap import Text, Panel
 
 comp1 = Text("Component 1").as_outline()
 comp2 = Text("Component 2").as_outline()
@@ -7583,25 +7719,25 @@ comp3 = Text("Component 3").as_outline()
 Panel(comp1, comp2, comp3).vertical()
 </code></pre>
           </div>
-          <div class="ms-3" id="cfedbc4e-9b44-4140-ad27-c42d191e834d">
-           <div id="a28751a6-8fb0-4247-8afa-af2f03c9c951">
+          <div class="ms-3" id="2907d38b-a399-4874-ac8f-970cc7859f71">
+           <div id="d885771a-b1f3-40c5-8fb7-313cb5518692">
             <div class="row">
              <div class="col-md">
-              <span class="border" id="d7b8f940-e5cd-4f71-b44c-a8abf08d3025">
+              <span class="border" id="9123de8d-91de-4768-b9c8-7732236b87db">
                Component 1
               </span>
              </div>
             </div>
             <div class="row">
              <div class="col-md">
-              <span class="border" id="e35095b3-9fbe-4691-a794-b7b71d141cf6">
+              <span class="border" id="8532cb67-2f71-4a38-99ef-1d853ed619df">
                Component 2
               </span>
              </div>
             </div>
             <div class="row">
              <div class="col-md">
-              <span class="border" id="fa5c3301-9f88-4885-bdea-87c7afeb63af">
+              <span class="border" id="15eb5f12-7066-4916-92ba-9b96df915782">
                Component 3
               </span>
              </div>
@@ -7611,28 +7747,28 @@ Panel(comp1, comp2, comp3).vertical()
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="037987d5-40dd-467f-b8bd-a252b750909b">
-        <div class="mt-3" id="625a6396-8924-4969-b364-6c2fab75965a">
-         <div id="0109e35e-a5a3-4fe3-881d-94df46eb09bb">
+       <div class="tab-pane fade" id="9f6e90ca-3439-4fce-9464-cf91fc4dea5c">
+        <div class="mt-3" id="2e3c4df4-1349-493f-8a57-7012d8167b07">
+         <div id="bf7816f7-cdcb-4792-98e2-fca59573f58a">
           <div class="row">
            <div class="col-md">
-            <div id="2486abe1-b60b-4c7d-8d2e-9f1e2d77a92a">
-             <h1 id="fd8cb261-caa5-405b-85b0-3706d8b6c176">
+            <div id="8df22d09-9580-4597-97a3-c6567f73bfa9">
+             <h1 id="790167ff-da6f-43f7-a866-90920a3bc4ad">
               Appearance
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="db7fa12c-e5fa-47d4-b90a-ab200f9c14e8">
+            <div id="f8c40059-92aa-403c-af00-6f2fe5a1883b">
             </div>
            </div>
           </div>
          </div>
-         <div id="29be90b4-1fa6-4969-aa6a-fdf7765c66a6">
+         <div id="ba0d559a-a99b-42fc-a413-3b0c5be77408">
           <div class="row">
            <div class="col-md">
-            <div id="a2846bd8-1775-499d-b2fd-f6b660574e0b">
-             <p id="7e8bd008-cc4d-4739-8227-bdf14c2b53eb">
+            <div id="b865acfb-22c4-4045-956a-1f3f86fccf61">
+             <p id="adda4dda-2e94-4c45-8589-69490116de97">
               Change
               <code>
                Panel
@@ -7674,8 +7810,8 @@ Panel(comp1, comp2, comp3).vertical()
             </div>
            </div>
            <div class="col-md">
-            <div id="6f961fe5-499b-460f-95b6-dcad33ea57e2">
-             <pre id="4e62d52f-fcf3-42fa-9be2-7419599afeb6"><code class="language-python">from bootwrap import Panel, Text
+            <div id="10efbb6e-9b85-40d7-96fa-c7426af3e366">
+             <pre id="b3f25b92-8b05-4505-9538-19ed6f545124"><code class="language-python">from bootwrap import Panel, Text
 panel = Panel(
   Panel(Text("Primary")).as_primary(),
   Panel(Text("Secondary")).as_secondary(),
@@ -7689,44 +7825,44 @@ panel = Panel(
 for anchor in panel:
   anchor.mb(1)
 panel</code></pre>
-             <div id="c8c55b39-76db-48f6-a777-2239161f50e2">
-              <div class="mb-1 bg-primary" id="dd8cd349-b4bc-4271-b41b-993d7b19a84a">
-               <span id="ab860f35-9d1a-412e-9c02-74cbdfe82703">
+             <div id="0e46ae4d-1800-4e43-9ffe-3ecb40e4c4ab">
+              <div class="mb-1 bg-primary" id="ebd27b00-4754-4bdd-beca-4d785b7c0ce2">
+               <span id="37a207b9-e805-4b0e-b20f-70149ca6f2e1">
                 Primary
                </span>
               </div>
-              <div class="mb-1 bg-secondary" id="9dd258ab-3b35-43b3-bbe7-519707ed471b">
-               <span id="9366a85b-2ff5-481c-9959-9bf8e077061d">
+              <div class="mb-1 bg-secondary" id="074858cd-1afa-471e-9bbd-7507162dcf03">
+               <span id="72ed63f7-5002-4d62-a28a-7edbb86efaae">
                 Secondary
                </span>
               </div>
-              <div class="mb-1 bg-success" id="ff82c9ab-82df-4e02-b9d8-1cf9e5997e4e">
-               <span id="637e52ea-572b-41b7-993b-ca2ce05347df">
+              <div class="mb-1 bg-success" id="d6c4634c-316b-445c-839a-5089985a129b">
+               <span id="9eaff048-9ad7-45f9-836e-6163d249d7f5">
                 Success
                </span>
               </div>
-              <div class="mb-1 bg-warning" id="3ea91d25-e2f7-4eb2-ba04-4af900c1b3f6">
-               <span id="802b003b-22ab-4e3d-a603-eb294aed00e1">
+              <div class="mb-1 bg-warning" id="820c92f2-4ba8-41fe-9934-223cc0d38334">
+               <span id="2cfe05aa-f3fe-434e-a47a-8cbae0a2d25c">
                 Warning
                </span>
               </div>
-              <div class="mb-1 bg-danger" id="4771433f-1176-4235-99ef-5acba61b4e28">
-               <span id="ab1f87fd-00f0-46cd-a6ec-f595582991d2">
+              <div class="mb-1 bg-danger" id="a31aa780-e273-45a8-bf38-6dbdef166684">
+               <span id="801f19e7-b607-4253-846b-99b6e48ef5cb">
                 Danger
                </span>
               </div>
-              <div class="mb-1 bg-info" id="7e5c330d-cd0f-47ca-8f79-b0c9d5bac93e">
-               <span id="d8b71cb4-645e-40b6-ba3a-c1788fc522a2">
+              <div class="mb-1 bg-info" id="58b5bf94-0939-42c9-8951-f2b923708d6f">
+               <span id="d40bdb69-54f8-40c7-9d9d-1c2a9a32901d">
                 Info
                </span>
               </div>
-              <div class="mb-1 bg-light" id="ff662fae-299a-4cf6-bae2-07b3218957f1">
-               <span id="9969cd40-c2fb-4715-9e5f-f50652c96521">
+              <div class="mb-1 bg-light" id="0c20393d-4a19-4839-a6fd-b60504d2bbdc">
+               <span id="712c1479-df12-4a57-9159-daf93f6b7615">
                 Light
                </span>
               </div>
-              <div class="mb-1 bg-dark" id="04613373-21d9-4aca-8387-17f7043c46a3">
-               <span class="text-light" id="b4092272-c3a8-4ce0-b470-65c68e605f42">
+              <div class="mb-1 bg-dark" id="b4ca2beb-49e6-407a-b00e-8b9ef77393a5">
+               <span class="text-light" id="82a0d441-4aed-4315-b59c-a2d3c83a483c">
                 Dark
                </span>
               </div>
@@ -7737,28 +7873,28 @@ panel</code></pre>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="4a0b1ce9-3068-4500-bd6e-7239541d1c17">
-        <div class="mt-3" id="f7e13703-d661-4f4d-994b-41055b1e686d">
-         <div id="fcb265a3-6caa-4809-8541-d5d748705bbe">
+       <div class="tab-pane fade" id="30a2e862-40f1-473d-aa29-0db3c0e8c2a7">
+        <div class="mt-3" id="d0165b8f-f78e-4d9a-840a-f99fcd7c7cd3">
+         <div id="8c4c28fe-0995-4804-8c57-820040ed50b4">
           <div class="row">
            <div class="col-md">
-            <div id="ce34a9a0-8699-47bc-9512-26c6758a6f61">
-             <h1 id="7a3f22af-32bb-4305-91bd-b102594343d8">
+            <div id="043275fe-5115-4083-bb13-d67b5daad916">
+             <h1 id="72c2fd8a-8d52-4aaf-8e00-4c75cea710e2">
               Outline
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="b228de06-066a-4d18-ac81-cc709b9fb396">
+            <div id="fc0108f2-f083-4200-a849-aa6bad3afc00">
             </div>
            </div>
           </div>
          </div>
-         <div id="02257a68-2df8-4f7d-a0f5-2c5b371ad9e5">
+         <div id="bcfd6d3b-913c-45c4-a13c-6491afa278a0">
           <div class="row">
            <div class="col-md">
-            <div id="368a7bc3-5535-4820-b370-8618dfece52b">
-             <p id="adcb678e-2944-4627-a08d-91c22fda4f06">
+            <div id="f1e404b4-4baa-4d9f-b89e-e13bc235edf1">
+             <p id="3aad466f-0559-4d38-ace2-de9696243b58">
               Make
               <code>
                Panel
@@ -7772,8 +7908,8 @@ panel</code></pre>
             </div>
            </div>
            <div class="col-md">
-            <div id="93704b0d-01aa-4159-b3f6-34b4fb739472">
-             <pre id="336c477b-ec65-4762-b60a-078cd44b9e2e"><code class="language-python">from bootwrap import Panel, Text
+            <div id="e5feeec7-4963-4cca-abb4-d3f5da2df185">
+             <pre id="e45813d3-42ff-4412-8552-95c528926558"><code class="language-python">from bootwrap import Panel, Text
 panel = Panel(
   Panel(Text("Primary").as_primary()).as_primary().as_outline(),
   Panel(Text("Secondary").as_secondary()).as_secondary().as_outline(),
@@ -7787,44 +7923,44 @@ panel = Panel(
 for anchor in panel:
   anchor.mb(1)
 panel</code></pre>
-             <div id="56b6d9f3-4366-458e-b275-9a89cf7fc4e5">
-              <div class="mb-1 border border-primary" id="69e5da1c-71af-4792-ac2a-ae9cfa5e14fb">
-               <span class="text-primary" id="47876f3c-e488-4f90-929d-8de8b46242d6">
+             <div id="711b81ac-44dd-485f-8dc5-f045f4480ddb">
+              <div class="mb-1 border border-primary" id="cb0e106f-9ac3-4870-b8ed-78fb4f2e8fe4">
+               <span class="text-primary" id="0fa5d6b1-65bd-437d-a1e7-a883b1288259">
                 Primary
                </span>
               </div>
-              <div class="mb-1 border border-secondary" id="648739c5-da99-4830-9089-1172dbce67a9">
-               <span class="text-secondary" id="059a9c86-9c9f-48fe-85eb-e8111c851c0e">
+              <div class="mb-1 border border-secondary" id="aab60ecf-112e-48b5-b5ee-8aaaa14f8ec6">
+               <span class="text-secondary" id="666983b9-f202-47c3-9507-8027c1f7d90e">
                 Secondary
                </span>
               </div>
-              <div class="mb-1 border border-success" id="e7aa5239-9777-4418-a05a-0fcc886eca3c">
-               <span class="text-success" id="32a0baba-6dd5-41c7-821f-4a70ec68682f">
+              <div class="mb-1 border border-success" id="bc685be4-2584-42cf-9e92-f6674779bc62">
+               <span class="text-success" id="b74d04f4-f2a5-4904-b26d-4d2b5acac222">
                 Success
                </span>
               </div>
-              <div class="mb-1 border border-warning" id="f2620be0-eb52-41a4-b663-4716d597b5e3">
-               <span class="text-warning" id="06769da2-af18-47f3-b72e-a53d1398466c">
+              <div class="mb-1 border border-warning" id="679338ff-4a3c-47b4-ae21-65deeb24449a">
+               <span class="text-warning" id="2e0474e6-13a4-41a6-bbed-28c87c4c045c">
                 Warning
                </span>
               </div>
-              <div class="mb-1 border border-danger" id="506be4cc-729d-4c68-96a1-3aac27a53d66">
-               <span class="text-danger" id="43643879-2ff3-4ef4-ab00-c752e3473684">
+              <div class="mb-1 border border-danger" id="b3eb4a6b-1466-4830-ae74-1c20ef57791d">
+               <span class="text-danger" id="5de58b3c-6d9a-412a-88dc-6dd52d4cc2d8">
                 Danger
                </span>
               </div>
-              <div class="mb-1 border border-info" id="dc66d29d-f9e4-4950-a4bc-1fa175394b39">
-               <span class="text-info" id="751f103f-ac35-4b73-966b-436ccbbf04e5">
+              <div class="mb-1 border border-info" id="c1f76025-e4a8-4d0e-a2d7-cdf358d36117">
+               <span class="text-info" id="16cc2836-4c8f-4577-8901-2bb0cca78f4e">
                 Info
                </span>
               </div>
-              <div class="mb-1 border border-light" id="c4d3cecd-afad-4a33-a860-319a27518d34">
-               <span class="text-light" id="2acd1473-7b67-4d31-8e45-61186b33a3d5">
+              <div class="mb-1 border border-light" id="9a26ad0b-0c8b-46e3-b2ee-2bf5230ba672">
+               <span class="text-light" id="78b5bc5a-ba2d-4d37-888b-eaee72baead5">
                 Light
                </span>
               </div>
-              <div class="mb-1 border border-dark" id="e3606083-718f-44f7-b9fe-622e69c6b7d8">
-               <span class="text-dark" id="9b0f3663-b8e7-416a-a6bd-8c75a1e2db26">
+              <div class="mb-1 border border-dark" id="86c05cbf-7688-489c-bc79-59bcf0793a16">
+               <span class="text-dark" id="07cf0f73-8b13-459d-ba3c-213ef3af20aa">
                 Dark
                </span>
               </div>
@@ -7838,27 +7974,27 @@ panel</code></pre>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="9f76d8e3-e7d4-465c-8904-92989d0563e0">
-     <div class="mt-5" id="9980cfee-8737-4dc9-87d7-87214e13b4ce">
-      <div class="d-flex justify-content-between" id="c692278b-a818-4a57-9fba-2c122483b46b">
-       <h1 id="cfee6329-fae3-48e9-bc1e-71c5392b86f2">
+    <div class="tab-pane fade" id="98279619-57db-4a97-80ac-c10757d39ee0">
+     <div class="mt-5" id="45d704d0-ac5d-4190-8bb6-ee5cc6afd218">
+      <div class="d-flex justify-content-between" id="abedcf41-ab57-4e92-87c1-2e0857d6d098">
+       <h1 id="a08633ca-d291-4b92-b712-c27cdab20710">
         Class
-        <span class="text-primary" id="6b4b9722-0edd-496a-ba11-4c0a9aa40da2">
+        <span class="text-primary" id="1cc7e54e-f16f-4c5d-bf97-039b956f7dd8">
          Separator
         </span>
        </h1>
-       <div id="148bae68-c440-456c-b2d2-22e21e404efb">
+       <div id="cf769388-4516-40de-b452-3ec86766de8c">
        </div>
       </div>
-      <span class="text-muted" id="a418c45b-fa13-4ec0-9685-e86e7ea51f99">
+      <span class="text-muted" id="05bcfc26-75dc-460f-9f11-1113ab426766">
        A horizontal line separator.
       </span>
-      <pre id="5b56597c-e399-47e0-9968-d7f14d3f129f"><code class="language-python">Separator()</code></pre>
-      <div class="ms-3" id="a6ffa3f6-bf75-4add-a483-baf7c3c9c986">
-       <h6 id="13fd3fa9-9db8-4100-baac-863a7f1a719d">
+      <pre id="e7224cb3-2925-4501-92e4-3b1c1be1ad8a"><code class="language-python">Separator()</code></pre>
+      <div class="ms-3" id="e96aeb6c-bd03-49c7-b0ba-c1a4644174e5">
+       <h6 id="d1b4b0e5-eecc-4f6b-a04d-f4bfb13349ed">
         Example
        </h6>
-       <pre id="cc734baf-6a56-444c-8a55-794ec83d973e"><code class="language-python">from bootwrap import Panel, Separator, Text
+       <pre id="5db25f43-be9c-4202-902c-6e5396725605"><code class="language-python">from bootwrap import Panel, Separator, Text
 
 Panel(
     Text("Top Text"),
@@ -7867,70 +8003,70 @@ Panel(
 )
 </code></pre>
       </div>
-      <div class="ms-3" id="1fd990d5-73d2-4289-8a98-1b0136dc5a15">
-       <div id="fbfa12d3-26e5-49b4-9c3a-0eb17b00aed2">
-        <span id="d197d8b3-bf94-43d9-99d3-46f6b0decfe9">
+      <div class="ms-3" id="0c92eb7f-f0fb-4ec0-a67f-bb350e690d13">
+       <div id="a15dbc86-e5bb-4070-8433-a7626ca5f1ba">
+        <span id="d5bc1f5e-f188-416c-a584-3a45d7e0fb01">
          Top Text
         </span>
         <hr/>
-        <span id="e65a747c-20e0-4ca7-b741-743805fa3042">
+        <span id="0986f978-ee58-46f0-84de-0a855d87ca3c">
          Bottom Text
         </span>
        </div>
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="ed2977cf-fedd-497b-9efa-0dc18edcd646">
-     <div id="1eb8ecd8-e655-4347-ae62-40159f66288f">
+    <div class="tab-pane fade" id="76b006e8-d6c5-4b33-b6c5-fcf28580ce05">
+     <div id="e9e47bed-5f7e-4ab6-ace0-41bdb0180146">
       <hr/>
-      <ul class="nav" id="6fedfd40-7233-40b1-a582-5843f60691b4" role="tablist">
+      <ul class="nav" id="c590e0aa-5929-4ca7-bab4-42cf26da10f0" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#08cfddcf-2ab5-459b-9f17-d6065bb03f22" data-bs-toggle="tab" href="#08cfddcf-2ab5-459b-9f17-d6065bb03f22" id="3056d45d-3505-4226-a4e5-d268bce9322b" role="tab">
-         <span class="text-secondary" id="17735231-b8c7-48dc-bd45-4c04abfb76a3">
+        <a class="nav-link active" data-bs-target="#aa28e171-9b1f-4fcb-9f83-c933f5a5a6cb" data-bs-toggle="tab" href="#aa28e171-9b1f-4fcb-9f83-c933f5a5a6cb" id="838d9d65-998b-4771-9b5b-105ccf861412" role="tab">
+         <span class="text-secondary" id="bf3edb5c-1842-4c2d-9323-a5c46dfcfeb2">
           Table
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#05e07221-be1b-4a97-a432-ed8003fc157b" data-bs-toggle="tab" href="#05e07221-be1b-4a97-a432-ed8003fc157b" id="414c4976-5055-4168-951c-6b722980757a" role="tab">
-         <span class="text-secondary" id="3be0804e-c6f4-4aaf-a532-e66f039e111d">
+        <a class="nav-link" data-bs-target="#489ca2a9-34ca-4c5c-a4a5-ed767a5fd54e" data-bs-toggle="tab" href="#489ca2a9-34ca-4c5c-a4a5-ed767a5fd54e" id="9bef842a-1854-41d1-b9d1-5fdb98d37d72" role="tab">
+         <span class="text-secondary" id="a941db83-1b87-4496-a4d6-6d1ad960d972">
           Table.Head
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#77a4557b-4775-4eab-9a56-a11d931981dd" data-bs-toggle="tab" href="#77a4557b-4775-4eab-9a56-a11d931981dd" id="2a3c701d-4f68-4fec-98d4-9866d1e0fe17" role="tab">
-         <span class="text-secondary" id="e85b15ab-d3f7-4ca8-899c-9c5bfb1567ed">
+        <a class="nav-link" data-bs-target="#abece634-be54-4b85-b64e-5868a89c3045" data-bs-toggle="tab" href="#abece634-be54-4b85-b64e-5868a89c3045" id="12bef1a4-c398-4a19-b6f6-0f93b91863cc" role="tab">
+         <span class="text-secondary" id="014b8926-b900-4a7c-ba6c-e6a6a26ac642">
           Table.Body
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="08cfddcf-2ab5-459b-9f17-d6065bb03f22">
-        <div class="mt-5" id="d16a7fde-329e-41c9-b152-ca485334c3fd">
-         <div class="d-flex justify-content-between" id="64ae5ab7-118b-4bd9-914f-8208f4308a32">
-          <h1 id="d71d48ee-1015-4f08-ba84-764626c3b0d1">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="aa28e171-9b1f-4fcb-9f83-c933f5a5a6cb">
+        <div class="mt-5" id="f0679fcf-2471-4228-971b-5a9b91053451">
+         <div class="d-flex justify-content-between" id="53765a42-d3e6-49ab-b99a-c26458629cee">
+          <h1 id="4920dcf3-80e2-480b-bb63-a54e9ca24070">
            Class
-           <span class="text-primary" id="ceea31bb-05a5-4f6c-a7cd-eaa29ee5c65f">
+           <span class="text-primary" id="08292838-cbde-4eff-bd61-0005aac288cb">
             Table
            </span>
           </h1>
-          <div id="c11dfe42-1602-4489-a1fe-7123511bb856">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f0a9fa15-2e99-4cc3-8a10-a9d59d3f81da" data-bs-toggle="collapse" id="c695cf02-b813-464f-af87-f47a7bebcba8" onclick="return false;" type="button">
+          <div id="44ccddee-5aa1-4a65-931b-2c605e00469b">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#0b28cf4e-07d7-4c71-8f3e-2a70d62b9610" data-bs-toggle="collapse" id="8fb39b42-aa5d-4500-9837-53a6843cc34e" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="7f4ca0dd-41e4-44d5-ab5e-1585688be70a">
+         <span class="text-muted" id="f51b42ac-9d0d-4a53-a53b-753657f7f193">
           A web component for a table.
          </span>
-         <pre id="28fd2654-bb2a-4999-8a0f-069e85d2c6c4"><code class="language-python">Table(head, body)</code></pre>
-         <div class="ms-3 collapse" id="f0a9fa15-2e99-4cc3-8a10-a9d59d3f81da">
-          <h6 id="85d3655b-cb44-4e11-8370-88ca6d487bcc">
+         <pre id="19076523-d867-459a-a85c-28c6d9231265"><code class="language-python">Table(head, body)</code></pre>
+         <div class="ms-3 collapse" id="0b28cf4e-07d7-4c71-8f3e-2a70d62b9610">
+          <h6 id="2743e912-3d41-4792-a355-64290a3eb407">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="f192991e-c4ab-4d4c-ab07-d48d8891295f">
+          <table class="table table-sm bg-light" id="a29f65a2-37c3-4978-a6e8-96861716cd7a">
            <thead>
             <tr>
              <th scope="col">
@@ -7978,11 +8114,11 @@ Panel(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="9c6c67f1-5b40-408f-a3b7-9612249c4067">
-          <h6 id="453e7bcc-6ecd-46d8-bd58-bc364190adc4">
+         <div class="ms-3" id="0d0c779f-1f2e-4163-8792-94e9cbacfb44">
+          <h6 id="013655a7-352c-4318-afc7-314539df06ee">
            Example
           </h6>
-          <pre id="8de767a0-5865-4d04-8e24-5da2b4f6f72a"><code class="language-python">from bootwrap import Table
+          <pre id="d1c42612-7aea-4666-868d-f588452344b2"><code class="language-python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -7994,8 +8130,8 @@ Table(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="7593ed72-6181-401d-a9d5-01a36467019e">
-          <table class="table" id="23993f20-6560-4884-b48b-cc1434d844c9">
+         <div class="ms-3" id="fa997d87-1d16-4eb0-ab4a-1e19573edf22">
+          <table class="table" id="57332e54-1aef-4b13-a64a-cfc0008793ab">
            <thead>
             <tr>
              <th scope="col">
@@ -8046,51 +8182,51 @@ Table(
            </tbody>
           </table>
          </div>
-         <div class="mt-5" id="e8ba4748-cd13-4807-b8dd-b09cb9b3dd58">
-          <h4 id="acdea8bd-c469-403d-ac14-f96dedcfc703">
+         <div class="mt-5" id="c95cff9a-cef2-4a71-80dc-2b40a533891f">
+          <h4 id="85e78318-7306-4c54-83e0-bbc041fc7e71">
            Property
-           <span class="text-primary" id="ac1b69e0-c4ab-4a74-a058-ef4a7f6e97ae">
+           <span class="text-primary" id="fe92eb3a-d85b-48eb-b8d1-7660d790b54f">
             body
            </span>
           </h4>
-          <span class="text-muted" id="42dd4d4f-6892-4d95-9feb-e2299727ad9b">
+          <span class="text-muted" id="07952f0e-39f4-4d37-9be1-22506d3e91a3">
            The table body.
           </span>
          </div>
-         <div class="mt-5" id="c6bb0d24-fa81-42b5-8507-7da5d51ed320">
-          <h4 id="3d23cb21-d9ab-4e29-84e6-b639a13f1f49">
+         <div class="mt-5" id="f4b3ec38-37b4-4788-ab39-58388011f2ba">
+          <h4 id="04260ce3-a420-48bc-b803-ea5f86c7fd86">
            Property
-           <span class="text-primary" id="9b1bce14-4e85-4545-927b-9c116a3645f9">
+           <span class="text-primary" id="8e79b484-6e34-40a3-8d45-8ebf6d28c095">
             head
            </span>
           </h4>
-          <span class="text-muted" id="9e5e8c91-3202-477e-9126-b20cf9a0159f">
+          <span class="text-muted" id="1796d440-2549-4e2a-8719-d6e04db1dc25">
            The table head.
           </span>
          </div>
-         <div class="mt-5" id="34f880d8-aefc-4daf-82d4-b0744a9501fd">
-          <div class="d-flex justify-content-between" id="bf45ae22-d2d4-4651-963b-71e142407133">
-           <h4 id="f836e5eb-3e18-4e15-8079-8fa20a4b4702">
+         <div class="mt-5" id="670f2a37-78b8-4743-ba87-64b2c7531991">
+          <div class="d-flex justify-content-between" id="f1feca83-6d06-491e-a42b-9e7b078b8e77">
+           <h4 id="a7ef8092-5faa-44f0-b870-f2cc920c2946">
             Method
-            <span class="text-primary" id="6110876e-3cbb-4689-9a9b-29e0688a2a39">
+            <span class="text-primary" id="6ee0ee09-7a0f-4b4d-ad93-fb83b2413854">
              as_bordered
             </span>
            </h4>
-           <div id="3152ef79-ac32-4625-8def-47e6adc9d2b8">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#b96f8935-1d1e-4270-881a-cd9b0dfcb2d0" data-bs-toggle="collapse" id="e23f591b-34dd-47fa-825e-364a72739e0a" onclick="return false;" type="button">
+           <div id="f9f6be43-71df-43a8-8bb5-b25833da3735">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#2de0002a-a1ad-4627-ae18-9a0294154280" data-bs-toggle="collapse" id="858598dc-2aab-454e-afce-9355914bf0ad" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="7486dcf8-9e7a-4518-94f9-957967a9e928">
+          <span class="text-muted" id="dbb26e3c-d4c5-4ffe-aeee-d8844b114f8c">
            Adds borders on all sides of the table and cells.
           </span>
-          <pre id="1ab5beb6-65c5-4fd0-83f9-6bcc3c168621"><code class="language-python">as_bordered()</code></pre>
-          <div class="ms-3 collapse" id="b96f8935-1d1e-4270-881a-cd9b0dfcb2d0">
-           <h6 id="21533d10-fba2-4985-8ce8-c3df10a50af4">
+          <pre id="dae44569-711d-4087-8043-a6b005187d2f"><code class="language-python">as_bordered()</code></pre>
+          <div class="ms-3 collapse" id="2de0002a-a1ad-4627-ae18-9a0294154280">
+           <h6 id="e2adcfc7-1cca-4458-bf4b-92c1a674a19c">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="ad3bb1d1-29a2-4730-bdd2-891e28df5330">
+           <table class="table table-sm bg-light" id="28ab4aa8-6ee1-4c96-b2a3-59603141eabc">
             <thead>
              <tr>
               <th scope="col">
@@ -8123,11 +8259,11 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="f4a87acf-d1b5-44c6-9089-eb9d519e7c28">
-           <h6 id="bf64a883-7a52-43f1-aea5-3e0b5e2bc0e6">
+          <div class="ms-3" id="3a116b2a-34f8-432b-914a-5439e096a906">
+           <h6 id="b2381147-abdc-4e60-90b0-785c5f5109bf">
             Example
            </h6>
-           <pre id="c67b66d0-c48c-4666-96da-7824e38e40dc"><code class="language-python">from bootwrap import Table
+           <pre id="fb510539-d8c4-48ac-bb51-ce97aad8b94a"><code class="language-python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -8139,8 +8275,8 @@ Table(
 ).as_bordered()
 </code></pre>
           </div>
-          <div class="ms-3" id="96cebb75-fab4-4cf2-a8be-eca2ae2302d1">
-           <table class="table table-bordered" id="e35fe875-8372-4cbf-84af-6bc0af480071">
+          <div class="ms-3" id="5d9b8aca-d4a0-4096-8bf6-195c52b4aaed">
+           <table class="table table-bordered" id="a73b83ab-4f15-4de2-9a06-354cb46ad250">
             <thead>
              <tr>
               <th scope="col">
@@ -8192,29 +8328,29 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="a570aa7f-39bd-4ea6-a7a5-be02711f335d">
-          <div class="d-flex justify-content-between" id="b0ba2b64-8ce9-4202-8812-ffd535234b52">
-           <h4 id="72a1fc56-3ad0-4e79-b0dc-483132f08686">
+         <div class="mt-5" id="2bf4fd62-0c24-4c5c-930b-5d03ef9a18de">
+          <div class="d-flex justify-content-between" id="fa40ca36-65d2-4753-b16e-9dc9f7562e1b">
+           <h4 id="5b1b6094-3dd9-49c9-b6a6-54f211fa0e06">
             Method
-            <span class="text-primary" id="a2828f1b-2d8b-4db3-b89e-7c7d817af5a4">
+            <span class="text-primary" id="5cd8fa75-1ae5-4ece-9cce-120b08a07858">
              as_dark
             </span>
            </h4>
-           <div id="8722f223-490e-4931-9bd9-d861994504b8">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#48e27a05-91c1-463d-b2d3-ad95d66fbd8c" data-bs-toggle="collapse" id="b05dd940-b178-4dc6-bb5f-7bd62869bfd6" onclick="return false;" type="button">
+           <div id="94c9d631-2a32-4e13-a675-658ddeb03903">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#53087cd9-6647-4415-9ce0-86cf607a8e0d" data-bs-toggle="collapse" id="153d2090-8bd8-4f11-b892-90e75b3c1d3a" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="6954017a-25f1-44b3-8c6d-545122b6b8a2">
+          <span class="text-muted" id="2520de23-d307-4c82-bb3f-3fc90fbca96e">
            Inverts the colors—with light text on dark backgrounds.
           </span>
-          <pre id="182fc540-2406-4f8b-9e97-681a63902453"><code class="language-python">as_dark()</code></pre>
-          <div class="ms-3 collapse" id="48e27a05-91c1-463d-b2d3-ad95d66fbd8c">
-           <h6 id="d713380d-90d4-4d0b-a72f-d07a924607e5">
+          <pre id="9cad6daa-f98e-412b-bc62-5ea56aaef9a5"><code class="language-python">as_dark()</code></pre>
+          <div class="ms-3 collapse" id="53087cd9-6647-4415-9ce0-86cf607a8e0d">
+           <h6 id="2551651a-1028-42ad-80a0-c26114586f84">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="00222463-f176-49e5-bc44-2b1f4b860086">
+           <table class="table table-sm bg-light" id="d1e7c59c-a798-4916-806e-2461bf870929">
             <thead>
              <tr>
               <th scope="col">
@@ -8247,11 +8383,11 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="cc0d19b8-8bd6-4c5b-bae4-46908fffead6">
-           <h6 id="1201970d-603a-4b71-afb1-ec571ba70ca5">
+          <div class="ms-3" id="40966f5f-ec35-4434-aab0-af7fbc3943b7">
+           <h6 id="831dfab4-289e-4d6e-828e-0d7e186b8cbd">
             Example
            </h6>
-           <pre id="c8d7ad85-2d2f-4cf8-8d74-26f82c4b483b"><code class="language-python">from bootwrap import Table
+           <pre id="f2ade36e-d2da-4d94-956c-0af1f0f70bdd"><code class="language-python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -8263,8 +8399,8 @@ Table(
 ).as_dark()
 </code></pre>
           </div>
-          <div class="ms-3" id="ce4f497e-dbe1-41d8-919c-42b67df81c1e">
-           <table class="table table-dark" id="49813244-7038-4b1b-9ccc-ca97dc340912">
+          <div class="ms-3" id="ded65afb-80a2-4c68-a647-5e38d2765a81">
+           <table class="table table-dark" id="a3692923-54e3-4458-89e8-54cc39f05e42">
             <thead>
              <tr>
               <th scope="col">
@@ -8316,32 +8452,32 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="acf685ce-c352-4b2f-9957-d54cf5da54ae">
-          <div class="d-flex justify-content-between" id="fde162e5-9ac0-4923-a1fb-68ec615aff99">
-           <h4 id="fecc4c29-e49b-4e62-a445-d39059184616">
+         <div class="mt-5" id="0568e62b-1c3a-4d6a-ae2a-76f76a9e93d6">
+          <div class="d-flex justify-content-between" id="9bbb7294-edd9-4f0a-926d-c9bed17edef8">
+           <h4 id="d13f0a22-6c05-4758-808c-0f22bf0c4947">
             Method
-            <span class="text-primary" id="d0c485df-5c09-4d11-aff2-f6828d6679c0">
+            <span class="text-primary" id="e1d09da8-7759-4194-9d46-6bdfe41e5d31">
              as_responsive
             </span>
            </h4>
-           <div id="51abbbaa-abd7-44c8-aeff-36446876a65b">
-            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f7c60479-2e90-4848-b7d9-ec6f34a6f6e1" data-bs-toggle="collapse" id="9299f117-13dd-4948-af79-958cc9a60809" onclick="return false;" type="button">
+           <div id="231aed5c-02af-457f-ae31-0bddc7c8b0fb">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#37987aba-1ad5-483f-875c-27a90a97021c" data-bs-toggle="collapse" id="8a9e639a-385f-42cf-ab44-47b65422afe3" onclick="return false;" type="button">
              Argument
             </button>
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#18b67238-27a1-4c7c-8c03-7b1b1c334002" data-bs-toggle="collapse" id="8f4e93d5-1349-48e9-800e-f035723d3a59" onclick="return false;" type="button">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#ab91be44-80c6-4e99-b96e-854783ec9c96" data-bs-toggle="collapse" id="5af4f0df-2c76-496e-8723-85e80e807cd9" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="b0bb7d03-cbba-4121-8e7c-c4bfd32cd716">
+          <span class="text-muted" id="dd893c50-87bd-4d0a-982b-341a70c45955">
            Create responsive tables.
           </span>
-          <pre id="b44a86c2-f382-41e0-b15a-028bac1fbc6f"><code class="language-python">as_responsive(breakpoint=<breakpoint.sm: 'sm'="">)</breakpoint.sm:></code></pre>
-          <div class="ms-3 collapse" id="f7c60479-2e90-4848-b7d9-ec6f34a6f6e1">
-           <h6 id="80a8d4ee-b1b8-4d5e-b7f6-02ef50740236">
+          <pre id="d956d4c9-ebfa-407c-99a4-b3b33dd5612a"><code class="language-python">as_responsive(breakpoint=<breakpoint.sm: 'sm'="">)</breakpoint.sm:></code></pre>
+          <div class="ms-3 collapse" id="37987aba-1ad5-483f-875c-27a90a97021c">
+           <h6 id="84d40f94-6270-42bc-b7ab-2b9249aa1ac9">
             Arguments
            </h6>
-           <table class="table table-sm bg-light" id="f7eb3a75-fb43-44d9-b9aa-438f1588d8a1">
+           <table class="table table-sm bg-light" id="ec1f7325-30a0-411c-89b4-e3423aa8e64a">
             <thead>
              <tr>
               <th scope="col">
@@ -8374,11 +8510,11 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3 collapse" id="18b67238-27a1-4c7c-8c03-7b1b1c334002">
-           <h6 id="fe71fed8-b5f0-4aaa-8a76-7534dfbfc905">
+          <div class="ms-3 collapse" id="ab91be44-80c6-4e99-b96e-854783ec9c96">
+           <h6 id="66a19702-9957-4c49-98d6-d611e61ae64a">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="cb9a3229-02f6-4ce2-9d8a-0d0c28f187e9">
+           <table class="table table-sm bg-light" id="0535e3b2-1692-4d31-b350-4f88faa74324">
             <thead>
              <tr>
               <th scope="col">
@@ -8411,11 +8547,11 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="27de9b68-7573-4ff5-90d9-6ddbecc768d3">
-           <h6 id="54a5a7f0-5397-4888-8694-b90207598136">
+          <div class="ms-3" id="4944fe94-7843-4e17-9cf2-26f79543f6fc">
+           <h6 id="7bf7422a-c6dd-4d18-9b55-bf4dc54ef163">
             Example
            </h6>
-           <pre id="001e2547-107c-4846-9d7c-14ad6d424e5d"><code class="language-python">from bootwrap import Table
+           <pre id="f4424975-478f-47db-a4ba-9c671c9cb19f"><code class="language-python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -8427,8 +8563,8 @@ Table(
 ).as_responsive()
 </code></pre>
           </div>
-          <div class="ms-3" id="6b0fef98-466a-482c-81d0-08b0acdecc31">
-           <table class="table table-responsive-sm" id="ce111e54-a4c0-4cfd-a11f-510d4558ad72">
+          <div class="ms-3" id="0c5e566c-88a8-4ead-bf43-b22958a0620e">
+           <table class="table table-responsive-sm" id="31e54e0a-1b4c-4cb8-95fa-f1504fac52d1">
             <thead>
              <tr>
               <th scope="col">
@@ -8480,29 +8616,29 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="19c44ef2-09ca-497e-940a-f4bf2362811f">
-          <div class="d-flex justify-content-between" id="f9bf9e6a-11d0-4a89-963a-7e603004f4cf">
-           <h4 id="3d97917c-46bd-4933-a6c4-9e8ec88c140a">
+         <div class="mt-5" id="99cee13e-8f7d-4c36-afd5-9c106f73d248">
+          <div class="d-flex justify-content-between" id="1c4c65d4-b72a-43e9-ab3d-d8c44634b1c7">
+           <h4 id="c5902e0e-2008-44ee-9f36-cd347c586476">
             Method
-            <span class="text-primary" id="fc08cfa2-5b7e-4119-b48d-84e549628d6c">
+            <span class="text-primary" id="9da3544d-fd83-42db-99d3-ab27fa619044">
              as_small
             </span>
            </h4>
-           <div id="023e4446-7232-40fa-b708-04c161a0ea17">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#61ef79aa-4445-4b48-98ca-bcefb4f73722" data-bs-toggle="collapse" id="dd491919-e9fb-426f-b945-c4c4ee709017" onclick="return false;" type="button">
+           <div id="b70be7d9-713e-4f1d-be8a-dccc76ee08ed">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#6ada46c3-d81c-41d1-afa1-501814241b2a" data-bs-toggle="collapse" id="42b26036-da44-4100-8d54-668d4b4550ec" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="248226ce-806a-4fbe-af86-53f2f77cd265">
+          <span class="text-muted" id="0e924f09-cf23-4681-9a8f-aaa1bd168c03">
            Make tables more compact by cutting cell padding in half.
           </span>
-          <pre id="2a4ed9b6-40cc-4b2d-a219-489557f18dcf"><code class="language-python">as_small()</code></pre>
-          <div class="ms-3 collapse" id="61ef79aa-4445-4b48-98ca-bcefb4f73722">
-           <h6 id="58c2422a-13bd-4b44-bd84-418b0b1bfae6">
+          <pre id="c6975e02-10b0-4ce9-96f7-15a4768be533"><code class="language-python">as_small()</code></pre>
+          <div class="ms-3 collapse" id="6ada46c3-d81c-41d1-afa1-501814241b2a">
+           <h6 id="2024a45b-573d-41a8-8a45-caf38b951fea">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="51312a20-74ae-4ff8-acfd-c01e5b7e1298">
+           <table class="table table-sm bg-light" id="7f3af651-5321-4aa7-a2bf-5a7b7c5c3fb4">
             <thead>
              <tr>
               <th scope="col">
@@ -8535,11 +8671,11 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="14321766-239d-4b37-80bd-afaf9f0b2b17">
-           <h6 id="4a86fa1c-16e3-4cf1-854d-36a17c040003">
+          <div class="ms-3" id="1fb4ddbf-b1c6-4207-ae20-d483e1a1a6f0">
+           <h6 id="510761c1-842a-4cef-a193-e106d756efe7">
             Example
            </h6>
-           <pre id="7579950a-3c9e-49de-a998-b75b5a95c993"><code class="language-python">from bootwrap import Table
+           <pre id="22147956-9579-45c0-922a-94b40a32fed8"><code class="language-python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -8551,8 +8687,8 @@ Table(
 ).as_small()
 </code></pre>
           </div>
-          <div class="ms-3" id="7c9e1ee3-b4b4-410a-bdae-7471064637c1">
-           <table class="table table-sm" id="b7392970-d727-4b8c-a93f-faeb331d580a">
+          <div class="ms-3" id="babfed41-da22-4486-a12a-f9dd84b230c8">
+           <table class="table table-sm" id="2edcb84f-337e-4e32-8015-3bf1cac3f383">
             <thead>
              <tr>
               <th scope="col">
@@ -8604,29 +8740,29 @@ Table(
            </table>
           </div>
          </div>
-         <div class="mt-5" id="93488775-bd7b-4c7d-af59-b7fdf101d01a">
-          <div class="d-flex justify-content-between" id="8e9a225a-5472-462c-b443-964808cafedb">
-           <h4 id="66684cbb-5740-427f-8155-0f3b88d64bac">
+         <div class="mt-5" id="7d72528b-2767-4269-93b9-fda1490200aa">
+          <div class="d-flex justify-content-between" id="7f863c0a-7eb0-4a31-a1b9-ee721020e723">
+           <h4 id="03909b62-5c9f-42b9-ab19-2dae94b2e619">
             Method
-            <span class="text-primary" id="2757929b-fa3c-40fb-99f3-6f9b1dd4597c">
+            <span class="text-primary" id="5e0935c5-a20f-4baf-aadf-f593cdd88d98">
              as_striped
             </span>
            </h4>
-           <div id="34daecfa-71d6-41af-8b88-1296433b0bff">
-            <button class="btn-sm btn btn-outline-primary" data-bs-target="#cbddf135-aeca-47ae-8943-6189f53ba444" data-bs-toggle="collapse" id="45ff2f01-b0e4-45a8-aa19-6e1fc5898abf" onclick="return false;" type="button">
+           <div id="838e0bf8-f100-42b8-85b4-519114c9c719">
+            <button class="btn-sm btn btn-outline-primary" data-bs-target="#447cca1c-6ad8-4800-9e67-5e4c7daf7356" data-bs-toggle="collapse" id="bc8abed1-0094-4b19-bd62-bdd0a395870d" onclick="return false;" type="button">
              Returns
             </button>
            </div>
           </div>
-          <span class="text-muted" id="635adfda-1b78-4564-837e-9b821be64c7d">
+          <span class="text-muted" id="eb68a21d-4780-44ba-a533-7daebfeb1950">
            Adds zebra-striping to any table row within the table body.
           </span>
-          <pre id="a6de1b23-d2be-48af-b664-14950eb17a07"><code class="language-python">as_striped()</code></pre>
-          <div class="ms-3 collapse" id="cbddf135-aeca-47ae-8943-6189f53ba444">
-           <h6 id="510c2501-4ffe-42c1-b91e-9d2871b05158">
+          <pre id="de4718d7-bb6c-422d-b606-21ab753bf331"><code class="language-python">as_striped()</code></pre>
+          <div class="ms-3 collapse" id="447cca1c-6ad8-4800-9e67-5e4c7daf7356">
+           <h6 id="7e609b28-b02d-4ecf-8d91-ca774d5bcf3f">
             Returns
            </h6>
-           <table class="table table-sm bg-light" id="2ec7d80e-5649-44ca-9edf-6e33928b4750">
+           <table class="table table-sm bg-light" id="042567f5-56c1-4552-aa4c-e6b21d683f05">
             <thead>
              <tr>
               <th scope="col">
@@ -8659,11 +8795,11 @@ Table(
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="9d9990c6-9eab-4844-b381-428884b4c43e">
-           <h6 id="b5390682-09ff-423d-b57b-5900b57c8f2d">
+          <div class="ms-3" id="d05ce767-625e-48cb-9ee4-8b96195b6aa2">
+           <h6 id="2ec4c461-78b9-4ccc-99a2-36b218b27908">
             Example
            </h6>
-           <pre id="6f14576e-2c18-4fef-b568-81959a4bfa35"><code class="language-python">from bootwrap import Table
+           <pre id="f6967eb1-b985-4b5b-9626-3deaef562b26"><code class="language-python">from bootwrap import Table
 
 Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -8675,8 +8811,8 @@ Table(
 ).as_striped()
 </code></pre>
           </div>
-          <div class="ms-3" id="9ed8c2ec-058c-423e-8089-87710c94c307">
-           <table class="table table-striped" id="9ddccaa0-b130-4dc9-822a-6201e42cab34">
+          <div class="ms-3" id="6fbffad3-0ebf-45ff-a619-afcc11d39be9">
+           <table class="table table-striped" id="b3d6968b-9453-43b9-8150-e382ba66b6f2">
             <thead>
              <tr>
               <th scope="col">
@@ -8730,42 +8866,42 @@ Table(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="05e07221-be1b-4a97-a432-ed8003fc157b">
-        <div class="mt-5" id="5c174040-dc47-4ad9-ab2d-402b2062bb3d">
-         <div class="d-flex justify-content-between" id="bf3468b9-81c8-4474-8846-96186cb402ad">
-          <h1 id="fdc92da9-d658-4b68-8201-5899688312c0">
+       <div class="tab-pane fade" id="489ca2a9-34ca-4c5c-a4a5-ed767a5fd54e">
+        <div class="mt-5" id="ec2a1b97-9a14-4203-8351-d009a538e7b0">
+         <div class="d-flex justify-content-between" id="a2d93bf0-a9ab-4b1c-9c44-d0a9c17af33f">
+          <h1 id="ac875642-9fcd-491b-b679-bf0e7ec9a31f">
            Class
-           <span class="text-primary" id="3eaa6423-d4ad-49d6-b791-c1eb4ff29e52">
+           <span class="text-primary" id="3eac56e9-17fe-4c46-8571-f47a72893883">
             Table.Head
            </span>
           </h1>
-          <div id="68ce14af-4f8e-4c48-aa98-240f7227f3b1">
+          <div id="bdbf346a-5b12-42c1-9884-346069f290d9">
           </div>
          </div>
-         <span class="text-muted" id="ecdeaf60-3197-435b-91a2-3c4054397ba3">
+         <span class="text-muted" id="66fb7e32-5602-4880-a979-727ed9aa9cc5">
           The table head.
          </span>
-         <pre id="1f720d38-5b9a-4464-8b75-664b43bf5b33"><code class="language-python">Table.Head(head)</code></pre>
-         <div class="mt-5" id="a59c8f7c-deca-4aab-b68f-6f60eff4746e">
-          <div class="d-flex justify-content-between" id="167b8d41-daef-4943-a75e-d2f023e17dec">
-           <h4 id="a701a2a3-3f98-404e-979c-9db71cae0860">
+         <pre id="3531a435-27cf-4a7e-be0d-14475a92e8c5"><code class="language-python">Table.Head(head)</code></pre>
+         <div class="mt-5" id="4accb6a5-2347-4777-bab5-46985cb0c288">
+          <div class="d-flex justify-content-between" id="5edf3e12-f51e-42d1-bc1e-c4e0a42c8724">
+           <h4 id="a18eadae-0d18-4410-8419-2fa0f32d4bd9">
             Method
-            <span class="text-primary" id="a0d9c9ce-558a-4ab4-b76c-402372372386">
+            <span class="text-primary" id="9241ac56-9d0b-45b4-b1f3-9cbffac87299">
              as_dark
             </span>
            </h4>
-           <div id="9085b1de-b974-4f53-bbd1-a4a46af1acff">
+           <div id="cfd573b6-95b0-483a-b38e-614477b7f9df">
            </div>
           </div>
-          <span class="text-muted" id="61a2f580-c277-4d28-b962-97567fab66fd">
+          <span class="text-muted" id="8785ea84-9ff1-4f62-9041-343f24c91a2c">
            Makes the table head appears as dark gray.
           </span>
-          <pre id="bd4db9e1-b318-4295-bd1d-d2c5bfcb1071"><code class="language-python">as_dark()</code></pre>
-          <div class="ms-3" id="e91ea103-5540-4e53-bc73-0514498494e5">
-           <h6 id="5d76f22b-a5ce-4ca7-b17b-78fc0f4a491e">
+          <pre id="d3d4813f-ff5e-4730-92a0-88ca5f0c1966"><code class="language-python">as_dark()</code></pre>
+          <div class="ms-3" id="cec574c8-3220-42f2-b8e7-92311fb7541c">
+           <h6 id="2ba2cf6d-1fb8-4705-a55d-4e2f523b32a3">
             Example
            </h6>
-           <pre id="1ecfe600-4dd9-4320-85a8-6c3c59f71dbd"><code class="language-python">from bootwrap import Table
+           <pre id="a5147ddf-97ca-4149-be6e-1a52ef31817c"><code class="language-python">from bootwrap import Table
 
 table = Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -8780,8 +8916,8 @@ table.head.as_dark()
 table
 </code></pre>
           </div>
-          <div class="ms-3" id="cf35d5af-469b-477b-b4ca-32a409511ff1">
-           <table class="table" id="c7a18234-44ed-423c-a5a5-efb6d4ad8165">
+          <div class="ms-3" id="bd3a0ead-7fb5-4dca-a896-cda297625948">
+           <table class="table" id="8b47ef59-7239-4362-b7e4-6aa856d899c5">
             <thead class="thead-dark">
              <tr>
               <th scope="col">
@@ -8833,26 +8969,26 @@ table
            </table>
           </div>
          </div>
-         <div class="mt-5" id="9e6ed453-79fd-437d-99ef-3f2ca220d819">
-          <div class="d-flex justify-content-between" id="f2097411-14fe-4c6e-a30f-f455377c2751">
-           <h4 id="e4a80380-7a85-4d1a-81d7-c23b03af7dde">
+         <div class="mt-5" id="52989018-8084-4481-8354-98344d6d1ed3">
+          <div class="d-flex justify-content-between" id="06d251f5-d10b-4b2e-a525-fb927881d024">
+           <h4 id="b234c916-1c1c-42ac-b7ae-1a36f2fb23bd">
             Method
-            <span class="text-primary" id="c3316ed2-ef24-4e89-94ef-e09322b770f5">
+            <span class="text-primary" id="d4f92deb-e098-4c03-acd0-2d898ea4c420">
              as_light
             </span>
            </h4>
-           <div id="e42285fe-9c6a-4ea6-9e5a-f5f2828ce7a9">
+           <div id="e5bfcf8e-fd6b-40bd-8c8b-c796b18f26ec">
            </div>
           </div>
-          <span class="text-muted" id="b96bcfb0-047d-49a5-8b67-5227f86c7840">
+          <span class="text-muted" id="d24bab8f-eb07-4f57-8f81-1a866d523f10">
            Makes the table head appears as light gray.
           </span>
-          <pre id="a904ffa2-c83f-4361-b229-3a1895682bbf"><code class="language-python">as_light()</code></pre>
-          <div class="ms-3" id="67bfe38f-7046-4f34-80eb-dd776cdc3ca2">
-           <h6 id="6180341e-eaac-4258-96e0-06221f1eb5ac">
+          <pre id="7f494b3c-741b-4347-a75c-c1cbf25ff802"><code class="language-python">as_light()</code></pre>
+          <div class="ms-3" id="355ab20d-9cea-472f-85f1-0580fda8b90a">
+           <h6 id="ecca2df2-3fd0-409d-9181-e60cbd2a55c7">
             Example
            </h6>
-           <pre id="b7edbf91-ec44-4e5a-87a2-5e732a2fa394"><code class="language-python">from bootwrap import Table
+           <pre id="862f8dab-6873-4ca6-b7e8-c66e3ae332ef"><code class="language-python">from bootwrap import Table
 
 table = Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -8867,8 +9003,8 @@ table.head.as_light()
 table
 </code></pre>
           </div>
-          <div class="ms-3" id="cb8c014f-c92c-41cb-9bdd-2176ffef0a4b">
-           <table class="table" id="ae8d0348-c2f3-46b7-b5b3-fb716210a742">
+          <div class="ms-3" id="68ea4ff1-77d0-4574-bf28-75a41085e339">
+           <table class="table" id="178768e7-2548-4b71-98d5-c67473f30834">
             <thead class="thead-light">
              <tr>
               <th scope="col">
@@ -8922,45 +9058,45 @@ table
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="77a4557b-4775-4eab-9a56-a11d931981dd">
-        <div class="mt-5" id="911ed6fa-7978-4fb3-b35d-3625a222eea8">
-         <div class="d-flex justify-content-between" id="75b875a8-4070-4e14-897d-ce07fc879fa1">
-          <h1 id="e559f2f4-beb5-4f07-8b74-2aa39e588dc5">
+       <div class="tab-pane fade" id="abece634-be54-4b85-b64e-5868a89c3045">
+        <div class="mt-5" id="a46b35df-e9b3-491b-9e55-a5ad328c052f">
+         <div class="d-flex justify-content-between" id="e85cf272-b490-4c31-aa71-e2e909fa9292">
+          <h1 id="56680c24-0a15-4eba-86fe-a0aed2cd24ec">
            Class
-           <span class="text-primary" id="5714de00-029a-43b0-86ed-c77bc8c71044">
+           <span class="text-primary" id="c28fd540-b15b-4e99-9c85-7a8caa483982">
             Table.Body
            </span>
           </h1>
-          <div id="dea83f64-2248-441e-80ab-7cb5d8a73c4c">
+          <div id="4680433d-dbfe-4e71-b91b-08833b1c2434">
           </div>
          </div>
-         <span class="text-muted" id="b74ba918-e14a-4c8c-a76d-3d63f8f8d7b7">
+         <span class="text-muted" id="27957042-d6c1-4103-97ff-87afd6d93670">
           The table body.
          </span>
-         <pre id="db0c60b4-a21d-49b3-a8bf-eed67570e02f"><code class="language-python">Table.Body(body)</code></pre>
-         <div class="mt-5" id="511432e5-ac54-47b6-b891-d3490c3f8ff3">
-          <div class="d-flex justify-content-between" id="6554b44b-3c7a-4b2f-b298-237a5a6a970b">
-           <h4 id="1f8724c1-1f1c-4d29-8d9b-a077545d49c9">
+         <pre id="6f5634e7-db76-420f-be2b-769c22292738"><code class="language-python">Table.Body(body)</code></pre>
+         <div class="mt-5" id="c1ba43d4-9176-4091-a0d9-eb9a6eaeb770">
+          <div class="d-flex justify-content-between" id="9e4d4028-af52-4c3f-85b0-49701c5f1d85">
+           <h4 id="81ff5aa5-9830-4127-a1db-b0d49adada82">
             Method
-            <span class="text-primary" id="23a85673-6a36-48d4-9706-c09abcfc842f">
+            <span class="text-primary" id="8e6525de-c0c6-4af9-89fb-abd97214335d">
              transform
             </span>
            </h4>
-           <div id="c22014d8-1ccf-40bb-badc-47fbfd5cb412">
-            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#f64f872f-f3d0-4e7e-9c97-b80f1907e3e7" data-bs-toggle="collapse" id="9aeac2f1-9f88-403d-b2e0-4c5a1d94b062" onclick="return false;" type="button">
+           <div id="cd76566b-c5b4-4b25-a702-2b6a59af8f12">
+            <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#875e1202-04dc-4226-b249-45cbee36c35a" data-bs-toggle="collapse" id="665b23b0-dde7-4a59-97f3-429baec0c644" onclick="return false;" type="button">
              Argument
             </button>
            </div>
           </div>
-          <span class="text-muted" id="42e83c25-8a7e-4155-94f6-2c637d94acdf">
+          <span class="text-muted" id="9a4cc652-18ae-44a7-a71d-5b59b4e9795b">
            Defines a function to transform a cell value
           </span>
-          <pre id="af52b355-75d5-40cf-b93c-260638575002"><code class="language-python">transform(index, entity, fn)</code></pre>
-          <div class="ms-3 collapse" id="f64f872f-f3d0-4e7e-9c97-b80f1907e3e7">
-           <h6 id="989c1678-552c-4fd7-a6d3-24765e964645">
+          <pre id="d91f345d-6b6a-4fdc-89a2-a2327aa7e860"><code class="language-python">transform(index, entity, fn)</code></pre>
+          <div class="ms-3 collapse" id="875e1202-04dc-4226-b249-45cbee36c35a">
+           <h6 id="76f58115-8b19-4c3d-8e4c-328ed9c32ea4">
             Arguments
            </h6>
-           <table class="table table-sm bg-light" id="dc2ae4f3-0123-483a-a249-352f1311a754">
+           <table class="table table-sm bg-light" id="2e45c06c-b6f2-45d1-b514-76726ebaab44">
             <thead>
              <tr>
               <th scope="col">
@@ -9025,11 +9161,11 @@ table
             </tbody>
            </table>
           </div>
-          <div class="ms-3" id="db67d48c-3ec5-4914-94df-ec013b7d8ab8">
-           <h6 id="11389547-f8d1-4a34-8e9a-3bc38da2312a">
+          <div class="ms-3" id="db25f259-309a-4607-b66b-cce6b5129f49">
+           <h6 id="77a873b4-1cdb-4c3a-8f4c-428aeaf03301">
             Example
            </h6>
-           <pre id="81125101-cd38-43db-8f4c-bbb17c6fa3a2"><code class="language-python">from bootwrap import Table, TableEntity, Text
+           <pre id="764cc7ec-5672-43dd-9349-f099c51252d3"><code class="language-python">from bootwrap import Table, TableEntity, Text
 
 table = Table(
     ["Column 1", "Column 2", "Column 3"],
@@ -9061,8 +9197,8 @@ table.body.transform(
 table
 </code></pre>
           </div>
-          <div class="ms-3" id="3bba5eb9-b0d5-4341-9a24-61998c5c8169">
-           <table class="table" id="ac94e7d3-5a67-40e8-9463-ba3bcb169396">
+          <div class="ms-3" id="0d1bbc7e-aee2-458d-9bf9-12b630b5b661">
+           <table class="table" id="750ed124-c98e-4881-a32a-fb54a14c0cdb">
             <thead>
              <tr>
               <th scope="col">
@@ -9125,30 +9261,30 @@ table
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="7bbaf003-c029-4ded-8cd5-2e9e20756a68">
-     <div class="mt-5" id="59d8babb-479d-4a87-b84d-9ab9e95bf2b0">
-      <div class="d-flex justify-content-between" id="63eae3b3-6014-4eb7-b5fe-29b317befc06">
-       <h1 id="46d7d7c6-cf9f-4f7d-a688-e4e9585ecf04">
+    <div class="tab-pane fade" id="3c5b41a7-a5e9-48bd-aaf8-a575a4443ca7">
+     <div class="mt-5" id="827cccd1-04a5-4983-bb54-37e309946e05">
+      <div class="d-flex justify-content-between" id="7b69d042-6a08-4a1c-873d-eec5d09f125a">
+       <h1 id="1ba611fc-c16b-4f67-bf39-4d5934c4b669">
         Class
-        <span class="text-primary" id="5a7a9a04-21fd-4d8b-a999-3410106ac2a6">
+        <span class="text-primary" id="66aaf234-ee82-4907-ab36-3d3e18e88905">
          Text
         </span>
        </h1>
-       <div id="58534866-8e32-43ac-9620-13cc883919b4">
-        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#ddf2c53e-e58c-4c6e-ab5e-5a8f52dc44c2" data-bs-toggle="collapse" id="4a501f95-2424-4165-b065-095bdb54f653" onclick="return false;" type="button">
+       <div id="32a300f6-5476-4e54-b442-c0a9840957fd">
+        <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#fe47c225-ec60-4126-a81b-b3e86205d2fa" data-bs-toggle="collapse" id="172f5c66-8f10-4632-b20b-e160cde8ba2d" onclick="return false;" type="button">
          Argument
         </button>
        </div>
       </div>
-      <span class="text-muted" id="d0da7216-a6e5-4b60-807b-7d1fb8b6f175">
+      <span class="text-muted" id="2c92ecb2-5855-4f04-915f-6b1bb6745efd">
        A web component for a text.
       </span>
-      <pre id="6901db37-4f39-4ffa-9f88-6597bec3bb6a"><code class="language-python">Text(content)</code></pre>
-      <div class="ms-3 collapse" id="ddf2c53e-e58c-4c6e-ab5e-5a8f52dc44c2">
-       <h6 id="3549b3cf-63f7-4327-85b7-d8791e441b8c">
+      <pre id="27a12fce-6e56-41c5-9b6b-6f061cfcece0"><code class="language-python">Text(content)</code></pre>
+      <div class="ms-3 collapse" id="fe47c225-ec60-4126-a81b-b3e86205d2fa">
+       <h6 id="39b924f3-69c8-4bc6-b1b9-f9a41d7d3c54">
         Arguments
        </h6>
-       <table class="table table-sm bg-light" id="5d51093e-80bf-410b-9877-81aba88ac29d">
+       <table class="table table-sm bg-light" id="8a3c0943-d7ee-4cdc-b1e8-598ad648a8e1">
         <thead>
          <tr>
           <th scope="col">
@@ -9181,11 +9317,11 @@ table
         </tbody>
        </table>
       </div>
-      <div class="ms-3" id="9d2a64a8-607a-4b40-92ed-e0c0f13facdb">
-       <h6 id="44f9f107-f3cd-4d73-900c-9917513850db">
+      <div class="ms-3" id="87034ef5-9d2d-42be-94c2-78d8bba7de31">
+       <h6 id="69bc8497-6e90-4259-84a5-28b7de80e73b">
         Example
        </h6>
-       <pre id="caa4967f-e4a2-4759-ac66-ad55495cdacd"><code class="language-python">from bootwrap import Text, Panel
+       <pre id="cb327985-d481-49b7-8646-562f5937e22b"><code class="language-python">from bootwrap import Text, Panel
 
 txt = Text("Text")
 txt_outline = Text("Text with border").as_outline()
@@ -9200,64 +9336,64 @@ Panel(
 ).vertical()
 </code></pre>
       </div>
-      <div class="ms-3" id="0e6ec2f9-4d12-4082-a8d9-4f9390c812f1">
-       <div id="1490d631-7a78-4a60-9c12-f513a5501917">
+      <div class="ms-3" id="e7f26a0a-ab20-4e56-8d83-d6a1211dab66">
+       <div id="d5932116-921e-4614-8f37-61fa5abca99b">
         <div class="row">
          <div class="col-md">
-          <span id="f70aedef-0197-46a7-aea0-941353ca5d7e">
+          <span id="851bdda2-6ccd-409a-911a-c20477ced36b">
            Text
           </span>
          </div>
         </div>
         <div class="row">
          <div class="col-md">
-          <span class="border" id="94867828-e569-4c9d-b45c-8b4211d44c51">
+          <span class="border" id="21797aa8-9ede-44b6-935f-c8cd6950d266">
            Text with border
           </span>
          </div>
         </div>
         <div class="row">
          <div class="col-md">
-          <span class="text-primary" id="2aa68ae6-3f48-4d43-ad78-9e30976141cd">
+          <span class="text-primary" id="70f47d17-f511-40bc-90f7-323643b9d4a6">
            Text of primary color
           </span>
          </div>
         </div>
         <div class="row">
          <div class="col-md">
-          <span class="text-primary border border-primary" id="7943b8e3-7513-45e9-b59d-256445b6e4b8">
+          <span class="text-primary border border-primary" id="f1de35a5-0ee0-44e7-b3fe-21e0c7ac7783">
            Text of primary color with border
           </span>
          </div>
         </div>
        </div>
       </div>
-      <div class="mt-5" id="c3e5aa03-73fa-4778-8511-66ae4a1d761f">
-       <div class="d-flex justify-content-between" id="973dd692-2582-40ab-91ec-1c5d2ba2a20f">
-        <h4 id="fa225967-ac17-4a66-ab75-a8a8baa02156">
+      <div class="mt-5" id="5d15bef0-8f4d-4ff2-9118-b7f74ed39efe">
+       <div class="d-flex justify-content-between" id="21ba3513-8697-4e51-83bd-74f139a5834b">
+        <h4 id="8f47d726-5a23-4752-9044-7069bac70158">
          Method
-         <span class="text-primary" id="d485e841-9be5-4c74-be6e-674f87b51ecc">
+         <span class="text-primary" id="f99a86cb-ab13-4411-8075-eb9aa528a86a">
           as_code
          </span>
         </h4>
-        <div id="ba0c5f3c-443c-4d2a-8a7a-f0e0b48de0f6">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#8158792f-1188-4deb-89ac-10d8e8e8deb5" data-bs-toggle="collapse" id="c024d0ee-a8c7-4dd9-88c8-7de7e4ca91d2" onclick="return false;" type="button">
+        <div id="136a3366-e970-4ee0-8861-43132ae31536">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#80eba1ed-f20c-4112-bb74-0fc07e91614f" data-bs-toggle="collapse" id="7fbcdf14-03ff-4eac-8eb5-f42a3663044f" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#835a2c72-0b14-4005-9ccc-3796d8027a78" data-bs-toggle="collapse" id="b21e0253-d9e6-4bf4-beb3-1fcf571abf99" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#f01ce354-2ff4-46e6-a1a9-8cb4c8419e39" data-bs-toggle="collapse" id="6a616236-730d-43ef-b92c-a035c5ab3ada" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="c9816415-0901-4aed-9c2d-178c613f98bd">
+       <span class="text-muted" id="4247aa5d-04f0-4cea-b05c-c61f3993c2a3">
         Makes the text wrap as a code snippet.
        </span>
-       <pre id="f4f9a277-2bda-42b0-aade-aee1a4cffb26"><code class="language-python">as_code(language='python')</code></pre>
-       <div class="ms-3 collapse" id="8158792f-1188-4deb-89ac-10d8e8e8deb5">
-        <h6 id="971612d0-dd53-4f0f-a95e-b6603c0f3f92">
+       <pre id="75c2908a-86f2-4f46-a78d-20a8d2184440"><code class="language-python">as_code(language='python')</code></pre>
+       <div class="ms-3 collapse" id="80eba1ed-f20c-4112-bb74-0fc07e91614f">
+        <h6 id="4ff144cf-26c5-450e-94e2-8a821226b9b7">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="61279fbd-41a1-4be9-9feb-6346128bc7c6">
+        <table class="table table-sm bg-light" id="b2343e5b-f2a7-427a-8d74-57840d9a288f">
          <thead>
           <tr>
            <th scope="col">
@@ -9291,11 +9427,11 @@ Panel(
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="835a2c72-0b14-4005-9ccc-3796d8027a78">
-        <h6 id="75d88c5c-15fe-4b6f-a07f-65e0aa47eb89">
+       <div class="ms-3 collapse" id="f01ce354-2ff4-46e6-a1a9-8cb4c8419e39">
+        <h6 id="2251f950-86a1-4cf2-8b0e-6cad2c16d193">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="db3aaeec-de6a-4963-a6da-f1745a354ae0">
+        <table class="table table-sm bg-light" id="cbf40503-6c2f-45e0-8a91-81dafb28e38a">
          <thead>
           <tr>
            <th scope="col">
@@ -9328,11 +9464,11 @@ Panel(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="8926e0ca-2fec-4de2-8973-4d67b53945ea">
-        <h6 id="added9d9-4cd9-4d07-b6ae-736064028574">
+       <div class="ms-3" id="f9d8c464-d56a-44f8-ad9a-a30c77bf12d8">
+        <h6 id="cf5ebb84-659a-42a9-8ede-06819d96b0a5">
          Example
         </h6>
-        <pre id="b5939f2f-0005-46b3-ad3d-3b70102b89c6"><code class="language-python">from bootwrap import Panel, Text
+        <pre id="9bf22d9c-4c06-422d-b322-f3a2735f2fd6"><code class="language-python">from bootwrap import Panel, Text
 
 Panel(
     Text('print("language python")').as_code("python"),
@@ -9342,57 +9478,57 @@ Panel(
 ).vertical()
 </code></pre>
        </div>
-       <div class="ms-3" id="1b354be6-32f5-4020-99b8-dfd511a8dd38">
-        <div id="db9a7a9e-7379-4b06-b236-a3edad8842cb">
+       <div class="ms-3" id="d5a52c90-7bae-435b-852e-f2e03b4fc1a2">
+        <div id="fd20f9dd-5f9c-4165-8ef6-b53b53b3ad15">
          <div class="row">
           <div class="col-md">
-           <pre id="0ed8e717-0df7-452f-87f1-350ec6c21cab"><code class="language-python">print("language python")</code></pre>
+           <pre id="651190b7-89e6-4857-84b6-d516c7ace586"><code class="language-python">print("language python")</code></pre>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <pre id="a3638e25-5fe3-407d-8aff-e155778ff0e7"><code class="language-json">{"language": "json"}</code></pre>
+           <pre id="aec0839b-6640-4d87-91be-ba2ca1fb0eb6"><code class="language-json">{"language": "json"}</code></pre>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <pre id="0b43332f-17d8-4cc9-b947-43c8458b9647"><code class="language-yaml">language: yaml</code></pre>
+           <pre id="0182493c-53d3-41ab-a023-5ade5c6d4b17"><code class="language-yaml">language: yaml</code></pre>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <pre id="14767429-0d5d-45ed-93a8-f3eaf70666db"><code class="language-bash">~$ ls language/bash</code></pre>
+           <pre id="07139b78-02bb-4883-8a94-2031065518b3"><code class="language-bash">~$ ls language/bash</code></pre>
           </div>
          </div>
         </div>
        </div>
       </div>
-      <div class="mt-5" id="d57a656e-960a-449a-9085-f1cfad129906">
-       <div class="d-flex justify-content-between" id="144ddbba-ab60-4e9c-8b06-229eb99fcb2c">
-        <h4 id="a8f4391e-15a2-4b7d-9731-208d98bbf7a2">
+      <div class="mt-5" id="4dfe8318-63a4-4a13-8cf0-0e40827ad61a">
+       <div class="d-flex justify-content-between" id="f4f6afa6-5a7e-4100-b4ce-31c6b2dbc245">
+        <h4 id="4a0ca454-4d68-4761-81a2-24ecac00be9a">
          Method
-         <span class="text-primary" id="107cded7-3f02-4065-afff-7627f198d574">
+         <span class="text-primary" id="c2045c64-5147-47b8-a3e7-530243648598">
           as_heading
          </span>
         </h4>
-        <div id="84cf9bbe-2ae1-48f0-8d71-4d902c36a59b">
-         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#7f1a28b6-27ba-4262-a766-624128baa9ee" data-bs-toggle="collapse" id="8361b9ea-cf2e-4adb-aaad-84226c9bb761" onclick="return false;" type="button">
+        <div id="d1e003dc-4593-4af9-a784-b17fd05af256">
+         <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#6fc6b5f9-1434-4f88-b993-0c06ff991c7c" data-bs-toggle="collapse" id="d1bb2120-8efb-4cfa-887a-37e302ab5f94" onclick="return false;" type="button">
           Argument
          </button>
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#de98a554-d297-4d61-b8cf-96cd93100626" data-bs-toggle="collapse" id="9ed35cca-3a80-4636-8472-464222e7f605" onclick="return false;" type="button">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#8cb967eb-7028-469f-9418-715a843b0fdf" data-bs-toggle="collapse" id="031ea477-7bb1-4b95-b84b-1dbc30e4f8b1" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="d686d962-e0cf-49d0-928d-f2449b7f657b">
+       <span class="text-muted" id="87aa6533-4d7e-4933-9ebb-a703c76d5bd2">
         Makes the text as heading.
        </span>
-       <pre id="0c28022c-baa9-4fb6-91ea-a2c050d6c5fb"><code class="language-python">as_heading(level)</code></pre>
-       <div class="ms-3 collapse" id="7f1a28b6-27ba-4262-a766-624128baa9ee">
-        <h6 id="11e5a387-16e1-4565-bad8-757c1dd41680">
+       <pre id="47233b85-1c3d-4497-9223-95aa1fdf633b"><code class="language-python">as_heading(level)</code></pre>
+       <div class="ms-3 collapse" id="6fc6b5f9-1434-4f88-b993-0c06ff991c7c">
+        <h6 id="32dc0378-aa7f-4a4b-af83-d26992fde888">
          Arguments
         </h6>
-        <table class="table table-sm bg-light" id="55d5f9b1-cc78-4d4f-8e63-3f1878711b30">
+        <table class="table table-sm bg-light" id="9b1b1e56-ba74-4d3e-9389-1bc301c3e324">
          <thead>
           <tr>
            <th scope="col">
@@ -9425,11 +9561,11 @@ Panel(
          </tbody>
         </table>
        </div>
-       <div class="ms-3 collapse" id="de98a554-d297-4d61-b8cf-96cd93100626">
-        <h6 id="791d81a5-94e2-4288-97f8-dfde5a2af341">
+       <div class="ms-3 collapse" id="8cb967eb-7028-469f-9418-715a843b0fdf">
+        <h6 id="3c8f6455-9365-4fac-afa0-05d62cb66ef6">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="dfa53e5c-9faa-489d-ba4f-ce6137661e4c">
+        <table class="table table-sm bg-light" id="f06ae1e2-39b2-4b8e-9219-be83d44c02a7">
          <thead>
           <tr>
            <th scope="col">
@@ -9462,11 +9598,11 @@ Panel(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="022a7b49-8a9c-4bcb-98d2-0d0c23944687">
-        <h6 id="55549b9c-6f82-4293-b23e-6782b3b1b0c4">
+       <div class="ms-3" id="593ed422-3e7b-4f24-978b-3d678bc49973">
+        <h6 id="1ed503d7-b306-42e1-ba1b-58ff758915c6">
          Example
         </h6>
-        <pre id="d203b484-1ee0-44fb-ab22-531041b6c31e"><code class="language-python">from bootwrap import Panel, Text
+        <pre id="2e54ebeb-0bc5-4cf2-a702-42868c2b4f2d"><code class="language-python">from bootwrap import Panel, Text
 
 Panel(
     Text("Header text 1").as_heading(1),
@@ -9478,52 +9614,52 @@ Panel(
 )
 </code></pre>
        </div>
-       <div class="ms-3" id="feea313b-c836-4d13-9ef6-9ca8163df48b">
-        <div id="f6596e7b-a2c3-40dc-b4f9-6123bf816791">
-         <h1 id="777be9df-290b-4431-ad5f-c4751ae7ce7d">
+       <div class="ms-3" id="f13478b6-99b5-40ae-be4a-c2f8ecfc4017">
+        <div id="7a7dd971-222e-4b6b-9057-ef08536fce51">
+         <h1 id="e129a4f0-fcf0-49bc-9598-2d9dc8d7b175">
           Header text 1
          </h1>
-         <h2 id="f8cddcf6-cc9b-43af-9c5b-af920e742bce">
+         <h2 id="d4ea18e5-7980-4160-a944-c20554fa2ba1">
           Header text 2
          </h2>
-         <h3 id="9b3385a8-c99f-4fd2-bf4e-f8158695613e">
+         <h3 id="4c805750-5333-4731-9c06-e6e353bb2341">
           Header text 3
          </h3>
-         <h4 id="08389f62-1ee9-49ad-b45a-f4d0a6be6f76">
+         <h4 id="5b7a62f6-07f0-46fc-8d8a-f780c1dd2327">
           Header text 4
          </h4>
-         <h5 id="93627cb7-2565-4d53-81bd-e3bfa3934f8e">
+         <h5 id="8899d4ee-3b39-4bc0-ba1b-d503799c21fb">
           Header text 5
          </h5>
-         <h6 id="29e27887-493e-4982-ae14-4deb2518fedf">
+         <h6 id="8ebb2b03-b84e-43e7-a820-2af20593321e">
           Header text 6
          </h6>
         </div>
        </div>
       </div>
-      <div class="mt-5" id="38d1aa3c-4afb-4e8b-9eba-ffd970432acb">
-       <div class="d-flex justify-content-between" id="97b9fbdc-238e-4fd5-a4ec-c88f656b15c5">
-        <h4 id="86ab0701-f600-4f78-9416-f55408d79d91">
+      <div class="mt-5" id="b6b1dd6c-7b33-4d5f-95b6-d912feec0c40">
+       <div class="d-flex justify-content-between" id="2e3abe6c-001b-4483-810d-ed649b77005f">
+        <h4 id="0090a02b-2b03-4385-ab94-d811ccf74eee">
          Method
-         <span class="text-primary" id="8ba83337-c338-414c-a7c7-f179f8a7d889">
+         <span class="text-primary" id="645be1d9-2f4e-4942-b538-933c928417db">
           as_muted
          </span>
         </h4>
-        <div id="55102b47-1891-4afb-9835-3f88f3de31f5">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#0976daec-bfd9-47c0-bea3-03ec41bb58b0" data-bs-toggle="collapse" id="102470d2-3249-4f14-9ff0-38f0e821cc2f" onclick="return false;" type="button">
+        <div id="62708224-f26c-4c43-a34b-5a5c71099ed6">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#764df9f5-bb8d-45e3-b385-dfb81410bcd2" data-bs-toggle="collapse" id="0361f6b5-9699-4124-8af1-12aa66c645f1" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="fd61aa74-52bc-4937-8782-c5e8264a8933">
+       <span class="text-muted" id="96321646-4f49-42a8-a8da-7c57d6ef74f8">
         Makes the text muted.
        </span>
-       <pre id="154fd239-6b78-4f3b-927b-c076f1cbc825"><code class="language-python">as_muted()</code></pre>
-       <div class="ms-3 collapse" id="0976daec-bfd9-47c0-bea3-03ec41bb58b0">
-        <h6 id="16e4026a-396d-4c3c-bf5c-33191dc1a5e7">
+       <pre id="18f8dcfc-29a1-410c-b42f-9f782bd80f3b"><code class="language-python">as_muted()</code></pre>
+       <div class="ms-3 collapse" id="764df9f5-bb8d-45e3-b385-dfb81410bcd2">
+        <h6 id="fddc2f5c-7337-43df-9ea5-29d7ca10b9a5">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="e237c880-cedc-445e-9d69-1fcdac78cc48">
+        <table class="table table-sm bg-light" id="4088d582-eff3-4827-9187-5b266adfc849">
          <thead>
           <tr>
            <th scope="col">
@@ -9556,44 +9692,44 @@ Panel(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="f93b8306-453b-495a-9ff2-56f4bcee2f22">
-        <h6 id="3ea865f4-23c9-476b-a18c-e1e173793342">
+       <div class="ms-3" id="31569da1-3bbe-4c6d-94e9-84aa2c49e436">
+        <h6 id="82b0587f-1fcb-47e2-8394-9030741a92da">
          Example
         </h6>
-        <pre id="2e4eb5e9-74e2-4afc-95e4-fe5ed383c281"><code class="language-python">from bootwrap import Text
+        <pre id="a6d2a4c1-813a-447c-8b1f-b4709f866942"><code class="language-python">from bootwrap import Text
 
 Text("Muted text").as_muted()
 </code></pre>
        </div>
-       <div class="ms-3" id="81bcdaf3-0068-45d1-b755-0ba6f7b6fc6d">
-        <span class="text-muted" id="3d5dfeae-fb18-4a0a-9643-1877cc3fe6e9">
+       <div class="ms-3" id="ed1921f6-69d3-402a-8d79-a756f3b8f3ab">
+        <span class="text-muted" id="78ff2b44-4a57-4d03-9c5b-424a7e6f27d7">
          Muted text
         </span>
        </div>
       </div>
-      <div class="mt-5" id="741792c1-736b-4c79-af90-906c21fc8e52">
-       <div class="d-flex justify-content-between" id="0dc79ad0-8272-4d71-9ba2-76d7367744e3">
-        <h4 id="1e961ac5-7c93-4cc9-b00b-832f8e7c52c3">
+      <div class="mt-5" id="1d1ef88d-92ae-431a-85fa-d9e9dbeef011">
+       <div class="d-flex justify-content-between" id="48a09a5f-8f3f-420d-99ef-65e048174d4b">
+        <h4 id="ecb66610-353c-4c54-b8e4-fee691b17e6c">
          Method
-         <span class="text-primary" id="a99b5fd4-0c42-48a8-875a-eb82e78a5bd9">
+         <span class="text-primary" id="1eaa7aed-f8da-4b1b-8dd8-11aaa8066252">
           as_paragraph
          </span>
         </h4>
-        <div id="f615fbbc-aebe-42db-9fa3-38cefb75a545">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#6f3f38c1-0045-457a-af36-aa34f286d45a" data-bs-toggle="collapse" id="1f23ca10-c745-49e8-9fc9-5a38de840c1d" onclick="return false;" type="button">
+        <div id="6288f72b-e93c-45f6-8842-64ac25141877">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#43553cd2-f6eb-4b23-88d0-e8335a63c215" data-bs-toggle="collapse" id="af190e03-09e6-499c-8261-18f8deda27dc" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="c10af11e-9c90-44f6-ab70-9b2e0601a5ec">
+       <span class="text-muted" id="43909d45-3ad3-44cb-97f4-84476ee5f2ea">
         Makes the text wrap in a paragraph.
        </span>
-       <pre id="e52d19a2-d4db-4388-9d9c-99aa12b27c09"><code class="language-python">as_paragraph()</code></pre>
-       <div class="ms-3 collapse" id="6f3f38c1-0045-457a-af36-aa34f286d45a">
-        <h6 id="942d0de4-9f5f-4c1f-8d08-b5bc72d84c47">
+       <pre id="261f5d9f-c403-45aa-8f90-9109c6b1d247"><code class="language-python">as_paragraph()</code></pre>
+       <div class="ms-3 collapse" id="43553cd2-f6eb-4b23-88d0-e8335a63c215">
+        <h6 id="b498ee9b-15ad-4115-902e-f91b98aa8d32">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="866cd2d8-510d-4572-b529-497e110700b2">
+        <table class="table table-sm bg-light" id="b8004062-1536-47bf-b547-79154728c25b">
          <thead>
           <tr>
            <th scope="col">
@@ -9626,11 +9762,11 @@ Text("Muted text").as_muted()
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="c502fa35-e2b8-49ca-83dc-9f73307be0f1">
-        <h6 id="69dfc853-3e06-401c-b14f-5c7233e2dbdd">
+       <div class="ms-3" id="425a5937-60f2-4b3e-ae5f-c0c16dd7d567">
+        <h6 id="c169b6ff-36e0-4753-a85c-e6a026df5b1c">
          Example
         </h6>
-        <pre id="62ee0139-0c78-4e5e-b1cf-1bdd8bd4b73a"><code class="language-python">from bootwrap import Panel, Text
+        <pre id="6702196e-e4b9-425a-a18c-3b92bf162bf8"><code class="language-python">from bootwrap import Panel, Text
 
 Panel(
     Text("Paragraph 1").as_paragraph(),
@@ -9639,43 +9775,43 @@ Panel(
 )
 </code></pre>
        </div>
-       <div class="ms-3" id="4f0b8b7f-0094-483d-bb6e-6a9947005bc8">
-        <div id="c45bdbe1-b057-494b-8323-82eeb6f570f9">
-         <p id="b0a5dac7-0969-4dda-a1a2-95233748a35c">
+       <div class="ms-3" id="b79f1cf5-40a9-4f20-a360-c069d968fe15">
+        <div id="75034560-75e5-401e-ae7c-9008857424f1">
+         <p id="ada06e9a-9728-409d-80ac-42ef3c7b37e5">
           Paragraph 1
          </p>
-         <p id="a846664b-caf9-4fef-a9d9-278fbbf61536">
+         <p id="93ae5987-97b2-4793-8bd3-aacbdc60fc2d">
           Paragraph 2
          </p>
-         <p id="109bc0be-bed8-4ab0-9087-31377cb2bcd4">
+         <p id="bf6685b8-c9cd-4dc8-af00-2379b93cb913">
           Paragraph 3
          </p>
         </div>
        </div>
       </div>
-      <div class="mt-5" id="a8f8e8dd-1be3-4dde-a2d1-63814c10e19b">
-       <div class="d-flex justify-content-between" id="d97c4ca5-bd45-4b4c-8f07-65cf4bc3cd8c">
-        <h4 id="a6709891-a698-4a81-a0c1-b6713404300c">
+      <div class="mt-5" id="8db6dd10-8b3e-4596-9302-249c18979c1b">
+       <div class="d-flex justify-content-between" id="f9eacb3a-8708-4c9a-bb20-8368771674a8">
+        <h4 id="a2651b73-10a9-4c73-95ab-da8ff842f0f1">
          Method
-         <span class="text-primary" id="046b4c87-e3b7-4e7b-9264-89d22d57393e">
+         <span class="text-primary" id="bf60c455-1611-4700-9f47-8f8a7880e02b">
           as_small
          </span>
         </h4>
-        <div id="f76a705c-ccb2-4843-9205-0e81ba582ea2">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#edd65e04-eb98-4b83-8e14-7179c15dfc22" data-bs-toggle="collapse" id="9ef8c442-ade8-4299-bafd-cd00676c928b" onclick="return false;" type="button">
+        <div id="7704345c-76a1-4ee2-80c8-aa4591c9c657">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#9fcc9a4b-0f4e-49d6-a846-99b791ac5806" data-bs-toggle="collapse" id="6e28cd7b-cd25-499b-8683-79e8efd3d90c" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="328fdab5-ec89-4ff4-aac3-914c3874050c">
+       <span class="text-muted" id="53b1186b-f7e7-4b1a-9ebd-510e75e5a1c8">
         Makes the text as small.
        </span>
-       <pre id="db9d372b-800e-4bfd-9a76-dc658fde77f2"><code class="language-python">as_small()</code></pre>
-       <div class="ms-3 collapse" id="edd65e04-eb98-4b83-8e14-7179c15dfc22">
-        <h6 id="914b65be-bbbf-46dc-b44b-59887a2b8aee">
+       <pre id="88036735-1044-49a3-a69c-7c9ff21c1e1c"><code class="language-python">as_small()</code></pre>
+       <div class="ms-3 collapse" id="9fcc9a4b-0f4e-49d6-a846-99b791ac5806">
+        <h6 id="8140004f-452d-4d7e-a4d8-84f268e07836">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="7edb0729-4bad-48a5-9792-180053c03396">
+        <table class="table table-sm bg-light" id="d4b426c2-d54d-4cce-868c-d894e5265a37">
          <thead>
           <tr>
            <th scope="col">
@@ -9708,11 +9844,11 @@ Panel(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="724b34a1-65a9-4220-ab79-bb42c2464fc6">
-        <h6 id="c1319798-4d7f-4a44-baf9-939817893242">
+       <div class="ms-3" id="b63fafc9-e3da-4d8b-b943-7e60743ef00b">
+        <h6 id="2cefe4f6-66c4-4956-b000-a14bd35dbb65">
          Example
         </h6>
-        <pre id="d421554f-782d-4f8b-8009-6da5d6d84407"><code class="language-python">from bootwrap import Text, Panel
+        <pre id="2188cf1e-e6a8-4dfe-adf3-00dbbceee400"><code class="language-python">from bootwrap import Text, Panel
 
 txt_small = Text("Small text").as_small()
 txt_small_outline = Text("Small text with border").as_small().as_outline()
@@ -9727,32 +9863,32 @@ Panel(
 ).vertical()
 </code></pre>
        </div>
-       <div class="ms-3" id="b993427a-09ea-4414-ab03-d29d3bd2889c">
-        <div id="ba4b1425-0b08-452d-8e52-cc8c9b6d3ba1">
+       <div class="ms-3" id="c3f16c84-b102-4db2-889d-de5ddf47258e">
+        <div id="6eaeafe6-3ce4-4cb3-aefa-76831b035e37">
          <div class="row">
           <div class="col-md">
-           <small id="27051fec-e794-4411-a817-d0a6c6be1ff4">
+           <small id="255ad5b6-be68-4896-8adb-5a454ddd06ce">
             Small text
            </small>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <small class="border" id="ac60e885-49ca-46f5-bf7a-fab7f679164f">
+           <small class="border" id="b2178dc3-0a81-48fb-a35b-80465ed42fa0">
             Small text with border
            </small>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <small class="text-primary" id="9a235ef5-8982-4afb-b36b-08fadd98be95">
+           <small class="text-primary" id="575e6d93-e8ba-4ccc-8133-314550d593ec">
             Small text of primary color
            </small>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <small class="text-primary border border-primary" id="52164b98-960d-4f39-ab96-1b41a19b38ad">
+           <small class="text-primary border border-primary" id="bf3f64d3-25be-4ddf-a9a3-3532ff800993">
             Small text of primary color with border
            </small>
           </div>
@@ -9760,29 +9896,29 @@ Panel(
         </div>
        </div>
       </div>
-      <div class="mt-5" id="d5dc2584-320e-4602-bcfb-f2e08d0f11b6">
-       <div class="d-flex justify-content-between" id="aae2326e-617d-4ef2-853c-568037b6f55b">
-        <h4 id="1bef3657-21ef-4fd9-945c-a7180b91dbfb">
+      <div class="mt-5" id="1ce55d58-9957-41e5-8a5b-dea26b082567">
+       <div class="d-flex justify-content-between" id="8dd3ea72-86e2-4fec-a4a1-789992026cc9">
+        <h4 id="df77f8e1-3eaa-4954-a425-bbaafdba2cb4">
          Method
-         <span class="text-primary" id="00b505fc-cf72-4d05-82ec-c336ccb8d012">
+         <span class="text-primary" id="0e484653-e59b-4b1c-b7a7-0c3e471e564f">
           as_strong
          </span>
         </h4>
-        <div id="b69cafdf-0e6d-414e-bfef-2b789326d52a">
-         <button class="btn-sm btn btn-outline-primary" data-bs-target="#73a20d00-1495-4110-807e-2383290be71c" data-bs-toggle="collapse" id="9b52562c-eb76-44f8-a102-77be9c19ac41" onclick="return false;" type="button">
+        <div id="44cd8cf3-593d-4d17-a685-4092e23f3605">
+         <button class="btn-sm btn btn-outline-primary" data-bs-target="#ef49a56e-2e54-4a2d-889e-c45e7ae19d12" data-bs-toggle="collapse" id="a5648f3f-aff6-4208-a5e5-05f7dd1394a5" onclick="return false;" type="button">
           Returns
          </button>
         </div>
        </div>
-       <span class="text-muted" id="5c72081f-7e87-400c-96a0-7ecd66511d1e">
+       <span class="text-muted" id="809461aa-4f8a-40a9-aace-2ce614d2d1b6">
         Makes the text as strong.
        </span>
-       <pre id="a3118113-a433-48eb-a451-2b83feabfad5"><code class="language-python">as_strong()</code></pre>
-       <div class="ms-3 collapse" id="73a20d00-1495-4110-807e-2383290be71c">
-        <h6 id="8bcc9405-bf9c-4ecb-b33c-28641d43ac32">
+       <pre id="f1321151-4a13-41bd-85a6-5dc81363824d"><code class="language-python">as_strong()</code></pre>
+       <div class="ms-3 collapse" id="ef49a56e-2e54-4a2d-889e-c45e7ae19d12">
+        <h6 id="ab255c84-d751-4999-a31a-8eab0dbc084a">
          Returns
         </h6>
-        <table class="table table-sm bg-light" id="a2c0ccc0-2322-4cc8-afdf-c7ea2ce91281">
+        <table class="table table-sm bg-light" id="c9b0c955-0b7e-4cb0-8aaa-ea2ef57342aa">
          <thead>
           <tr>
            <th scope="col">
@@ -9815,11 +9951,11 @@ Panel(
          </tbody>
         </table>
        </div>
-       <div class="ms-3" id="d042fda1-7519-4b9a-a552-7a081eb23fe2">
-        <h6 id="30994051-e690-4022-9215-d6d31527fa08">
+       <div class="ms-3" id="50f1ab53-25e7-49d6-b443-4c8d96a19795">
+        <h6 id="d409336a-21cb-4ae4-94d7-e02e95200114">
          Example
         </h6>
-        <pre id="3c2555c2-a41c-44c0-93fd-c27948b27a24"><code class="language-python">from bootwrap import Text, Panel
+        <pre id="ddf647b5-a0f9-4b52-a0a3-ec5e5454dbc3"><code class="language-python">from bootwrap import Text, Panel
 
 txt_strong = Text("Strong text").as_strong()
 txt_strong_outline = Text("Strong text with border").as_strong().as_outline()
@@ -9834,32 +9970,32 @@ Panel(
 ).vertical()
 </code></pre>
        </div>
-       <div class="ms-3" id="53d32cc2-4fee-4c0f-9d15-07cec873ea60">
-        <div id="30eced33-c4d3-4b83-9d90-f7bbc398a08f">
+       <div class="ms-3" id="11d6500b-f5bf-4d5f-8ee7-6bc9fa191924">
+        <div id="1a05419d-e801-43db-93e8-11cd851e52ec">
          <div class="row">
           <div class="col-md">
-           <strong id="9048b869-09ec-4f2e-ba45-e614714c8b6f">
+           <strong id="8252aa02-4cbf-4c9a-9761-41d0ed157323">
             Strong text
            </strong>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <strong class="border" id="b4381ac3-0347-43a4-a337-7dccfc928c7e">
+           <strong class="border" id="c8d32910-95c6-44c7-bfa7-cfee3e944284">
             Strong text with border
            </strong>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <strong class="text-primary" id="ae68049e-94cf-49a3-bea0-cc4d056f9e4c">
+           <strong class="text-primary" id="59c36862-c69d-430d-aa4d-c34e66d0fa56">
             Strong text of primary color
            </strong>
           </div>
          </div>
          <div class="row">
           <div class="col-md">
-           <strong class="text-primary border border-primary" id="14bc3261-0628-4fde-bb9e-7d50acaa869d">
+           <strong class="text-primary border border-primary" id="ad34bf71-b4ca-4b94-be0b-110b419cbcb5">
             Strong text of primary color with border
            </strong>
           </div>
@@ -9869,71 +10005,71 @@ Panel(
       </div>
      </div>
     </div>
-    <div class="tab-pane fade" id="4614f849-ef22-4d62-8f64-2659c26ecbd9">
-     <div id="436c2ed5-63d2-48df-87a6-a619c91e7941">
+    <div class="tab-pane fade" id="058e8f0c-e01b-4b9d-bf4c-440b103ef89d">
+     <div id="b597b972-53ff-45a7-bf07-df1ba122649e">
       <hr/>
-      <ul class="nav" id="60a661ee-562d-4657-b622-93fafea01626" role="tablist">
+      <ul class="nav" id="0883f08f-1c94-47b3-9de4-d00868330933" role="tablist">
        <li class="nav-item">
-        <a class="nav-link active" data-bs-target="#35cf8ae7-e67a-47c8-871b-b2e76dc3521b" data-bs-toggle="tab" href="#35cf8ae7-e67a-47c8-871b-b2e76dc3521b" id="5359ccea-02d1-491a-8f26-15caef14336e" role="tab">
-         <span class="text-secondary" id="f52ef20d-62f1-433a-b738-830e701dd1a5">
+        <a class="nav-link active" data-bs-target="#df0cb3a7-6f82-4b7a-a450-2efc78999e4b" data-bs-toggle="tab" href="#df0cb3a7-6f82-4b7a-a450-2efc78999e4b" id="f86e3908-e7d6-4b71-bd90-e9f104c09438" role="tab">
+         <span class="text-secondary" id="ebac6031-ed8d-4181-866d-1b1fa7766ad2">
           Toast
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#c0a95466-4bc3-4763-9508-e86565b4c132" data-bs-toggle="tab" href="#c0a95466-4bc3-4763-9508-e86565b4c132" id="fd316dcc-55ca-41dc-9670-6fe7bf5778b4" role="tab">
-         <span class="text-secondary" id="7f7bf537-9a8b-4596-b083-34fbe5e7befb">
+        <a class="nav-link" data-bs-target="#99a347f9-302e-44a8-b62a-cca970d643b2" data-bs-toggle="tab" href="#99a347f9-302e-44a8-b62a-cca970d643b2" id="e1d0610a-a8d9-4ab2-b858-1c38b788090c" role="tab">
+         <span class="text-secondary" id="393f2418-5818-4c75-a439-58aa6f1258d7">
           Default
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#66cb91a1-8463-4d8b-9503-8030bef2671f" data-bs-toggle="tab" href="#66cb91a1-8463-4d8b-9503-8030bef2671f" id="0ba5e64f-ca81-447e-af9c-30072eb869d2" role="tab">
-         <span class="text-secondary" id="63f09bec-1677-46ce-85ba-4d2e140e1d25">
+        <a class="nav-link" data-bs-target="#e80863b5-d880-4caa-836d-f19c6b4f57ef" data-bs-toggle="tab" href="#e80863b5-d880-4caa-836d-f19c6b4f57ef" id="f3762c99-0aaf-474e-9ba5-10fe43af34dc" role="tab">
+         <span class="text-secondary" id="03050222-46fa-4a8c-a4f0-a8faff2dabbd">
           Appearance
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#6056bfa1-96f5-46d0-9a41-d097b7c58945" data-bs-toggle="tab" href="#6056bfa1-96f5-46d0-9a41-d097b7c58945" id="7123109c-fd9b-4dde-a2b3-adb51a64079d" role="tab">
-         <span class="text-secondary" id="4a7cbc5a-7392-46c2-a8a8-ff8dd97cab26">
+        <a class="nav-link" data-bs-target="#21c36473-9a43-4127-9b82-2e6c3e934a9f" data-bs-toggle="tab" href="#21c36473-9a43-4127-9b82-2e6c3e934a9f" id="e51fbf36-3346-41c0-9390-a3252dfd3dc9" role="tab">
+         <span class="text-secondary" id="4e650d70-010c-4571-8694-051395a829a1">
           Outline
          </span>
         </a>
        </li>
        <li class="nav-item">
-        <a class="nav-link" data-bs-target="#f415b21b-d9fc-4b03-bd7b-3864050bdd9a" data-bs-toggle="tab" href="#f415b21b-d9fc-4b03-bd7b-3864050bdd9a" id="2126bf4c-62ec-4160-96d9-37cd6db2805e" role="tab">
-         <span class="text-secondary" id="f9f7d915-1784-437c-b218-c82cdc21c57c">
+        <a class="nav-link" data-bs-target="#2b2297f2-73f2-4d1e-82d5-8ba7e07369f5" data-bs-toggle="tab" href="#2b2297f2-73f2-4d1e-82d5-8ba7e07369f5" id="c0328261-39f4-493a-9ce6-c9e9655f7745" role="tab">
+         <span class="text-secondary" id="75773e48-25c4-4e48-9cb2-a1227ba09992">
           Delay
          </span>
         </a>
        </li>
       </ul>
-      <div class="tab-content">
-       <div class="tab-pane fade active show" id="35cf8ae7-e67a-47c8-871b-b2e76dc3521b">
-        <div class="mt-5" id="c089c9eb-4439-40b7-8ead-a61c21fb4983">
-         <div class="d-flex justify-content-between" id="19d76ccb-ef4a-4b03-adee-34475e92b742">
-          <h1 id="76903a05-b526-4bfe-9a01-d76793edd9c8">
+      <div class="tab-content w-100">
+       <div class="tab-pane fade active show" id="df0cb3a7-6f82-4b7a-a450-2efc78999e4b">
+        <div class="mt-5" id="d368952a-b32a-450b-aa57-4d8c69974067">
+         <div class="d-flex justify-content-between" id="23c0d9ed-5223-486f-8081-822efb4608c9">
+          <h1 id="62b8d46f-dcb5-4be3-8444-1769ba8cdc3c">
            Class
-           <span class="text-primary" id="c28b0db5-0b0c-4eed-84f8-af97e95f8d56">
+           <span class="text-primary" id="3a6d10ed-0e42-4a8b-b9d2-710c9545d91e">
             Toast
            </span>
           </h1>
-          <div id="47bc5904-d18a-456f-84c4-f022ce9335e5">
-           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#60111564-b072-47b5-88c2-6da9be8a0216" data-bs-toggle="collapse" id="2a6fd349-76ce-40b1-a0c4-081e4666dc44" onclick="return false;" type="button">
+          <div id="a2e56c01-c07d-4881-84ac-37dc7bae37e6">
+           <button class="ms-1 me-1 btn-sm btn btn-outline-primary" data-bs-target="#be5e158e-0450-40ce-a385-6ffa4fb5c8f3" data-bs-toggle="collapse" id="3e51c1e7-2117-464b-891e-81039fa53f7d" onclick="return false;" type="button">
             Argument
            </button>
           </div>
          </div>
-         <span class="text-muted" id="625f31ac-1bf9-4658-90e3-0d20f0ffdc03">
+         <span class="text-muted" id="177b622c-a023-4824-a246-05b2d8f82704">
           A toast.
          </span>
-         <pre id="220d861a-7e48-41df-8439-235e28eca024"><code class="language-python">Toast(title=None, description=None, marker=None, figure=None, hide_delay=None)</code></pre>
-         <div class="ms-3 collapse" id="60111564-b072-47b5-88c2-6da9be8a0216">
-          <h6 id="c67bdb70-2290-4b30-b2bf-07a504488c88">
+         <pre id="cf8dee67-a4e2-4193-a053-eb4d0d139e57"><code class="language-python">Toast(title=None, description=None, marker=None, figure=None, hide_delay=None)</code></pre>
+         <div class="ms-3 collapse" id="be5e158e-0450-40ce-a385-6ffa4fb5c8f3">
+          <h6 id="3b60710b-9e67-4b78-a48b-2e8d59ee2eec">
            Arguments
           </h6>
-          <table class="table table-sm bg-light" id="cd04029c-accb-49aa-af4c-60d6542310d8">
+          <table class="table table-sm bg-light" id="d7e02c6a-e34f-4ef0-8324-109ca96f88f4">
            <thead>
             <tr>
              <th scope="col">
@@ -10011,11 +10147,11 @@ Panel(
            </tbody>
           </table>
          </div>
-         <div class="ms-3" id="d1d22c4f-1fb1-485e-a1b8-9e7a05c97e6d">
-          <h6 id="71c32ed9-b322-45fb-a3c5-c5b9c35cd2f7">
+         <div class="ms-3" id="7daa543c-da1c-4666-ad13-5e39c5a67991">
+          <h6 id="04b3bf8d-bd04-4494-802e-c7a85e38610c">
            Example
           </h6>
-          <pre id="4dba434a-611d-411c-b105-ad74c07a0f68"><code class="language-python">from bootwrap import Panel, Toast, Button, Icon, Text, Javascript
+          <pre id="172d73a5-966e-4705-b3b4-b41f58444179"><code class="language-python">from bootwrap import Panel, Toast, Button, Icon, Text, Javascript
 
 tst_example = Toast(
     title="Bootwrap",
@@ -10044,17 +10180,17 @@ Panel(
 )
 </code></pre>
          </div>
-         <div class="ms-3" id="f23f6dfe-4c1d-4078-b189-155ebd03e3eb">
-          <div id="9cc847a1-0b5b-47b2-8e8a-a68c2de1ac84">
+         <div class="ms-3" id="f123f456-da90-4c4d-b74b-416313be5c3a">
+          <div id="066049a0-97af-480a-8014-9f09789afcca">
            <div class="position-fixed bottom-0 end-0 p-3" style="z-index: 10">
-            <div aria-atomic="true" aria-live="assertive" class="toast" data-bs-autohide="true" id="a45a8594-1f3b-461d-838b-d4ffc9df75d5" role="alert">
+            <div aria-atomic="true" aria-live="assertive" class="toast" data-bs-autohide="true" id="65acc212-1162-4154-aead-7f0996b46bd2" role="alert">
              <div class="toast-header">
-              <i class="me-2 fa-solid fa-info" id="4f7056e1-3e79-414a-9520-58745188d796">
+              <i class="me-2 fa-solid fa-info" id="6e65d641-bafa-488a-9dc2-00eee1d6a22b">
               </i>
-              <strong class="me-auto" id="16c2ab5e-eb81-4ed8-9fc7-89756bac34b8">
+              <strong class="me-auto" id="6df8ecbf-a497-4409-a7d8-a209f5a53ed0">
                Bootwrap
               </strong>
-              <small id="86e444b6-5cae-42d1-9ee6-ce465bc57990">
+              <small id="b4139384-38c3-48ac-8412-e38cef7a63f8">
                11 mins ago
               </small>
               <button aria-label="Close" class="btn-close" data-bs-dismiss="toast" type="button">
@@ -10065,40 +10201,40 @@ Panel(
              </div>
             </div>
            </div>
-           <button class="btn" id="1795407c-a045-4e76-a6fa-4a5a7202c1a3" onclick="return false;">
+           <button class="btn" id="958a2f5f-8454-4991-ae59-c9255db95a05" onclick="return false;">
             Show toast
            </button>
            <script type="application/javascript">
-            $("#1795407c-a045-4e76-a6fa-4a5a7202c1a3").on("click",function(){
-        $("#a45a8594-1f3b-461d-838b-d4ffc9df75d5").toast("show");
+            $("#958a2f5f-8454-4991-ae59-c9255db95a05").on("click",function(){
+        $("#65acc212-1162-4154-aead-7f0996b46bd2").toast("show");
     });
            </script>
           </div>
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="c0a95466-4bc3-4763-9508-e86565b4c132">
-        <div class="mt-3" id="519fc3d6-6676-445c-bebc-309bdeb1d7da">
-         <div id="e3266e17-9e9a-4d31-8246-9e0fd77205ec">
+       <div class="tab-pane fade" id="99a347f9-302e-44a8-b62a-cca970d643b2">
+        <div class="mt-3" id="90102e51-6cf8-406a-9c1f-737484b36e04">
+         <div id="d1a2479d-e51a-467b-9da2-fc727dd6459e">
           <div class="row">
            <div class="col-md">
-            <div id="3cdbbeb9-8d11-4ba5-a178-cf24b1316465">
-             <h1 id="0181d2a4-7c80-4fde-95b9-7c904307e2d6">
+            <div id="dabb9fd2-f1fc-4e49-8b27-afd3be641390">
+             <h1 id="3a7fb8f5-82d7-4283-9536-d8a3210b29e8">
               Default
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="34e2a0d7-9043-4766-bd04-52d7a7d7d0b1">
+            <div id="ba7e3b07-6b51-45ef-8c23-d15346ac9029">
             </div>
            </div>
           </div>
          </div>
-         <div id="2790bc38-cc1e-4d0f-88d3-28bf885c641c">
+         <div id="365f64bb-a8db-43a9-bbfa-4986e751de39">
           <div class="row">
            <div class="col-md">
-            <div id="8e2b3d4a-0143-4a6b-b4bf-fe3d5ede36d4">
-             <p id="def4a2f8-bfa1-4d24-95a7-8e239f09107c">
+            <div id="f467419e-a11e-4bb6-b0a0-e400b4b149e9">
+             <p id="7b2ef75b-ec71-4a44-8a60-7b238e2094df">
               Make
               <code>
                Toast
@@ -10109,8 +10245,8 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="92553c46-4973-4b5c-b218-be846403727a">
-             <pre id="544d07c6-53b3-4f9a-ab75-fd626e65c84a"><code class="language-python">from bootwrap import Panel, Toast, Button, Icon, Text, Javascript
+            <div id="abf60fe8-2bcc-4b51-bcd5-50018e0bab5a">
+             <pre id="b9eb4065-b70e-4d92-880c-a012a35a535a"><code class="language-python">from bootwrap import Panel, Toast, Button, Icon, Text, Javascript
 
 tst_with_title = Toast(
     title="Bootwrap",
@@ -10149,16 +10285,16 @@ Panel(
     btn_show_toast_without_title,
     action
 )</code></pre>
-             <div id="767e8043-899a-40b1-8196-91205fe919ad">
+             <div id="25536d10-b84b-46c1-aa96-993c49dd9062">
               <div class="position-fixed bottom-0 end-0 p-3" style="z-index: 10">
-               <div aria-atomic="true" aria-live="assertive" class="toast" data-bs-autohide="true" id="89324a7b-4644-48f0-8c25-30270ee5f99c" role="alert">
+               <div aria-atomic="true" aria-live="assertive" class="toast" data-bs-autohide="true" id="dbdfb3be-a290-4d8e-ba33-7c16b77af2de" role="alert">
                 <div class="toast-header">
-                 <i class="me-2 fa-solid fa-info" id="4d023777-9a46-44bc-86b7-22711265ed48">
+                 <i class="me-2 fa-solid fa-info" id="3abb2155-3a18-4de5-84ab-acc91a687a27">
                  </i>
-                 <strong class="me-auto" id="0614f46a-dab6-4a91-8ce8-6830ca36c334">
+                 <strong class="me-auto" id="aa2e4e65-d23b-46da-8d69-6b166f7d7d6b">
                   Bootwrap
                  </strong>
-                 <small id="acd71b50-653a-4d54-92d9-1f6efaa6ea4f">
+                 <small id="d07c36a9-4295-43d8-a7a2-43eec10e3277">
                   11 mins ago
                  </small>
                  <button aria-label="Close" class="btn-close" data-bs-dismiss="toast" type="button">
@@ -10170,7 +10306,7 @@ Panel(
                </div>
               </div>
               <div class="position-fixed bottom-0 end-0 p-3" style="z-index: 10">
-               <div aria-atomic="true" aria-live="assertive" class="toast align-items-center" data-bs-autohide="true" id="c0a9af62-47fc-4253-af5a-dd5bcf04db30" role="alert">
+               <div aria-atomic="true" aria-live="assertive" class="toast align-items-center" data-bs-autohide="true" id="5cb6bad7-efc4-47c8-8b6e-ebc349597d9e" role="alert">
                 <div class="d-flex">
                  <div class="toast-body">
                   Hello, world! This is a toast message.
@@ -10180,18 +10316,18 @@ Panel(
                 </div>
                </div>
               </div>
-              <button class="btn" id="22a0ceb3-33ea-4b2e-bf33-d92aa39fd5b8" onclick="return false;">
+              <button class="btn" id="d7a944e2-2f44-44f1-9dfc-d20cc91ea356" onclick="return false;">
                Show toast with title
               </button>
-              <button class="btn" id="ef498bc2-7525-46fa-b4f4-5b1243e6098d" onclick="return false;">
+              <button class="btn" id="a2d113f8-cc72-4a7d-b0c4-9aad3da13d55" onclick="return false;">
                Show toast without title
               </button>
               <script type="application/javascript">
-               $("#22a0ceb3-33ea-4b2e-bf33-d92aa39fd5b8").on("click",function(){
-        $("#89324a7b-4644-48f0-8c25-30270ee5f99c").toast("show");
+               $("#d7a944e2-2f44-44f1-9dfc-d20cc91ea356").on("click",function(){
+        $("#dbdfb3be-a290-4d8e-ba33-7c16b77af2de").toast("show");
     });
-    $("#ef498bc2-7525-46fa-b4f4-5b1243e6098d").on("click",function(){
-        $("#c0a9af62-47fc-4253-af5a-dd5bcf04db30").toast("show");
+    $("#a2d113f8-cc72-4a7d-b0c4-9aad3da13d55").on("click",function(){
+        $("#5cb6bad7-efc4-47c8-8b6e-ebc349597d9e").toast("show");
     });
               </script>
              </div>
@@ -10201,28 +10337,28 @@ Panel(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="66cb91a1-8463-4d8b-9503-8030bef2671f">
-        <div class="mt-3" id="a54c0569-ac9b-499e-ba2a-11822f0af7a1">
-         <div id="a0093ff6-5ed0-4cd0-acdd-81f524aa49af">
+       <div class="tab-pane fade" id="e80863b5-d880-4caa-836d-f19c6b4f57ef">
+        <div class="mt-3" id="d95362d7-400e-4d47-af32-7e3475f1c36d">
+         <div id="ee2d3a87-885d-4f80-88d8-5360eba13c96">
           <div class="row">
            <div class="col-md">
-            <div id="61f0dd7a-7348-48a5-a702-bd28b4d53523">
-             <h1 id="1f9e1dcb-36fb-4a95-abb2-ad201074d119">
+            <div id="723b9ba4-1e12-4679-957e-9d4fd51fabe0">
+             <h1 id="6ef3528f-0193-4cd8-bca0-74c1aabda311">
               Appearance
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="eeb5f6f2-0e90-4be6-b5f5-d41e4c5003f8">
+            <div id="08bb5b4f-76cc-4752-8cb2-69bf5e255d77">
             </div>
            </div>
           </div>
          </div>
-         <div id="a8dfdaa2-5d80-473b-b2dc-dc8124d48135">
+         <div id="0d8e0339-db40-4929-a730-62c0d5f35232">
           <div class="row">
            <div class="col-md">
-            <div id="eebf6d87-d608-4972-8990-040a3c179b0c">
-             <p id="264b8ff5-0b53-4f6e-b3ce-e2adfef778cc">
+            <div id="92d16e28-e7b6-4139-a1ec-3cfd6b20ecdc">
+             <p id="7636708c-2c7a-4fd7-ba27-99f029afd8b0">
               Change
               <code>
                Toast
@@ -10264,8 +10400,8 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="aad241c1-bd54-4619-a1f8-8f8ff457488f">
-             <pre id="9c59fe25-646b-4c8f-bbf3-3fffd0fedfd0"><code class="language-python">from bootwrap import Panel, Toast, Button, Icon, Text, Javascript
+            <div id="4d30339e-90f8-4245-9e9f-c87bd5274023">
+             <pre id="50b2114c-a218-4247-ab21-e95a3f47d429"><code class="language-python">from bootwrap import Panel, Toast, Button, Icon, Text, Javascript
 
 tst_with_title = Toast(
     title="Bootwrap",
@@ -10304,16 +10440,16 @@ Panel(
     btn_show_toast_without_title,
     action
 )</code></pre>
-             <div id="e91dde02-2db0-47f6-bc73-3dea355df72f">
+             <div id="af4eddda-6b25-4dda-8c29-12cafcc8f8bc">
               <div class="position-fixed bottom-0 end-0 p-3" style="z-index: 10">
-               <div aria-atomic="true" aria-live="assertive" class="toast text-bg-primary" data-bs-autohide="true" id="5b68416e-1f20-453d-bddb-05475f23a229" role="alert">
+               <div aria-atomic="true" aria-live="assertive" class="toast text-bg-primary" data-bs-autohide="true" id="8c363340-d6c2-4bcd-80bf-e1ea4ec20e45" role="alert">
                 <div class="toast-header">
-                 <i class="me-2 fa-solid fa-info" id="230bf88d-feb8-4ed4-b186-8139613cd9ef">
+                 <i class="me-2 fa-solid fa-info" id="da36305e-55e6-4668-a9b8-9ec6ffe4e2d5">
                  </i>
-                 <strong class="me-auto" id="1a293de2-1dec-4ab1-84b1-f5ff053f150f">
+                 <strong class="me-auto" id="dfb3197e-4737-4758-810f-b309a505c6df">
                   Bootwrap
                  </strong>
-                 <small id="14ac3660-d0e9-475b-9f39-20177cdaa308">
+                 <small id="30c8d1d9-f6c7-410d-bcb0-0709ca70e45c">
                   11 mins ago
                  </small>
                  <button aria-label="Close" class="btn-close" data-bs-dismiss="toast" type="button">
@@ -10325,7 +10461,7 @@ Panel(
                </div>
               </div>
               <div class="position-fixed bottom-0 end-0 p-3" style="z-index: 10">
-               <div aria-atomic="true" aria-live="assertive" class="toast text-bg-primary align-items-center" data-bs-autohide="true" id="b8fc1849-1c27-4784-a4dc-9296087ec1dc" role="alert">
+               <div aria-atomic="true" aria-live="assertive" class="toast text-bg-primary align-items-center" data-bs-autohide="true" id="6ffee2cf-6a7e-4ce2-b765-18c6ef17d64e" role="alert">
                 <div class="d-flex">
                  <div class="toast-body">
                   Hello, world! This is a toast message.
@@ -10335,18 +10471,18 @@ Panel(
                 </div>
                </div>
               </div>
-              <button class="btn btn-primary" id="f6b2c286-a73e-43a5-bca6-78ff6c2da9e1" onclick="return false;">
+              <button class="btn btn-primary" id="422325da-8ffe-45bb-8700-0a363117e7ac" onclick="return false;">
                Show toast with title
               </button>
-              <button class="btn btn-primary" id="204ce3bb-f54f-40bd-afd1-0dc186b45d5c" onclick="return false;">
+              <button class="btn btn-primary" id="8995f031-a9d3-411d-8981-581a9e3efbce" onclick="return false;">
                Show toast without title
               </button>
               <script type="application/javascript">
-               $("#f6b2c286-a73e-43a5-bca6-78ff6c2da9e1").on("click",function(){
-        $("#5b68416e-1f20-453d-bddb-05475f23a229").toast("show");
+               $("#422325da-8ffe-45bb-8700-0a363117e7ac").on("click",function(){
+        $("#8c363340-d6c2-4bcd-80bf-e1ea4ec20e45").toast("show");
     });
-    $("#204ce3bb-f54f-40bd-afd1-0dc186b45d5c").on("click",function(){
-        $("#b8fc1849-1c27-4784-a4dc-9296087ec1dc").toast("show");
+    $("#8995f031-a9d3-411d-8981-581a9e3efbce").on("click",function(){
+        $("#6ffee2cf-6a7e-4ce2-b765-18c6ef17d64e").toast("show");
     });
               </script>
              </div>
@@ -10356,28 +10492,28 @@ Panel(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="6056bfa1-96f5-46d0-9a41-d097b7c58945">
-        <div class="mt-3" id="68954c4c-f9da-4070-9932-d1448e6dec24">
-         <div id="3cb04cac-c433-46a2-849d-c924c8e78c30">
+       <div class="tab-pane fade" id="21c36473-9a43-4127-9b82-2e6c3e934a9f">
+        <div class="mt-3" id="0eceab62-9a5b-4358-9d0a-c95218aa2dab">
+         <div id="a77775d3-08d8-4a76-a884-cc3c38480676">
           <div class="row">
            <div class="col-md">
-            <div id="782de1b2-e491-4964-9330-076441db792e">
-             <h1 id="a60d78d6-3d3c-450a-bb1d-170c919e6d19">
+            <div id="d08a5e1b-ec54-48e7-a061-dc6b2bc11fcf">
+             <h1 id="b36d2107-a2eb-4ec1-bd94-06b46571a8d4">
               Outline
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="6e473739-67d8-41f2-ba51-f1f7485ab64d">
+            <div id="e214addb-c9dd-45a0-8394-af80b279fecd">
             </div>
            </div>
           </div>
          </div>
-         <div id="f66eec72-ef6f-45b6-b852-ba9c3250a0d4">
+         <div id="ad6fffd3-0c4b-4c0b-8ba5-d9205258c32f">
           <div class="row">
            <div class="col-md">
-            <div id="b0b75234-3451-4b67-9fda-a1a7104d63ab">
-             <p id="b1b1f40d-cb83-4b05-8349-bdb058a4e67f">
+            <div id="8417125a-e990-4261-b673-2e31633a54a4">
+             <p id="ecd730e0-cd11-4858-8216-bc7eb0d57efb">
               Make
               <code>
                Toast
@@ -10391,8 +10527,8 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="bffcaa68-bdba-45d2-8f60-c3d039840685">
-             <pre id="3352aa58-f1a7-4eb7-a47a-9c9914dfe201"><code class="language-python">from bootwrap import Panel, Toast, Button, Icon, Text, Javascript
+            <div id="a3765ee5-bb8d-411f-a8e5-baa2beb4efab">
+             <pre id="3cc848f4-57ff-4a4f-a6e5-5a593347b6d8"><code class="language-python">from bootwrap import Panel, Toast, Button, Icon, Text, Javascript
 
 tst_with_title = Toast(
     title="Bootwrap",
@@ -10431,16 +10567,16 @@ Panel(
     btn_show_toast_without_title,
     action
 )</code></pre>
-             <div id="b38cfe25-3303-4a22-a4ed-b27fb32a9222">
+             <div id="7909a3f5-7040-4741-aa58-28e47f1e9ac5">
               <div class="position-fixed bottom-0 end-0 p-3" style="z-index: 10">
-               <div aria-atomic="true" aria-live="assertive" class="toast border border-success text-success" data-bs-autohide="true" id="ab7163af-abbb-4321-a1a1-693d508cecd6" role="alert">
+               <div aria-atomic="true" aria-live="assertive" class="toast border border-success text-success" data-bs-autohide="true" id="24c2b36a-a4e2-4033-8ec4-f5585f3a0dbd" role="alert">
                 <div class="toast-header">
-                 <i class="me-2 fa-solid fa-info" id="e25d1e3d-0be9-4c5b-8c2e-6323f86f093f">
+                 <i class="me-2 fa-solid fa-info" id="02f5016c-2238-47ab-bdae-7db2939d9712">
                  </i>
-                 <strong class="me-auto" id="8d1083ee-e327-450a-9930-152053017b38">
+                 <strong class="me-auto" id="56812cbb-72df-43e0-995c-ffcf75fbfb05">
                   Bootwrap
                  </strong>
-                 <small id="5eb0f929-470f-49f5-afe1-5cf060513b72">
+                 <small id="88d24106-f9ff-4d47-8437-0d362d96e304">
                   11 mins ago
                  </small>
                  <button aria-label="Close" class="btn-close" data-bs-dismiss="toast" type="button">
@@ -10452,7 +10588,7 @@ Panel(
                </div>
               </div>
               <div class="position-fixed bottom-0 end-0 p-3" style="z-index: 10">
-               <div aria-atomic="true" aria-live="assertive" class="toast border border-success text-success align-items-center" data-bs-autohide="true" id="e373eac0-350b-4477-a3cf-d344eab99d9c" role="alert">
+               <div aria-atomic="true" aria-live="assertive" class="toast border border-success text-success align-items-center" data-bs-autohide="true" id="9500f2ed-1089-4140-bc31-18ba44ca58d2" role="alert">
                 <div class="d-flex">
                  <div class="toast-body">
                   Hello, world! This is a toast message.
@@ -10462,18 +10598,18 @@ Panel(
                 </div>
                </div>
               </div>
-              <button class="btn btn-outline-success" id="1a4a0010-5657-4ab2-a48c-280a3d4ccf13" onclick="return false;">
+              <button class="btn btn-outline-success" id="a6b88745-d5aa-4ca5-9cc7-122ee157e670" onclick="return false;">
                Show toast with title
               </button>
-              <button class="btn btn-outline-success" id="d0cb9448-46b6-4235-ad56-dcd2c3237a2f" onclick="return false;">
+              <button class="btn btn-outline-success" id="08b981c7-fe98-44a8-95b5-68c9f21d76dd" onclick="return false;">
                Show toast without title
               </button>
               <script type="application/javascript">
-               $("#1a4a0010-5657-4ab2-a48c-280a3d4ccf13").on("click",function(){
-        $("#ab7163af-abbb-4321-a1a1-693d508cecd6").toast("show");
+               $("#a6b88745-d5aa-4ca5-9cc7-122ee157e670").on("click",function(){
+        $("#24c2b36a-a4e2-4033-8ec4-f5585f3a0dbd").toast("show");
     });
-    $("#d0cb9448-46b6-4235-ad56-dcd2c3237a2f").on("click",function(){
-        $("#e373eac0-350b-4477-a3cf-d344eab99d9c").toast("show");
+    $("#08b981c7-fe98-44a8-95b5-68c9f21d76dd").on("click",function(){
+        $("#9500f2ed-1089-4140-bc31-18ba44ca58d2").toast("show");
     });
               </script>
              </div>
@@ -10483,28 +10619,28 @@ Panel(
          </div>
         </div>
        </div>
-       <div class="tab-pane fade" id="f415b21b-d9fc-4b03-bd7b-3864050bdd9a">
-        <div class="mt-3" id="b92d856f-0ce9-4905-9f85-d795e1fc77d0">
-         <div id="3a0d7272-af01-407c-941c-13a24cb8c430">
+       <div class="tab-pane fade" id="2b2297f2-73f2-4d1e-82d5-8ba7e07369f5">
+        <div class="mt-3" id="59111579-67d5-4e8a-841f-598702d1ccb1">
+         <div id="46b88efc-5153-4d2e-bc4f-03926bf5146a">
           <div class="row">
            <div class="col-md">
-            <div id="05cc6be1-0434-4e6e-aded-3e8e505fc496">
-             <h1 id="4af3fe49-d6de-45aa-8b75-4a07ea345d04">
+            <div id="ef21a9ac-0f28-4a04-9e3c-2dd288402f85">
+             <h1 id="7d795bf3-bbda-47ee-b222-a6b92f191bb1">
               Delay
              </h1>
             </div>
            </div>
            <div class="col-md">
-            <div id="d14b6809-284d-4ece-ad33-d52a1b0c8cfe">
+            <div id="5d0c8340-658a-441d-b42f-34fe0e3258d9">
             </div>
            </div>
           </div>
          </div>
-         <div id="e49f6128-a01b-41f3-bc2d-310f1a02a7c9">
+         <div id="61bd162b-159a-44f8-88e0-615b4aebc4e8">
           <div class="row">
            <div class="col-md">
-            <div id="b9b1f944-5758-454b-9e4d-4716463ecc01">
-             <p id="0ab02275-3699-48c4-9e93-7059fe9ee169">
+            <div id="260610a8-433e-4acb-9831-f350504a46ab">
+             <p id="68a8f378-82df-4262-a35d-040de248df22">
               Make
               <code>
                Toast
@@ -10514,8 +10650,8 @@ Panel(
             </div>
            </div>
            <div class="col-md">
-            <div id="4df9fe82-4385-476e-83b6-d05f229b8d9f">
-             <pre id="0fd67f8f-dedc-432b-925c-2e158728c78b"><code class="language-python">from bootwrap import Panel, Toast, Button, Icon, Text, Javascript
+            <div id="9b3a5544-ff94-41d4-a754-da8d25e23ecd">
+             <pre id="722c638e-f976-45c7-af46-a196f631b464"><code class="language-python">from bootwrap import Panel, Toast, Button, Icon, Text, Javascript
 
 tst_example = Toast(
     title="Bootwrap",
@@ -10543,16 +10679,16 @@ Panel(
     btn_show_toast,
     action
 )</code></pre>
-             <div id="18d2ad0e-cb4f-4b51-a4bd-668c07b1a5d3">
+             <div id="56996fb6-584d-4c5e-b4f7-97a6504f42b1">
               <div class="position-fixed bottom-0 end-0 p-3" style="z-index: 10">
-               <div aria-atomic="true" aria-live="assertive" class="toast" data-bs-autohide="true" data-bs-delay="5000" id="ce9eb139-db0b-42b8-81aa-9e9ec4f27b13" role="alert">
+               <div aria-atomic="true" aria-live="assertive" class="toast" data-bs-autohide="true" data-bs-delay="5000" id="0200bfff-45e6-460e-a9c8-1cb238db9d3b" role="alert">
                 <div class="toast-header">
-                 <i class="me-2 fa-solid fa-info" id="9560162e-6d25-4266-af4a-ae177dfc4ba5">
+                 <i class="me-2 fa-solid fa-info" id="80b26b1b-df0c-477f-8ae8-459914c8b353">
                  </i>
-                 <strong class="me-auto" id="dfb4c887-46ee-4508-97db-b0bcda8dad85">
+                 <strong class="me-auto" id="71f0a059-2788-4bc4-8b41-846d80bbfeb7">
                   Bootwrap
                  </strong>
-                 <small id="4b818001-4356-4ca2-8065-33f3b21692ce">
+                 <small id="625e91c7-0677-4071-9ac5-181805f7661f">
                   11 mins ago
                  </small>
                  <button aria-label="Close" class="btn-close" data-bs-dismiss="toast" type="button">
@@ -10563,12 +10699,12 @@ Panel(
                 </div>
                </div>
               </div>
-              <button class="btn" id="cc63c4ce-aa84-40de-8424-7a5e0778d23c" onclick="return false;">
+              <button class="btn" id="1a34f394-f3a5-4b07-8b9b-bf97ce73b46b" onclick="return false;">
                Show toast
               </button>
               <script type="application/javascript">
-               $("#cc63c4ce-aa84-40de-8424-7a5e0778d23c").on("click",function(){
-        $("#ce9eb139-db0b-42b8-81aa-9e9ec4f27b13").toast("show");
+               $("#1a34f394-f3a5-4b07-8b9b-bf97ce73b46b").on("click",function(){
+        $("#0200bfff-45e6-460e-a9c8-1cb238db9d3b").toast("show");
     });
               </script>
              </div>
diff --git a/docs/index.html b/docs/index.html
index 0afec87..9bb8520 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -27,8 +27,8 @@
  </head>
  <body>
   <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
-   <img alt="Bootwrap Logo" id="af25d6d9-a18c-48ae-b57d-b37cb4af8cd7" src="logo.png" width="32"/>
-   <strong class="text-light" id="7814d722-10a1-4fff-a5e8-3a396b89fa59">
+   <img alt="Bootwrap Logo" id="5a86078f-84f7-4781-9ca8-f8296db39f20" src="logo.png" width="32"/>
+   <strong class="text-light" id="052ed53f-3f21-4df3-87bc-639f4950a41e">
     Bootwrap
    </strong>
    <button aria-controls="menu" aria-expanded="false" aria-label="Toggle menu" class="navbar-toggler" data-bs-target="#menu" data-bs-toggle="collapse" type="button">
@@ -38,39 +38,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="64949796-aea7-47f3-94c4-b5f012643d6e">
+      <a class="ms-2 nav-link" href="index.html" id="a4abd9b7-98bc-4722-a983-7d417876d8b1">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="layout.html" id="8fae484f-21cd-4aa0-a811-5f31a66a6716">
+      <a class="ms-2 nav-link" href="layout.html" id="de195e11-7639-4f70-948f-9e6c1da91cfd">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="base.html" id="4795c507-3526-4963-ad54-1a766d9a1a74">
+      <a class="ms-2 nav-link" href="base.html" id="fdec9616-87f5-4042-b1bd-bf0def55757c">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="components.html" id="6e577c7a-f449-4b78-a6ae-f10cfeb9cfab">
+      <a class="ms-2 nav-link" href="components.html" id="5490d595-623f-48e3-9502-31b05032643e">
        Components
       </a>
      </li>
     </ul>
-    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="cc75c792-f0e9-43d9-a9f0-b2222fa0a125" role="button">
+    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="599dd16b-c449-4750-94bd-0b666c7da441" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container-fluid">
-   <div id="a1845757-1059-4b52-9d11-ce2784a08678">
-    <div class="mt-3" id="281df304-dad7-41ea-ad8f-b94296c51d29">
-     <div id="08af1a2b-703a-4f21-92f0-8404fdb89f3e">
+   <div id="c8cc24d5-e2b8-416a-b9b2-39a9011a9a01">
+    <div class="mt-3" id="bc65832e-e4c4-41c0-87d8-48ece7998bbe">
+     <div id="e502e475-2ac9-493a-980f-e0e544bfb927">
       <div class="row">
        <div class="col-md">
-        <div id="639fc6c7-cce2-4fe2-9411-fe03048bcb81">
-         <h1 id="63427b3d-f09c-4a62-9c9c-149ef3608f7d">
+        <div id="0ac77984-c2bd-4920-a37b-7e3f89dcfaed">
+         <h1 id="e9c87bae-6e12-4e4a-9d73-3f3390de8d78">
           <span class="display-4">
            Bootwrap
           </span>
@@ -78,16 +78,16 @@
         </div>
        </div>
        <div class="col-md">
-        <div id="b4cfad4d-5128-4f5d-bbcb-64c136368dab">
+        <div id="390aeccd-4526-43df-ab4f-90b2f9556c46">
         </div>
        </div>
       </div>
      </div>
-     <div id="c2cec3e5-2e95-402e-abd0-0114e56806a5">
+     <div id="ca00c53a-98e5-40b9-8373-3096d661f39e">
       <div class="row">
        <div class="col-md">
-        <div id="acb84256-0edf-4575-9d25-e6dd95ea461f">
-         <p id="b3b72a7c-8a82-4dcb-b7a0-4ea403ed3717">
+        <div id="2cf8e1b3-ec49-4d18-bb09-80e635221854">
+         <p id="3952bf1e-cb97-4153-b094-20be31adf8b9">
           <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>
@@ -95,72 +95,72 @@
         </div>
        </div>
        <div class="col-md">
-        <div id="e433efee-f37b-42f5-981a-b157ad17fcc3">
-         <div class="text-center" id="877089bf-96f9-4134-8162-0b1db92df207">
-          <img height="300" id="f718f568-188e-440e-9889-230549dbb904" src="flash.png"/>
+        <div id="ca5c3d3f-ab50-46f7-b472-8acec0d0d8c3">
+         <div class="text-center" id="92291e09-0348-4660-9010-aab27385534a">
+          <img height="300" id="aef68836-39a9-428e-8aaa-d63907584b04" src="flash.png"/>
          </div>
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="c0eddb6e-2422-4112-b530-749f6786b0e6">
-     <div id="bcc96673-ab4a-4595-8ea0-f9f1763b63a0">
+    <div class="mt-3" id="17ade29c-7fa1-4337-893f-eeba974d4c47">
+     <div id="5e4cdf24-e090-4966-b9cc-3bcfbc2eb895">
       <div class="row">
        <div class="col-md">
-        <div id="53116c54-b2bf-4a5a-bf7a-9d269ce76d49">
-         <h1 id="b832605b-7dbe-4126-bc84-9dc9e9bcbefb">
+        <div id="a3f3d2d7-86a5-42ed-95da-7d04fb140ca9">
+         <h1 id="84c44f4e-e220-4c0a-9e60-65d398899218">
           Installation
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="bfb1b8b4-dfeb-4c05-bb86-3cee37e63408">
+        <div id="18bc3553-d4c2-490d-9dcc-575d60aa316e">
         </div>
        </div>
       </div>
      </div>
-     <div id="cd4a54ea-4500-4373-93c1-45df2940b65b">
+     <div id="698a669f-c0be-4367-84e6-f5e46e2d4fee">
       <div class="row">
        <div class="col-md">
-        <div id="90d3b085-f8b2-4172-8833-00c6230ed527">
-         <p id="22d03ac5-06d9-4316-a56f-9329cd9f5408">
+        <div id="21cca6c5-f685-4f85-bee0-23e6fd36ad72">
+         <p id="2c161c06-fba9-435f-a687-182ba1b2cf82">
           Use the following command to install Python Bootwrap:
          </p>
-         <pre id="b0c7ce00-92ff-4d5a-9c8e-0c99d07eb80b"><code class="language-python">~$ pip install bootwrap</code></pre>
+         <pre id="e918762d-90e6-4a63-bf5b-43a4d0f78987"><code class="language-python">~$ pip install bootwrap</code></pre>
         </div>
        </div>
        <div class="col-md">
-        <div id="e036707c-ce6c-423e-b596-d4fd887b1256">
+        <div id="77d6abc4-e1e9-43f8-93df-fb20b8819d63">
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="7bca11cd-cf1d-490d-9972-88bdde61afb9">
-     <div id="b65dd9d7-f7f9-47b3-8c9f-9341f2a4f263">
+    <div class="mt-3" id="c7e0347b-1234-486d-a131-1c4f2876d9f7">
+     <div id="bef1c270-bb65-4fbe-be59-3d7063ccbb36">
       <div class="row">
        <div class="col-md">
-        <div id="08fb1984-06f2-4f53-b809-e31a2564b42a">
-         <h1 id="5b3c8ac5-eb28-4d2e-bb52-095ac1bafcb9">
+        <div id="ed0754bd-da99-43a0-9143-727d3dbeff15">
+         <h1 id="544f8504-4137-41d3-bcaa-49f8296d8659">
           Single-Page Application
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="78ee92eb-6719-4b41-9a48-767da61fa92b">
+        <div id="eba7b2f5-a1d5-4ce6-a3ff-c73ce8552060">
         </div>
        </div>
       </div>
      </div>
-     <div id="7b9e4e24-3370-459a-9e2b-c5c29483081d">
+     <div id="d9a92b1f-d1fb-4fcf-8882-012cd1d0daaf">
       <div class="row">
        <div class="col-md">
-        <div id="aac6d13b-726b-4bde-a191-1685a8fe1b23">
-         <p id="e988e2cf-2ada-4d32-a63d-266c396d89fe">
+        <div id="675614e5-bf2f-4c7e-b775-b3df627dbfa8">
+         <p id="a9dcbb1a-e177-4a6f-bcb5-6ca87d383246">
           A single-page Bootwrap application looks something like this:
          </p>
-         <pre id="4131f2c7-3dea-4112-a50a-188cc58e90e5"><code class="language-python">from flask import Flask
+         <pre id="ef9f9f4b-7102-4a2d-ae72-755ac0e69cde"><code class="language-python">from flask import Flask
 from markupsafe import Markup
 from bootwrap import Page, Text
 
@@ -177,39 +177,39 @@ if __name__ == '__main__':
         </div>
        </div>
        <div class="col-md">
-        <div id="64f19830-ee7f-4928-bd1f-f1f2a52d4e21">
-         <div class="text-center" id="f47d1218-cb40-48a9-b2b3-2235149887d6">
-          <img height="200" id="babf202c-9a73-496f-ac6d-0c6a6dbe423a" src="single-page-app.png"/>
+        <div id="54c52712-a424-4578-b340-9a50a7a746f8">
+         <div class="text-center" id="ef8924a1-b17f-4a43-9bd3-f7315566b035">
+          <img height="200" id="ccc587e7-8ae7-4a6a-8422-45af2b6a8c12" src="single-page-app.png"/>
          </div>
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="4bffdc64-26e9-4685-a465-7ece9fe2547e">
-     <div id="90eb6ab5-8d18-4f40-b5af-0fa764ff7bc1">
+    <div class="mt-3" id="ac5a9c71-7e04-4b38-b9fb-dc2b782b6c85">
+     <div id="64189bb8-222b-41a9-b235-918eba17b023">
       <div class="row">
        <div class="col-md">
-        <div id="a1d37a97-509c-4af9-a46e-c49346f9c18d">
-         <h1 id="d3447c56-f6d0-424b-a0e6-98e740b6402f">
+        <div id="8f0a3c75-b543-4e1c-86ff-49b9d10eaa8f">
+         <h1 id="49f417f3-9468-45a9-913f-edcf170f48db">
           Multi-Pages Application
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="5158e6c9-ec2f-40f4-8a00-c4dca267035d">
+        <div id="0b96c433-3fd7-4d09-aca2-97c2b5fb620d">
         </div>
        </div>
       </div>
      </div>
-     <div id="44c6805c-394e-4720-89e8-8983948f8477">
+     <div id="5b801e68-d2f5-43cb-ab86-2448d91fe5f7">
       <div class="row">
        <div class="col-md">
-        <div id="9fdd18c7-8d49-41c5-8bd9-e82a31477cf5">
-         <p id="4c364c84-c379-4835-a381-8d13466011a9">
+        <div id="3c8756f0-b6dc-4150-b6f9-1cbcc248293f">
+         <p id="6cf8a839-0900-4d74-89c9-62e91618e168">
           A multi-pages Bootwrap application looks something like this:
          </p>
-         <pre id="4e02a55f-2db4-452b-aca9-8059df8b9c60"><code class="language-python">from flask import Flask
+         <pre id="b96604af-ee7e-495a-beef-4e8497985199"><code class="language-python">from flask import Flask
 from markupsafe import Markup
 from bootwrap import (
   Page, Menu, Image, Anchor, Button, Text
@@ -290,9 +290,9 @@ if __name__ == '__main__':
         </div>
        </div>
        <div class="col-md">
-        <div id="746d7a25-0874-418f-8f35-f55dc10cb75a">
-         <div class="text-center" id="4f8f9f6e-7130-4b16-a644-a7c7ee0ceebb">
-          <img height="200" id="45f46bf7-e82b-408e-9c66-8cbbde4cf741" src="multi-pages-app.png"/>
+        <div id="4d340bce-9e16-49f8-9491-dae92501ba92">
+         <div class="text-center" id="14c5ba56-e50e-49cc-9d53-38431cf1f558">
+          <img height="200" id="745c861c-bfbd-4efd-b7cd-bbd094f29a46" src="multi-pages-app.png"/>
          </div>
         </div>
        </div>
diff --git a/docs/layout.html b/docs/layout.html
index 9bd7ee3..ddd5437 100644
--- a/docs/layout.html
+++ b/docs/layout.html
@@ -27,8 +27,8 @@
  </head>
  <body>
   <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
-   <img alt="Bootwrap Logo" id="67b66d25-06f5-460b-900e-d9052b2335c9" src="logo.png" width="32"/>
-   <strong class="text-light" id="56acf6fa-796b-4f19-8725-e6d3fe0830e2">
+   <img alt="Bootwrap Logo" id="8628330f-e8fd-41e4-92c1-294db5373fc7" src="logo.png" width="32"/>
+   <strong class="text-light" id="8089fb10-94e0-443a-8c7d-bc7dcf885e78">
     Bootwrap
    </strong>
    <button aria-controls="menu" aria-expanded="false" aria-label="Toggle menu" class="navbar-toggler" data-bs-target="#menu" data-bs-toggle="collapse" type="button">
@@ -38,54 +38,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="392077f2-e505-4506-acaf-7d6ebe93160d">
+      <a class="ms-2 nav-link" href="index.html" id="9e2101da-25cc-4a35-8182-e5f6efb6cf3c">
        Home
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="layout.html" id="2688c8c1-ccf9-4c53-bee8-7291ccc80508">
+      <a class="ms-2 nav-link" href="layout.html" id="680d5be2-a687-4685-a7f4-a2fe03b24333">
        Layout
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="base.html" id="05ce724a-bda0-4f60-86e3-d97d7cad882f">
+      <a class="ms-2 nav-link" href="base.html" id="89a7a169-634a-44b9-83dd-d17e83633b13">
        Base
       </a>
      </li>
      <li class="nav-item">
-      <a class="ms-2 nav-link" href="components.html" id="a6e8b13c-0067-496e-b925-59d90d63b938">
+      <a class="ms-2 nav-link" href="components.html" id="988b5ebf-61ea-451d-ade5-c8b4347d35c6">
        Components
       </a>
      </li>
     </ul>
-    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="00a6275b-adc8-4e22-b5f9-2dc69e7596d1" role="button">
+    <a class="ms-2 btn btn-outline-light" href="https://github.com/mmgalushka/bootwrap" id="40c5d314-e754-482a-91c4-603710a12e49" role="button">
      GitHub
     </a>
    </div>
   </nav>
   <div class="container-fluid">
-   <div id="b4693677-33c7-45fa-be3c-d456e9d40f12">
-    <div class="mt-3" id="54f21e43-f7f5-4f7c-b757-cc89c2bd9175">
-     <div id="e6bc023e-fad4-4f0d-8a5e-1974880641ac">
+   <div id="9e418e95-14a4-4dcb-be8c-39443bbce8e0">
+    <div class="mt-3" id="ee93b291-9d12-43c8-81d5-3d22ec98b56a">
+     <div id="7bca34d9-bec4-4ff6-ba5d-3bdaa44dd1dd">
       <div class="row">
        <div class="col-md">
-        <div id="5f3627ff-bc3e-4194-b118-19113ac4b859">
-         <h1 id="37c1311a-0f5b-402c-bcf9-6aa246cf67e9">
+        <div id="02b48dec-49ef-40c4-8409-4e2881c79e90">
+         <h1 id="9679f91a-0e15-40e7-b404-0e074a9dfb1b">
           Layout
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="f000321b-d9ea-4706-b9ac-96551042d596">
+        <div id="92742581-fac7-4815-92f0-25f95d2747ca">
         </div>
        </div>
       </div>
      </div>
-     <div id="639cf421-41f4-415d-b524-b3cc7bed3147">
+     <div id="bf96500f-376b-410c-bc14-712dae0d1153">
       <div class="row">
        <div class="col-md">
-        <div id="d8bf77c7-b783-415b-bcc6-08f7b97acf1e">
-         <p id="4ceaab1d-0067-40aa-8f5f-3894c3936319">
+        <div id="b7de535b-f4db-4d53-99cd-9305d571dc75">
+         <p id="ad834f36-c4ee-40e9-b93a-dd4dd717bc04">
           To simplify the process of developing Web UI, Bootwrap uses the predefined layout which consists  of two elements
           <code>
            Page
@@ -96,7 +96,7 @@
           </code>
           .
          </p>
-         <p id="2fc0b277-04b7-4309-9876-287b21a63270">
+         <p id="22906588-39db-4e02-b646-fec3e9847154">
           <strong>
            Note:
           </strong>
@@ -105,36 +105,36 @@
         </div>
        </div>
        <div class="col-md">
-        <div id="8548844b-4eb4-4081-897b-468ac7b136eb">
-         <div class="text-center" id="246edf3e-cd96-4598-82d2-84e744c75788">
-          <img height="200" id="f0d65bbe-2b0e-4abf-88a7-e8a683a75935" src="layout.png"/>
+        <div id="ba782d87-8d7b-483f-a14d-09660b6a1715">
+         <div class="text-center" id="7142a4b4-a189-43cd-8087-46ca8d7f2536">
+          <img height="200" id="8eef9618-1659-4870-a736-83a62ee082f6" src="layout.png"/>
          </div>
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="e5ab4c25-c1cb-4efa-b933-0c326648b6cb">
-     <div id="b7ce4ae8-ef90-4e53-8801-60181c905e26">
+    <div class="mt-3" id="492d2ae3-6df5-4523-a16c-f7dd52da1046">
+     <div id="1e8ac31f-aafa-4bf3-8ba4-9a2e217b24a5">
       <div class="row">
        <div class="col-md">
-        <div id="0f1fb8dd-1c42-4227-88ec-c8b6eb17a2ff">
-         <h1 id="288b1f04-9e3a-4040-91ba-d6f07bc87992">
+        <div id="d93ba9dc-44fc-47fe-b23e-af9cc69cefcd">
+         <h1 id="9b52d684-07fc-4d25-ba5b-8391dd2afbce">
           Page
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="fecd20f0-be3c-4dfe-9bd6-e580083a055d">
+        <div id="c1a2f12a-1f31-4467-8dd7-d41eef1de981">
         </div>
        </div>
       </div>
      </div>
-     <div id="85a85985-ff8d-4350-8ec1-3ab0104dd9b6">
+     <div id="79123c20-f6a5-4a48-9325-4cb265a47f89">
       <div class="row">
        <div class="col-md">
-        <div id="33714a5d-befd-45f6-87c6-acbec4b4c462">
-         <p id="183ad092-ea94-4649-973d-49a1ab2d4df3">
+        <div id="a1e1d980-0565-46eb-84fe-b0ec911483f3">
+         <p id="4f5b70c6-d74e-4a43-a72a-b71b935ceb50">
           The container could be any element inheriting
           <code>
            WebComponent
@@ -145,7 +145,7 @@
           </code>
           .
          </p>
-         <pre id="cf0b641e-5ee9-462b-9b30-4e97ba6fa472"><code class="language-python">from bootwrap import Page
+         <pre id="3e175394-1e41-4b57-81a8-d76863f58bf5"><code class="language-python">from bootwrap import Page
 
 page = Page(
   favicon=..., title=..., resources=..., menu=...,
@@ -154,43 +154,43 @@ page = Page(
         </div>
        </div>
        <div class="col-md">
-        <div id="5820aa6d-b4ea-4bd6-96b0-1ea733959c6b">
-         <div class="text-center" id="43d9139b-eb0f-49eb-b460-353763019b64">
-          <img height="250" id="23580d8a-38fc-4b22-8184-4cdb36aa7ace" src="page.png"/>
+        <div id="ffc64a39-7ac0-4ff2-8170-96f68c248be5">
+         <div class="text-center" id="f693df20-a679-440e-8d32-e3e15cb8d079">
+          <img height="250" id="b46ad295-4258-47ff-a28f-7c28f811f975" src="page.png"/>
          </div>
         </div>
        </div>
       </div>
      </div>
     </div>
-    <div class="mt-3" id="6486ec37-59fa-48ad-a4cd-259ad212fe66">
-     <div id="db49f7ac-c05e-4a76-8fdd-7ffabbe4995c">
+    <div class="mt-3" id="cb5d756c-c583-4272-a321-8e64bee7b000">
+     <div id="fe565edc-eaaf-41d7-a0be-152bd8e5e325">
       <div class="row">
        <div class="col-md">
-        <div id="66aa5fab-399d-492e-87d4-e0d544d266ba">
-         <h1 id="c26d44fa-214f-4306-b1a8-e81c1b4950be">
+        <div id="743e1965-ee6c-494c-8791-2fea1e520b3d">
+         <h1 id="b7c1cabb-b657-4df2-90c3-ddf7e9069022">
           Menu
          </h1>
         </div>
        </div>
        <div class="col-md">
-        <div id="8ac8e805-4658-439d-a61d-1db44786131f">
+        <div id="e59e0664-2517-4e36-b64d-401de66317cb">
         </div>
        </div>
       </div>
      </div>
-     <div id="3cca01c9-9889-4699-8122-8eeded26774b">
+     <div id="da9a1bba-e239-434a-824f-58fe25f7f162">
       <div class="row">
        <div class="col-md">
-        <div id="514a3970-2c4f-42bd-834b-76424a24710f">
-         <p id="aa883ab4-8883-4be8-acdd-88f7d666fb85">
+        <div id="79631245-70e5-4190-9be3-0a761e3c06f6">
+         <p id="93015713-d1d0-4e9a-ad49-61f70953d345">
           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="e6f5e959-eb51-4495-a508-33317c636bbc"><code class="language-python">from bootwrap import Menu
+         <pre id="5a23dcf1-26d1-4038-80cf-cc3c9d066141"><code class="language-python">from bootwrap import Menu
 
 menu = Menu(
   logo=..., brand=..., anchors=...,  actions=...
@@ -198,9 +198,9 @@ menu = Menu(
         </div>
        </div>
        <div class="col-md">
-        <div id="a50f1060-dc71-4a60-a6fe-42ecefed4dac">
-         <div class="text-center" id="442b1941-2051-47dd-ad0e-6e6991bb2b39">
-          <img height="100" id="6094fb58-4538-42a6-8c20-ec087dcb44c5" src="menu.png"/>
+        <div id="44b66186-e6f3-48ca-a25d-0e08e69a2e07">
+         <div class="text-center" id="9f31ba1e-4187-4b1f-8871-3d9c12ecf9ca">
+          <img height="100" id="db04218e-a0e7-4846-b50a-5624008c9ea1" src="menu.png"/>
          </div>
         </div>
        </div>


Test patch:
diff --git a/tests/test_form.py b/tests/test_form.py
index caafea0..c1cc7c5 100644
--- a/tests/test_form.py
+++ b/tests/test_form.py
@@ -103,8 +103,11 @@ def test_checkbox_input():
                 name="somename"
                 class="form-check-input"
                 type="checkbox"
+                value="true"
                 autocomplete="off">
-            </input>    
+            </input>
+            <input type="hidden" name="somename" value="false">
+            </input>
             <label class="form-check-label" 
                 for="{checkbox.identifier}">
                 somelabel
@@ -113,6 +116,30 @@ def test_checkbox_input():
     ''')
     assert actual == expected
 
+
+    checkbox = CheckboxInput('somelabel', 'somename').label_on_left()
+    actual = HelperHTMLParser.parse(str(checkbox))
+    expected = HelperHTMLParser.parse(f'''
+        <div class="form-group row">
+            <label class="col-sm-4 col-form-label d-flex align-items-center"
+                for="...">
+                somelabel
+            </label>
+            <div class="col-sm-8 d-flex align-items-center">
+                <input id="..."
+                    name="somename"
+                    class="form-check-input"
+                    value="true"
+                    type="checkbox"
+                    autocomplete="off">
+                </input>    
+                <input type="hidden" name="somename" value="false">
+                </input> 
+            </div>
+        </div>
+    ''')
+    assert actual == expected
+
     checkbox = CheckboxInput('somelabel', 'somename', True).\
         as_disabled()
     actual = HelperHTMLParser.parse(str(checkbox))
@@ -122,9 +149,12 @@ def test_checkbox_input():
                 name="somename"
                 class="form-check-input"
                 type="checkbox"
+                value="true"
                 autocomplete="off"
                 checked disabled>
-            </input>    
+            </input>
+            <input type="hidden" name="somename" value="false">
+            </input>
             <label class="form-check-label" 
                 for="{checkbox.identifier}">
                 somelabel
@@ -143,8 +173,11 @@ def test_checkbox_input():
                 name="somename"
                 class="form-check-input"
                 type="checkbox"
+                value="true"
                 autocomplete="off">
-            </input>    
+            </input>
+            <input type="hidden" name="somename" value="false">
+            </input>
             <label class="form-check-label" 
                 for="{checkbox.identifier}">
                 somelabel
@@ -165,7 +198,9 @@ def test_checkbox_input():
                 value="1"
                 type="radio"
                 autocomplete="off">
-            </input>    
+            </input>
+            <input type="hidden" name="somename" value="false">
+            </input>
             <label class="form-check-label" 
                 for="{checkbox.identifier}">
                 somelabel
@@ -183,8 +218,11 @@ def test_checkbox_input():
             name="somename"
             class="btn-check"
             type="checkbox"
+            value="true"
             autocomplete="off">
-        </input>    
+        </input>
+        <input type="hidden" name="somename" value="false">
+        </input>
         <label class="btn btn-primary" 
             for="{checkbox.identifier}">
             somelabel
@@ -200,8 +238,11 @@ def test_checkbox_input():
             name="somename"
             class="btn-check"
             type="checkbox"
+            value="true"
             autocomplete="off">
-        </input>    
+        </input>
+        <input type="hidden" name="somename" value="false">
+        </input>
         <label class="btn btn-outline-primary" 
             for="{checkbox.identifier}">
             somelabel
@@ -219,8 +260,11 @@ def test_checkbox_input():
                 name="somename"
                 class="form-check-input"
                 type="checkbox"
+                value="true"
                 autocomplete="off">
-            </input>    
+            </input>
+            <input type="hidden" name="somename" value="false">
+            </input>
             <label class="form-check-label" 
                 for="{checkbox.identifier}">
                 somelabel
@@ -483,7 +527,7 @@ def test_radio_input():
 def test_json_input():
     # testing json-input...
     json = JsonInput(
-        'somelabel', 'somename', '{ "hello": "test" }'
+        'somelabel', 'somename', { "hello": "test" }
     )
     actual = HelperHTMLParser.parse(str(json))
     expected = HelperHTMLParser.parse(f'''
@@ -494,16 +538,16 @@ def test_json_input():
             </label>
             <div class="col-sm-8 d-flex align-items-center">
                 <pre contenteditable="true" class="w-100" onkeyup="javascript:$('#{json.identifier}').val($(this).text())">
-                    <code class="language-json">{{ "hello": "test" }}</code>
+                    <code class="language-json">...</code>
                 </pre>
-                <input id="{json.identifier}" name="somename" value="{{ &quot;hello&quot;: &quot;test&quot; }}" type="hidden"></input>
+                <input id="{json.identifier}" name="somename" value="..." type="hidden"></input>
             </div>
         </div>
     ''')
     assert actual == expected
 
     json = JsonInput(
-        'somelabel', 'somename', '{ "hello": "test" }'
+        'somelabel', 'somename', { "hello": "test" }
     ).as_disabled()
     actual = HelperHTMLParser.parse(str(json))
     expected = HelperHTMLParser.parse(f'''
@@ -514,17 +558,15 @@ def test_json_input():
             </label>
             <div class="col-sm-8 d-flex align-items-center">
                 <pre contenteditable="false" class="w-100" onkeyup="javascript:$('#{json.identifier}').val($(this).text())">
-                    <code class="language-json">{{ "hello": "test" }}</code>
+                    <code class="language-json">...</code>
                 </pre>
-                <input id="{json.identifier}" name="somename" value="{{ &quot;hello&quot;: &quot;test&quot; }}" type="hidden"></input>
+                <input id="{json.identifier}" name="somename" value="..." type="hidden"></input>
             </div>
         </div>
     ''')
     assert actual == expected
 
 
-
-
 @pytest.mark.form
 def test_hidden_input():
     hidden = HiddenInput('somename', 'somevalue')
diff --git a/tests/test_navigation.py b/tests/test_navigation.py
index bb6faf3..9dfd4fb 100644
--- a/tests/test_navigation.py
+++ b/tests/test_navigation.py
@@ -40,7 +40,7 @@ def test_navigation():
                 </a>
             </li>
         </ul>
-        <div class="tab-content">
+        <div class="tab-content w-100">
             <div id="..."
                 class="show active tab-pane fade">
                 <span id="{textA.identifier}">a-text</span>
@@ -68,7 +68,7 @@ def test_navigation_vertical():
                 class="nav flex-column"
                 role="tablist">
             </ul>
-            <div class="tab-content"></div>
+            <div class="tab-content w-100"></div>
         </div>
     ''')
     assert actual == expected
@@ -85,7 +85,7 @@ def test_navigation_tabs():
             class="nav nav-tabs"
             role="tablist">
         </ul>
-        <div class="tab-content"></div>
+        <div class="tab-content w-100"></div>
     ''')
     assert len(actual) == 2
     assert len(expected) == 2
@@ -103,7 +103,7 @@ def test_navigation_pills():
             class="nav nav-pills"
             role="tablist">
         </ul>
-        <div class="tab-content"></div>
+        <div class="tab-content w-100"></div>
     ''')
     assert len(actual) == 2
     assert len(expected) == 2