Add 1.6 release notes intro with cover and component screenshots

- Store the 1.5 release screenshots in the repo

.github/release-notes/1.5.0.md

@@ -7,6 +7,8 @@ Tabler 1.5 is out. It's the biggest release we've done, with more than 250 chang
 
 ## Folded sidebar
 
+![Folded sidebar](https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.5.0-folded-sidebar.png)
+
 The vertical sidebar can fold down to a narrow strip of icons with `navbar-folded`. With `navbar-folded-hover` it stays folded and opens when you hover over it. Submenus open as flyouts next to the icon, and there's a pin toggle if you want to keep the sidebar open.
 
 Two smaller things came with it. Section titles in the sidebar (`nav-section-title`) turn into short separators while it's folded, so you don't lose the grouping. And there's a new `navbar-footer` zone for the user block at the bottom. The navigation scrolls between the pinned brand and the pinned footer.
@@ -15,12 +17,16 @@ The sidebar is also light and `16rem` wide by default now.
 
 ## Layout settings
 
+![Layout settings](https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.5.0-layout-settings.png)
+
 The theme panel does more than light and dark now. It also switches the layout, through four attributes you can set on `<html>` yourself: `data-bs-layout` for the container width (`default`, `fluid`, `boxed`), `data-bs-navbar-position` for whether the page shows the vertical or the horizontal navigation, `data-bs-navbar` for a sticky top bar, and `data-bs-navbar-theme` for coloring the navigation `dark` or `primary`. The folded sidebar has its own `data-bs-sidebar`.
 
 The panel itself was redesigned around them, with an illustrated intro, color scheme presets and thumbnail tiles for most settings. A Customize entry in the sidebar footer and in the navbar opens it.
 
 ## Gradient cards
 
+![Gradient cards](https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.5.0-gradient-cards.png)
+
 `.card-gradient` gives a card a gradient background. There are variants for each theme color, modifiers for the direction, and an animated version.
 
 The gradient stops are plain utilities, so you can use them anywhere else too. `.bg-gradient-from-*`, `-via-*` and `-to-*` now also take `transparent` and `-inverted`.
@@ -29,12 +35,16 @@ There's a new Card gradients page in the demo with all the combinations.
 
 ## Background patterns
 
+![Background patterns](https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.5.0-background-patterns.png)
+
 Backgrounds can have a pattern now. Dots, grids, stripes and a few more, through a set of `.bg-pattern-*` utilities.
 
 You can also control how strong the pattern is. `--tblr-pattern-opacity-factor` scales the opacity globally, and `.bg-pattern-opacity-*` sets it per element.
 
 ## New chart types
 
+![Radar chart](https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.5.0-chart-radar.png)
+
 Seven chart types joined the demo and the docs: radar, polar area, treemap, timeline, box plot, bubble and funnel. There's also a new Advanced charts page for the harder cases, with two y-axes, annotations, a zoom brush and synced chart groups.
 
 Chart colors aren't hardcoded per chart any more. There's a `--tblr-chart-1` through `--tblr-chart-5` palette wired into the ApexCharts theme tokens, so charts generally follow the current color mode on their own. ApexCharts itself went from 3.54.1 to 7.0.0.

.github/release-notes/1.6.0.md

@@ -0,0 +1,113 @@
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-cover-dark.png">
+  <img alt="Tabler 1.6" src="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-cover.png">
+</picture>
+
+Tabler 1.6 is out. It brings eight new components, a datepicker that doesn't depend on Litepicker any more, a neutral gray scale, colors defined in `oklch()` and a focus ring that's finally an outline. The CSS also got smaller: about 110 kB came off `tabler.min.css`. On top of that there are more than a hundred smaller changes across the framework, the demo pages and the docs.
+
+## New components
+
+Eight components joined `tabler.js` and the CSS. Each one has a demo page and a docs page.
+
+**Datepicker**, a calendar popup or an inline calendar with single, multiple and range selection. It's built on Vanilla Calendar Pro, so Litepicker is deprecated.
+
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-datepicker-dark.png">
+  <img alt="Datepicker" src="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-datepicker.png">
+</picture>
+
+**Sparkline**, inline SVG line, bar and circle charts rendered from `data-bs-values`. No chart library needed.
+
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-sparkline-dark.png">
+  <img alt="Sparkline" src="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-sparkline.png">
+</picture>
+
+**Legend**, a colored marker plus a label for chart series, with an interactive mode that toggles the series on click. There's a large variant with a big value and a unit.
+
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-legend-dark.png">
+  <img alt="Legend" src="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-legend.png">
+</picture>
+
+**Signal**, a row of stepped bars that shows a level, such as priority or signal strength.
+
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-signal-dark.png">
+  <img alt="Signal" src="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-signal.png">
+</picture>
+
+**Password strength**, a segmented meter that scores the password as the user types and fires `change.bs.strength`.
+
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-password-strength-dark.png">
+  <img alt="Password strength" src="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-password-strength.png">
+</picture>
+
+**OTP input**, grouped single-character slots for one-time codes, with masking and validation states.
+
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-otp-input-dark.png">
+  <img alt="OTP input" src="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-otp-input.png">
+</picture>
+
+**Clipboard**, a copy button with a copied state, built on the browser API. `dist/libs/clipboard` is deprecated.
+
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-clipboard-dark.png">
+  <img alt="Clipboard" src="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-clipboard.png">
+</picture>
+
+**Confetti**, a shower of pieces from any button with `data-bs-toggle="confetti"`.
+
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-confetti-dark.png">
+  <img alt="Confetti" src="https://raw.githubusercontent.com/tabler/tabler/dev/.github/release-notes/1.6.0-confetti.png">
+</picture>
+
+## Plugins are components now
+
+`Autosize`, `CountUp`, `InputMask`, `Sortable` and `SwitchIcon` are real components with instances, methods and events. Autosize and CountUp are written from scratch and don't need the `dist/libs` scripts any more, so those are deprecated. CountUp respects `prefers-reduced-motion`.
+
+Switch icon got a `switch-icon-loading` state. Pass a promise to `event.wait()` in the `toggle.bs.switch-icon` event and the button shows a spinner until it settles.
+
+Sortable got drag styles for the ghost, the chosen and the dragged item, and the demo shows a drag handle, table rows, a kanban board, clone, multi-drag and swap.
+
+`tabler.js` also no longer stops on page load when one element has an invalid `data-*` config. The error is logged and every other component is still created.
+
+## Neutral gray and oklch colors
+
+The default gray scale is `neutral` now. In 1.5 it had a slight blue tint, so backgrounds, borders and muted text look a little different. To keep the 1.5 look, load `tabler-themes.css` and set `data-bs-theme-base="gray"` on `<html>`.
+
+The palette is defined in `oklch()`, and tints, shades and hover states are mixed with `color-mix(in oklab)` instead of `rgba()`. Mixed colors are a touch cleaner, mostly noticeable in the lighter backgrounds. The `--tblr-*-rgb` variables are deprecated and stay until 2.0.
+
+The focus indicator is a solid 2px `outline` instead of a `box-shadow` halo, stronger in dark mode. You can tune it per component with `--tblr-focus-ring-width` and `--tblr-focus-ring-color`.
+
+## Floating navbar and offcanvas
+
+`.navbar-floating` detaches the navbar and the sidebar from the edge of the screen with a `0.5rem` gap, and `.offcanvas-floating` does the same for an offcanvas. The theme settings `data-bs-navbar-style="floating"` and `data-bs-offcanvas-style="floating"` on `<html>` switch the whole page.
+
+A native `<dialog>` opened with `showModal()` gets the same backdrop as a modal, and `.modal-blur` on it blurs the page behind. Scrolling to the end of a modal, an offcanvas or a scrollable dropdown no longer scrolls the page behind it.
+
+## Smaller CSS
+
+`tabler.min.css` lost about 110 kB. The button, list group, `bg-pattern-*` and color utility styles are generated once instead of per variant, and the vertical navbar is generated once instead of per breakpoint. The flag, payment and social SVGs in `dist/img` are minified, and only the images the CSS uses are copied.
+
+If you ship your own build, `$enable-deprecated: false` leaves the deprecated aliases and the `--tblr-*-rgb` variables out of the CSS entirely.
+
+## Demo and docs
+
+The demo has a new billing page, a system status panel with 60-day uptime bars, gauge cards on the widgets page and a reworked charts page with sections and legends. The hardcoded Google Maps and Mapbox keys are gone; the map demos read them from the environment.
+
+Component docs pages got a CSS variables section generated from the source, so it can't go stale. Markdown tables and the class reference table sit in a bordered, scrollable box. The CDN snippets carry `integrity` and `crossorigin` attributes. There's a Sortable page, an agent skill under `/.well-known/agent-skills/`, and the upgrade guides moved to `/ui/getting-started/upgrade/` with one page per release.
+
+## Upgrading
+
+Nothing in 1.6 requires a change to your markup. A few things are deprecated and keep working:
+
+- `.form-hint` is `.form-text` now, matching Bootstrap. The old class is an alias.
+- An empty `.legend` still renders as a dot, but `.legend-dot` is the class for it.
+- The `$*-focus-box-shadow` variables, `theme-color-lighter()`, `url-svg()`, `varify()` and a few other Sass helpers warn when used.
+- The `tabler.tabler` JS namespace with `getColor()` and `hexToRgba()` is deprecated. Read the variable yourself.
+
+Every change, with a before and after example for each one, is in the [Upgrade to 1.6](https://docs.tabler.io/ui/getting-started/upgrade/1-6) guide.