codecalm 1 год назад
Родитель
Сommit
93d9718c33
10 измененных файлов с 512 добавлено и 614 удалено
  1. 27 0
      CHANGELOG.md
  2. 9 34
      demo/2-step-verification-code.html
  3. 260 291
      demo/2-step-verification.html
  4. 28 36
      demo/accordion.html
  5. 28 36
      demo/activity.html
  6. 28 36
      demo/alerts.html
  7. 9 34
      demo/auth-lock.html
  8. 65 73
      demo/badges.html
  9. 28 36
      demo/blank.html
  10. 30 38
      demo/buttons.html

+ 27 - 0
CHANGELOG.md

@@ -3,6 +3,33 @@
 All notable changes to this project will be documented in this file.
 
 
+## `1.0.0-beta20` - 2023-08-24
+
+- Update `bootstrap` to v5.3.1
+- Add new `Chat` component
+- Add new `Tag` component
+- Add customizable Star Ratings component using `star-rating.js` library
+- Add new color picker component using `coloris.js` library
+- Add `alerts.html` page with example of alerts.
+- Add `flags.html` page with list of all flags
+- Add Two-Step Verification Pages
+- Add variable to configure `avatar-list` spacing
+- Unify dark mode with latest Bootstrap API and improve dark mode elements
+- Unify Box Shadows with Bootstrap Compatibility
+- Avoid SCSS color dependency on `:focus`
+- Update CSS class from `text-muted` to `text-secondary` for better Bootstrap compatibility
+- Fix text color in dark version of navbar
+- Adjusting form element sizes for enhanced mobile devices compatibility
+- Resolved light dropdown issue on dark theme
+- Update Tabler Icons to version 2.32 with 48 new icons added
+- Fix table default background color
+- Fix responsiveness issue in Settings menu
+- Update required Node.js version to 18 and add `.nvmrc` file
+- Add support for changeset tool for more efficient and organized code changes
+- `Dockerfile` fix
+- Switch from `npm` to `pnpm` for faster package installation
+
+
 ## `1.0.0-beta19` - 2023-05-15
 
 - Add customizable Star Ratings component using `star-rating.js` library (#1571)

+ 9 - 34
demo/2-step-verification-code.html

@@ -1,7 +1,7 @@
 <!doctype html>
 <!--
 * Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
-* @version 1.0.0-beta19
+* @version 1.0.0-beta20
 * @link https://tabler.io
 * Copyright 2018-2023 The Tabler Authors
 * Copyright 2018-2023 codecalm.net Paweł Kuna
@@ -13,37 +13,12 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
     <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
     <title>2-Step Verification - Tabler - Premium and Open Source dashboard template with responsive and high quality UI.</title>
-    <script defer data-api="/stats/api/event" data-domain="preview.tabler.io" src="/stats/js/script.js"></script>
-    <meta name="msapplication-TileColor" content=""/>
-    <meta name="theme-color" content=""/>
-    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
-    <meta name="apple-mobile-web-app-capable" content="yes"/>
-    <meta name="mobile-web-app-capable" content="yes"/>
-    <meta name="HandheldFriendly" content="True"/>
-    <meta name="MobileOptimized" content="320"/>
-    <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
-    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon"/>
-    <meta name="description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!"/>
-    <meta name="canonical" content="https://preview.tabler.io/2-step-verification-code.html">
-    <meta name="twitter:image:src" content="https://preview.tabler.io/static/og.png">
-    <meta name="twitter:site" content="@tabler_ui">
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta name="twitter:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
-    <meta property="og:image" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:image:width" content="1280">
-    <meta property="og:image:height" content="640">
-    <meta property="og:site_name" content="Tabler">
-    <meta property="og:type" content="object">
-    <meta property="og:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta property="og:url" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
     <!-- CSS files -->
-    <link href="./dist/css/tabler.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-flags.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-payments.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-vendors.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/demo.min.css?1685973381" rel="stylesheet"/>
+    <link href="./dist/css/tabler.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-flags.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-payments.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-vendors.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/demo.min.css?1692870487" rel="stylesheet"/>
     <style>
       @import url('https://rsms.me/inter/inter.css');
       :root {
@@ -55,7 +30,7 @@
     </style>
   </head>
   <body  class=" d-flex flex-column">
-    <script src="./dist/js/demo-theme.min.js?1685973381"></script>
+    <script src="./dist/js/demo-theme.min.js?1692870487"></script>
     <div class="page page-center">
       <div class="container container-tight py-4">
         <div class="text-center mb-4">
@@ -128,8 +103,8 @@
     </div>
     <!-- Libs JS -->
     <!-- Tabler Core -->
-    <script src="./dist/js/tabler.min.js?1685973381" defer></script>
-    <script src="./dist/js/demo.min.js?1685973381" defer></script>
+    <script src="./dist/js/tabler.min.js?1692870487" defer></script>
+    <script src="./dist/js/demo.min.js?1692870487" defer></script>
     <script>
       document.addEventListener("DOMContentLoaded", function() {
       	var inputs = document.querySelectorAll('[data-code-input]');

+ 260 - 291
demo/2-step-verification.html

@@ -1,7 +1,7 @@
 <!doctype html>
 <!--
 * Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
-* @version 1.0.0-beta19
+* @version 1.0.0-beta20
 * @link https://tabler.io
 * Copyright 2018-2023 The Tabler Authors
 * Copyright 2018-2023 codecalm.net Paweł Kuna
@@ -13,37 +13,12 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
     <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
     <title>2-Step Verification - Tabler - Premium and Open Source dashboard template with responsive and high quality UI.</title>
-    <script defer data-api="/stats/api/event" data-domain="preview.tabler.io" src="/stats/js/script.js"></script>
-    <meta name="msapplication-TileColor" content=""/>
-    <meta name="theme-color" content=""/>
-    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
-    <meta name="apple-mobile-web-app-capable" content="yes"/>
-    <meta name="mobile-web-app-capable" content="yes"/>
-    <meta name="HandheldFriendly" content="True"/>
-    <meta name="MobileOptimized" content="320"/>
-    <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
-    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon"/>
-    <meta name="description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!"/>
-    <meta name="canonical" content="https://preview.tabler.io/2-step-verification.html">
-    <meta name="twitter:image:src" content="https://preview.tabler.io/static/og.png">
-    <meta name="twitter:site" content="@tabler_ui">
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta name="twitter:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
-    <meta property="og:image" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:image:width" content="1280">
-    <meta property="og:image:height" content="640">
-    <meta property="og:site_name" content="Tabler">
-    <meta property="og:type" content="object">
-    <meta property="og:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta property="og:url" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
     <!-- CSS files -->
-    <link href="./dist/css/tabler.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-flags.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-payments.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-vendors.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/demo.min.css?1685973381" rel="stylesheet"/>
+    <link href="./dist/css/tabler.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-flags.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-payments.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-vendors.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/demo.min.css?1692870487" rel="stylesheet"/>
     <style>
       @import url('https://rsms.me/inter/inter.css');
       :root {
@@ -55,7 +30,7 @@
     </style>
   </head>
   <body  class=" d-flex flex-column">
-    <script src="./dist/js/demo-theme.min.js?1685973381"></script>
+    <script src="./dist/js/demo-theme.min.js?1692870487"></script>
     <div class="page page-center">
       <div class="container container-tight py-4">
         <div class="text-center mb-4">
@@ -75,263 +50,257 @@
             <div class="mb-3">
               <label class="form-label">Country</label>
               <select class="form-select">
-                <option value="AD">Andorra</option>
-                <option value="AE">United Arab Emirates</option>
-                <option value="AFRUN">African Union</option>
-                <option value="AG">Antigua and Barbuda</option>
-                <option value="AI">Anguilla</option>
-                <option value="AL">Albania</option>
-                <option value="AM">Armenia</option>
-                <option value="AO">Angola</option>
-                <option value="AQ">Antarctica</option>
-                <option value="AR">Argentina</option>
-                <option value="AS">American Samoa</option>
-                <option value="AT">Austria</option>
-                <option value="AU">Australia</option>
-                <option value="AW">Aruba</option>
-                <option value="AX">Åland Islands</option>
-                <option value="AZ">Azerbaijan</option>
-                <option value="BA">Bosnia and Herzegovina</option>
-                <option value="BB">Barbados</option>
-                <option value="BD">Bangladesh</option>
-                <option value="BE">Belgium</option>
-                <option value="BF">Burkina Faso</option>
-                <option value="BG">Bulgaria</option>
-                <option value="BH">Bahrain</option>
-                <option value="BI">Burundi</option>
-                <option value="BJ">Benin</option>
-                <option value="BL">Saint Barthélemy</option>
-                <option value="BM">Bermuda</option>
-                <option value="BN">Brunei</option>
-                <option value="BO">Bolivia</option>
-                <option value="BQ-BO">Bonaire</option>
-                <option value="BQ-SA">Saba</option>
-                <option value="BQ-SE">Sint Eustatius</option>
-                <option value="BR">Brazil</option>
-                <option value="BS">Bahamas</option>
-                <option value="BT">Bhutan</option>
-                <option value="BW">Botswana</option>
-                <option value="BY">Belarus</option>
-                <option value="BZ">Belize</option>
-                <option value="CA">Canada</option>
-                <option value="CC">Cocos Islands</option>
-                <option value="CD">Democratis Republic of Congo</option>
-                <option value="CF">Central African Republic</option>
-                <option value="CG">Congo</option>
-                <option value="CH">Switzerland</option>
-                <option value="CI">Côte d'Ivoire</option>
-                <option value="CK">Cook Island</option>
-                <option value="CL">Chile</option>
-                <option value="CM">Cameroon</option>
-                <option value="CN">China</option>
-                <option value="CO">Colombia</option>
-                <option value="CR">Costa Rica</option>
-                <option value="CU">Cuba</option>
-                <option value="CV">Cape Verde</option>
-                <option value="CW">Curaçao</option>
-                <option value="CX">Christmas Island</option>
-                <option value="CY">Cyprus</option>
-                <option value="CZ">Czech Republic</option>
-                <option value="DE">Germany</option>
-                <option value="DJ">Djibouti</option>
-                <option value="DK">Denmark</option>
-                <option value="DM">Dominica</option>
-                <option value="DO">Dominican Republic</option>
-                <option value="EC">Ecuador</option>
-                <option value="EE">Estonia</option>
-                <option value="EG">Egypt</option>
-                <option value="EH">Western Sahara</option>
-                <option value="ER">Eritrea</option>
-                <option value="ES">Spain</option>
-                <option value="ET">Ethiopia</option>
-                <option value="EU">European Union</option>
-                <option value="FI">Finland</option>
-                <option value="FJ">Fiji</option>
-                <option value="FK">Falkland Islands</option>
-                <option value="FM">Micronesia (Federated States of)</option>
-                <option value="FO">Faroe Island</option>
-                <option value="FR">France</option>
-                <option value="GA">Gabon</option>
-                <option value="GB-ENG">England</option>
-                <option value="GB-SCT">Scotland</option>
-                <option value="GB">United Kingdom</option>
-                <option value="GB-WLS">Wales</option>
-                <option value="GB-NIR">Northern Ireland</option>
-                <option value="GD">Grenada</option>
-                <option value="GE">Georgia</option>
-                <option value="GF">French Guiana</option>
-                <option value="GG">Guernsey</option>
-                <option value="GH">Ghana</option>
-                <option value="GI">Gibraltar</option>
-                <option value="GL">Greenland</option>
-                <option value="GM">Gambia</option>
-                <option value="GN">Guinea</option>
-                <option value="GP">Guadeloupe</option>
-                <option value="GQ">Equatorial Guinea</option>
-                <option value="GR">Greece</option>
-                <option value="GS">South Gerogia and the South Sandwich Islands</option>
-                <option value="GT">Guatemala</option>
-                <option value="GU">Guam</option>
-                <option value="GW">Guinea-Bissau</option>
-                <option value="GY">Guyana</option>
-                <option value="HK">Hong Kong</option>
-                <option value="HM">Heard Island and McDonald Islands</option>
-                <option value="HN">Honduras</option>
-                <option value="HR">Croatia</option>
-                <option value="HT">Haiti</option>
-                <option value="HU">Hungary</option>
-                <option value="ID">Indonesia</option>
-                <option value="IE">Ireland</option>
-                <option value="IL">Israel</option>
-                <option value="IM">Isle of Man</option>
-                <option value="IN">India</option>
-                <option value="IO">British Indian Ocean Territory</option>
-                <option value="IQ">Iraq</option>
-                <option value="IR">Iran</option>
-                <option value="IS">Iceland</option>
-                <option value="IT">Italy</option>
-                <option value="JE">Jersey</option>
-                <option value="JM">Jamaica</option>
-                <option value="JO">Jordan</option>
-                <option value="JP">Japan</option>
-                <option value="KE">Kenya</option>
-                <option value="KG">Kyrgyzstan</option>
-                <option value="KH">Cambodia</option>
-                <option value="KI">Kiribati</option>
-                <option value="KM">Comoros</option>
-                <option value="KN-SK">Saint Kitts and Nevis</option>
-                <option value="KP">Korea (the Democratic People's Republic of)</option>
-                <option value="KR">Korea (the Republic of)</option>
-                <option value="KW">Kuwait</option>
-                <option value="KY">Cayman Islands</option>
-                <option value="KZ">Kazakhstan</option>
-                <option value="LA">Lao People's Democratic Republic</option>
-                <option value="LB">Lebanon</option>
-                <option value="LC">Saint Lucia</option>
-                <option value="LI">Liechtenstein</option>
-                <option value="LK">Sri Lanka</option>
-                <option value="LR">Liberia</option>
-                <option value="LS">Lesotho</option>
-                <option value="LT">Lithuania</option>
-                <option value="LU">Luxembourg</option>
-                <option value="LV">Latvia</option>
-                <option value="LY">Libya</option>
-                <option value="MA">Morocco</option>
-                <option value="MC">Monaco</option>
-                <option value="MD">Moldova (the Republic of)</option>
-                <option value="ME">Montenegro</option>
-                <option value="MF">Saint Martin</option>
-                <option value="MG">Madagascar</option>
-                <option value="MH">Marshall Islands</option>
-                <option value="MK">North Macedonia</option>
-                <option value="ML">Mali</option>
-                <option value="MM">Myanmar</option>
-                <option value="MN">Mongolia</option>
-                <option value="MO">Macao</option>
-                <option value="MP">Northern Mariana Islands</option>
-                <option value="MQ">Martinique</option>
-                <option value="MR">Mauritania</option>
-                <option value="MS">Montserrat</option>
-                <option value="MT">Malta</option>
-                <option value="MU">Mauritius</option>
-                <option value="MV">Maldives</option>
-                <option value="MW">Malawi</option>
-                <option value="MX">Mexico</option>
-                <option value="MY">Malaysia</option>
-                <option value="MZ">Mozambique</option>
-                <option value="NA">Namibia</option>
-                <option value="NC">New Caledonia</option>
-                <option value="NE">Niger</option>
-                <option value="NF">Norfolk Island</option>
-                <option value="NG">Nigeria</option>
-                <option value="NI">Nicaragua</option>
-                <option value="NL">Netherlands</option>
-                <option value="NO">Norway</option>
-                <option value="NP">Nepal</option>
-                <option value="NR">Nauru</option>
-                <option value="NU">Niue</option>
-                <option value="NZ">New Zealand</option>
-                <option value="OM">Oman</option>
-                <option value="PA">Panama</option>
-                <option value="PE">Peru</option>
-                <option value="PF">French Polyesia</option>
-                <option value="PG">Papua New Guinea</option>
-                <option value="PH">Phillippines</option>
-                <option value="PK">Pakistan</option>
-                <option value="PL">Poland</option>
-                <option value="PM">Saint Pierre and Miquelon</option>
-                <option value="PN">Pitcairn</option>
-                <option value="PR">Puerto Rico</option>
-                <option value="PS">Palestine, State of</option>
-                <option value="PT">Portugal</option>
-                <option value="PW">Palau</option>
-                <option value="PY">Paraguay</option>
-                <option value="QA">Qatar</option>
-                <option value="RAINBOW">Rainbow</option>
-                <option value="RE">Réunion</option>
-                <option value="RO">Romania</option>
-                <option value="RS">Serbia</option>
-                <option value="RU">Russian Federation</option>
-                <option value="RW">Rwanda</option>
-                <option value="SA">Saudi Arabia</option>
-                <option value="SB">Solomon Islands</option>
-                <option value="SC">Seychelles</option>
-                <option value="SD">Sudan</option>
-                <option value="SE">Sweden</option>
-                <option value="SG">Singapore</option>
-                <option value="SH">Saint Helena, Ascension Island, Traistan da Cunha</option>
-                <option value="SI">Slovenia</option>
-                <option value="SJ">Svalbard, Jan Mayen</option>
-                <option value="SK">Slovakia</option>
-                <option value="SL">Sierra Leone</option>
-                <option value="SM">San Marino</option>
-                <option value="SN">Senegal</option>
-                <option value="SO">Somalia</option>
-                <option value="SR">Suriname</option>
-                <option value="SS">South Sudan</option>
-                <option value="ST">Sao Tome and Principe</option>
-                <option value="SV">El Salvador</option>
-                <option value="SX">Sint Maarten</option>
-                <option value="SY">Syrian Arab Republic</option>
-                <option value="SZ">Eswatini</option>
-                <option value="TC">Turks and Caicos Islands</option>
-                <option value="TD">Chad</option>
-                <option value="TF">French Southern Territories</option>
-                <option value="TG">Togo</option>
-                <option value="TH">Thailand</option>
-                <option value="TJ">Tajikistan</option>
-                <option value="TK">Tokelau</option>
-                <option value="TL">Timor-Leste</option>
-                <option value="TM">Turkmenistan</option>
-                <option value="TN">Tunisia</option>
-                <option value="TO">Tonga</option>
-                <option value="TR">Turkey</option>
-                <option value="TT">Trinidad and Tobago</option>
-                <option value="TV">Tuvalu</option>
-                <option value="TW">Taiwan</option>
-                <option value="TZ">Tanzania, the United Republic of</option>
-                <option value="UA">Ukraine</option>
-                <option value="UG">Uganda</option>
-                <option value="UM">United States Minor Outlying Islands</option>
-                <option value="UNASUR">Union of South American Nations</option>
-                <option value="US" selected>United States of America</option>
-                <option value="UY">Uruguay</option>
-                <option value="UZ">Uzbekistan</option>
-                <option value="VA">Holy See</option>
-                <option value="VC">Saint Vincent and the Grenadines</option>
-                <option value="VE">Venezuela (Bolivarian Republic of)</option>
-                <option value="VG">Virgin Islands (British)</option>
-                <option value="VI">Virgin Islands (U.S.)</option>
-                <option value="VN">Vietnam</option>
-                <option value="VU">Vanuatu</option>
-                <option value="WF">Wallis and Futuna</option>
-                <option value="WS">Samoa</option>
-                <option value="YE">Yemen</option>
-                <option value="ZA">South Africa</option>
-                <option value="ZM">Zambia</option>
-                <option value="ZW">Zimbabwe</option>
-                <option value="AF">Afghanistan</option>
-                <option value="BV">Bouvet Island</option>
+                <option value="">Andorra</option>
+                <option value="">United Arab Emirates</option>
+                <option value="">Afghanistan</option>
+                <option value="">Antigua</option>
+                <option value="">Anguilla</option>
+                <option value="">Armenia</option>
+                <option value="">Angolan</option>
+                <option value="">Antarctica</option>
+                <option value="">Argentina</option>
+                <option value="">American Samoa</option>
+                <option value="">Austria</option>
+                <option value="">Australia</option>
+                <option value="">Aruba</option>
+                <option value="">Aslan Islands</option>
+                <option value="">Azerbaijan</option>
+                <option value="">Bosnian</option>
+                <option value="">Barbados</option>
+                <option value="">Belgium</option>
+                <option value="">Burkina Faso</option>
+                <option value="">Bulgaria</option>
+                <option value="">Bahrain</option>
+                <option value="">Burundi</option>
+                <option value="">Benin</option>
+                <option value="">Saint-Barthélemy</option>
+                <option value="">Bermuda</option>
+                <option value="">Bruneian</option>
+                <option value="">Bolivia</option>
+                <option value="">Bonaire</option>
+                <option value="">Brazil</option>
+                <option value="">Bahamas</option>
+                <option value="">Bhutan</option>
+                <option value="">Bouvet Island</option>
+                <option value="">Batswana</option>
+                <option value="">Belarus</option>
+                <option value="">Belize</option>
+                <option value="">Canada</option>
+                <option value="">Cocos Island</option>
+                <option value="">Democratic Republic of Congo</option>
+                <option value="">Central African Republic</option>
+                <option value="">Republic of the Congo</option>
+                <option value="">Switzerland</option>
+                <option value="">Ivory Coast</option>
+                <option value="">Cook Island</option>
+                <option value="">Chile</option>
+                <option value="">Cameroon</option>
+                <option value="">China</option>
+                <option value="">Colombia</option>
+                <option value="">Costa Rica</option>
+                <option value="">Cuba</option>
+                <option value="">Cape Verde</option>
+                <option value="">Curacao</option>
+                <option value="">Christmas Island</option>
+                <option value="">Cyprus</option>
+                <option value="">Czech Republic</option>
+                <option value="">Germany</option>
+                <option value="">Djibouti</option>
+                <option value="">Denmark</option>
+                <option value="">Dominica</option>
+                <option value="">Dominican Republic</option>
+                <option value="">Algeria</option>
+                <option value="">Ecuador</option>
+                <option value="">Estonia</option>
+                <option value="">Egypt</option>
+                <option value="">Sahrawi</option>
+                <option value="">Eritrea</option>
+                <option value="">Spain</option>
+                <option value="">Catalonia</option>
+                <option value="">Ethiopia</option>
+                <option value="">European Union</option>
+                <option value="">Finland</option>
+                <option value="">Fiji</option>
+                <option value="">Falkland Islands</option>
+                <option value="">Federate States of Micronesia</option>
+                <option value="">Faroe Islands</option>
+                <option value="">France</option>
+                <option value="">Gabon</option>
+                <option value="">Great Britain</option>
+                <option value="">England</option>
+                <option value="">Nothern Ireland</option>
+                <option value="">Scotland</option>
+                <option value="">Wales</option>
+                <option value="">Grenada</option>
+                <option value="">Georgia</option>
+                <option value="">Guyana</option>
+                <option value="">Guernsey</option>
+                <option value="">Ghana</option>
+                <option value="">Gibraltar</option>
+                <option value="">Greenland</option>
+                <option value="">Gambia</option>
+                <option value="">Guinea</option>
+                <option value="">Guadeloupe</option>
+                <option value="">Equatorial Guinea</option>
+                <option value="">Greece</option>
+                <option value="">South Georgia</option>
+                <option value="">Guatemala</option>
+                <option value="">Guam</option>
+                <option value="">Guinea-Bissau</option>
+                <option value="">Guyana</option>
+                <option value="">Hong Kong</option>
+                <option value="">Heard and McDonald Islands</option>
+                <option value="">Honduras</option>
+                <option value="">Croatia</option>
+                <option value="">Haiti</option>
+                <option value="">Hungary</option>
+                <option value="">Indonesia</option>
+                <option value="">Ireland</option>
+                <option value="">Israel</option>
+                <option value="">Isle of Man</option>
+                <option value="">India</option>
+                <option value="">British Indian Ocean Territory</option>
+                <option value="">Iraq</option>
+                <option value="">Iran</option>
+                <option value="">Iceland</option>
+                <option value="">Italy</option>
+                <option value="">Jersey</option>
+                <option value="">Jamaica</option>
+                <option value="">Jordan</option>
+                <option value="">Japan</option>
+                <option value="">Kenya</option>
+                <option value="">Kyrgyzstan</option>
+                <option value="">Cambodia</option>
+                <option value="">Kiribati</option>
+                <option value="">Comoros</option>
+                <option value="">Saint Kitts and Nevis</option>
+                <option value="">North Korea</option>
+                <option value="">South Korea</option>
+                <option value="">Kuwait</option>
+                <option value="">Cayman Islands</option>
+                <option value="">Kazakhstan</option>
+                <option value="">Laos</option>
+                <option value="">Lebanese</option>
+                <option value="">Saint Lucia</option>
+                <option value="">Liechtenstein</option>
+                <option value="">Sri Lanka</option>
+                <option value="">Liberia</option>
+                <option value="">Lesotho</option>
+                <option value="">Lithuania</option>
+                <option value="">Luxembourg</option>
+                <option value="">Latvia</option>
+                <option value="">Libya</option>
+                <option value="">Morocco</option>
+                <option value="">Monaco</option>
+                <option value="">Moldova</option>
+                <option value="">Montenegro</option>
+                <option value="">Saint Martin</option>
+                <option value="">Madagascar</option>
+                <option value="">Marshall Islands</option>
+                <option value="">Macedonia</option>
+                <option value="">Mali</option>
+                <option value="">Myanmar</option>
+                <option value="">Mongolia</option>
+                <option value="">Macao</option>
+                <option value="">Nothern Mariana Islands</option>
+                <option value="">Martinique</option>
+                <option value="">Mauritania</option>
+                <option value="">Montserrat</option>
+                <option value="">Malta</option>
+                <option value="">Mauritius</option>
+                <option value="">Maldives</option>
+                <option value="">Malawi</option>
+                <option value="">Mexico</option>
+                <option value="">Malaysia</option>
+                <option value="">Mozambique</option>
+                <option value="">Namibia</option>
+                <option value="">New Caledonia</option>
+                <option value="">Niger</option>
+                <option value="">Norfolk Island</option>
+                <option value="">Nigeria</option>
+                <option value="">Nicaragua</option>
+                <option value="">Norway</option>
+                <option value="">Nepal</option>
+                <option value="">Nauruan</option>
+                <option value="">Niger</option>
+                <option value="">New Zealand</option>
+                <option value="">Oman</option>
+                <option value="">Panama</option>
+                <option value="">Peru</option>
+                <option value="">French Polynesia</option>
+                <option value="">Papua New Guinea</option>
+                <option value="">Philippines</option>
+                <option value="">Pakistan</option>
+                <option value="">Poland</option>
+                <option value="">Saint Pierre</option>
+                <option value="">Pitcairn Islands</option>
+                <option value="">Puerto Rico</option>
+                <option value="">Palestine</option>
+                <option value="">Portugal</option>
+                <option value="">Palau</option>
+                <option value="">Paraguay</option>
+                <option value="">Qatar</option>
+                <option value="">Reunion Island</option>
+                <option value="">Romania</option>
+                <option value="">Serbia</option>
+                <option value="">Russia</option>
+                <option value="">Rwanda</option>
+                <option value="">Saudi Arabia</option>
+                <option value="">Solomon Islands</option>
+                <option value="">Seychelles</option>
+                <option value="">Sudan</option>
+                <option value="">Sweden</option>
+                <option value="">Singapore</option>
+                <option value="">Saint Helena</option>
+                <option value="">Slovenia</option>
+                <option value="">Svalbard Island</option>
+                <option value="">Slovakia</option>
+                <option value="">Sierra Leone</option>
+                <option value="">San Marino</option>
+                <option value="">Senegal</option>
+                <option value="">Somalia</option>
+                <option value="">Suriname</option>
+                <option value="">South Sudan</option>
+                <option value="">Sao Tome</option>
+                <option value="">El Salvador</option>
+                <option value="">Sint Maarten</option>
+                <option value="">Syria</option>
+                <option value="">Swaziland</option>
+                <option value="">Turks and Caicos</option>
+                <option value="">Chad</option>
+                <option value="">French Southern and Antarctic Lands</option>
+                <option value="">Togo</option>
+                <option value="">Thailand</option>
+                <option value="">Tajikistan</option>
+                <option value="">Tokelau</option>
+                <option value="">Timor Leste</option>
+                <option value="">Turkmenistan</option>
+                <option value="">Tunisia</option>
+                <option value="">Tonga</option>
+                <option value="">Turkey</option>
+                <option value="">Trinidad and Tobago</option>
+                <option value="">Tuvalu</option>
+                <option value="">Tanzania</option>
+                <option value="">Ukraine</option>
+                <option value="">Uganda</option>
+                <option value="">United States Minor Islands</option>
+                <option value="">United Nations</option>
+                <option value="">United States of America</option>
+                <option value="">Uruguay</option>
+                <option value="">Uzbekistan</option>
+                <option value="">Vatican City</option>
+                <option value="">Saint Vincent</option>
+                <option value="">Venezuela</option>
+                <option value="">British Virgin Islands</option>
+                <option value="">Virgiin Islands</option>
+                <option value="">Vietnam</option>
+                <option value="">Vanuatu</option>
+                <option value="">Wallis and Futuna</option>
+                <option value="">Samoa</option>
+                <option value="">Yemen</option>
+                <option value="">South Africa</option>
+                <option value="">Zambia</option>
+                <option value="">Zimbabwe</option>
               </select>
             </div>
             <div class="mb-4">
@@ -356,7 +325,7 @@
     </div>
     <!-- Libs JS -->
     <!-- Tabler Core -->
-    <script src="./dist/js/tabler.min.js?1685973381" defer></script>
-    <script src="./dist/js/demo.min.js?1685973381" defer></script>
+    <script src="./dist/js/tabler.min.js?1692870487" defer></script>
+    <script src="./dist/js/demo.min.js?1692870487" defer></script>
   </body>
 </html>

+ 28 - 36
demo/accordion.html

@@ -1,7 +1,7 @@
 <!doctype html>
 <!--
 * Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
-* @version 1.0.0-beta19
+* @version 1.0.0-beta20
 * @link https://tabler.io
 * Copyright 2018-2023 The Tabler Authors
 * Copyright 2018-2023 codecalm.net Paweł Kuna
@@ -13,37 +13,12 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
     <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
     <title>Accordion - Tabler - Premium and Open Source dashboard template with responsive and high quality UI.</title>
-    <script defer data-api="/stats/api/event" data-domain="preview.tabler.io" src="/stats/js/script.js"></script>
-    <meta name="msapplication-TileColor" content=""/>
-    <meta name="theme-color" content=""/>
-    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
-    <meta name="apple-mobile-web-app-capable" content="yes"/>
-    <meta name="mobile-web-app-capable" content="yes"/>
-    <meta name="HandheldFriendly" content="True"/>
-    <meta name="MobileOptimized" content="320"/>
-    <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
-    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon"/>
-    <meta name="description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!"/>
-    <meta name="canonical" content="https://preview.tabler.io/accordion.html">
-    <meta name="twitter:image:src" content="https://preview.tabler.io/static/og.png">
-    <meta name="twitter:site" content="@tabler_ui">
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta name="twitter:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
-    <meta property="og:image" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:image:width" content="1280">
-    <meta property="og:image:height" content="640">
-    <meta property="og:site_name" content="Tabler">
-    <meta property="og:type" content="object">
-    <meta property="og:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta property="og:url" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
     <!-- CSS files -->
-    <link href="./dist/css/tabler.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-flags.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-payments.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-vendors.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/demo.min.css?1685973381" rel="stylesheet"/>
+    <link href="./dist/css/tabler.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-flags.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-payments.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-vendors.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/demo.min.css?1692870487" rel="stylesheet"/>
     <style>
       @import url('https://rsms.me/inter/inter.css');
       :root {
@@ -55,7 +30,7 @@
     </style>
   </head>
   <body >
-    <script src="./dist/js/demo-theme.min.js?1685973381"></script>
+    <script src="./dist/js/demo-theme.min.js?1692870487"></script>
     <div class="page">
       <!-- Navbar -->
       <header class="navbar navbar-expand-md d-print-none" >
@@ -399,6 +374,9 @@
                         <a class="dropdown-item" href="./tabs.html">
                           Tabs
                         </a>
+                        <a class="dropdown-item" href="./tags.html">
+                          Tags
+                        </a>
                         <a class="dropdown-item" href="./tables.html">
                           Tables
                         </a>
@@ -442,6 +420,10 @@
                           Cookie banner
                           <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
                         </a>
+                        <a class="dropdown-item" href="./chat.html">
+                          Chat
+                          <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
+                        </a>
                         <a class="dropdown-item" href="./activity.html">
                           Activity
                         </a>
@@ -580,7 +562,17 @@
                       <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 11a7 7 0 0 1 14 0v7a1.78 1.78 0 0 1 -3.1 1.4a1.65 1.65 0 0 0 -2.6 0a1.65 1.65 0 0 1 -2.6 0a1.65 1.65 0 0 0 -2.6 0a1.78 1.78 0 0 1 -3.1 -1.4v-7" /><path d="M10 10l.01 0" /><path d="M14 10l.01 0" /><path d="M10 14a3.5 3.5 0 0 0 4 0" /></svg>
                     </span>
                     <span class="nav-link-title">
-                      4231 icons
+                      4637 icons
+                    </span>
+                  </a>
+                </li>
+                <li class="nav-item">
+                  <a class="nav-link" href="./emails.html" >
+                    <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/mail-opened -->
+                      <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 9l9 6l9 -6l-9 -6l-9 6" /><path d="M21 9v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10" /><path d="M3 19l6 -6" /><path d="M15 13l6 6" /></svg>
+                    </span>
+                    <span class="nav-link-title">
+                      Email templates
                     </span>
                   </a>
                 </li>
@@ -724,7 +716,7 @@
                   </li>
                   <li class="list-inline-item">
                     <a href="./changelog.html" class="link-secondary" rel="noopener">
-                      v1.0.0-beta19
+                      v1.0.0-beta20
                     </a>
                   </li>
                 </ul>
@@ -736,7 +728,7 @@
     </div>
     <!-- Libs JS -->
     <!-- Tabler Core -->
-    <script src="./dist/js/tabler.min.js?1685973381" defer></script>
-    <script src="./dist/js/demo.min.js?1685973381" defer></script>
+    <script src="./dist/js/tabler.min.js?1692870487" defer></script>
+    <script src="./dist/js/demo.min.js?1692870487" defer></script>
   </body>
 </html>

+ 28 - 36
demo/activity.html

@@ -1,7 +1,7 @@
 <!doctype html>
 <!--
 * Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
-* @version 1.0.0-beta19
+* @version 1.0.0-beta20
 * @link https://tabler.io
 * Copyright 2018-2023 The Tabler Authors
 * Copyright 2018-2023 codecalm.net Paweł Kuna
@@ -13,37 +13,12 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
     <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
     <title>Activity - Tabler - Premium and Open Source dashboard template with responsive and high quality UI.</title>
-    <script defer data-api="/stats/api/event" data-domain="preview.tabler.io" src="/stats/js/script.js"></script>
-    <meta name="msapplication-TileColor" content=""/>
-    <meta name="theme-color" content=""/>
-    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
-    <meta name="apple-mobile-web-app-capable" content="yes"/>
-    <meta name="mobile-web-app-capable" content="yes"/>
-    <meta name="HandheldFriendly" content="True"/>
-    <meta name="MobileOptimized" content="320"/>
-    <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
-    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon"/>
-    <meta name="description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!"/>
-    <meta name="canonical" content="https://preview.tabler.io/activity.html">
-    <meta name="twitter:image:src" content="https://preview.tabler.io/static/og.png">
-    <meta name="twitter:site" content="@tabler_ui">
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta name="twitter:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
-    <meta property="og:image" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:image:width" content="1280">
-    <meta property="og:image:height" content="640">
-    <meta property="og:site_name" content="Tabler">
-    <meta property="og:type" content="object">
-    <meta property="og:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta property="og:url" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
     <!-- CSS files -->
-    <link href="./dist/css/tabler.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-flags.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-payments.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-vendors.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/demo.min.css?1685973381" rel="stylesheet"/>
+    <link href="./dist/css/tabler.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-flags.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-payments.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-vendors.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/demo.min.css?1692870487" rel="stylesheet"/>
     <style>
       @import url('https://rsms.me/inter/inter.css');
       :root {
@@ -55,7 +30,7 @@
     </style>
   </head>
   <body >
-    <script src="./dist/js/demo-theme.min.js?1685973381"></script>
+    <script src="./dist/js/demo-theme.min.js?1692870487"></script>
     <div class="page">
       <!-- Navbar -->
       <header class="navbar navbar-expand-md d-print-none" >
@@ -399,6 +374,9 @@
                         <a class="dropdown-item" href="./tabs.html">
                           Tabs
                         </a>
+                        <a class="dropdown-item" href="./tags.html">
+                          Tags
+                        </a>
                         <a class="dropdown-item" href="./tables.html">
                           Tables
                         </a>
@@ -442,6 +420,10 @@
                           Cookie banner
                           <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
                         </a>
+                        <a class="dropdown-item" href="./chat.html">
+                          Chat
+                          <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
+                        </a>
                         <a class="dropdown-item active" href="./activity.html">
                           Activity
                         </a>
@@ -580,7 +562,17 @@
                       <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 11a7 7 0 0 1 14 0v7a1.78 1.78 0 0 1 -3.1 1.4a1.65 1.65 0 0 0 -2.6 0a1.65 1.65 0 0 1 -2.6 0a1.65 1.65 0 0 0 -2.6 0a1.78 1.78 0 0 1 -3.1 -1.4v-7" /><path d="M10 10l.01 0" /><path d="M14 10l.01 0" /><path d="M10 14a3.5 3.5 0 0 0 4 0" /></svg>
                     </span>
                     <span class="nav-link-title">
-                      4231 icons
+                      4637 icons
+                    </span>
+                  </a>
+                </li>
+                <li class="nav-item">
+                  <a class="nav-link" href="./emails.html" >
+                    <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/mail-opened -->
+                      <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 9l9 6l9 -6l-9 -6l-9 6" /><path d="M21 9v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10" /><path d="M3 19l6 -6" /><path d="M15 13l6 6" /></svg>
+                    </span>
+                    <span class="nav-link-title">
+                      Email templates
                     </span>
                   </a>
                 </li>
@@ -926,7 +918,7 @@
                   </li>
                   <li class="list-inline-item">
                     <a href="./changelog.html" class="link-secondary" rel="noopener">
-                      v1.0.0-beta19
+                      v1.0.0-beta20
                     </a>
                   </li>
                 </ul>
@@ -938,7 +930,7 @@
     </div>
     <!-- Libs JS -->
     <!-- Tabler Core -->
-    <script src="./dist/js/tabler.min.js?1685973381" defer></script>
-    <script src="./dist/js/demo.min.js?1685973381" defer></script>
+    <script src="./dist/js/tabler.min.js?1692870487" defer></script>
+    <script src="./dist/js/demo.min.js?1692870487" defer></script>
   </body>
 </html>

+ 28 - 36
demo/alerts.html

@@ -1,7 +1,7 @@
 <!doctype html>
 <!--
 * Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
-* @version 1.0.0-beta19
+* @version 1.0.0-beta20
 * @link https://tabler.io
 * Copyright 2018-2023 The Tabler Authors
 * Copyright 2018-2023 codecalm.net Paweł Kuna
@@ -13,37 +13,12 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
     <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
     <title>Alerts - Tabler - Premium and Open Source dashboard template with responsive and high quality UI.</title>
-    <script defer data-api="/stats/api/event" data-domain="preview.tabler.io" src="/stats/js/script.js"></script>
-    <meta name="msapplication-TileColor" content=""/>
-    <meta name="theme-color" content=""/>
-    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
-    <meta name="apple-mobile-web-app-capable" content="yes"/>
-    <meta name="mobile-web-app-capable" content="yes"/>
-    <meta name="HandheldFriendly" content="True"/>
-    <meta name="MobileOptimized" content="320"/>
-    <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
-    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon"/>
-    <meta name="description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!"/>
-    <meta name="canonical" content="https://preview.tabler.io/alerts.html">
-    <meta name="twitter:image:src" content="https://preview.tabler.io/static/og.png">
-    <meta name="twitter:site" content="@tabler_ui">
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta name="twitter:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
-    <meta property="og:image" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:image:width" content="1280">
-    <meta property="og:image:height" content="640">
-    <meta property="og:site_name" content="Tabler">
-    <meta property="og:type" content="object">
-    <meta property="og:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta property="og:url" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
     <!-- CSS files -->
-    <link href="./dist/css/tabler.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-flags.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-payments.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-vendors.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/demo.min.css?1685973381" rel="stylesheet"/>
+    <link href="./dist/css/tabler.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-flags.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-payments.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-vendors.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/demo.min.css?1692870487" rel="stylesheet"/>
     <style>
       @import url('https://rsms.me/inter/inter.css');
       :root {
@@ -55,7 +30,7 @@
     </style>
   </head>
   <body >
-    <script src="./dist/js/demo-theme.min.js?1685973381"></script>
+    <script src="./dist/js/demo-theme.min.js?1692870487"></script>
     <div class="page">
       <!-- Navbar -->
       <header class="navbar navbar-expand-md d-print-none" >
@@ -399,6 +374,9 @@
                         <a class="dropdown-item" href="./tabs.html">
                           Tabs
                         </a>
+                        <a class="dropdown-item" href="./tags.html">
+                          Tags
+                        </a>
                         <a class="dropdown-item" href="./tables.html">
                           Tables
                         </a>
@@ -442,6 +420,10 @@
                           Cookie banner
                           <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
                         </a>
+                        <a class="dropdown-item" href="./chat.html">
+                          Chat
+                          <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
+                        </a>
                         <a class="dropdown-item" href="./activity.html">
                           Activity
                         </a>
@@ -580,7 +562,17 @@
                       <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 11a7 7 0 0 1 14 0v7a1.78 1.78 0 0 1 -3.1 1.4a1.65 1.65 0 0 0 -2.6 0a1.65 1.65 0 0 1 -2.6 0a1.65 1.65 0 0 0 -2.6 0a1.78 1.78 0 0 1 -3.1 -1.4v-7" /><path d="M10 10l.01 0" /><path d="M14 10l.01 0" /><path d="M10 14a3.5 3.5 0 0 0 4 0" /></svg>
                     </span>
                     <span class="nav-link-title">
-                      4231 icons
+                      4637 icons
+                    </span>
+                  </a>
+                </li>
+                <li class="nav-item">
+                  <a class="nav-link" href="./emails.html" >
+                    <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/mail-opened -->
+                      <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 9l9 6l9 -6l-9 -6l-9 6" /><path d="M21 9v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10" /><path d="M3 19l6 -6" /><path d="M15 13l6 6" /></svg>
+                    </span>
+                    <span class="nav-link-title">
+                      Email templates
                     </span>
                   </a>
                 </li>
@@ -911,7 +903,7 @@
                   </li>
                   <li class="list-inline-item">
                     <a href="./changelog.html" class="link-secondary" rel="noopener">
-                      v1.0.0-beta19
+                      v1.0.0-beta20
                     </a>
                   </li>
                 </ul>
@@ -923,7 +915,7 @@
     </div>
     <!-- Libs JS -->
     <!-- Tabler Core -->
-    <script src="./dist/js/tabler.min.js?1685973381" defer></script>
-    <script src="./dist/js/demo.min.js?1685973381" defer></script>
+    <script src="./dist/js/tabler.min.js?1692870487" defer></script>
+    <script src="./dist/js/demo.min.js?1692870487" defer></script>
   </body>
 </html>

+ 9 - 34
demo/auth-lock.html

@@ -1,7 +1,7 @@
 <!doctype html>
 <!--
 * Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
-* @version 1.0.0-beta19
+* @version 1.0.0-beta20
 * @link https://tabler.io
 * Copyright 2018-2023 The Tabler Authors
 * Copyright 2018-2023 codecalm.net Paweł Kuna
@@ -13,37 +13,12 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
     <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
     <title>Forgot password - Tabler - Premium and Open Source dashboard template with responsive and high quality UI.</title>
-    <script defer data-api="/stats/api/event" data-domain="preview.tabler.io" src="/stats/js/script.js"></script>
-    <meta name="msapplication-TileColor" content=""/>
-    <meta name="theme-color" content=""/>
-    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
-    <meta name="apple-mobile-web-app-capable" content="yes"/>
-    <meta name="mobile-web-app-capable" content="yes"/>
-    <meta name="HandheldFriendly" content="True"/>
-    <meta name="MobileOptimized" content="320"/>
-    <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
-    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon"/>
-    <meta name="description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!"/>
-    <meta name="canonical" content="https://preview.tabler.io/auth-lock.html">
-    <meta name="twitter:image:src" content="https://preview.tabler.io/static/og.png">
-    <meta name="twitter:site" content="@tabler_ui">
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta name="twitter:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
-    <meta property="og:image" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:image:width" content="1280">
-    <meta property="og:image:height" content="640">
-    <meta property="og:site_name" content="Tabler">
-    <meta property="og:type" content="object">
-    <meta property="og:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta property="og:url" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
     <!-- CSS files -->
-    <link href="./dist/css/tabler.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-flags.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-payments.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-vendors.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/demo.min.css?1685973381" rel="stylesheet"/>
+    <link href="./dist/css/tabler.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-flags.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-payments.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-vendors.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/demo.min.css?1692870487" rel="stylesheet"/>
     <style>
       @import url('https://rsms.me/inter/inter.css');
       :root {
@@ -55,7 +30,7 @@
     </style>
   </head>
   <body  class=" d-flex flex-column">
-    <script src="./dist/js/demo-theme.min.js?1685973381"></script>
+    <script src="./dist/js/demo-theme.min.js?1692870487"></script>
     <div class="page page-center">
       <div class="container container-tight py-4">
         <div class="text-center mb-4">
@@ -89,7 +64,7 @@
     </div>
     <!-- Libs JS -->
     <!-- Tabler Core -->
-    <script src="./dist/js/tabler.min.js?1685973381" defer></script>
-    <script src="./dist/js/demo.min.js?1685973381" defer></script>
+    <script src="./dist/js/tabler.min.js?1692870487" defer></script>
+    <script src="./dist/js/demo.min.js?1692870487" defer></script>
   </body>
 </html>

+ 65 - 73
demo/badges.html

@@ -1,7 +1,7 @@
 <!doctype html>
 <!--
 * Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
-* @version 1.0.0-beta19
+* @version 1.0.0-beta20
 * @link https://tabler.io
 * Copyright 2018-2023 The Tabler Authors
 * Copyright 2018-2023 codecalm.net Paweł Kuna
@@ -13,37 +13,12 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
     <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
     <title>Badges - Tabler - Premium and Open Source dashboard template with responsive and high quality UI.</title>
-    <script defer data-api="/stats/api/event" data-domain="preview.tabler.io" src="/stats/js/script.js"></script>
-    <meta name="msapplication-TileColor" content=""/>
-    <meta name="theme-color" content=""/>
-    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
-    <meta name="apple-mobile-web-app-capable" content="yes"/>
-    <meta name="mobile-web-app-capable" content="yes"/>
-    <meta name="HandheldFriendly" content="True"/>
-    <meta name="MobileOptimized" content="320"/>
-    <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
-    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon"/>
-    <meta name="description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!"/>
-    <meta name="canonical" content="https://preview.tabler.io/badges.html">
-    <meta name="twitter:image:src" content="https://preview.tabler.io/static/og.png">
-    <meta name="twitter:site" content="@tabler_ui">
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta name="twitter:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
-    <meta property="og:image" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:image:width" content="1280">
-    <meta property="og:image:height" content="640">
-    <meta property="og:site_name" content="Tabler">
-    <meta property="og:type" content="object">
-    <meta property="og:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta property="og:url" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
     <!-- CSS files -->
-    <link href="./dist/css/tabler.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-flags.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-payments.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-vendors.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/demo.min.css?1685973381" rel="stylesheet"/>
+    <link href="./dist/css/tabler.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-flags.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-payments.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-vendors.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/demo.min.css?1692870487" rel="stylesheet"/>
     <style>
       @import url('https://rsms.me/inter/inter.css');
       :root {
@@ -55,7 +30,7 @@
     </style>
   </head>
   <body >
-    <script src="./dist/js/demo-theme.min.js?1685973381"></script>
+    <script src="./dist/js/demo-theme.min.js?1692870487"></script>
     <div class="page">
       <!-- Navbar -->
       <header class="navbar navbar-expand-md d-print-none" >
@@ -399,6 +374,9 @@
                         <a class="dropdown-item" href="./tabs.html">
                           Tabs
                         </a>
+                        <a class="dropdown-item" href="./tags.html">
+                          Tags
+                        </a>
                         <a class="dropdown-item" href="./tables.html">
                           Tables
                         </a>
@@ -442,6 +420,10 @@
                           Cookie banner
                           <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
                         </a>
+                        <a class="dropdown-item" href="./chat.html">
+                          Chat
+                          <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
+                        </a>
                         <a class="dropdown-item" href="./activity.html">
                           Activity
                         </a>
@@ -580,7 +562,17 @@
                       <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 11a7 7 0 0 1 14 0v7a1.78 1.78 0 0 1 -3.1 1.4a1.65 1.65 0 0 0 -2.6 0a1.65 1.65 0 0 1 -2.6 0a1.65 1.65 0 0 0 -2.6 0a1.78 1.78 0 0 1 -3.1 -1.4v-7" /><path d="M10 10l.01 0" /><path d="M14 10l.01 0" /><path d="M10 14a3.5 3.5 0 0 0 4 0" /></svg>
                     </span>
                     <span class="nav-link-title">
-                      4231 icons
+                      4637 icons
+                    </span>
+                  </a>
+                </li>
+                <li class="nav-item">
+                  <a class="nav-link" href="./emails.html" >
+                    <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/mail-opened -->
+                      <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 9l9 6l9 -6l-9 -6l-9 6" /><path d="M21 9v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10" /><path d="M3 19l6 -6" /><path d="M15 13l6 6" /></svg>
+                    </span>
+                    <span class="nav-link-title">
+                      Email templates
                     </span>
                   </a>
                 </li>
@@ -661,18 +653,18 @@
                     <div class="card">
                       <div class="card-body">
                         <div class="badges-list">
-                          <span class="badge bg-blue">Blue</span>
-                          <span class="badge bg-azure">Azure</span>
-                          <span class="badge bg-indigo">Indigo</span>
-                          <span class="badge bg-purple">Purple</span>
-                          <span class="badge bg-pink">Pink</span>
-                          <span class="badge bg-red">Red</span>
-                          <span class="badge bg-orange">Orange</span>
-                          <span class="badge bg-yellow">Yellow</span>
-                          <span class="badge bg-lime">Lime</span>
-                          <span class="badge bg-green">Green</span>
-                          <span class="badge bg-teal">Teal</span>
-                          <span class="badge bg-cyan">Cyan</span>
+                          <span class="badge bg-blue text-blue-fg">Blue</span>
+                          <span class="badge bg-azure text-azure-fg">Azure</span>
+                          <span class="badge bg-indigo text-indigo-fg">Indigo</span>
+                          <span class="badge bg-purple text-purple-fg">Purple</span>
+                          <span class="badge bg-pink text-pink-fg">Pink</span>
+                          <span class="badge bg-red text-red-fg">Red</span>
+                          <span class="badge bg-orange text-orange-fg">Orange</span>
+                          <span class="badge bg-yellow text-yellow-fg">Yellow</span>
+                          <span class="badge bg-lime text-lime-fg">Lime</span>
+                          <span class="badge bg-green text-green-fg">Green</span>
+                          <span class="badge bg-teal text-teal-fg">Teal</span>
+                          <span class="badge bg-cyan text-cyan-fg">Cyan</span>
                         </div>
                       </div>
                     </div>
@@ -723,7 +715,7 @@
                 <div class="dropdown-menu dropdown-menu-demo dropdown-menu-arrow">
                   <a class="dropdown-item" href="#">
                     Action
-                    <span class="badge bg-primary ms-auto">12</span>
+                    <span class="badge bg-primary text-primary-fg ms-auto">12</span>
                   </a>
                   <a class="dropdown-item" href="#">
                     Another action
@@ -737,18 +729,18 @@
                     <div class="card">
                       <div class="card-body">
                         <div class="btn-list">
-                          <button class="btn">Blue badge <span class="badge bg-blue ms-2">1</span></button>
-                          <button class="btn">Azure badge <span class="badge bg-azure ms-2">2</span></button>
-                          <button class="btn">Indigo badge <span class="badge bg-indigo ms-2">3</span></button>
-                          <button class="btn">Purple badge <span class="badge bg-purple ms-2">4</span></button>
-                          <button class="btn">Pink badge <span class="badge bg-pink ms-2">5</span></button>
-                          <button class="btn">Red badge <span class="badge bg-red ms-2">6</span></button>
-                          <button class="btn">Orange badge <span class="badge bg-orange ms-2">7</span></button>
-                          <button class="btn">Yellow badge <span class="badge bg-yellow ms-2">8</span></button>
-                          <button class="btn">Lime badge <span class="badge bg-lime ms-2">9</span></button>
-                          <button class="btn">Green badge <span class="badge bg-green ms-2">10</span></button>
-                          <button class="btn">Teal badge <span class="badge bg-teal ms-2">11</span></button>
-                          <button class="btn">Cyan badge <span class="badge bg-cyan ms-2">12</span></button>
+                          <button class="btn">Blue badge <span class="badge bg-blue text-blue-fg ms-2">1</span></button>
+                          <button class="btn">Azure badge <span class="badge bg-azure text-azure-fg ms-2">2</span></button>
+                          <button class="btn">Indigo badge <span class="badge bg-indigo text-indigo-fg ms-2">3</span></button>
+                          <button class="btn">Purple badge <span class="badge bg-purple text-purple-fg ms-2">4</span></button>
+                          <button class="btn">Pink badge <span class="badge bg-pink text-pink-fg ms-2">5</span></button>
+                          <button class="btn">Red badge <span class="badge bg-red text-red-fg ms-2">6</span></button>
+                          <button class="btn">Orange badge <span class="badge bg-orange text-orange-fg ms-2">7</span></button>
+                          <button class="btn">Yellow badge <span class="badge bg-yellow text-yellow-fg ms-2">8</span></button>
+                          <button class="btn">Lime badge <span class="badge bg-lime text-lime-fg ms-2">9</span></button>
+                          <button class="btn">Green badge <span class="badge bg-green text-green-fg ms-2">10</span></button>
+                          <button class="btn">Teal badge <span class="badge bg-teal text-teal-fg ms-2">11</span></button>
+                          <button class="btn">Cyan badge <span class="badge bg-cyan text-cyan-fg ms-2">12</span></button>
                         </div>
                       </div>
                     </div>
@@ -757,18 +749,18 @@
                     <div class="card">
                       <div class="card-body">
                         <div class="btn-list">
-                          <button class="btn position-relative">Blue badge <span class="badge bg-blue badge-notification badge-pill">1</span></button>
-                          <button class="btn position-relative">Azure badge <span class="badge bg-azure badge-notification badge-pill">2</span></button>
-                          <button class="btn position-relative">Indigo badge <span class="badge bg-indigo badge-notification badge-pill">3</span></button>
-                          <button class="btn position-relative">Purple badge <span class="badge bg-purple badge-notification badge-pill">4</span></button>
-                          <button class="btn position-relative">Pink badge <span class="badge bg-pink badge-notification badge-pill">5</span></button>
-                          <button class="btn position-relative">Red badge <span class="badge bg-red badge-notification badge-pill">6</span></button>
-                          <button class="btn position-relative">Orange badge <span class="badge bg-orange badge-notification badge-pill">7</span></button>
-                          <button class="btn position-relative">Yellow badge <span class="badge bg-yellow badge-notification badge-pill">8</span></button>
-                          <button class="btn position-relative">Lime badge <span class="badge bg-lime badge-notification badge-pill">9</span></button>
-                          <button class="btn position-relative">Green badge <span class="badge bg-green badge-notification badge-pill">10</span></button>
-                          <button class="btn position-relative">Teal badge <span class="badge bg-teal badge-notification badge-pill">11</span></button>
-                          <button class="btn position-relative">Cyan badge <span class="badge bg-cyan badge-notification badge-pill">12</span></button>
+                          <button class="btn position-relative">Blue badge <span class="badge bg-blue text-blue-fg badge-notification badge-pill">1</span></button>
+                          <button class="btn position-relative">Azure badge <span class="badge bg-azure text-azure-fg badge-notification badge-pill">2</span></button>
+                          <button class="btn position-relative">Indigo badge <span class="badge bg-indigo text-indigo-fg badge-notification badge-pill">3</span></button>
+                          <button class="btn position-relative">Purple badge <span class="badge bg-purple text-purple-fg badge-notification badge-pill">4</span></button>
+                          <button class="btn position-relative">Pink badge <span class="badge bg-pink text-pink-fg badge-notification badge-pill">5</span></button>
+                          <button class="btn position-relative">Red badge <span class="badge bg-red text-red-fg badge-notification badge-pill">6</span></button>
+                          <button class="btn position-relative">Orange badge <span class="badge bg-orange text-orange-fg badge-notification badge-pill">7</span></button>
+                          <button class="btn position-relative">Yellow badge <span class="badge bg-yellow text-yellow-fg badge-notification badge-pill">8</span></button>
+                          <button class="btn position-relative">Lime badge <span class="badge bg-lime text-lime-fg badge-notification badge-pill">9</span></button>
+                          <button class="btn position-relative">Green badge <span class="badge bg-green text-green-fg badge-notification badge-pill">10</span></button>
+                          <button class="btn position-relative">Teal badge <span class="badge bg-teal text-teal-fg badge-notification badge-pill">11</span></button>
+                          <button class="btn position-relative">Cyan badge <span class="badge bg-cyan text-cyan-fg badge-notification badge-pill">12</span></button>
                         </div>
                       </div>
                     </div>
@@ -824,7 +816,7 @@
                   </li>
                   <li class="list-inline-item">
                     <a href="./changelog.html" class="link-secondary" rel="noopener">
-                      v1.0.0-beta19
+                      v1.0.0-beta20
                     </a>
                   </li>
                 </ul>
@@ -836,7 +828,7 @@
     </div>
     <!-- Libs JS -->
     <!-- Tabler Core -->
-    <script src="./dist/js/tabler.min.js?1685973381" defer></script>
-    <script src="./dist/js/demo.min.js?1685973381" defer></script>
+    <script src="./dist/js/tabler.min.js?1692870487" defer></script>
+    <script src="./dist/js/demo.min.js?1692870487" defer></script>
   </body>
 </html>

+ 28 - 36
demo/blank.html

@@ -1,7 +1,7 @@
 <!doctype html>
 <!--
 * Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
-* @version 1.0.0-beta19
+* @version 1.0.0-beta20
 * @link https://tabler.io
 * Copyright 2018-2023 The Tabler Authors
 * Copyright 2018-2023 codecalm.net Paweł Kuna
@@ -13,37 +13,12 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
     <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
     <title>Blank page - Tabler - Premium and Open Source dashboard template with responsive and high quality UI.</title>
-    <script defer data-api="/stats/api/event" data-domain="preview.tabler.io" src="/stats/js/script.js"></script>
-    <meta name="msapplication-TileColor" content=""/>
-    <meta name="theme-color" content=""/>
-    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
-    <meta name="apple-mobile-web-app-capable" content="yes"/>
-    <meta name="mobile-web-app-capable" content="yes"/>
-    <meta name="HandheldFriendly" content="True"/>
-    <meta name="MobileOptimized" content="320"/>
-    <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
-    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon"/>
-    <meta name="description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!"/>
-    <meta name="canonical" content="https://preview.tabler.io/blank.html">
-    <meta name="twitter:image:src" content="https://preview.tabler.io/static/og.png">
-    <meta name="twitter:site" content="@tabler_ui">
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta name="twitter:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
-    <meta property="og:image" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:image:width" content="1280">
-    <meta property="og:image:height" content="640">
-    <meta property="og:site_name" content="Tabler">
-    <meta property="og:type" content="object">
-    <meta property="og:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta property="og:url" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
     <!-- CSS files -->
-    <link href="./dist/css/tabler.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-flags.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-payments.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-vendors.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/demo.min.css?1685973381" rel="stylesheet"/>
+    <link href="./dist/css/tabler.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-flags.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-payments.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-vendors.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/demo.min.css?1692870487" rel="stylesheet"/>
     <style>
       @import url('https://rsms.me/inter/inter.css');
       :root {
@@ -55,7 +30,7 @@
     </style>
   </head>
   <body >
-    <script src="./dist/js/demo-theme.min.js?1685973381"></script>
+    <script src="./dist/js/demo-theme.min.js?1692870487"></script>
     <div class="page">
       <!-- Navbar -->
       <header class="navbar navbar-expand-md d-print-none" >
@@ -399,6 +374,9 @@
                         <a class="dropdown-item" href="./tabs.html">
                           Tabs
                         </a>
+                        <a class="dropdown-item" href="./tags.html">
+                          Tags
+                        </a>
                         <a class="dropdown-item" href="./tables.html">
                           Tables
                         </a>
@@ -442,6 +420,10 @@
                           Cookie banner
                           <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
                         </a>
+                        <a class="dropdown-item" href="./chat.html">
+                          Chat
+                          <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
+                        </a>
                         <a class="dropdown-item" href="./activity.html">
                           Activity
                         </a>
@@ -580,7 +562,17 @@
                       <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 11a7 7 0 0 1 14 0v7a1.78 1.78 0 0 1 -3.1 1.4a1.65 1.65 0 0 0 -2.6 0a1.65 1.65 0 0 1 -2.6 0a1.65 1.65 0 0 0 -2.6 0a1.78 1.78 0 0 1 -3.1 -1.4v-7" /><path d="M10 10l.01 0" /><path d="M14 10l.01 0" /><path d="M10 14a3.5 3.5 0 0 0 4 0" /></svg>
                     </span>
                     <span class="nav-link-title">
-                      4231 icons
+                      4637 icons
+                    </span>
+                  </a>
+                </li>
+                <li class="nav-item">
+                  <a class="nav-link" href="./emails.html" >
+                    <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/mail-opened -->
+                      <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 9l9 6l9 -6l-9 -6l-9 6" /><path d="M21 9v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10" /><path d="M3 19l6 -6" /><path d="M15 13l6 6" /></svg>
+                    </span>
+                    <span class="nav-link-title">
+                      Email templates
                     </span>
                   </a>
                 </li>
@@ -673,7 +665,7 @@
                   </li>
                   <li class="list-inline-item">
                     <a href="./changelog.html" class="link-secondary" rel="noopener">
-                      v1.0.0-beta19
+                      v1.0.0-beta20
                     </a>
                   </li>
                 </ul>
@@ -685,7 +677,7 @@
     </div>
     <!-- Libs JS -->
     <!-- Tabler Core -->
-    <script src="./dist/js/tabler.min.js?1685973381" defer></script>
-    <script src="./dist/js/demo.min.js?1685973381" defer></script>
+    <script src="./dist/js/tabler.min.js?1692870487" defer></script>
+    <script src="./dist/js/demo.min.js?1692870487" defer></script>
   </body>
 </html>

+ 30 - 38
demo/buttons.html

@@ -1,7 +1,7 @@
 <!doctype html>
 <!--
 * Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
-* @version 1.0.0-beta19
+* @version 1.0.0-beta20
 * @link https://tabler.io
 * Copyright 2018-2023 The Tabler Authors
 * Copyright 2018-2023 codecalm.net Paweł Kuna
@@ -13,37 +13,12 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
     <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
     <title>Buttons - Tabler - Premium and Open Source dashboard template with responsive and high quality UI.</title>
-    <script defer data-api="/stats/api/event" data-domain="preview.tabler.io" src="/stats/js/script.js"></script>
-    <meta name="msapplication-TileColor" content=""/>
-    <meta name="theme-color" content=""/>
-    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
-    <meta name="apple-mobile-web-app-capable" content="yes"/>
-    <meta name="mobile-web-app-capable" content="yes"/>
-    <meta name="HandheldFriendly" content="True"/>
-    <meta name="MobileOptimized" content="320"/>
-    <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
-    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon"/>
-    <meta name="description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!"/>
-    <meta name="canonical" content="https://preview.tabler.io/buttons.html">
-    <meta name="twitter:image:src" content="https://preview.tabler.io/static/og.png">
-    <meta name="twitter:site" content="@tabler_ui">
-    <meta name="twitter:card" content="summary">
-    <meta name="twitter:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta name="twitter:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
-    <meta property="og:image" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:image:width" content="1280">
-    <meta property="og:image:height" content="640">
-    <meta property="og:site_name" content="Tabler">
-    <meta property="og:type" content="object">
-    <meta property="og:title" content="Tabler: Premium and Open Source dashboard template with responsive and high quality UI.">
-    <meta property="og:url" content="https://preview.tabler.io/static/og.png">
-    <meta property="og:description" content="Tabler comes with tons of well-designed components and features. Start your adventure with Tabler and make your dashboard great again. For free!">
     <!-- CSS files -->
-    <link href="./dist/css/tabler.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-flags.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-payments.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/tabler-vendors.min.css?1685973381" rel="stylesheet"/>
-    <link href="./dist/css/demo.min.css?1685973381" rel="stylesheet"/>
+    <link href="./dist/css/tabler.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-flags.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-payments.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/tabler-vendors.min.css?1692870487" rel="stylesheet"/>
+    <link href="./dist/css/demo.min.css?1692870487" rel="stylesheet"/>
     <style>
       @import url('https://rsms.me/inter/inter.css');
       :root {
@@ -55,7 +30,7 @@
     </style>
   </head>
   <body >
-    <script src="./dist/js/demo-theme.min.js?1685973381"></script>
+    <script src="./dist/js/demo-theme.min.js?1692870487"></script>
     <div class="page">
       <!-- Navbar -->
       <header class="navbar navbar-expand-md d-print-none" >
@@ -399,6 +374,9 @@
                         <a class="dropdown-item" href="./tabs.html">
                           Tabs
                         </a>
+                        <a class="dropdown-item" href="./tags.html">
+                          Tags
+                        </a>
                         <a class="dropdown-item" href="./tables.html">
                           Tables
                         </a>
@@ -442,6 +420,10 @@
                           Cookie banner
                           <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
                         </a>
+                        <a class="dropdown-item" href="./chat.html">
+                          Chat
+                          <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">New</span>
+                        </a>
                         <a class="dropdown-item" href="./activity.html">
                           Activity
                         </a>
@@ -580,7 +562,17 @@
                       <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 11a7 7 0 0 1 14 0v7a1.78 1.78 0 0 1 -3.1 1.4a1.65 1.65 0 0 0 -2.6 0a1.65 1.65 0 0 1 -2.6 0a1.65 1.65 0 0 0 -2.6 0a1.78 1.78 0 0 1 -3.1 -1.4v-7" /><path d="M10 10l.01 0" /><path d="M14 10l.01 0" /><path d="M10 14a3.5 3.5 0 0 0 4 0" /></svg>
                     </span>
                     <span class="nav-link-title">
-                      4231 icons
+                      4637 icons
+                    </span>
+                  </a>
+                </li>
+                <li class="nav-item">
+                  <a class="nav-link" href="./emails.html" >
+                    <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/mail-opened -->
+                      <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 9l9 6l9 -6l-9 -6l-9 6" /><path d="M21 9v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10" /><path d="M3 19l6 -6" /><path d="M15 13l6 6" /></svg>
+                    </span>
+                    <span class="nav-link-title">
+                      Email templates
                     </span>
                   </a>
                 </li>
@@ -1268,7 +1260,7 @@
                       <div class="col-6 col-sm-4 col-md-2 col-xl-auto py-3">
                         <a href="#" class="btn btn-youtube w-100 btn-icon" aria-label="Youtube">
                           <!-- Download SVG icon from http://tabler-icons.io/i/brand-youtube -->
-                          <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 5m0 4a4 4 0 0 1 4 -4h10a4 4 0 0 1 4 4v6a4 4 0 0 1 -4 4h-10a4 4 0 0 1 -4 -4z" /><path d="M10 9l5 3l-5 3z" /></svg>
+                          <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M2 8a4 4 0 0 1 4 -4h12a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-12a4 4 0 0 1 -4 -4v-8z" /><path d="M10 9l5 3l-5 3z" /></svg>
                         </a>
                       </div>
                       <div class="col-6 col-sm-4 col-md-2 col-xl-auto py-3">
@@ -1366,7 +1358,7 @@
                       <div class="col-6 col-sm-4 col-md-2 col-xl-auto py-3">
                         <a href="#" class="btn btn-youtube w-100">
                           <!-- Download SVG icon from http://tabler-icons.io/i/brand-youtube -->
-                          <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 5m0 4a4 4 0 0 1 4 -4h10a4 4 0 0 1 4 4v6a4 4 0 0 1 -4 4h-10a4 4 0 0 1 -4 -4z" /><path d="M10 9l5 3l-5 3z" /></svg>
+                          <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M2 8a4 4 0 0 1 4 -4h12a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-12a4 4 0 0 1 -4 -4v-8z" /><path d="M10 9l5 3l-5 3z" /></svg>
                           Youtube
                         </a>
                       </div>
@@ -1473,7 +1465,7 @@
                   </li>
                   <li class="list-inline-item">
                     <a href="./changelog.html" class="link-secondary" rel="noopener">
-                      v1.0.0-beta19
+                      v1.0.0-beta20
                     </a>
                   </li>
                 </ul>
@@ -1485,7 +1477,7 @@
     </div>
     <!-- Libs JS -->
     <!-- Tabler Core -->
-    <script src="./dist/js/tabler.min.js?1685973381" defer></script>
-    <script src="./dist/js/demo.min.js?1685973381" defer></script>
+    <script src="./dist/js/tabler.min.js?1692870487" defer></script>
+    <script src="./dist/js/demo.min.js?1692870487" defer></script>
   </body>
 </html>

Некоторые файлы не были показаны из-за большого количества измененных файлов