mirror of
https://github.com/tabler/tabler.git
synced 2025-12-26 11:16:12 +04:00
Release 1.0.0-beta7
This commit is contained in:
codecalm
@@ -1,7 +1,7 @@
|
||||
<!doctype html>
|
||||
<!--
|
||||
* Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
|
||||
* @version 1.0.0-beta6
|
||||
* @version 1.0.0-beta7
|
||||
* @link https://tabler.io
|
||||
* Copyright 2018-2022 The Tabler Authors
|
||||
* Copyright 2018-2022 codecalm.net Paweł Kuna
|
||||
@@ -47,24 +47,96 @@
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<a href="?theme=dark" class="nav-link px-0 hide-theme-dark" title="Enable dark mode" data-bs-toggle="tooltip" data-bs-placement="bottom">
|
||||
<!-- Download SVG icon from http://tabler-icons.io/i/moon -->
|
||||
<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="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454z" /></svg>
|
||||
</a>
|
||||
<a href="?theme=light" class="nav-link px-0 hide-theme-light" title="Enable light mode" data-bs-toggle="tooltip" data-bs-placement="bottom">
|
||||
<!-- Download SVG icon from http://tabler-icons.io/i/sun -->
|
||||
<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"/><circle cx="12" cy="12" r="4" /><path d="M3 12h1m8 -9v1m8 8h1m-9 8v1m-6.4 -15.4l.7 .7m12.1 -.7l-.7 .7m0 11.4l.7 .7m-12.1 -.7l-.7 .7" /></svg>
|
||||
</a>
|
||||
<div class="nav-item dropdown d-none d-md-flex me-3">
|
||||
<a href="#" class="nav-link px-0" data-bs-toggle="dropdown" tabindex="-1" aria-label="Show notifications">
|
||||
<!-- Download SVG icon from http://tabler-icons.io/i/bell -->
|
||||
<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="M10 5a2 2 0 0 1 4 0a7 7 0 0 1 4 6v3a4 4 0 0 0 2 3h-16a4 4 0 0 0 2 -3v-3a7 7 0 0 1 4 -6" /><path d="M9 17v1a3 3 0 0 0 6 0v-1" /></svg>
|
||||
<span class="badge bg-red"></span>
|
||||
<div class="d-none d-md-flex">
|
||||
<a href="?theme=dark" class="nav-link px-0 hide-theme-dark" title="Enable dark mode" data-bs-toggle="tooltip" data-bs-placement="bottom">
|
||||
<!-- Download SVG icon from http://tabler-icons.io/i/moon -->
|
||||
<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="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454z" /></svg>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-end dropdown-menu-card">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus ad amet consectetur exercitationem fugiat in ipsa ipsum, natus odio quidem quod repudiandae sapiente. Amet debitis et magni maxime necessitatibus ullam.
|
||||
<a href="?theme=light" class="nav-link px-0 hide-theme-light" title="Enable light mode" data-bs-toggle="tooltip" data-bs-placement="bottom">
|
||||
<!-- Download SVG icon from http://tabler-icons.io/i/sun -->
|
||||
<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"/><circle cx="12" cy="12" r="4" /><path d="M3 12h1m8 -9v1m8 8h1m-9 8v1m-6.4 -15.4l.7 .7m12.1 -.7l-.7 .7m0 11.4l.7 .7m-12.1 -.7l-.7 .7" /></svg>
|
||||
</a>
|
||||
<div class="nav-item dropdown d-none d-md-flex me-3">
|
||||
<a href="#" class="nav-link px-0" data-bs-toggle="dropdown" tabindex="-1" aria-label="Show notifications">
|
||||
<!-- Download SVG icon from http://tabler-icons.io/i/bell -->
|
||||
<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="M10 5a2 2 0 0 1 4 0a7 7 0 0 1 4 6v3a4 4 0 0 0 2 3h-16a4 4 0 0 0 2 -3v-3a7 7 0 0 1 4 -6" /><path d="M9 17v1a3 3 0 0 0 6 0v-1" /></svg>
|
||||
<span class="badge bg-red"></span>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-arrow dropdown-menu-end dropdown-menu-card">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Last updates</h3>
|
||||
</div>
|
||||
<div class="list-group list-group-flush list-group-hoverable">
|
||||
<div class="list-group-item">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-auto"><span class="status-dot status-dot-animated bg-red d-block"></span></div>
|
||||
<div class="col text-truncate">
|
||||
<a href="#" class="text-body d-block">Example 1</a>
|
||||
<div class="d-block text-muted text-truncate mt-n1">
|
||||
Change deprecated html tags to text decoration classes (#29604)
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<a href="#" class="list-group-item-actions">
|
||||
<!-- Download SVG icon from http://tabler-icons.io/i/star -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon text-muted" 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="M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z" /></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list-group-item">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-auto"><span class="status-dot d-block"></span></div>
|
||||
<div class="col text-truncate">
|
||||
<a href="#" class="text-body d-block">Example 2</a>
|
||||
<div class="d-block text-muted text-truncate mt-n1">
|
||||
justify-content:between ⇒ justify-content:space-between (#29734)
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<a href="#" class="list-group-item-actions show">
|
||||
<!-- Download SVG icon from http://tabler-icons.io/i/star -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon text-yellow" 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="M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z" /></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list-group-item">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-auto"><span class="status-dot d-block"></span></div>
|
||||
<div class="col text-truncate">
|
||||
<a href="#" class="text-body d-block">Example 3</a>
|
||||
<div class="d-block text-muted text-truncate mt-n1">
|
||||
Update change-version.js (#29736)
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<a href="#" class="list-group-item-actions">
|
||||
<!-- Download SVG icon from http://tabler-icons.io/i/star -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon text-muted" 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="M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z" /></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list-group-item">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-auto"><span class="status-dot status-dot-animated bg-green d-block"></span></div>
|
||||
<div class="col text-truncate">
|
||||
<a href="#" class="text-body d-block">Example 4</a>
|
||||
<div class="d-block text-muted text-truncate mt-n1">
|
||||
Regenerate package-lock.json (#29730)
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<a href="#" class="list-group-item-actions">
|
||||
<!-- Download SVG icon from http://tabler-icons.io/i/star -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon text-muted" 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="M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z" /></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -128,21 +200,30 @@
|
||||
<a class="dropdown-item" href="../buttons.html" >
|
||||
Buttons
|
||||
</a>
|
||||
<a class="dropdown-item" href="../cards.html" >
|
||||
Cards
|
||||
</a>
|
||||
<a class="dropdown-item" href="../cards-masonry.html" >
|
||||
Cards Masonry
|
||||
</a>
|
||||
<div class="dropend">
|
||||
<a class="dropdown-item dropdown-toggle" href="#sidebar-cards" data-bs-toggle="dropdown" data-bs-auto-close="outside" role="button" aria-expanded="false" >
|
||||
Cards
|
||||
<span class="badge badge-sm bg-green text-uppercase ms-2">New</span>
|
||||
</a>
|
||||
<div class="dropdown-menu">
|
||||
<a href="../cards.html" class="dropdown-item">
|
||||
Sample cards
|
||||
</a>
|
||||
<a href="../card-actions.html" class="dropdown-item">
|
||||
Card actions
|
||||
<span class="badge badge-sm bg-green text-uppercase ms-2">New</span>
|
||||
</a>
|
||||
<a href="../cards-masonry.html" class="dropdown-item">
|
||||
Cards Masonry
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<a class="dropdown-item" href="../colors.html" >
|
||||
Colors
|
||||
</a>
|
||||
<a class="dropdown-item" href="../dropdowns.html" >
|
||||
Dropdowns
|
||||
</a>
|
||||
<a class="dropdown-item" href="../icons.html" >
|
||||
Icons
|
||||
</a>
|
||||
<a class="dropdown-item" href="../modals.html" >
|
||||
Modals
|
||||
</a>
|
||||
@@ -155,11 +236,11 @@
|
||||
<a class="dropdown-item" href="../maps-vector.html" >
|
||||
Vector maps
|
||||
</a>
|
||||
</div>
|
||||
<div class="dropdown-menu-column">
|
||||
<a class="dropdown-item" href="../navigation.html" >
|
||||
Navigation
|
||||
</a>
|
||||
</div>
|
||||
<div class="dropdown-menu-column">
|
||||
<a class="dropdown-item" href="../charts.html" >
|
||||
Charts
|
||||
</a>
|
||||
@@ -195,11 +276,21 @@
|
||||
Authentication
|
||||
</a>
|
||||
<div class="dropdown-menu">
|
||||
<a href="../sign-in.html" class="dropdown-item">Sign in</a>
|
||||
<a href="../sign-up.html" class="dropdown-item">Sign up</a>
|
||||
<a href="../forgot-password.html" class="dropdown-item">Forgot password</a>
|
||||
<a href="../terms-of-service.html" class="dropdown-item">Terms of service</a>
|
||||
<a href="../auth-lock.html" class="dropdown-item">Lock screen</a>
|
||||
<a href="../sign-in.html" class="dropdown-item">
|
||||
Sign in
|
||||
</a>
|
||||
<a href="../sign-up.html" class="dropdown-item">
|
||||
Sign up
|
||||
</a>
|
||||
<a href="../forgot-password.html" class="dropdown-item">
|
||||
Forgot password
|
||||
</a>
|
||||
<a href="../terms-of-service.html" class="dropdown-item">
|
||||
Terms of service
|
||||
</a>
|
||||
<a href="../auth-lock.html" class="dropdown-item">
|
||||
Lock screen
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dropend">
|
||||
@@ -207,9 +298,15 @@
|
||||
Error pages
|
||||
</a>
|
||||
<div class="dropdown-menu">
|
||||
<a href="../error-404.html" class="dropdown-item">404 page</a>
|
||||
<a href="../error-500.html" class="dropdown-item">500 page</a>
|
||||
<a href="../error-maintenance.html" class="dropdown-item">Maintenance page</a>
|
||||
<a href="../error-404.html" class="dropdown-item">
|
||||
404 page
|
||||
</a>
|
||||
<a href="../error-500.html" class="dropdown-item">
|
||||
500 page
|
||||
</a>
|
||||
<a href="../error-maintenance.html" class="dropdown-item">
|
||||
Maintenance page
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -262,6 +359,7 @@
|
||||
</a>
|
||||
<a class="dropdown-item" href="../uptime.html" >
|
||||
Uptime monitor
|
||||
<span class="badge badge-sm bg-green text-uppercase ms-2">New</span>
|
||||
</a>
|
||||
<a class="dropdown-item" href="../widgets.html" >
|
||||
Widgets
|
||||
@@ -325,6 +423,16 @@
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../icons.html" >
|
||||
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/ghost -->
|
||||
<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" /><line x1="10" y1="10" x2="10.01" y2="10" /><line x1="14" y1="10" x2="14.01" y2="10" /><path d="M10 14a3.5 3.5 0 0 0 4 0" /></svg>
|
||||
</span>
|
||||
<span class="nav-link-title">
|
||||
1518 icons
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link" href="../docs/index.html" >
|
||||
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/file-text -->
|
||||
@@ -335,6 +443,16 @@
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../changelog.html" >
|
||||
<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/file-plus -->
|
||||
<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="M14 3v4a1 1 0 0 0 1 1h4" /><path d="M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z" /><line x1="12" y1="11" x2="12" y2="17" /><line x1="9" y1="14" x2="15" y2="14" /></svg>
|
||||
</span>
|
||||
<span class="nav-link-title">
|
||||
Changelog
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="my-2 my-md-0 flex-grow-1 flex-md-grow-0 order-first order-md-last">
|
||||
<form action="." method="get">
|
||||
@@ -343,7 +461,7 @@
|
||||
<!-- Download SVG icon from http://tabler-icons.io/i/search -->
|
||||
<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"/><circle cx="10" cy="10" r="7" /><line x1="21" y1="21" x2="15" y2="15" /></svg>
|
||||
</span>
|
||||
<input type="text" class="form-control" placeholder="Search…" aria-label="Search in website">
|
||||
<input type="text" value="" class="form-control" placeholder="Search…" aria-label="Search in website">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@@ -366,7 +484,7 @@
|
||||
</div>
|
||||
<div class="page-body">
|
||||
<div class="container-xl">
|
||||
<div class="row gx-lg-4">
|
||||
<div class="row gx-lg-5">
|
||||
<div class="d-none d-lg-block col-lg-3">
|
||||
<ul class="nav nav-pills nav-vertical">
|
||||
<li class="nav-item">
|
||||
@@ -668,7 +786,7 @@
|
||||
<li class="nav-item">
|
||||
<a href="../changelog.html" class="nav-link">
|
||||
Changelog
|
||||
<span class="badge bg-blue-lt ms-auto">1.0.0-beta6</span>
|
||||
<span class="badge bg-blue-lt ms-auto">1.0.0-beta7</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -688,7 +806,7 @@
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<p>Progress bars are used to provide feedback on an action status and inform users of the current progress. Although seemingly small interface elements, they are extremely hepful in managing users' expectations and preventing them from abandoning a process they have initiated.</p>
|
||||
<p class="mb-4 text-muted">Progress bars are used to provide feedback on an action status and inform users of the current progress. Although seemingly small interface elements, they are extremely hepful in managing users' expectations and preventing them from abandoning a process they have initiated.</p>
|
||||
</div>
|
||||
<h2 id="default-markup">Default markup</h2>
|
||||
<p>To create a default progress bar, add a <code class="language-plaintext highlighter-rouge">.progress</code> class to a <code class="language-plaintext highlighter-rouge"><div></code> element. Thanks to that, you will be able to notify users how long they have to wait for a process to complete.</p>
|
||||
@@ -861,7 +979,7 @@
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<a href="../changelog.html" class="link-secondary" rel="noopener">
|
||||
v1.0.0-beta6
|
||||
v1.0.0-beta7
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
Reference in New Issue
Block a user