mirror of
https://github.com/tabler/tabler.git
synced 2025-12-23 10:24:24 +04:00
Compare commits
6 Commits
dev-form-c
...
dev-docs-i
| Author | SHA1 | Date | |
|---|---|---|---|
|
fa8fff6ed5 | ||
|
|
ae2f15183c | ||
|
|
c3fa9524ea | ||
|
|
49e766da8b | ||
|
|
5c8a98788c | ||
|
|
2a474ef935 |
@@ -1,5 +0,0 @@
|
|||||||
---
|
|
||||||
"@tabler/core": patch
|
|
||||||
---
|
|
||||||
|
|
||||||
Refactored Bootstrap exports to use single source of truth in `bootstrap.js` and removed duplicate exports from `tabler.js` for better maintainability.
|
|
||||||
@@ -1,6 +0,0 @@
|
|||||||
---
|
|
||||||
"@tabler/core": minor
|
|
||||||
---
|
|
||||||
|
|
||||||
Added `.card-gradient` component with gradient variants, direction modifiers, and animated backgrounds.
|
|
||||||
|
|
||||||
@@ -1,6 +0,0 @@
|
|||||||
---
|
|
||||||
"@tabler/preview": minor
|
|
||||||
---
|
|
||||||
|
|
||||||
Added new `card-gradients.html` page showcasing various gradient card styles and components.
|
|
||||||
|
|
||||||
@@ -1,5 +0,0 @@
|
|||||||
---
|
|
||||||
"@tabler/core": patch
|
|
||||||
---
|
|
||||||
|
|
||||||
Updated `$border-color-translucent-dark` from `rgba(72, 110, 149, 0.14)` to `rgba(128, 150, 172, 0.2)` to improve visibility of form checkboxes and other form elements in dark mode.
|
|
||||||
@@ -1,5 +0,0 @@
|
|||||||
---
|
|
||||||
"@tabler/core": patch
|
|
||||||
---
|
|
||||||
|
|
||||||
Fixed status color classes to use CSS variables instead of hardcoded values and include social colors (bitbucket, facebook, etc.) in status class generation.
|
|
||||||
@@ -1,5 +0,0 @@
|
|||||||
---
|
|
||||||
"@tabler/core": patch
|
|
||||||
---
|
|
||||||
|
|
||||||
Fixed white space on left side when scrollbar is present by replacing `margin-inline-start: calc(100vw - 100%)` with `scrollbar-gutter: stable` on `html` element, with `overflow-y: scroll` fallback for unsupported browsers.
|
|
||||||
@@ -1,7 +0,0 @@
|
|||||||
---
|
|
||||||
"@tabler/core": minor
|
|
||||||
"@tabler/docs": patch
|
|
||||||
---
|
|
||||||
|
|
||||||
Added Geist font family integration.
|
|
||||||
|
|
||||||
@@ -1,6 +0,0 @@
|
|||||||
---
|
|
||||||
"@tabler/core": patch
|
|
||||||
---
|
|
||||||
|
|
||||||
Added `border-top-left-radius` and `border-top-right-radius` to first and last child elements in `.card-table` for proper corner rounding.
|
|
||||||
|
|
||||||
@@ -1,6 +0,0 @@
|
|||||||
---
|
|
||||||
"@tabler/core": patch
|
|
||||||
---
|
|
||||||
|
|
||||||
Removed redundant nullish coalescing operator from `html` option in popover and tooltip initialization.
|
|
||||||
|
|
||||||
@@ -1,7 +0,0 @@
|
|||||||
---
|
|
||||||
"@tabler/core": patch
|
|
||||||
"@tabler/preview": patch
|
|
||||||
---
|
|
||||||
|
|
||||||
Added Driver.js library integration and Tour demo page for interactive product tours and onboarding guides.
|
|
||||||
|
|
||||||
@@ -1,7 +0,0 @@
|
|||||||
---
|
|
||||||
"@tabler/core": minor
|
|
||||||
"@tabler/preview": minor
|
|
||||||
---
|
|
||||||
|
|
||||||
Upgraded `apexcharts` from `3.54.1` to `5.3.6` and added CSS variables (`--chart-{id}-color-{index}`) for dynamic chart colors to fix compatibility with the new version.
|
|
||||||
|
|
||||||
2
.github/workflows/argos.yml
vendored
2
.github/workflows/argos.yml
vendored
@@ -26,7 +26,7 @@ jobs:
|
|||||||
if: false
|
if: false
|
||||||
steps:
|
steps:
|
||||||
- name: Clone repository
|
- name: Clone repository
|
||||||
uses: actions/checkout@v6
|
uses: actions/checkout@v5
|
||||||
|
|
||||||
- name: Cache turbo build setup
|
- name: Cache turbo build setup
|
||||||
uses: actions/cache@v4
|
uses: actions/cache@v4
|
||||||
|
|||||||
2
.github/workflows/bundlewatch.yml
vendored
2
.github/workflows/bundlewatch.yml
vendored
@@ -17,7 +17,7 @@ jobs:
|
|||||||
|
|
||||||
steps:
|
steps:
|
||||||
- name: Clone repository
|
- name: Clone repository
|
||||||
uses: actions/checkout@v6
|
uses: actions/checkout@v5
|
||||||
|
|
||||||
- name: Cache turbo build setup
|
- name: Cache turbo build setup
|
||||||
uses: actions/cache@v4
|
uses: actions/cache@v4
|
||||||
|
|||||||
@@ -16,7 +16,7 @@ jobs:
|
|||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
steps:
|
steps:
|
||||||
- name: Checkout Repo
|
- name: Checkout Repo
|
||||||
uses: actions/checkout@v6
|
uses: actions/checkout@v5
|
||||||
with:
|
with:
|
||||||
persist-credentials: false
|
persist-credentials: false
|
||||||
|
|
||||||
|
|||||||
2
.github/workflows/lockfiles.yaml
vendored
2
.github/workflows/lockfiles.yaml
vendored
@@ -12,7 +12,7 @@ jobs:
|
|||||||
name: Verify lock file integrity
|
name: Verify lock file integrity
|
||||||
steps:
|
steps:
|
||||||
- name: Clone Tabler
|
- name: Clone Tabler
|
||||||
uses: actions/checkout@v6
|
uses: actions/checkout@v5
|
||||||
- name: Prevent lock file change
|
- name: Prevent lock file change
|
||||||
uses: xalvarez/prevent-file-change-action@v3
|
uses: xalvarez/prevent-file-change-action@v3
|
||||||
with:
|
with:
|
||||||
|
|||||||
2
.github/workflows/release.yml
vendored
2
.github/workflows/release.yml
vendored
@@ -21,7 +21,7 @@ jobs:
|
|||||||
pull-requests: write # to create pull request
|
pull-requests: write # to create pull request
|
||||||
steps:
|
steps:
|
||||||
- name: Checkout Repo
|
- name: Checkout Repo
|
||||||
uses: actions/checkout@v6
|
uses: actions/checkout@v5
|
||||||
|
|
||||||
- name: Install PNPM
|
- name: Install PNPM
|
||||||
uses: pnpm/action-setup@v4
|
uses: pnpm/action-setup@v4
|
||||||
|
|||||||
2
.github/workflows/test.yml
vendored
2
.github/workflows/test.yml
vendored
@@ -14,7 +14,7 @@ jobs:
|
|||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
steps:
|
steps:
|
||||||
- name: Clone repository
|
- name: Clone repository
|
||||||
uses: actions/checkout@v6
|
uses: actions/checkout@v5
|
||||||
|
|
||||||
- name: Cache turbo build setup
|
- name: Cache turbo build setup
|
||||||
uses: actions/cache@v4
|
uses: actions/cache@v4
|
||||||
|
|||||||
6
core/js/src/bootstrap.js
vendored
6
core/js/src/bootstrap.js
vendored
@@ -1,7 +1,3 @@
|
|||||||
export * as Popper from '@popperjs/core'
|
export * as Popper from '@popperjs/core'
|
||||||
|
|
||||||
// Export all Bootstrap components directly for consistent usage
|
export { Dropdown, Tooltip, Popover, Tab, Toast } from 'bootstrap'
|
||||||
export { Alert, Button, Carousel, Collapse, Dropdown, Modal, Offcanvas, Popover, ScrollSpy, Tab, Toast, Tooltip } from 'bootstrap'
|
|
||||||
|
|
||||||
// Re-export everything as namespace for backward compatibility
|
|
||||||
export * as bootstrap from 'bootstrap'
|
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ let popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggl
|
|||||||
popoverTriggerList.map(function (popoverTriggerEl) {
|
popoverTriggerList.map(function (popoverTriggerEl) {
|
||||||
let options = {
|
let options = {
|
||||||
delay: { show: 50, hide: 50 },
|
delay: { show: 50, hide: 50 },
|
||||||
html: popoverTriggerEl.getAttribute('data-bs-html') === 'true',
|
html: popoverTriggerEl.getAttribute('data-bs-html') === 'true' ?? false,
|
||||||
placement: popoverTriggerEl.getAttribute('data-bs-placement') ?? 'auto',
|
placement: popoverTriggerEl.getAttribute('data-bs-placement') ?? 'auto',
|
||||||
}
|
}
|
||||||
return new Popover(popoverTriggerEl, options)
|
return new Popover(popoverTriggerEl, options)
|
||||||
|
|||||||
@@ -4,7 +4,7 @@ let tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggl
|
|||||||
tooltipTriggerList.map(function (tooltipTriggerEl) {
|
tooltipTriggerList.map(function (tooltipTriggerEl) {
|
||||||
let options = {
|
let options = {
|
||||||
delay: { show: 50, hide: 50 },
|
delay: { show: 50, hide: 50 },
|
||||||
html: tooltipTriggerEl.getAttribute('data-bs-html') === 'true',
|
html: tooltipTriggerEl.getAttribute('data-bs-html') === 'true' ?? false,
|
||||||
placement: tooltipTriggerEl.getAttribute('data-bs-placement') ?? 'auto',
|
placement: tooltipTriggerEl.getAttribute('data-bs-placement') ?? 'auto',
|
||||||
}
|
}
|
||||||
return new Tooltip(tooltipTriggerEl, options)
|
return new Tooltip(tooltipTriggerEl, options)
|
||||||
|
|||||||
@@ -9,8 +9,7 @@ import './src/tab'
|
|||||||
import './src/toast'
|
import './src/toast'
|
||||||
import './src/sortable'
|
import './src/sortable'
|
||||||
|
|
||||||
// Re-export everything from bootstrap.js (single source of truth)
|
export * as bootstrap from 'bootstrap'
|
||||||
export * from './src/bootstrap'
|
|
||||||
|
|
||||||
// Re-export tabler namespace
|
|
||||||
export * as tabler from './src/tabler'
|
export * as tabler from './src/tabler'
|
||||||
|
|
||||||
|
export { Alert, Modal, Toast, Tooltip, Tab, Button, Carousel, Collapse, Dropdown, Popover, ScrollSpy, Offcanvas } from 'bootstrap'
|
||||||
|
|||||||
@@ -166,14 +166,5 @@
|
|||||||
"dist/turbo.es2017-umd.js"
|
"dist/turbo.es2017-umd.js"
|
||||||
],
|
],
|
||||||
"head": true
|
"head": true
|
||||||
},
|
|
||||||
"driver.js": {
|
|
||||||
"npm": "driver.js",
|
|
||||||
"js": [
|
|
||||||
"dist/driver.js.iife.js"
|
|
||||||
],
|
|
||||||
"css": [
|
|
||||||
"dist/driver.css"
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -5,31 +5,30 @@
|
|||||||
"homepage": "https://tabler.io",
|
"homepage": "https://tabler.io",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "pnpm run clean && pnpm run copy && pnpm run watch",
|
"dev": "pnpm run clean && pnpm run copy && pnpm run watch",
|
||||||
"build": "pnpm run clean && pnpm run build-assets && pnpm run copy && pnpm run generate-sri",
|
"build": "pnpm run clean && pnpm run css && pnpm run js && pnpm run copy && pnpm run generate-sri",
|
||||||
"build-assets": "concurrently \"pnpm run css\" \"pnpm run js\"",
|
|
||||||
"clean": "shx rm -rf dist demo",
|
"clean": "shx rm -rf dist demo",
|
||||||
"css": "pnpm run css-compile && pnpm run css-prefix && pnpm run css-rtl && pnpm run css-minify && pnpm run css-banner",
|
"css": "pnpm run css-compile && pnpm run css-prefix && pnpm run css-rtl && pnpm run css-minify && pnpm run css-banner",
|
||||||
"css-compile": "sass --no-source-map --load-path=node_modules --style expanded scss/:dist/css/",
|
"css-compile": "sass --no-source-map --load-path=node_modules --style expanded scss/:dist/css/",
|
||||||
"css-banner": "node .build/add-banner.mjs",
|
"css-banner": "node .build/add-banner.mjs",
|
||||||
"css-prefix": "postcss --config .build/postcss.config.mjs --replace \"dist/css/*.css\" \"!dist/css/*.rtl*.css\" \"!dist/css/*.min.css\"",
|
"css-prefix": "postcss --config .build/postcss.config.mjs --replace \"dist/css/*.css\" \"!dist/css/*.rtl*.css\" \"!dist/css/*.min.css\"",
|
||||||
"css-rtl": "cross-env NODE_ENV=RTL postcss --config .build/postcss.config.mjs --dir \"dist/css\" --ext \".rtl.css\" \"dist/css/*.css\" \"!dist/css/*.min.css\" \"!dist/css/*.rtl.css\"",
|
"css-rtl": "cross-env NODE_ENV=RTL postcss --config .build/postcss.config.mjs --dir \"dist/css\" --ext \".rtl.css\" \"dist/css/*.css\" \"!dist/css/*.min.css\" \"!dist/css/*.rtl.css\"",
|
||||||
"css-minify": "concurrently \"pnpm run css-minify-main\" \"pnpm run css-minify-rtl\"",
|
"css-minify": "pnpm run css-minify-main && pnpm run css-minify-rtl",
|
||||||
"css-minify-main": "cleancss -O1 --format breakWith=lf --with-rebase --source-map --source-map-inline-sources --output dist/css/ --batch --batch-suffix \".min\" \"dist/css/*.css\" \"!dist/css/*.min.css\" \"!dist/css/*rtl*.css\"",
|
"css-minify-main": "cleancss -O1 --format breakWith=lf --with-rebase --source-map --source-map-inline-sources --output dist/css/ --batch --batch-suffix \".min\" \"dist/css/*.css\" \"!dist/css/*.min.css\" \"!dist/css/*rtl*.css\"",
|
||||||
"css-minify-rtl": "cleancss -O1 --format breakWith=lf --with-rebase --source-map --source-map-inline-sources --output dist/css/ --batch --batch-suffix \".min\" \"dist/css/*rtl.css\" \"!dist/css/*.min.css\"",
|
"css-minify-rtl": "cleancss -O1 --format breakWith=lf --with-rebase --source-map --source-map-inline-sources --output dist/css/ --batch --batch-suffix \".min\" \"dist/css/*rtl.css\" \"!dist/css/*.min.css\"",
|
||||||
"css-lint": "pnpm run css-lint-variables",
|
"css-lint": "pnpm run css-lint-variables",
|
||||||
"css-lint-variables": "find-unused-sass-variables scss/ node_modules/bootstrap/scss/",
|
"css-lint-variables": "find-unused-sass-variables scss/ node_modules/bootstrap/scss/",
|
||||||
"js": "pnpm run js-compile && pnpm run js-minify",
|
"js": "pnpm run js-compile && pnpm run js-minify",
|
||||||
"js-compile": "concurrently \"pnpm run js-compile-standalone\" \"pnpm run js-compile-standalone-esm\" \"pnpm run js-compile-theme\" \"pnpm run js-compile-theme-esm\"",
|
"js-compile": "pnpm run js-compile-standalone && pnpm run js-compile-standalone-esm && pnpm run js-compile-theme && pnpm run js-compile-theme-esm",
|
||||||
"js-compile-theme-esm": "rollup --environment THEME:true --environment ESM:true --config .build/rollup.config.mjs --sourcemap",
|
"js-compile-theme-esm": "rollup --environment THEME:true --environment ESM:true --config .build/rollup.config.mjs --sourcemap",
|
||||||
"js-compile-theme": "rollup --environment THEME:true --config .build/rollup.config.mjs --sourcemap",
|
"js-compile-theme": "rollup --environment THEME:true --config .build/rollup.config.mjs --sourcemap",
|
||||||
"js-compile-standalone": "rollup --config .build/rollup.config.mjs --sourcemap",
|
"js-compile-standalone": "rollup --config .build/rollup.config.mjs --sourcemap",
|
||||||
"js-compile-standalone-esm": "rollup --environment ESM:true --config .build/rollup.config.mjs --sourcemap",
|
"js-compile-standalone-esm": "rollup --environment ESM:true --config .build/rollup.config.mjs --sourcemap",
|
||||||
"js-minify": "concurrently \"pnpm run js-minify-standalone\" \"pnpm run js-minify-standalone-esm\" \"pnpm run js-minify-theme\" \"pnpm run js-minify-theme-esm\"",
|
"js-minify": "pnpm run js-minify-standalone && pnpm run js-minify-standalone-esm && pnpm run js-minify-theme && pnpm run js-minify-theme-esm",
|
||||||
"js-minify-standalone": "terser --compress passes=2 --mangle --comments \"/^!/\" --source-map \"content=dist/js/tabler.js.map,includeSources,url=tabler.min.js.map\" --output dist/js/tabler.min.js dist/js/tabler.js",
|
"js-minify-standalone": "terser --compress passes=2 --mangle --comments \"/^!/\" --source-map \"content=dist/js/tabler.js.map,includeSources,url=tabler.min.js.map\" --output dist/js/tabler.min.js dist/js/tabler.js",
|
||||||
"js-minify-standalone-esm": "terser --compress passes=2 --mangle --comments \"/^!/\" --source-map \"content=dist/js/tabler.esm.js.map,includeSources,url=tabler.esm.min.js.map\" --output dist/js/tabler.esm.min.js dist/js/tabler.esm.js",
|
"js-minify-standalone-esm": "terser --compress passes=2 --mangle --comments \"/^!/\" --source-map \"content=dist/js/tabler.esm.js.map,includeSources,url=tabler.esm.min.js.map\" --output dist/js/tabler.esm.min.js dist/js/tabler.esm.js",
|
||||||
"js-minify-theme": "terser --compress passes=2 --mangle --comments \"/^!/\" --source-map \"content=dist/js/tabler-theme.js.map,includeSources,url=tabler-theme.min.js.map\" --output dist/js/tabler-theme.min.js dist/js/tabler-theme.js",
|
"js-minify-theme": "terser --compress passes=2 --mangle --comments \"/^!/\" --source-map \"content=dist/js/tabler-theme.js.map,includeSources,url=tabler-theme.min.js.map\" --output dist/js/tabler-theme.min.js dist/js/tabler-theme.js",
|
||||||
"js-minify-theme-esm": "terser --compress passes=2 --mangle --comments \"/^!/\" --source-map \"content=dist/js/tabler-theme.esm.js.map,includeSources,url=tabler-theme.esm.min.js.map\" --output dist/js/tabler-theme.esm.min.js dist/js/tabler-theme.esm.js",
|
"js-minify-theme-esm": "terser --compress passes=2 --mangle --comments \"/^!/\" --source-map \"content=dist/js/tabler-theme.esm.js.map,includeSources,url=tabler-theme.esm.min.js.map\" --output dist/js/tabler-theme.esm.min.js dist/js/tabler-theme.esm.js",
|
||||||
"copy": "concurrently \"pnpm run copy-img\" \"pnpm run copy-libs\" \"pnpm run copy-fonts\"",
|
"copy": "pnpm run copy-img && pnpm run copy-libs && pnpm run copy-fonts",
|
||||||
"copy-img": "shx mkdir -p dist/img && shx cp -rf img/* dist/img",
|
"copy-img": "shx mkdir -p dist/img && shx cp -rf img/* dist/img",
|
||||||
"copy-libs": "node .build/copy-libs.mjs",
|
"copy-libs": "node .build/copy-libs.mjs",
|
||||||
"copy-fonts": "shx mkdir -p dist/fonts && shx cp -rf fonts/* dist/fonts",
|
"copy-fonts": "shx mkdir -p dist/fonts && shx cp -rf fonts/* dist/fonts",
|
||||||
@@ -151,12 +150,13 @@
|
|||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@popperjs/core": "^2.11.8",
|
"@popperjs/core": "^2.11.8",
|
||||||
"bootstrap": "5.3.8"
|
"bootstrap": "5.3.8",
|
||||||
|
"geist": "^1.5.1"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@hotwired/turbo": "^8.0.18",
|
"@hotwired/turbo": "^8.0.18",
|
||||||
"@melloware/coloris": "^0.25.0",
|
"@melloware/coloris": "^0.25.0",
|
||||||
"apexcharts": "^5.3.6",
|
"apexcharts": "3.54.1",
|
||||||
"autosize": "^6.0.1",
|
"autosize": "^6.0.1",
|
||||||
"choices.js": "^11.1.0",
|
"choices.js": "^11.1.0",
|
||||||
"clipboard": "^2.0.11",
|
"clipboard": "^2.0.11",
|
||||||
@@ -166,7 +166,6 @@
|
|||||||
"flatpickr": "^4.6.13",
|
"flatpickr": "^4.6.13",
|
||||||
"fslightbox": "^3.7.4",
|
"fslightbox": "^3.7.4",
|
||||||
"fullcalendar": "^6.1.19",
|
"fullcalendar": "^6.1.19",
|
||||||
"geist": "^1.5.1",
|
|
||||||
"hugerte": "^1.0.9",
|
"hugerte": "^1.0.9",
|
||||||
"imask": "^7.6.1",
|
"imask": "^7.6.1",
|
||||||
"jsvectormap": "^1.7.0",
|
"jsvectormap": "^1.7.0",
|
||||||
@@ -178,8 +177,7 @@
|
|||||||
"sortablejs": "^1.15.6",
|
"sortablejs": "^1.15.6",
|
||||||
"star-rating.js": "^4.3.1",
|
"star-rating.js": "^4.3.1",
|
||||||
"tom-select": "^2.4.3",
|
"tom-select": "^2.4.3",
|
||||||
"typed.js": "^2.1.0",
|
"typed.js": "^2.1.0"
|
||||||
"driver.js": "^1.0.0"
|
|
||||||
},
|
},
|
||||||
"directories": {
|
"directories": {
|
||||||
"doc": "docs"
|
"doc": "docs"
|
||||||
|
|||||||
@@ -32,7 +32,6 @@
|
|||||||
|
|
||||||
/** Theme colors */
|
/** Theme colors */
|
||||||
@each $name, $color in map.merge($theme-colors, $social-colors) {
|
@each $name, $color in map.merge($theme-colors, $social-colors) {
|
||||||
@debug contrast-ratio($color, white), $name, $min-contrast-ratio;
|
|
||||||
--#{$prefix}#{$name}: #{$color};
|
--#{$prefix}#{$name}: #{$color};
|
||||||
--#{$prefix}#{$name}-rgb: #{to-rgb($color)};
|
--#{$prefix}#{$name}-rgb: #{to-rgb($color)};
|
||||||
--#{$prefix}#{$name}-fg: #{if(contrast-ratio($color) > $min-contrast-ratio, var(--#{$prefix}light), var(--#{$prefix}dark))};
|
--#{$prefix}#{$name}-fg: #{if(contrast-ratio($color) > $min-contrast-ratio, var(--#{$prefix}light), var(--#{$prefix}dark))};
|
||||||
|
|||||||
@@ -17,11 +17,7 @@ $utilities-border-colors: map-loop(
|
|||||||
) !default;
|
) !default;
|
||||||
|
|
||||||
//Utilities
|
//Utilities
|
||||||
|
$utilities: (
|
||||||
$utilities: () !default;
|
|
||||||
|
|
||||||
$utilities: map-merge(
|
|
||||||
(
|
|
||||||
'align': (
|
'align': (
|
||||||
property: vertical-align,
|
property: vertical-align,
|
||||||
class: align,
|
class: align,
|
||||||
@@ -898,6 +894,4 @@ $utilities: map-merge(
|
|||||||
class: z,
|
class: z,
|
||||||
values: $zindex-levels,
|
values: $zindex-levels,
|
||||||
),
|
),
|
||||||
),
|
) !default;
|
||||||
$utilities
|
|
||||||
);
|
|
||||||
|
|||||||
@@ -6,7 +6,7 @@
|
|||||||
$darken-dark: color.adjust($dark, $lightness: -2%) !default;
|
$darken-dark: color.adjust($dark, $lightness: -2%) !default;
|
||||||
$lighten-dark: color.adjust($dark, $lightness: 2%) !default;
|
$lighten-dark: color.adjust($dark, $lightness: 2%) !default;
|
||||||
$border-color-dark: color.adjust($dark, $lightness: 8%) !default;
|
$border-color-dark: color.adjust($dark, $lightness: 8%) !default;
|
||||||
$border-color-translucent-dark: rgba(128, 150, 172, 0.2) !default;
|
$border-color-translucent-dark: rgba(72, 110, 149, 0.14) !default;
|
||||||
$border-dark-color-dark: color.adjust($dark, $lightness: 4%) !default;
|
$border-dark-color-dark: color.adjust($dark, $lightness: 4%) !default;
|
||||||
$border-active-color-dark: color.adjust($dark, $lightness: 12%) !default;
|
$border-active-color-dark: color.adjust($dark, $lightness: 12%) !default;
|
||||||
|
|
||||||
|
|||||||
@@ -33,7 +33,12 @@ $enable-deprecation-messages: true !default;
|
|||||||
$enable-important-utilities: true !default;
|
$enable-important-utilities: true !default;
|
||||||
|
|
||||||
// Escaped Characters
|
// Escaped Characters
|
||||||
$escaped-characters: (('<', '%3c'), ('>', '%3e'), ('#', '%23'), ('(', '%28'), (')', '%29')) !default;
|
$escaped-characters: (
|
||||||
|
('<', '%3c'),
|
||||||
|
('>', '%3e'),
|
||||||
|
('#', '%23'),
|
||||||
|
('(', '%28'),
|
||||||
|
(')', '%29')) !default;
|
||||||
|
|
||||||
// Dark Mode
|
// Dark Mode
|
||||||
$color-mode-type: data !default;
|
$color-mode-type: data !default;
|
||||||
@@ -101,7 +106,7 @@ $colors: (
|
|||||||
'gray-dark': $gray-800,
|
'gray-dark': $gray-800,
|
||||||
) !default;
|
) !default;
|
||||||
|
|
||||||
$min-contrast-ratio: 2 !default;
|
$min-contrast-ratio: 4.5 !default;
|
||||||
$color-contrast-dark: $black !default;
|
$color-contrast-dark: $black !default;
|
||||||
$color-contrast-light: $white !default;
|
$color-contrast-light: $white !default;
|
||||||
|
|
||||||
@@ -439,7 +444,7 @@ $headings-font-style: null !default;
|
|||||||
$headings-line-height: 1.2 !default;
|
$headings-line-height: 1.2 !default;
|
||||||
$headings-font-weight: var(--#{$prefix}font-weight-semibold) !default;
|
$headings-font-weight: var(--#{$prefix}font-weight-semibold) !default;
|
||||||
$headings-margin-bottom: var(--#{$prefix}spacer) !default;
|
$headings-margin-bottom: var(--#{$prefix}spacer) !default;
|
||||||
$headings-color: light-dark(var(--#{$prefix}gray-900), var(--#{$prefix}white)) !default;
|
$headings-color: inherit !default;
|
||||||
|
|
||||||
$font-weights: (
|
$font-weights: (
|
||||||
'light': $font-weight-light,
|
'light': $font-weight-light,
|
||||||
@@ -523,7 +528,7 @@ $initialism-font-size: $small-font-size !default;
|
|||||||
|
|
||||||
$sub-sup-font-size: 0.75em !default;
|
$sub-sup-font-size: 0.75em !default;
|
||||||
|
|
||||||
$dt-font-weight: $font-weight-semibold !default;
|
$dt-font-weight: $font-weight-bold !default;
|
||||||
|
|
||||||
$list-inline-padding: 0.5rem !default;
|
$list-inline-padding: 0.5rem !default;
|
||||||
|
|
||||||
@@ -551,10 +556,16 @@ $zindex-levels: (
|
|||||||
3: 3,
|
3: 3,
|
||||||
) !default;
|
) !default;
|
||||||
|
|
||||||
|
$min-contrast-ratio: 1.5 !default;
|
||||||
$text-secondary-opacity: 0.7 !default;
|
$text-secondary-opacity: 0.7 !default;
|
||||||
$text-secondary-light-opacity: 0.4 !default;
|
$text-secondary-light-opacity: 0.4 !default;
|
||||||
$text-secondary-dark-opacity: 0.8 !default;
|
$text-secondary-dark-opacity: 0.8 !default;
|
||||||
|
|
||||||
|
$border-opacity: 0.16 !default;
|
||||||
|
$border-light-opacity: 0.08 !default;
|
||||||
|
$border-dark-opacity: 0.24 !default;
|
||||||
|
$border-active-opacity: 0.58 !default;
|
||||||
|
|
||||||
$bg-surface: var(--#{$prefix}white) !default;
|
$bg-surface: var(--#{$prefix}white) !default;
|
||||||
$bg-surface-secondary: var(--#{$prefix}gray-100) !default;
|
$bg-surface-secondary: var(--#{$prefix}gray-100) !default;
|
||||||
$bg-surface-tertiary: var(--#{$prefix}gray-50) !default;
|
$bg-surface-tertiary: var(--#{$prefix}gray-50) !default;
|
||||||
@@ -562,7 +573,7 @@ $bg-surface-dark: var(--#{$prefix}dark) !default;
|
|||||||
|
|
||||||
$body-text-align: null !default;
|
$body-text-align: null !default;
|
||||||
$body-bg: $gray-50 !default;
|
$body-bg: $gray-50 !default;
|
||||||
$body-color: $gray-800 !default;
|
$body-color: $dark !default;
|
||||||
$body-emphasis-color: $gray-700 !default;
|
$body-emphasis-color: $gray-700 !default;
|
||||||
$body-secondary-color: rgba($body-color, 0.75) !default;
|
$body-secondary-color: rgba($body-color, 0.75) !default;
|
||||||
$body-secondary-bg: $gray-200 !default;
|
$body-secondary-bg: $gray-200 !default;
|
||||||
@@ -577,21 +588,14 @@ $text-secondary: $gray-500 !default;
|
|||||||
$text-secondary-light: $gray-400 !default;
|
$text-secondary-light: $gray-400 !default;
|
||||||
$text-secondary-dark: $gray-600 !default;
|
$text-secondary-dark: $gray-600 !default;
|
||||||
|
|
||||||
$border-light-color: var(--#{$prefix}gray-200) !default;
|
$border-color: $gray-200 !default;
|
||||||
$border-light-opacity: 4.7% !default;
|
$border-color-translucent: rgba(4, 32, 69, 0.1);
|
||||||
$border-light-color-translucent: color-mix(in srgb, var(--#{$prefix}gray-800) #{$border-light-opacity}, transparent) !default;
|
|
||||||
|
|
||||||
$border-color: var(--#{$prefix}gray-200) !default;
|
$border-dark-color: $gray-400 !default;
|
||||||
$border-opacity: 11.9% !default;
|
$border-dark-color-translucent: rgba(4, 32, 69, 0.27);
|
||||||
$border-color-translucent: color-mix(in srgb, var(--#{$prefix}gray-800) #{$border-opacity}, transparent) !default;
|
|
||||||
|
|
||||||
$border-dark-color: var(--#{$prefix}gray-300) !default;
|
$border-active-color: color.mix($text-secondary, #ffffff, math.percentage($border-active-opacity)) !default;
|
||||||
$border-dark-opacity: 20.7% !default;
|
$border-active-color-translucent: rgba($text-secondary, $border-active-opacity) !default;
|
||||||
$border-dark-color-translucent: color-mix(in srgb, var(--#{$prefix}gray-800) #{$border-dark-opacity}, transparent) !default;
|
|
||||||
|
|
||||||
$border-active-color: var(--#{$prefix}gray-400) !default;
|
|
||||||
$border-active-opacity: 44.8% !default;
|
|
||||||
$border-active-color-translucent: color-mix(in srgb, var(--#{$prefix}gray-800) #{$border-active-opacity}, transparent) !default;
|
|
||||||
|
|
||||||
$active-bg: rgba(var(--#{$prefix}primary-rgb), 0.04) !default;
|
$active-bg: rgba(var(--#{$prefix}primary-rgb), 0.04) !default;
|
||||||
$active-color: var(--#{$prefix}primary) !default;
|
$active-color: var(--#{$prefix}primary) !default;
|
||||||
@@ -801,8 +805,8 @@ $icon-color: var(--#{$prefix}gray-400) !default;
|
|||||||
// Code
|
// Code
|
||||||
$code-color: light-dark(var(--#{$prefix}gray-600), var(--#{$prefix}gray-400)) !default;
|
$code-color: light-dark(var(--#{$prefix}gray-600), var(--#{$prefix}gray-400)) !default;
|
||||||
$code-bg: light-dark(var(--#{$prefix}gray-100), var(--#{$prefix}gray-900)) !default;
|
$code-bg: light-dark(var(--#{$prefix}gray-100), var(--#{$prefix}gray-900)) !default;
|
||||||
$code-font-size: $font-size-reative-sm !default;
|
$code-font-size: $font-size-reative-md !default;
|
||||||
$code-line-height: 1.25rem !default;
|
$code-line-height: 1.7142857em !default;
|
||||||
|
|
||||||
$pre-padding: 1rem !default;
|
$pre-padding: 1rem !default;
|
||||||
$pre-bg: var(--#{$prefix}bg-surface-dark) !default;
|
$pre-bg: var(--#{$prefix}bg-surface-dark) !default;
|
||||||
@@ -877,7 +881,7 @@ $avatar-sizes: (
|
|||||||
brand-size: 2rem,
|
brand-size: 2rem,
|
||||||
),
|
),
|
||||||
) !default;
|
) !default;
|
||||||
$avatar-border-radius: var(--#{$prefix}border-radius-pill) !default;
|
$avatar-border-radius: var(--#{$prefix}border-radius) !default;
|
||||||
$avatar-font-size: $h4-font-size !default;
|
$avatar-font-size: $h4-font-size !default;
|
||||||
$avatar-box-shadow: var(--#{$prefix}shadow-border) !default;
|
$avatar-box-shadow: var(--#{$prefix}shadow-border) !default;
|
||||||
$avatar-list-spacing: -0.5;
|
$avatar-list-spacing: -0.5;
|
||||||
@@ -991,7 +995,7 @@ $box-shadow-lg: 0 1rem 3rem rgba($black, 0.175) !default;
|
|||||||
$box-shadow-transparent: 0 0 0 0 transparent !default;
|
$box-shadow-transparent: 0 0 0 0 transparent !default;
|
||||||
$box-shadow-border: inset 0 0 0 1px var(--#{$prefix}border-color-translucent) !default;
|
$box-shadow-border: inset 0 0 0 1px var(--#{$prefix}border-color-translucent) !default;
|
||||||
$box-shadow-input: 0 1px 1px rgba(var(--#{$prefix}body-color-rgb), 0.06) !default;
|
$box-shadow-input: 0 1px 1px rgba(var(--#{$prefix}body-color-rgb), 0.06) !default;
|
||||||
$box-shadow-card: 0px 1px 3px rgba(0, 0, 0, 0.08) !default;
|
$box-shadow-card: 0 0 4px rgba(var(--#{$prefix}body-color-rgb), 0.04) !default;
|
||||||
$box-shadow-card-hover: rgba(var(--#{$prefix}body-color-rgb), 0.16) 0 2px 16px 0 !default;
|
$box-shadow-card-hover: rgba(var(--#{$prefix}body-color-rgb), 0.16) 0 2px 16px 0 !default;
|
||||||
$box-shadow-dropdown:
|
$box-shadow-dropdown:
|
||||||
0 16px 24px 2px rgba(0, 0, 0, 0.07),
|
0 16px 24px 2px rgba(0, 0, 0, 0.07),
|
||||||
@@ -1036,7 +1040,7 @@ $alert-padding-y: 0.75rem !default;
|
|||||||
$alert-padding-x: 1rem !default;
|
$alert-padding-x: 1rem !default;
|
||||||
$alert-margin-bottom: 1rem !default;
|
$alert-margin-bottom: 1rem !default;
|
||||||
$alert-border-radius: var(--#{$prefix}border-radius) !default;
|
$alert-border-radius: var(--#{$prefix}border-radius) !default;
|
||||||
$alert-link-font-weight: var(--#{$prefix}font-weight-semibold) !default;
|
$alert-link-font-weight: var(--#{$prefix}font-weight-bold) !default;
|
||||||
$alert-border-width: var(--#{$prefix}border-width) !default;
|
$alert-border-width: var(--#{$prefix}border-width) !default;
|
||||||
$alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side
|
$alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side
|
||||||
$alert-border-color: var(--#{$prefix}border-color-translucent) !default;
|
$alert-border-color: var(--#{$prefix}border-color-translucent) !default;
|
||||||
@@ -1058,7 +1062,7 @@ $breadcrumb-divider: string.quote('/') !default;
|
|||||||
$breadcrumb-divider-flipped: $breadcrumb-divider !default;
|
$breadcrumb-divider-flipped: $breadcrumb-divider !default;
|
||||||
$breadcrumb-border-radius: null !default;
|
$breadcrumb-border-radius: null !default;
|
||||||
$breadcrumb-link-color: var(--#{$prefix}link-color) !default;
|
$breadcrumb-link-color: var(--#{$prefix}link-color) !default;
|
||||||
$breadcrumb-active-font-weight: var(--#{$prefix}font-weight-semibold) !default;
|
$breadcrumb-active-font-weight: var(--#{$prefix}font-weight-bold) !default;
|
||||||
$breadcrumb-disabled-color: var(--#{$prefix}disabled-color) !default;
|
$breadcrumb-disabled-color: var(--#{$prefix}disabled-color) !default;
|
||||||
|
|
||||||
$breadcrumb-variants: (
|
$breadcrumb-variants: (
|
||||||
@@ -1163,9 +1167,9 @@ $btn-padding-y-lg: $input-btn-padding-y-lg !default;
|
|||||||
$btn-padding-x-lg: $input-btn-padding-x-lg !default;
|
$btn-padding-x-lg: $input-btn-padding-x-lg !default;
|
||||||
|
|
||||||
// Inputs
|
// Inputs
|
||||||
$input-bg: var(--#{$prefix}bg-forms) !default;
|
$input-bg: var(--#{$prefix}body-bg) !default;
|
||||||
$input-disabled-color: null !default;
|
$input-disabled-color: null !default;
|
||||||
$input-disabled-bg: var(--#{$prefix}bg-surface-secondary) !default;
|
$input-disabled-bg: var(--#{$prefix}secondary-bg) !default;
|
||||||
$input-disabled-border-color: null !default;
|
$input-disabled-border-color: null !default;
|
||||||
|
|
||||||
$input-height: null !default;
|
$input-height: null !default;
|
||||||
@@ -1536,7 +1540,7 @@ $navbar-brand-padding-y: $nav-link-padding-y !default;
|
|||||||
$navbar-brand-image-height: 2rem !default;
|
$navbar-brand-image-height: 2rem !default;
|
||||||
$navbar-brand-margin-right: 0 !default;
|
$navbar-brand-margin-right: 0 !default;
|
||||||
$navbar-brand-margin-end: 1rem !default;
|
$navbar-brand-margin-end: 1rem !default;
|
||||||
$navbar-brand-font-weight: var(--#{$prefix}font-weight-semibold) !default;
|
$navbar-brand-font-weight: var(--#{$prefix}font-weight-bold) !default;
|
||||||
|
|
||||||
$navbar-toggler-padding-y: 0.25rem !default;
|
$navbar-toggler-padding-y: 0.25rem !default;
|
||||||
$navbar-toggler-padding-x: 0.75rem !default;
|
$navbar-toggler-padding-x: 0.75rem !default;
|
||||||
@@ -1862,16 +1866,16 @@ $form-select-font-size-lg: $input-font-size-lg !default;
|
|||||||
$form-select-border-radius-lg: $input-border-radius-lg !default;
|
$form-select-border-radius-lg: $input-border-radius-lg !default;
|
||||||
$form-select-transition: $input-transition !default;
|
$form-select-transition: $input-transition !default;
|
||||||
|
|
||||||
$form-switch-color: white !default;
|
$form-switch-color: rgba($black, 0.25) !default;
|
||||||
$form-switch-width: 2rem !default;
|
$form-switch-width: 2rem !default;
|
||||||
$form-switch-height: 1.25rem !default;
|
$form-switch-height: 1.25rem !default;
|
||||||
$form-switch-padding-start: $form-switch-width + 0.5rem !default;
|
$form-switch-padding-start: $form-switch-width + 0.5rem !default;
|
||||||
$form-switch-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-color}'/></svg>") !default;
|
$form-switch-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$border-color}'/></svg>") !default;
|
||||||
$form-switch-border-radius: $form-switch-width !default;
|
$form-switch-border-radius: $form-switch-width !default;
|
||||||
$form-switch-transition: background-position 0.15s ease-in-out !default;
|
$form-switch-transition: background-position 0.15s ease-in-out !default;
|
||||||
$form-switch-focus-color: white !default;
|
$form-switch-focus-color: $input-focus-border-color !default;
|
||||||
$form-switch-focus-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-focus-color}'/></svg>") !default;
|
$form-switch-focus-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-focus-color}'/></svg>") !default;
|
||||||
$form-switch-checked-color: white !default;
|
$form-switch-checked-color: $component-active-color !default;
|
||||||
$form-switch-checked-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-checked-color}'/></svg>") !default;
|
$form-switch-checked-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-checked-color}'/></svg>") !default;
|
||||||
$form-switch-checked-bg-position: right center !default;
|
$form-switch-checked-bg-position: right center !default;
|
||||||
$form-switch-bg-size: auto !default;
|
$form-switch-bg-size: auto !default;
|
||||||
|
|||||||
@@ -1,8 +1,7 @@
|
|||||||
// Geist Sans Font Family
|
// Geist Sans Font Family
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist';
|
font-family: 'Geist';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-sans/Geist-Thin.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Thin.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Thin.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-sans/Geist-Thin.ttf') format('truetype');
|
||||||
font-weight: 100;
|
font-weight: 100;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -11,8 +10,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist';
|
font-family: 'Geist';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-sans/Geist-UltraLight.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-UltraLight.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-UltraLight.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-sans/Geist-UltraLight.ttf') format('truetype');
|
||||||
font-weight: 200;
|
font-weight: 200;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -21,8 +19,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist';
|
font-family: 'Geist';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-sans/Geist-Light.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Light.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Light.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-sans/Geist-Light.ttf') format('truetype');
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -31,8 +28,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist';
|
font-family: 'Geist';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-sans/Geist-Regular.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Regular.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Regular.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-sans/Geist-Regular.ttf') format('truetype');
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -41,8 +37,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist';
|
font-family: 'Geist';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-sans/Geist-Medium.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Medium.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Medium.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-sans/Geist-Medium.ttf') format('truetype');
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -51,8 +46,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist';
|
font-family: 'Geist';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-sans/Geist-SemiBold.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-SemiBold.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-SemiBold.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-sans/Geist-SemiBold.ttf') format('truetype');
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -61,8 +55,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist';
|
font-family: 'Geist';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-sans/Geist-Bold.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Bold.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Bold.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-sans/Geist-Bold.ttf') format('truetype');
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -71,8 +64,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist';
|
font-family: 'Geist';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-sans/Geist-Black.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Black.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Black.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-sans/Geist-Black.ttf') format('truetype');
|
||||||
font-weight: 800;
|
font-weight: 800;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -81,8 +73,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist';
|
font-family: 'Geist';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-sans/Geist-UltraBlack.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-UltraBlack.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-UltraBlack.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-sans/Geist-UltraBlack.ttf') format('truetype');
|
||||||
font-weight: 900;
|
font-weight: 900;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -92,8 +83,7 @@
|
|||||||
// Geist Sans Variable Font
|
// Geist Sans Variable Font
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist';
|
font-family: 'Geist';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-sans/Geist-Variable.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Variable.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-sans/Geist-Variable.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-sans/Geist-Variable.ttf') format('truetype');
|
||||||
font-weight: 100 900;
|
font-weight: 100 900;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -103,8 +93,7 @@
|
|||||||
// Geist Mono Font Family
|
// Geist Mono Font Family
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist Mono';
|
font-family: 'Geist Mono';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-mono/GeistMono-Thin.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Thin.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Thin.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-mono/GeistMono-Thin.ttf') format('truetype');
|
||||||
font-weight: 100;
|
font-weight: 100;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -113,8 +102,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist Mono';
|
font-family: 'Geist Mono';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-mono/GeistMono-UltraLight.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-UltraLight.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-UltraLight.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-mono/GeistMono-UltraLight.ttf') format('truetype');
|
||||||
font-weight: 200;
|
font-weight: 200;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -123,8 +111,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist Mono';
|
font-family: 'Geist Mono';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-mono/GeistMono-Light.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Light.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Light.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-mono/GeistMono-Light.ttf') format('truetype');
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -133,8 +120,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist Mono';
|
font-family: 'Geist Mono';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-mono/GeistMono-Regular.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Regular.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Regular.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-mono/GeistMono-Regular.ttf') format('truetype');
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -143,8 +129,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist Mono';
|
font-family: 'Geist Mono';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-mono/GeistMono-Medium.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Medium.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Medium.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-mono/GeistMono-Medium.ttf') format('truetype');
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -153,8 +138,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist Mono';
|
font-family: 'Geist Mono';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-mono/GeistMono-SemiBold.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-SemiBold.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-SemiBold.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-mono/GeistMono-SemiBold.ttf') format('truetype');
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -163,8 +147,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist Mono';
|
font-family: 'Geist Mono';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-mono/GeistMono-Bold.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Bold.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Bold.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-mono/GeistMono-Bold.ttf') format('truetype');
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -173,8 +156,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist Mono';
|
font-family: 'Geist Mono';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-mono/GeistMono-Black.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Black.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Black.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-mono/GeistMono-Black.ttf') format('truetype');
|
||||||
font-weight: 800;
|
font-weight: 800;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -183,8 +165,7 @@
|
|||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist Mono';
|
font-family: 'Geist Mono';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-mono/GeistMono-UltraBlack.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-UltraBlack.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-UltraBlack.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-mono/GeistMono-UltraBlack.ttf') format('truetype');
|
||||||
font-weight: 900;
|
font-weight: 900;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@@ -194,10 +175,10 @@
|
|||||||
// Geist Mono Variable Font
|
// Geist Mono Variable Font
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Geist Mono';
|
font-family: 'Geist Mono';
|
||||||
src:
|
src: url('#{$assets-base}/fonts/geist-mono/GeistMono-Variable.woff2') format('woff2'),
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Variable.woff2') format('woff2'),
|
|
||||||
url('#{$assets-base}/fonts/geist-mono/GeistMono-Variable.ttf') format('truetype');
|
url('#{$assets-base}/fonts/geist-mono/GeistMono-Variable.ttf') format('truetype');
|
||||||
font-weight: 100 900;
|
font-weight: 100 900;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-display: swap;
|
font-display: swap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,13 +1,5 @@
|
|||||||
@use 'sass:map';
|
@use 'sass:map';
|
||||||
|
|
||||||
html {
|
|
||||||
scrollbar-gutter: stable;
|
|
||||||
|
|
||||||
@supports not (scrollbar-gutter: stable) {
|
|
||||||
overflow-y: scroll;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// stylelint-disable property-no-vendor-prefix
|
// stylelint-disable property-no-vendor-prefix
|
||||||
body {
|
body {
|
||||||
letter-spacing: $body-letter-spacing;
|
letter-spacing: $body-letter-spacing;
|
||||||
|
|||||||
@@ -2,6 +2,11 @@
|
|||||||
:host {
|
:host {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
||||||
|
@include media-breakpoint-up(lg) {
|
||||||
|
margin-inline-start: calc(100vw - 100%);
|
||||||
|
margin-inline-end: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
:root,
|
:root,
|
||||||
@@ -33,10 +38,7 @@
|
|||||||
--#{$prefix}border-color-translucent: #{$border-color-translucent};
|
--#{$prefix}border-color-translucent: #{$border-color-translucent};
|
||||||
--#{$prefix}border-dark-color: #{$border-dark-color};
|
--#{$prefix}border-dark-color: #{$border-dark-color};
|
||||||
--#{$prefix}border-dark-color-translucent: #{$border-dark-color-translucent};
|
--#{$prefix}border-dark-color-translucent: #{$border-dark-color-translucent};
|
||||||
--#{$prefix}border-light-color: #{$border-light-color};
|
|
||||||
--#{$prefix}border-light-color-translucent: #{$border-light-color-translucent};
|
|
||||||
--#{$prefix}border-active-color: #{$border-active-color};
|
--#{$prefix}border-active-color: #{$border-active-color};
|
||||||
--#{$prefix}border-active-color-translucent: #{$border-active-color-translucent};
|
|
||||||
|
|
||||||
--#{$prefix}icon-color: #{$icon-color};
|
--#{$prefix}icon-color: #{$icon-color};
|
||||||
|
|
||||||
|
|||||||
@@ -79,7 +79,7 @@ $pricing-card-width: 22rem;
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
font-size: 2.5rem;
|
font-size: 2.5rem;
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
font-weight: $font-weight-semibold;
|
font-weight: $font-weight-bold;
|
||||||
margin: 0.75rem 0;
|
margin: 0.75rem 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -87,7 +87,7 @@ $pricing-card-width: 22rem;
|
|||||||
font-size: $h2-font-size;
|
font-size: $h2-font-size;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
margin-inline-end: 0.25rem;
|
margin-inline-end: 0.25rem;
|
||||||
font-weight: $font-weight-semibold;
|
font-weight: $font-weight-bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.pricing-price-description {
|
.pricing-price-description {
|
||||||
|
|||||||
@@ -72,7 +72,7 @@
|
|||||||
|
|
||||||
.section-title {
|
.section-title {
|
||||||
font-size: var(--#{$prefix}font-size-h1);
|
font-size: var(--#{$prefix}font-size-h1);
|
||||||
font-weight: var(--#{$prefix}font-weight-semibold);
|
font-weight: var(--#{$prefix}font-weight-bold);
|
||||||
line-height: 1.2;
|
line-height: 1.2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -15,17 +15,17 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
[data-bs-theme-base='gray'] {
|
[data-bs-theme-base='gray'] {
|
||||||
--#{$prefix}gray-50: $gray-50;
|
--#{$prefix}gray-50: #f9fafb;
|
||||||
--#{$prefix}gray-100: $gray-100;
|
--#{$prefix}gray-100: #f3f4f6;
|
||||||
--#{$prefix}gray-200: $gray-200;
|
--#{$prefix}gray-200: #e5e7eb;
|
||||||
--#{$prefix}gray-300: $gray-300;
|
--#{$prefix}gray-300: #d1d5db;
|
||||||
--#{$prefix}gray-400: $gray-400;
|
--#{$prefix}gray-400: #9ca3af;
|
||||||
--#{$prefix}gray-500: $gray-500;
|
--#{$prefix}gray-500: #6b7280;
|
||||||
--#{$prefix}gray-600: $gray-600;
|
--#{$prefix}gray-600: #4b5563;
|
||||||
--#{$prefix}gray-700: $gray-700;
|
--#{$prefix}gray-700: #374151;
|
||||||
--#{$prefix}gray-800: $gray-800;
|
--#{$prefix}gray-800: #1f2937;
|
||||||
--#{$prefix}gray-900: $gray-900;
|
--#{$prefix}gray-900: #111827;
|
||||||
--#{$prefix}gray-950: $gray-950;
|
--#{$prefix}gray-950: #030712;
|
||||||
}
|
}
|
||||||
|
|
||||||
[data-bs-theme-base='zinc'] {
|
[data-bs-theme-base='zinc'] {
|
||||||
|
|||||||
@@ -1,12 +1,10 @@
|
|||||||
.alert {
|
.alert {
|
||||||
--#{$prefix}alert-variant-color: var(--#{$prefix}body-color);
|
--#{$prefix}alert-color: var(--#{$prefix}body-color);
|
||||||
--#{$prefix}alert-color: var(--#{$prefix}alert-variant-color);
|
--#{$prefix}alert-bg: #{color-transparent(var(--#{$prefix}alert-color), 0.1)};
|
||||||
--#{$prefix}alert-bg: #{color-transparent(var(--#{$prefix}alert-variant-color), 0.16, var(--#{$prefix}bg-surface))};
|
|
||||||
--#{$prefix}alert-padding-x: #{$alert-padding-x};
|
--#{$prefix}alert-padding-x: #{$alert-padding-x};
|
||||||
--#{$prefix}alert-padding-y: #{$alert-padding-y};
|
--#{$prefix}alert-padding-y: #{$alert-padding-y};
|
||||||
--#{$prefix}alert-margin-bottom: #{$alert-margin-bottom};
|
--#{$prefix}alert-margin-bottom: #{$alert-margin-bottom};
|
||||||
--#{$prefix}alert-border-color: #{color-transparent(var(--#{$prefix}alert-variant-color), 0.2, var(--#{$prefix}bg-surface))};
|
--#{$prefix}alert-border-color: #{color-transparent(var(--#{$prefix}alert-color), 0.2)};
|
||||||
--#{$prefix}alert-border-color: var(--#{$prefix}border-color);
|
|
||||||
--#{$prefix}alert-border: var(--#{$prefix}border-width) solid var(--#{$prefix}alert-border-color);
|
--#{$prefix}alert-border: var(--#{$prefix}border-width) solid var(--#{$prefix}alert-border-color);
|
||||||
--#{$prefix}alert-border-radius: var(--#{$prefix}border-radius);
|
--#{$prefix}alert-border-radius: var(--#{$prefix}border-radius);
|
||||||
--#{$prefix}alert-link-color: inherit;
|
--#{$prefix}alert-link-color: inherit;
|
||||||
@@ -18,8 +16,6 @@
|
|||||||
background-color: color-mix(in srgb, var(--#{$prefix}alert-bg), var(--#{$prefix}bg-surface));
|
background-color: color-mix(in srgb, var(--#{$prefix}alert-bg), var(--#{$prefix}bg-surface));
|
||||||
border-radius: var(--#{$prefix}alert-border-radius);
|
border-radius: var(--#{$prefix}alert-border-radius);
|
||||||
border: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}alert-border-color);
|
border: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}alert-border-color);
|
||||||
box-shadow: var(--#{$prefix}box-shadow);
|
|
||||||
color: var(--#{$prefix}alert-color);
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
gap: 1rem;
|
gap: 1rem;
|
||||||
@@ -77,7 +73,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.alert-important {
|
.alert-important {
|
||||||
background-color: var(--#{$prefix}alert-variant-color);
|
border-color: var(--#{$prefix}alert-color);
|
||||||
|
background-color: var(--#{$prefix}alert-color);
|
||||||
color: var(--#{$prefix}white);
|
color: var(--#{$prefix}white);
|
||||||
|
|
||||||
.alert-description {
|
.alert-description {
|
||||||
@@ -96,6 +93,6 @@
|
|||||||
|
|
||||||
@each $name, $color in $theme-colors {
|
@each $name, $color in $theme-colors {
|
||||||
.alert-#{$name} {
|
.alert-#{$name} {
|
||||||
--#{$prefix}alert-variant-color: var(--#{$prefix}#{$name});
|
--#{$prefix}alert-color: var(--#{$prefix}#{$name});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -9,7 +9,6 @@
|
|||||||
--#{$prefix}avatar-font-size: #{$avatar-font-size};
|
--#{$prefix}avatar-font-size: #{$avatar-font-size};
|
||||||
--#{$prefix}avatar-icon-size: #{$avatar-icon-size};
|
--#{$prefix}avatar-icon-size: #{$avatar-icon-size};
|
||||||
--#{$prefix}avatar-brand-size: #{$avatar-brand-size};
|
--#{$prefix}avatar-brand-size: #{$avatar-brand-size};
|
||||||
--#{$prefix}avatar-border-radius: #{$avatar-border-radius};
|
|
||||||
position: relative;
|
position: relative;
|
||||||
width: var(--#{$prefix}avatar-size);
|
width: var(--#{$prefix}avatar-size);
|
||||||
height: var(--#{$prefix}avatar-size);
|
height: var(--#{$prefix}avatar-size);
|
||||||
@@ -25,7 +24,7 @@
|
|||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
background: var(--#{$prefix}avatar-bg) no-repeat center/cover;
|
background: var(--#{$prefix}avatar-bg) no-repeat center/cover;
|
||||||
border-radius: var(--#{$prefix}avatar-border-radius);
|
border-radius: $avatar-border-radius;
|
||||||
box-shadow: var(--#{$prefix}avatar-box-shadow);
|
box-shadow: var(--#{$prefix}avatar-box-shadow);
|
||||||
transition:
|
transition:
|
||||||
color $transition-time,
|
color $transition-time,
|
||||||
@@ -59,10 +58,6 @@
|
|||||||
border-radius: $border-radius-pill;
|
border-radius: $border-radius-pill;
|
||||||
}
|
}
|
||||||
|
|
||||||
.avatar-square {
|
|
||||||
border-radius: var(--#{$prefix}border-radius);
|
|
||||||
}
|
|
||||||
|
|
||||||
@each $avatar-size, $size in $avatar-sizes {
|
@each $avatar-size, $size in $avatar-sizes {
|
||||||
.avatar-#{$avatar-size} {
|
.avatar-#{$avatar-size} {
|
||||||
--#{$prefix}avatar-size: #{map.get($size, size)};
|
--#{$prefix}avatar-size: #{map.get($size, size)};
|
||||||
@@ -71,14 +66,14 @@
|
|||||||
--#{$prefix}avatar-icon-size: #{map.get($size, icon-size)};
|
--#{$prefix}avatar-icon-size: #{map.get($size, icon-size)};
|
||||||
--#{$prefix}avatar-brand-size: #{map.get($size, brand-size)};
|
--#{$prefix}avatar-brand-size: #{map.get($size, brand-size)};
|
||||||
|
|
||||||
|
@if map.has-key($size, border-radius) {
|
||||||
|
border-radius: map.get($size, border-radius);
|
||||||
|
}
|
||||||
|
|
||||||
.badge:empty {
|
.badge:empty {
|
||||||
width: map.get($size, status-size);
|
width: map.get($size, status-size);
|
||||||
height: map.get($size, status-size);
|
height: map.get($size, status-size);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.avatar-square {
|
|
||||||
--#{$prefix}avatar-border-radius: #{map.get($size, border-radius)};
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -101,13 +96,10 @@
|
|||||||
--#{$prefix}list-gap: 0;
|
--#{$prefix}list-gap: 0;
|
||||||
|
|
||||||
.avatar {
|
.avatar {
|
||||||
|
margin-inline-end: calc(#{$avatar-list-spacing} * var(--#{$prefix}avatar-size)) !important;
|
||||||
box-shadow:
|
box-shadow:
|
||||||
var(--#{$prefix}avatar-box-shadow),
|
var(--#{$prefix}avatar-box-shadow),
|
||||||
0 0 0 2px var(--#{$prefix}card-bg, var(--#{$prefix}bg-surface));
|
0 0 0 2px var(--#{$prefix}card-bg, var(--#{$prefix}bg-surface));
|
||||||
|
|
||||||
&:not(:first-child) {
|
|
||||||
margin-inline-start: calc(#{$avatar-list-spacing} * var(--#{$prefix}avatar-size)) !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -76,15 +76,6 @@
|
|||||||
//
|
//
|
||||||
// Button color variations
|
// Button color variations
|
||||||
//
|
//
|
||||||
.btn-ghost {
|
|
||||||
--#{$prefix}btn-bg: transparent;
|
|
||||||
--#{$prefix}btn-border-color: transparent;
|
|
||||||
--#{$prefix}btn-box-shadow: none;
|
|
||||||
--#{$prefix}btn-hover-bg: var(--#{$prefix}bg-surface-secondary);
|
|
||||||
--#{$prefix}btn-hover-border-color: transparent;
|
|
||||||
--#{$prefix}btn-hover-color: var(--#{$prefix}body-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
@each $color, $value in map.merge($theme-colors, $social-colors) {
|
@each $color, $value in map.merge($theme-colors, $social-colors) {
|
||||||
.btn-#{$color} {
|
.btn-#{$color} {
|
||||||
@if $color == 'dark' {
|
@if $color == 'dark' {
|
||||||
@@ -123,6 +114,15 @@
|
|||||||
--#{$prefix}btn-disabled-border-color: var(--#{$prefix}#{$color});
|
--#{$prefix}btn-disabled-border-color: var(--#{$prefix}#{$color});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.btn-ghost {
|
||||||
|
--#{$prefix}btn-bg: transparent;
|
||||||
|
--#{$prefix}btn-border-color: transparent;
|
||||||
|
--#{$prefix}btn-box-shadow: none;
|
||||||
|
--#{$prefix}btn-hover-bg: var(--#{$prefix}bg-surface-secondary);
|
||||||
|
--#{$prefix}btn-hover-border-color: transparent;
|
||||||
|
--#{$prefix}btn-hover-color: var(--#{$prefix}body-color);
|
||||||
|
}
|
||||||
|
|
||||||
.btn-ghost-#{$color},
|
.btn-ghost-#{$color},
|
||||||
.btn-ghost.btn-#{$color} {
|
.btn-ghost.btn-#{$color} {
|
||||||
--#{$prefix}btn-color: var(--#{$prefix}#{$color});
|
--#{$prefix}btn-color: var(--#{$prefix}#{$color});
|
||||||
@@ -207,10 +207,6 @@
|
|||||||
@include elements-list;
|
@include elements-list;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-list-center {
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Button floating
|
// Button floating
|
||||||
//
|
//
|
||||||
|
|||||||
@@ -1,21 +1,3 @@
|
|||||||
@use 'sass:map';
|
|
||||||
|
|
||||||
@property --tblr-card-gradient-direction {
|
|
||||||
syntax: '<angle>';
|
|
||||||
inherits: true;
|
|
||||||
initial-value: 180deg;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes gradient-animation {
|
|
||||||
0% {
|
|
||||||
--#{$prefix}card-gradient-direction: 180deg;
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
--#{$prefix}card-gradient-direction: 540deg;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.card {
|
.card {
|
||||||
@include transition(transform $transition-time ease-out, opacity $transition-time ease-out, box-shadow $transition-time ease-out);
|
@include transition(transform $transition-time ease-out, opacity $transition-time ease-out, box-shadow $transition-time ease-out);
|
||||||
|
|
||||||
@@ -47,18 +29,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Card dashed
|
|
||||||
.card-dashed {
|
|
||||||
border: var(--#{$prefix}border-width) dashed var(--#{$prefix}border-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Card transparent
|
|
||||||
.card-transparent {
|
|
||||||
background: transparent;
|
|
||||||
border: var(--#{$prefix}border-width) dashed var(--#{$prefix}border-color);
|
|
||||||
box-shadow: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Card stamp
|
// Card stamp
|
||||||
.card-stamp {
|
.card-stamp {
|
||||||
--#{$prefix}stamp-size: 7rem;
|
--#{$prefix}stamp-size: 7rem;
|
||||||
@@ -317,7 +287,7 @@ Stacked card
|
|||||||
margin: 0 0 1rem;
|
margin: 0 0 1rem;
|
||||||
font-size: $h3-font-size;
|
font-size: $h3-font-size;
|
||||||
font-weight: var(--#{$prefix}font-weight-medium);
|
font-weight: var(--#{$prefix}font-weight-medium);
|
||||||
color: var(--#{$prefix}heading-color);
|
color: $headings-color;
|
||||||
line-height: 1.5rem;
|
line-height: 1.5rem;
|
||||||
|
|
||||||
@at-root a#{&}:hover {
|
@at-root a#{&}:hover {
|
||||||
@@ -441,15 +411,6 @@ Card table
|
|||||||
td,
|
td,
|
||||||
th {
|
th {
|
||||||
&:first-child {
|
&:first-child {
|
||||||
padding-left: $card-spacer-x;
|
|
||||||
border-left: 0;
|
|
||||||
border-top-left-radius: var(--#{$prefix}card-border-radius);
|
|
||||||
}
|
|
||||||
|
|
||||||
&:last-child {
|
|
||||||
padding-right: $card-spacer-x;
|
|
||||||
border-right: 0;
|
|
||||||
border-top-right-radius: var(--#{$prefix}card-border-radius);
|
|
||||||
padding-inline-start: $card-spacer-x;
|
padding-inline-start: $card-spacer-x;
|
||||||
border-inline-start: 0;
|
border-inline-start: 0;
|
||||||
}
|
}
|
||||||
@@ -663,75 +624,3 @@ Card note
|
|||||||
--#{$prefix}card-bg: #fff7dd;
|
--#{$prefix}card-bg: #fff7dd;
|
||||||
--#{$prefix}card-border-color: #fff1c9;
|
--#{$prefix}card-border-color: #fff1c9;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
Card gradient
|
|
||||||
*/
|
|
||||||
.card-gradient {
|
|
||||||
--#{$prefix}card-gradient-direction: 180deg;
|
|
||||||
--#{$prefix}card-gradient-opacity: 86%;
|
|
||||||
--#{$prefix}card-gradient: var(--tblr-primary), var(--tblr-primary);
|
|
||||||
|
|
||||||
background:
|
|
||||||
radial-gradient(ellipse at center, var(--#{$prefix}card-bg) 0%, color-mix(in srgb, var(--#{$prefix}card-bg) 0%, transparent) 80%) border-box,
|
|
||||||
linear-gradient(var(--#{$prefix}card-gradient-direction), color-mix(in srgb, var(--#{$prefix}card-bg) var(--#{$prefix}card-gradient-opacity), transparent) 0%, var(--#{$prefix}card-bg) 40%) border-box,
|
|
||||||
linear-gradient(calc(270deg + var(--#{$prefix}card-gradient-direction)), var(--#{$prefix}card-gradient)) border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
@each $name, $color in map.merge($colors, $theme-colors) {
|
|
||||||
.card-gradient-#{$name} {
|
|
||||||
--#{$prefix}card-gradient: var(--tblr-#{$name}), var(--tblr-#{$name});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-rainbow {
|
|
||||||
--#{$prefix}card-gradient: #78c5d6, #459ba8, #79c267, #c5d647, #f5d63d, #f08b33, #e868a2, #be61a5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-sun {
|
|
||||||
--#{$prefix}card-gradient: #fd1d1d, #fcb045;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-snow {
|
|
||||||
--#{$prefix}card-gradient: #333, #e9ecef;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-ocean {
|
|
||||||
--#{$prefix}card-gradient: #1cb5e0, #000851;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-mellow {
|
|
||||||
--#{$prefix}card-gradient: #f8ff00, #3ad59f;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-disco {
|
|
||||||
--#{$prefix}card-gradient: #fc466b, #3f5efb;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-psychedelic {
|
|
||||||
--#{$prefix}card-gradient: #fcc5e4, #fda34b, #ff7882, #c8699e, #7046aa, #0c1db8, #020f75;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-love {
|
|
||||||
--#{$prefix}card-gradient: #f235e6, #bc0707;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-gold {
|
|
||||||
--#{$prefix}card-gradient: #9d4100, #bf7122, #f59f00, #ffd700;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-animated {
|
|
||||||
animation: gradient-animation 15s linear infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-bottom {
|
|
||||||
--#{$prefix}card-gradient-direction: 0deg;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-end {
|
|
||||||
--#{$prefix}card-gradient-direction: 270deg;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-gradient-start {
|
|
||||||
--#{$prefix}card-gradient-direction: 90deg;
|
|
||||||
}
|
|
||||||
|
|||||||
@@ -139,7 +139,7 @@ Form help
|
|||||||
*/
|
*/
|
||||||
.form-help {
|
.form-help {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
font-weight: var(--#{$prefix}font-weight-semibold);
|
font-weight: var(--#{$prefix}font-weight-bold);
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
width: 1.125rem;
|
width: 1.125rem;
|
||||||
|
|||||||
@@ -82,7 +82,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
font-weight: var(--#{$prefix}font-weight-semibold);
|
font-weight: var(--#{$prefix}font-weight-bold);
|
||||||
color: inherit;
|
color: inherit;
|
||||||
background: $list-group-active-bg;
|
background: $list-group-active-bg;
|
||||||
|
|
||||||
|
|||||||
@@ -17,12 +17,12 @@
|
|||||||
|
|
||||||
.nav-link.active,
|
.nav-link.active,
|
||||||
.nav-item.show .nav-link {
|
.nav-item.show .nav-link {
|
||||||
font-weight: var(--#{$prefix}font-weight-semibold);
|
font-weight: var(--#{$prefix}nav-link-font-weight);
|
||||||
color: var(--#{$prefix}nav-link-active-color);
|
color: var(--#{$prefix}nav-link-active-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.nav-pills {
|
&.nav-pills {
|
||||||
margin: 0 calc(-1 * $nav-link-padding-x);
|
margin: 0 calc(-1 * var(--#{$prefix}nav-link-padding-x));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -9,7 +9,7 @@
|
|||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1);
|
box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1);
|
||||||
border-radius: var(--#{config.$prefix}border-radius);
|
border-radius: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@each $payment in config.$payment-providers {
|
@each $payment in config.$payment-providers {
|
||||||
|
|||||||
@@ -93,8 +93,6 @@ Progressbg
|
|||||||
.progressbg-text {
|
.progressbg-text {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
@include text-truncate;
|
@include text-truncate;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -9,7 +9,7 @@
|
|||||||
z-index: 1;
|
z-index: 1;
|
||||||
padding: 0.25rem 0.75rem;
|
padding: 0.25rem 0.75rem;
|
||||||
font-size: $card-ribbon-font-size;
|
font-size: $card-ribbon-font-size;
|
||||||
font-weight: var(--#{$prefix}font-weight-semibold);
|
font-weight: var(--#{$prefix}font-weight-bold);
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
color: $white;
|
color: $white;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|||||||
@@ -1,5 +1,3 @@
|
|||||||
@use 'sass:map';
|
|
||||||
|
|
||||||
@keyframes status-pulsate-main {
|
@keyframes status-pulsate-main {
|
||||||
40% {
|
40% {
|
||||||
transform: scale(1.25, 1.25);
|
transform: scale(1.25, 1.25);
|
||||||
@@ -76,10 +74,10 @@
|
|||||||
color: var(--#{$prefix}body-color) !important;
|
color: var(--#{$prefix}body-color) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
@each $name, $color in map.merge($theme-colors, $social-colors) {
|
@each $name, $color in $theme-colors {
|
||||||
.status-#{$name} {
|
.status-#{$name} {
|
||||||
--#{$prefix}status-color: var(--#{$prefix}#{$name});
|
--#{$prefix}status-color: #{$color};
|
||||||
--#{$prefix}status-color-rgb: var(--#{$prefix}#{$name}-rgb);
|
--#{$prefix}status-color-rgb: #{to-rgb($color)};
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -81,7 +81,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
font-weight: var(--#{$prefix}font-weight-semibold);
|
font-weight: var(--#{$prefix}font-weight-bold);
|
||||||
|
|
||||||
&:after {
|
&:after {
|
||||||
background: var(--#{$prefix}steps-inactive-color);
|
background: var(--#{$prefix}steps-inactive-color);
|
||||||
|
|||||||
@@ -1,6 +1,4 @@
|
|||||||
.table {
|
.table {
|
||||||
font: inherit;
|
|
||||||
|
|
||||||
thead {
|
thead {
|
||||||
th {
|
th {
|
||||||
background: $table-th-bg;
|
background: $table-th-bg;
|
||||||
|
|||||||
@@ -122,7 +122,7 @@ pre {
|
|||||||
background: $pre-bg;
|
background: $pre-bg;
|
||||||
color: $pre-color;
|
color: $pre-color;
|
||||||
border-radius: var(--#{$prefix}border-radius);
|
border-radius: var(--#{$prefix}border-radius);
|
||||||
line-height: $line-height-base;
|
line-height: $code-line-height;
|
||||||
|
|
||||||
@include scrollbar;
|
@include scrollbar;
|
||||||
|
|
||||||
@@ -307,7 +307,7 @@ $text-variants: (
|
|||||||
border-radius: var(--#{$prefix}border-radius);
|
border-radius: var(--#{$prefix}border-radius);
|
||||||
line-height: calc(var(--#{$prefix}steps-item-size) - 2px);
|
line-height: calc(var(--#{$prefix}steps-item-size) - 2px);
|
||||||
font-size: var(--#{$prefix}font-size-h4);
|
font-size: var(--#{$prefix}font-size-h4);
|
||||||
font-weight: var(--#{$prefix}font-weight-semibold);
|
font-weight: var(--#{$prefix}font-weight-bold);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -83,3 +83,8 @@ Form switch
|
|||||||
padding-top: 0.125rem;
|
padding-top: 0.125rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*Correction of Form-check position*/
|
||||||
|
.form-check-input:checked {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|||||||
2
core/scss/vendor/_apexcharts.scss
vendored
2
core/scss/vendor/_apexcharts.scss
vendored
@@ -10,7 +10,7 @@
|
|||||||
background: transparent !important;
|
background: transparent !important;
|
||||||
border: 0 !important;
|
border: 0 !important;
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
font-weight: var(--#{$prefix}font-weight-semibold);
|
font-weight: var(--#{$prefix}font-weight-bold);
|
||||||
padding: 0.25rem 0.5rem !important;
|
padding: 0.25rem 0.5rem !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
2
core/scss/vendor/_fullcalendar.scss
vendored
2
core/scss/vendor/_fullcalendar.scss
vendored
@@ -36,7 +36,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.fc-event-time {
|
.fc-event-time {
|
||||||
font-weight: var(--#{$prefix}font-weight-semibold) !important;
|
font-weight: var(--#{$prefix}font-weight-bold) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.fc-col-header-cell-cushion {
|
.fc-col-header-cell-cushion {
|
||||||
|
|||||||
@@ -1,6 +1,8 @@
|
|||||||
---
|
---
|
||||||
title: Tabler Emails
|
title: Tabler Emails
|
||||||
|
menu-title: Emails
|
||||||
seoTitle: Tabler Emails - premium email templates
|
seoTitle: Tabler Emails - premium email templates
|
||||||
|
icon: mail
|
||||||
order: 4
|
order: 4
|
||||||
description: Customizable email templates for over 90 clients and devices.
|
description: Customizable email templates for over 90 clients and devices.
|
||||||
summary: Tabler Emails is a set of 80 eye-catching, customizable HTML templates. They are compatible with over 90 email clients and devices.
|
summary: Tabler Emails is a set of 80 eye-catching, customizable HTML templates. They are compatible with over 90 email clients and devices.
|
||||||
|
|||||||
@@ -1,6 +1,8 @@
|
|||||||
---
|
---
|
||||||
title: Tabler Icons
|
title: Tabler Icons
|
||||||
|
menu-title: Icons
|
||||||
summary: Tabler Icons is a powerful and versatile icon library that offers a huge collection of high quality icons suitable for a wide range of applications. With its clean and modern aesthetic, extensive customization options, and user-friendly website and plugins, Tabler Icons is an excellent resource for designers and developers looking to enhance their projects with high-quality icons.
|
summary: Tabler Icons is a powerful and versatile icon library that offers a huge collection of high quality icons suitable for a wide range of applications. With its clean and modern aesthetic, extensive customization options, and user-friendly website and plugins, Tabler Icons is an excellent resource for designers and developers looking to enhance their projects with high-quality icons.
|
||||||
|
icon: ghost
|
||||||
order: 2
|
order: 2
|
||||||
description: Over 5000 pixel-perfect icons for web design and development
|
description: Over 5000 pixel-perfect icons for web design and development
|
||||||
---
|
---
|
||||||
@@ -9,5 +11,5 @@ description: Over 5000 pixel-perfect icons for web design and development
|
|||||||
|
|
||||||
Tabler Icons is a comprehensive icon library that features {{ iconsCount }} high-quality icons. These icons are designed with a clean and modern aesthetic, making them suitable for a wide range of applications.
|
Tabler Icons is a comprehensive icon library that features {{ iconsCount }} high-quality icons. These icons are designed with a clean and modern aesthetic, making them suitable for a wide range of applications.
|
||||||
|
|
||||||
To use Tabler Icons, you can visit their website at https://tabler-icons.io. From there, you can browse the full collection of icons by category or search for a specific icon using the search bar. Once you have found an icon you like, you can download it in various file formats, including SVG, PNG, and Icon Font.
|
To use Tabler Icons, you can visit their website at [Tabler Icons Official Website]({{ site.icons.link }}). From there, you can browse the full collection of icons by category or search for a specific icon using the search bar. Once you have found an icon you like, you can download it in various file formats, including SVG, PNG, and Icon Font.
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,8 @@
|
|||||||
---
|
---
|
||||||
title: Tabler Illustrations
|
title: Tabler Illustrations
|
||||||
|
menu-title: Illustrations
|
||||||
order: 3
|
order: 3
|
||||||
|
icon: paint
|
||||||
description: Customizable illustrations for modern web and mobile designs.
|
description: Customizable illustrations for modern web and mobile designs.
|
||||||
summary: Tabler Illustrations is a collection of customizable SVG illustrations for your web project. Explore our library of illustrations to enhance your web development experience.
|
summary: Tabler Illustrations is a collection of customizable SVG illustrations for your web project. Explore our library of illustrations to enhance your web development experience.
|
||||||
---
|
---
|
||||||
|
|||||||
@@ -10,11 +10,10 @@ To create an offcanvas, add the `.offcanvas` class to a container element. You c
|
|||||||
|
|
||||||
{% capture html -%}
|
{% capture html -%}
|
||||||
<div
|
<div
|
||||||
class="offcanvas offcanvas-start"
|
class="offcanvas offcanvas-start show"
|
||||||
tabindex="-1"
|
tabindex="-1"
|
||||||
id="offcanvas"
|
id="offcanvas"
|
||||||
aria-labelledby="offcanvasLabel"
|
aria-labelledby="offcanvasLabel"
|
||||||
data-bs-scroll="true"
|
|
||||||
>
|
>
|
||||||
<div class="offcanvas-body">
|
<div class="offcanvas-body">
|
||||||
Content for the offcanvas goes here. You can place just about any Tabler component or custom
|
Content for the offcanvas goes here. You can place just about any Tabler component or custom
|
||||||
@@ -30,12 +29,11 @@ The offcanvas component is used to display a cookies banner. It is a great way t
|
|||||||
|
|
||||||
{% capture html -%}
|
{% capture html -%}
|
||||||
<div
|
<div
|
||||||
class="offcanvas offcanvas-bottom h-auto"
|
class="offcanvas offcanvas-bottom h-auto show"
|
||||||
tabindex="-1"
|
tabindex="-1"
|
||||||
id="offcanvasBottom"
|
id="offcanvasBottom"
|
||||||
aria-modal="true"
|
aria-modal="true"
|
||||||
role="dialog"
|
role="dialog"
|
||||||
data-bs-scroll="true"
|
|
||||||
>
|
>
|
||||||
<div class="offcanvas-body">
|
<div class="offcanvas-body">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
@@ -61,11 +59,3 @@ The offcanvas component is used to display a cookies banner. It is a great way t
|
|||||||
</div>
|
</div>
|
||||||
{%- endcapture %}
|
{%- endcapture %}
|
||||||
{% include "docs/example.html" html=html raw %}
|
{% include "docs/example.html" html=html raw %}
|
||||||
|
|
||||||
<script>
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
document.querySelectorAll('[data-bs-scroll="true"]').forEach(el => {
|
|
||||||
new bootstrap.Offcanvas(el, { scroll: true }).show();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
@@ -1,6 +1,8 @@
|
|||||||
---
|
---
|
||||||
title: Tabler UI
|
title: Tabler UI
|
||||||
|
menu-title: Admin Template
|
||||||
order: 1
|
order: 1
|
||||||
|
icon: layout
|
||||||
description: Free and open source web application UI kit based on Bootstrap
|
description: Free and open source web application UI kit based on Bootstrap
|
||||||
summary: Tabler UI is a carefully crafted collection of modern and responsive user interface components. Built on top of Bootstrap, it helps developers create stunning and functional web applications quickly and efficiently.
|
summary: Tabler UI is a carefully crafted collection of modern and responsive user interface components. Built on top of Bootstrap, it helps developers create stunning and functional web applications quickly and efficiently.
|
||||||
---
|
---
|
||||||
|
|||||||
@@ -274,9 +274,9 @@ export default function (eleventyConfig) {
|
|||||||
eleventyConfig.addGlobalData("posthogHost", process.env.POSTHOG_HOST || "https://us.i.posthog.com");
|
eleventyConfig.addGlobalData("posthogHost", process.env.POSTHOG_HOST || "https://us.i.posthog.com");
|
||||||
|
|
||||||
const data = {
|
const data = {
|
||||||
iconsCount: () => 123,
|
iconsCount: () => 5963,
|
||||||
emailsCount: () => 123,
|
emailsCount: () => 80,
|
||||||
illustrationsCount: () => 123
|
illustrationsCount: () => 105
|
||||||
};
|
};
|
||||||
|
|
||||||
for (const [key, value] of Object.entries(data)) {
|
for (const [key, value] of Object.entries(data)) {
|
||||||
|
|||||||
@@ -4,8 +4,7 @@
|
|||||||
"description": "",
|
"description": "",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"build": "pnpm run clean && pnpm run build-assets && pnpm run html",
|
"build": "pnpm run clean && pnpm run js && pnpm run css && pnpm run html ",
|
||||||
"build-assets": "concurrently \"pnpm run js\" \"pnpm run css\"",
|
|
||||||
"html": "eleventy",
|
"html": "eleventy",
|
||||||
"js": "pnpm run js-compile && pnpm run js-minify",
|
"js": "pnpm run js-compile && pnpm run js-minify",
|
||||||
"js-compile": "rollup --config .build/rollup.config.mjs --sourcemap",
|
"js-compile": "rollup --config .build/rollup.config.mjs --sourcemap",
|
||||||
|
|||||||
@@ -2,11 +2,13 @@
|
|||||||
|
|
||||||
:root {
|
:root {
|
||||||
--docsearch-primary-color: var(--tblr-primary);
|
--docsearch-primary-color: var(--tblr-primary);
|
||||||
--docsearch-searchbox-background: var(--tblr-bg-surface);
|
--docsearch-searchbox-background: var(--tblr-bg-surface-secondary);
|
||||||
--docsearch-searchbox-focus-background: var(--tblr-bg-surface);
|
--docsearch-searchbox-focus-background: var(--tblr-bg-surface-secondary);
|
||||||
--docsearch-text-color: var(--tblr-body-text);
|
--docsearch-text-color: var(--tblr-body-text);
|
||||||
--docsearch-key-shadow: 0 0 0 1px var(--tblr-border-color);
|
--docsearch-key-shadow: none;
|
||||||
--docsearch-key-gradient: var(--tblr-bg-surface-secondary);
|
--docsearch-key-gradient: var(--tblr-bg-surface-secondary);
|
||||||
|
--docsearch-searchbox-shadow: 0 0 0 1px var(--tblr-border-color);
|
||||||
|
--docsearch-searchbox-focus-background: var(--tblr-bg-surface-tertiary);
|
||||||
}
|
}
|
||||||
|
|
||||||
.col-docs {
|
.col-docs {
|
||||||
@@ -24,6 +26,11 @@
|
|||||||
box-shadow: 0 0 0 1px var(--tblr-border-color);
|
box-shadow: 0 0 0 1px var(--tblr-border-color);
|
||||||
font-weight: var(--tblr-font-weight-normal);
|
font-weight: var(--tblr-font-weight-normal);
|
||||||
transition: all 0.2s ease-in-out;
|
transition: all 0.2s ease-in-out;
|
||||||
|
border-radius: var(--tblr-border-radius);
|
||||||
|
}
|
||||||
|
|
||||||
|
.DocSearch-Button-Placeholder {
|
||||||
|
font-size: var(--tblr-font-size);
|
||||||
}
|
}
|
||||||
|
|
||||||
.DocSearch-SearchBar {
|
.DocSearch-SearchBar {
|
||||||
@@ -32,6 +39,11 @@
|
|||||||
background-color: var(--tblr-bg-surface) !important;
|
background-color: var(--tblr-bg-surface) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.DocSearch-Search-Icon {
|
||||||
|
width: 1rem;
|
||||||
|
height: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
.DocSearch-Hit-source {
|
.DocSearch-Hit-source {
|
||||||
background: none !important;
|
background: none !important;
|
||||||
}
|
}
|
||||||
@@ -100,8 +112,20 @@
|
|||||||
box-shadow: none !important;
|
box-shadow: none !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.DocSearch-Button-Keys {
|
||||||
|
min-width: 0;
|
||||||
|
gap: .25rem;
|
||||||
|
margin-right: .25rem;
|
||||||
|
}
|
||||||
|
|
||||||
.DocSearch-Button-Key {
|
.DocSearch-Button-Key {
|
||||||
top: 0;
|
top: 0;
|
||||||
|
box-shadow: none;
|
||||||
|
background: none;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
width: auto;
|
||||||
|
font-size: var(--tblr-font-size);
|
||||||
}
|
}
|
||||||
|
|
||||||
.DocSearch-Container {
|
.DocSearch-Container {
|
||||||
|
|||||||
@@ -1,5 +1,12 @@
|
|||||||
{
|
{
|
||||||
"trailingSlash": false,
|
"trailingSlash": false,
|
||||||
|
"redirects": [
|
||||||
|
{
|
||||||
|
"source": "/",
|
||||||
|
"destination": "/ui",
|
||||||
|
"permanent": false
|
||||||
|
}
|
||||||
|
],
|
||||||
"rewrites": [
|
"rewrites": [
|
||||||
{
|
{
|
||||||
"source": "/stats/js/script.js",
|
"source": "/stats/js/script.js",
|
||||||
@@ -17,6 +24,7 @@
|
|||||||
"source": "/eat/:path(.*)",
|
"source": "/eat/:path(.*)",
|
||||||
"destination": "https://eu.i.posthog.com/:path*"
|
"destination": "https://eu.i.posthog.com/:path*"
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
"source": "/(.*)",
|
"source": "/(.*)",
|
||||||
"destination": "/error-404.html"
|
"destination": "/error-404.html"
|
||||||
|
|||||||
151
pnpm-lock.yaml
generated
151
pnpm-lock.yaml
generated
@@ -108,6 +108,9 @@ importers:
|
|||||||
bootstrap:
|
bootstrap:
|
||||||
specifier: 5.3.8
|
specifier: 5.3.8
|
||||||
version: 5.3.8(@popperjs/core@2.11.8)
|
version: 5.3.8(@popperjs/core@2.11.8)
|
||||||
|
geist:
|
||||||
|
specifier: ^1.5.1
|
||||||
|
version: 1.5.1(next@16.0.4(@babel/core@7.27.1)(@playwright/test@1.53.2)(react-dom@19.2.0(react@19.2.0))(react@19.2.0)(sass@1.89.2))
|
||||||
devDependencies:
|
devDependencies:
|
||||||
'@hotwired/turbo':
|
'@hotwired/turbo':
|
||||||
specifier: ^8.0.18
|
specifier: ^8.0.18
|
||||||
@@ -116,8 +119,8 @@ importers:
|
|||||||
specifier: ^0.25.0
|
specifier: ^0.25.0
|
||||||
version: 0.25.0
|
version: 0.25.0
|
||||||
apexcharts:
|
apexcharts:
|
||||||
specifier: ^5.3.6
|
specifier: 3.54.1
|
||||||
version: 5.3.6
|
version: 3.54.1
|
||||||
autosize:
|
autosize:
|
||||||
specifier: ^6.0.1
|
specifier: ^6.0.1
|
||||||
version: 6.0.1
|
version: 6.0.1
|
||||||
@@ -130,9 +133,6 @@ importers:
|
|||||||
countup.js:
|
countup.js:
|
||||||
specifier: ^2.9.0
|
specifier: ^2.9.0
|
||||||
version: 2.9.0
|
version: 2.9.0
|
||||||
driver.js:
|
|
||||||
specifier: ^1.0.0
|
|
||||||
version: 1.4.0
|
|
||||||
dropzone:
|
dropzone:
|
||||||
specifier: ^6.0.0-beta.2
|
specifier: ^6.0.0-beta.2
|
||||||
version: 6.0.0-beta.2
|
version: 6.0.0-beta.2
|
||||||
@@ -148,9 +148,6 @@ importers:
|
|||||||
fullcalendar:
|
fullcalendar:
|
||||||
specifier: ^6.1.19
|
specifier: ^6.1.19
|
||||||
version: 6.1.19
|
version: 6.1.19
|
||||||
geist:
|
|
||||||
specifier: ^1.5.1
|
|
||||||
version: 1.5.1(next@16.0.4(@babel/core@7.27.1)(@playwright/test@1.53.2)(react-dom@19.2.0(react@19.2.0))(react@19.2.0)(sass@1.89.2))
|
|
||||||
hugerte:
|
hugerte:
|
||||||
specifier: ^1.0.9
|
specifier: ^1.0.9
|
||||||
version: 1.0.9
|
version: 1.0.9
|
||||||
@@ -1268,31 +1265,6 @@ packages:
|
|||||||
resolution: {integrity: sha512-doH1gimEu3A46VX6aVxpHTeHrytJAG6HgdxntYnCFiIFHEM/ZGpG8KiZGBChchjQmG0XFIBL552kBTjVcMZXwQ==}
|
resolution: {integrity: sha512-doH1gimEu3A46VX6aVxpHTeHrytJAG6HgdxntYnCFiIFHEM/ZGpG8KiZGBChchjQmG0XFIBL552kBTjVcMZXwQ==}
|
||||||
engines: {node: '>=12'}
|
engines: {node: '>=12'}
|
||||||
|
|
||||||
'@svgdotjs/svg.draggable.js@3.0.6':
|
|
||||||
resolution: {integrity: sha512-7iJFm9lL3C40HQcqzEfezK2l+dW2CpoVY3b77KQGqc8GXWa6LhhmX5Ckv7alQfUXBuZbjpICZ+Dvq1czlGx7gA==}
|
|
||||||
peerDependencies:
|
|
||||||
'@svgdotjs/svg.js': ^3.2.4
|
|
||||||
|
|
||||||
'@svgdotjs/svg.filter.js@3.0.9':
|
|
||||||
resolution: {integrity: sha512-/69XMRCDoam2HgC4ldHIaDgeQf1ViHIsa0Ld4uWgiXtZ+E24DWHe/9Ib6kbNiZ7WRIdlVokUDR1Fg0kjIpkfbw==}
|
|
||||||
engines: {node: '>= 0.8.0'}
|
|
||||||
|
|
||||||
'@svgdotjs/svg.js@3.2.5':
|
|
||||||
resolution: {integrity: sha512-/VNHWYhNu+BS7ktbYoVGrCmsXDh+chFMaONMwGNdIBcFHrWqk2jY8fNyr3DLdtQUIalvkPfM554ZSFa3dm3nxQ==}
|
|
||||||
|
|
||||||
'@svgdotjs/svg.resize.js@2.0.5':
|
|
||||||
resolution: {integrity: sha512-4heRW4B1QrJeENfi7326lUPYBCevj78FJs8kfeDxn5st0IYPIRXoTtOSYvTzFWgaWWXd3YCDE6ao4fmv91RthA==}
|
|
||||||
engines: {node: '>= 14.18'}
|
|
||||||
peerDependencies:
|
|
||||||
'@svgdotjs/svg.js': ^3.2.4
|
|
||||||
'@svgdotjs/svg.select.js': ^4.0.1
|
|
||||||
|
|
||||||
'@svgdotjs/svg.select.js@4.0.3':
|
|
||||||
resolution: {integrity: sha512-qkMgso1sd2hXKd1FZ1weO7ANq12sNmQJeGDjs46QwDVsxSRcHmvWKL2NDF7Yimpwf3sl5esOLkPqtV2bQ3v/Jg==}
|
|
||||||
engines: {node: '>= 14.18'}
|
|
||||||
peerDependencies:
|
|
||||||
'@svgdotjs/svg.js': ^3.2.4
|
|
||||||
|
|
||||||
'@swc/helpers@0.2.14':
|
'@swc/helpers@0.2.14':
|
||||||
resolution: {integrity: sha512-wpCQMhf5p5GhNg2MmGKXzUNwxe7zRiCsmqYsamez2beP7mKPCSiu+BjZcdN95yYSzO857kr0VfQewmGpS77nqA==}
|
resolution: {integrity: sha512-wpCQMhf5p5GhNg2MmGKXzUNwxe7zRiCsmqYsamez2beP7mKPCSiu+BjZcdN95yYSzO857kr0VfQewmGpS77nqA==}
|
||||||
|
|
||||||
@@ -1388,8 +1360,8 @@ packages:
|
|||||||
resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
|
resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
|
||||||
engines: {node: '>= 8'}
|
engines: {node: '>= 8'}
|
||||||
|
|
||||||
apexcharts@5.3.6:
|
apexcharts@3.54.1:
|
||||||
resolution: {integrity: sha512-sVEPw+J0Gp0IHQabKu8cfdsxlfME0e36Wid7RIaPclGM2OUt+O7O4+6mfAmTUYhy5bDk8cNHzEhPfVtLCIXEJA==}
|
resolution: {integrity: sha512-E4et0h/J1U3r3EwS/WlqJCQIbepKbp6wGUmaAwJOMjHUP4Ci0gxanLa7FR3okx6p9coi4st6J853/Cb1NP0vpA==}
|
||||||
|
|
||||||
argparse@1.0.10:
|
argparse@1.0.10:
|
||||||
resolution: {integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==}
|
resolution: {integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==}
|
||||||
@@ -1795,9 +1767,6 @@ packages:
|
|||||||
resolution: {integrity: sha512-IrPdXQsk2BbzvCBGBOTmmSH5SodmqZNt4ERAZDmW4CT+tL8VtvinqywuANaFu4bOMWki16nqf0e4oC0QIaDr/g==}
|
resolution: {integrity: sha512-IrPdXQsk2BbzvCBGBOTmmSH5SodmqZNt4ERAZDmW4CT+tL8VtvinqywuANaFu4bOMWki16nqf0e4oC0QIaDr/g==}
|
||||||
engines: {node: '>=10'}
|
engines: {node: '>=10'}
|
||||||
|
|
||||||
driver.js@1.4.0:
|
|
||||||
resolution: {integrity: sha512-Gm64jm6PmcU+si21sQhBrTAM1JvUrR0QhNmjkprNLxohOBzul9+pNHXgQaT9lW84gwg9GMLB3NZGuGolsz5uew==}
|
|
||||||
|
|
||||||
dropzone@6.0.0-beta.2:
|
dropzone@6.0.0-beta.2:
|
||||||
resolution: {integrity: sha512-k44yLuFFhRk53M8zP71FaaNzJYIzr99SKmpbO/oZKNslDjNXQsBTdfLs+iONd0U0L94zzlFzRnFdqbLcs7h9fQ==}
|
resolution: {integrity: sha512-k44yLuFFhRk53M8zP71FaaNzJYIzr99SKmpbO/oZKNslDjNXQsBTdfLs+iONd0U0L94zzlFzRnFdqbLcs7h9fQ==}
|
||||||
|
|
||||||
@@ -1825,8 +1794,8 @@ packages:
|
|||||||
electron-to-chromium@1.5.149:
|
electron-to-chromium@1.5.149:
|
||||||
resolution: {integrity: sha512-UyiO82eb9dVOx8YO3ajDf9jz2kKyt98DEITRdeLPstOEuTlLzDA4Gyq5K9he71TQziU5jUVu2OAu5N48HmQiyQ==}
|
resolution: {integrity: sha512-UyiO82eb9dVOx8YO3ajDf9jz2kKyt98DEITRdeLPstOEuTlLzDA4Gyq5K9he71TQziU5jUVu2OAu5N48HmQiyQ==}
|
||||||
|
|
||||||
electron-to-chromium@1.5.262:
|
electron-to-chromium@1.5.259:
|
||||||
resolution: {integrity: sha512-NlAsMteRHek05jRUxUR0a5jpjYq9ykk6+kO0yRaMi5moe7u0fVIOeQ3Y30A8dIiWFBNUoQGi1ljb1i5VtS9WQQ==}
|
resolution: {integrity: sha512-I+oLXgpEJzD6Cwuwt1gYjxsDmu/S/Kd41mmLA3O+/uH2pFRO/DvOjUyGozL8j3KeLV6WyZ7ssPwELMsXCcsJAQ==}
|
||||||
|
|
||||||
emoji-regex@8.0.0:
|
emoji-regex@8.0.0:
|
||||||
resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
|
resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
|
||||||
@@ -3294,6 +3263,37 @@ packages:
|
|||||||
resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
|
resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
|
||||||
engines: {node: '>= 0.4'}
|
engines: {node: '>= 0.4'}
|
||||||
|
|
||||||
|
svg.draggable.js@2.2.2:
|
||||||
|
resolution: {integrity: sha512-JzNHBc2fLQMzYCZ90KZHN2ohXL0BQJGQimK1kGk6AvSeibuKcIdDX9Kr0dT9+UJ5O8nYA0RB839Lhvk4CY4MZw==}
|
||||||
|
engines: {node: '>= 0.8.0'}
|
||||||
|
|
||||||
|
svg.easing.js@2.0.0:
|
||||||
|
resolution: {integrity: sha512-//ctPdJMGy22YoYGV+3HEfHbm6/69LJUTAqI2/5qBvaNHZ9uUFVC82B0Pl299HzgH13rKrBgi4+XyXXyVWWthA==}
|
||||||
|
engines: {node: '>= 0.8.0'}
|
||||||
|
|
||||||
|
svg.filter.js@2.0.2:
|
||||||
|
resolution: {integrity: sha512-xkGBwU+dKBzqg5PtilaTb0EYPqPfJ9Q6saVldX+5vCRy31P6TlRCP3U9NxH3HEufkKkpNgdTLBJnmhDHeTqAkw==}
|
||||||
|
engines: {node: '>= 0.8.0'}
|
||||||
|
|
||||||
|
svg.js@2.7.1:
|
||||||
|
resolution: {integrity: sha512-ycbxpizEQktk3FYvn/8BH+6/EuWXg7ZpQREJvgacqn46gIddG24tNNe4Son6omdXCnSOaApnpZw6MPCBA1dODA==}
|
||||||
|
|
||||||
|
svg.pathmorphing.js@0.1.3:
|
||||||
|
resolution: {integrity: sha512-49HWI9X4XQR/JG1qXkSDV8xViuTLIWm/B/7YuQELV5KMOPtXjiwH4XPJvr/ghEDibmLQ9Oc22dpWpG0vUDDNww==}
|
||||||
|
engines: {node: '>= 0.8.0'}
|
||||||
|
|
||||||
|
svg.resize.js@1.4.3:
|
||||||
|
resolution: {integrity: sha512-9k5sXJuPKp+mVzXNvxz7U0uC9oVMQrrf7cFsETznzUDDm0x8+77dtZkWdMfRlmbkEEYvUn9btKuZ3n41oNA+uw==}
|
||||||
|
engines: {node: '>= 0.8.0'}
|
||||||
|
|
||||||
|
svg.select.js@2.1.2:
|
||||||
|
resolution: {integrity: sha512-tH6ABEyJsAOVAhwcCjF8mw4crjXSI1aa7j2VQR8ZuJ37H2MBUbyeqYr5nEO7sSN3cy9AR9DUwNg0t/962HlDbQ==}
|
||||||
|
engines: {node: '>= 0.8.0'}
|
||||||
|
|
||||||
|
svg.select.js@3.0.1:
|
||||||
|
resolution: {integrity: sha512-h5IS/hKkuVCbKSieR9uQCj9w+zLHoPh+ce19bBYyqF53g6mnPB8sAtIbe1s9dh2S2fCmYX2xel1Ln3PJBbK4kw==}
|
||||||
|
engines: {node: '>= 0.8.0'}
|
||||||
|
|
||||||
term-size@2.2.1:
|
term-size@2.2.1:
|
||||||
resolution: {integrity: sha512-wK0Ri4fOGjv/XPy8SBHZChl8CM7uMc5VML7SqiQ0zG7+J5Vr+RMQDoHa2CNT6KHUnTGIXH34UDMkPzAUyapBZg==}
|
resolution: {integrity: sha512-wK0Ri4fOGjv/XPy8SBHZChl8CM7uMc5VML7SqiQ0zG7+J5Vr+RMQDoHa2CNT6KHUnTGIXH34UDMkPzAUyapBZg==}
|
||||||
engines: {node: '>=8'}
|
engines: {node: '>=8'}
|
||||||
@@ -4695,25 +4695,6 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
escape-string-regexp: 5.0.0
|
escape-string-regexp: 5.0.0
|
||||||
|
|
||||||
'@svgdotjs/svg.draggable.js@3.0.6(@svgdotjs/svg.js@3.2.5)':
|
|
||||||
dependencies:
|
|
||||||
'@svgdotjs/svg.js': 3.2.5
|
|
||||||
|
|
||||||
'@svgdotjs/svg.filter.js@3.0.9':
|
|
||||||
dependencies:
|
|
||||||
'@svgdotjs/svg.js': 3.2.5
|
|
||||||
|
|
||||||
'@svgdotjs/svg.js@3.2.5': {}
|
|
||||||
|
|
||||||
'@svgdotjs/svg.resize.js@2.0.5(@svgdotjs/svg.js@3.2.5)(@svgdotjs/svg.select.js@4.0.3(@svgdotjs/svg.js@3.2.5))':
|
|
||||||
dependencies:
|
|
||||||
'@svgdotjs/svg.js': 3.2.5
|
|
||||||
'@svgdotjs/svg.select.js': 4.0.3(@svgdotjs/svg.js@3.2.5)
|
|
||||||
|
|
||||||
'@svgdotjs/svg.select.js@4.0.3(@svgdotjs/svg.js@3.2.5)':
|
|
||||||
dependencies:
|
|
||||||
'@svgdotjs/svg.js': 3.2.5
|
|
||||||
|
|
||||||
'@swc/helpers@0.2.14': {}
|
'@swc/helpers@0.2.14': {}
|
||||||
|
|
||||||
'@swc/helpers@0.5.15':
|
'@swc/helpers@0.5.15':
|
||||||
@@ -4800,14 +4781,15 @@ snapshots:
|
|||||||
normalize-path: 3.0.0
|
normalize-path: 3.0.0
|
||||||
picomatch: 2.3.1
|
picomatch: 2.3.1
|
||||||
|
|
||||||
apexcharts@5.3.6:
|
apexcharts@3.54.1:
|
||||||
dependencies:
|
dependencies:
|
||||||
'@svgdotjs/svg.draggable.js': 3.0.6(@svgdotjs/svg.js@3.2.5)
|
|
||||||
'@svgdotjs/svg.filter.js': 3.0.9
|
|
||||||
'@svgdotjs/svg.js': 3.2.5
|
|
||||||
'@svgdotjs/svg.resize.js': 2.0.5(@svgdotjs/svg.js@3.2.5)(@svgdotjs/svg.select.js@4.0.3(@svgdotjs/svg.js@3.2.5))
|
|
||||||
'@svgdotjs/svg.select.js': 4.0.3(@svgdotjs/svg.js@3.2.5)
|
|
||||||
'@yr/monotone-cubic-spline': 1.0.3
|
'@yr/monotone-cubic-spline': 1.0.3
|
||||||
|
svg.draggable.js: 2.2.2
|
||||||
|
svg.easing.js: 2.0.0
|
||||||
|
svg.filter.js: 2.0.2
|
||||||
|
svg.pathmorphing.js: 0.1.3
|
||||||
|
svg.resize.js: 1.4.3
|
||||||
|
svg.select.js: 3.0.1
|
||||||
|
|
||||||
argparse@1.0.10:
|
argparse@1.0.10:
|
||||||
dependencies:
|
dependencies:
|
||||||
@@ -4924,7 +4906,7 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
baseline-browser-mapping: 2.8.31
|
baseline-browser-mapping: 2.8.31
|
||||||
caniuse-lite: 1.0.30001757
|
caniuse-lite: 1.0.30001757
|
||||||
electron-to-chromium: 1.5.262
|
electron-to-chromium: 1.5.259
|
||||||
node-releases: 2.0.27
|
node-releases: 2.0.27
|
||||||
update-browserslist-db: 1.1.4(browserslist@4.28.0)
|
update-browserslist-db: 1.1.4(browserslist@4.28.0)
|
||||||
|
|
||||||
@@ -5197,8 +5179,6 @@ snapshots:
|
|||||||
|
|
||||||
dotenv@8.6.0: {}
|
dotenv@8.6.0: {}
|
||||||
|
|
||||||
driver.js@1.4.0: {}
|
|
||||||
|
|
||||||
dropzone@6.0.0-beta.2:
|
dropzone@6.0.0-beta.2:
|
||||||
dependencies:
|
dependencies:
|
||||||
'@swc/helpers': 0.2.14
|
'@swc/helpers': 0.2.14
|
||||||
@@ -5230,7 +5210,7 @@ snapshots:
|
|||||||
|
|
||||||
electron-to-chromium@1.5.149: {}
|
electron-to-chromium@1.5.149: {}
|
||||||
|
|
||||||
electron-to-chromium@1.5.262: {}
|
electron-to-chromium@1.5.259: {}
|
||||||
|
|
||||||
emoji-regex@8.0.0: {}
|
emoji-regex@8.0.0: {}
|
||||||
|
|
||||||
@@ -5962,7 +5942,7 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
'@next/env': 16.0.4
|
'@next/env': 16.0.4
|
||||||
'@swc/helpers': 0.5.15
|
'@swc/helpers': 0.5.15
|
||||||
caniuse-lite: 1.0.30001717
|
caniuse-lite: 1.0.30001757
|
||||||
postcss: 8.4.31
|
postcss: 8.4.31
|
||||||
react: 19.2.0
|
react: 19.2.0
|
||||||
react-dom: 19.2.0(react@19.2.0)
|
react-dom: 19.2.0(react@19.2.0)
|
||||||
@@ -6709,6 +6689,37 @@ snapshots:
|
|||||||
|
|
||||||
supports-preserve-symlinks-flag@1.0.0: {}
|
supports-preserve-symlinks-flag@1.0.0: {}
|
||||||
|
|
||||||
|
svg.draggable.js@2.2.2:
|
||||||
|
dependencies:
|
||||||
|
svg.js: 2.7.1
|
||||||
|
|
||||||
|
svg.easing.js@2.0.0:
|
||||||
|
dependencies:
|
||||||
|
svg.js: 2.7.1
|
||||||
|
|
||||||
|
svg.filter.js@2.0.2:
|
||||||
|
dependencies:
|
||||||
|
svg.js: 2.7.1
|
||||||
|
|
||||||
|
svg.js@2.7.1: {}
|
||||||
|
|
||||||
|
svg.pathmorphing.js@0.1.3:
|
||||||
|
dependencies:
|
||||||
|
svg.js: 2.7.1
|
||||||
|
|
||||||
|
svg.resize.js@1.4.3:
|
||||||
|
dependencies:
|
||||||
|
svg.js: 2.7.1
|
||||||
|
svg.select.js: 2.1.2
|
||||||
|
|
||||||
|
svg.select.js@2.1.2:
|
||||||
|
dependencies:
|
||||||
|
svg.js: 2.7.1
|
||||||
|
|
||||||
|
svg.select.js@3.0.1:
|
||||||
|
dependencies:
|
||||||
|
svg.js: 2.7.1
|
||||||
|
|
||||||
term-size@2.2.1: {}
|
term-size@2.2.1: {}
|
||||||
|
|
||||||
terser@5.44.0:
|
terser@5.44.0:
|
||||||
|
|||||||
@@ -11,7 +11,6 @@ const illustrations = sync(join(__dirname, `../../shared/static/illustrations/li
|
|||||||
.map((file) => {
|
.map((file) => {
|
||||||
return basename(file, '.png')
|
return basename(file, '.png')
|
||||||
})
|
})
|
||||||
.sort((a, b) => a.localeCompare(b));
|
|
||||||
|
|
||||||
writeFileSync(
|
writeFileSync(
|
||||||
join(__dirname, `../../shared/data/illustrations.json`),
|
join(__dirname, `../../shared/data/illustrations.json`),
|
||||||
|
|||||||
@@ -3,8 +3,7 @@
|
|||||||
"version": "1.4.0",
|
"version": "1.4.0",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"build": "pnpm run clean && pnpm run build-assets && pnpm run html",
|
"build": "pnpm run clean && pnpm run css && pnpm run js && pnpm run html",
|
||||||
"build-assets": "concurrently \"pnpm run css\" \"pnpm run js\"",
|
|
||||||
"dev": "pnpm run clean && pnpm run watch",
|
"dev": "pnpm run clean && pnpm run watch",
|
||||||
"watch": "concurrently \"pnpm run watch-html\" \"pnpm run watch-css\" \"pnpm run watch-js\"",
|
"watch": "concurrently \"pnpm run watch-html\" \"pnpm run watch-css\" \"pnpm run watch-js\"",
|
||||||
"watch-html": "cross-env NODE_ENV=development eleventy --serve --port=3000 --watch --incremental",
|
"watch-html": "cross-env NODE_ENV=development eleventy --serve --port=3000 --watch --incremental",
|
||||||
|
|||||||
@@ -714,22 +714,25 @@ permalink: all-elements.html
|
|||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<h4>Basic Segmented</h4>
|
<h4>Basic Segmented</h4>
|
||||||
<div class="mb-3">
|
<div class="mb-3">
|
||||||
{% include "ui/nav-segmented.html" items="Home,Profile,Settings" %}
|
{% include "ui/nav-segmented.html" %}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h4>With Icons</h4>
|
<h4>With Icons</h4>
|
||||||
<div class="mb-3">
|
<div class="mb-3">
|
||||||
{% include "ui/nav-segmented.html" icons="home,user,settings" %}
|
<nav class="nav nav-segmented" role="tablist">
|
||||||
</div>
|
<button class="nav-link active" role="tab">
|
||||||
|
{% include "ui/icon.html" icon="home" class="nav-link-icon" %}
|
||||||
<h4>With Emojis</h4>
|
Home
|
||||||
<div class="mb-3">
|
</button>
|
||||||
{% include "ui/nav-segmented.html" items="👦,👦🏿,👦🏾,👦🏽,👦🏼,👦🏻" %}
|
<button class="nav-link" role="tab">
|
||||||
</div>
|
{% include "ui/icon.html" icon="user" class="nav-link-icon" %}
|
||||||
|
Profile
|
||||||
<h4>With Icons and Text</h4>
|
</button>
|
||||||
<div class="mb-3">
|
<button class="nav-link" role="tab">
|
||||||
{% include "ui/nav-segmented.html" items="Home,Profile,Settings" icons="home,user,settings" %}
|
{% include "ui/icon.html" icon="settings" class="nav-link-icon" %}
|
||||||
|
Settings
|
||||||
|
</button>
|
||||||
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,97 +0,0 @@
|
|||||||
---
|
|
||||||
title: Card Gradients
|
|
||||||
page-header: Card Gradients
|
|
||||||
page-menu: base.cards.gradients
|
|
||||||
layout: default
|
|
||||||
permalink: card-gradients.html
|
|
||||||
page-libs: [apexcharts]
|
|
||||||
---
|
|
||||||
|
|
||||||
{% assign gradients = 'sunset,rainbow,ocean,mellow,disco,psychedelic' | split: ',' %}
|
|
||||||
|
|
||||||
<div class="row row-cards">
|
|
||||||
<div class="col-md-6">
|
|
||||||
<div class="row row-cards">
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/welcome.html" %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-6">
|
|
||||||
<div class="row row-cards">
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/delete-confirm.html" %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/success-message.html" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-6">
|
|
||||||
<div class="row row-cards">
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/pricing-plan.html" %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/stat-gradient.html" title="Earned" value="$2,847" icon="credit-card" color="success"
|
|
||||||
progress=75 %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/stat-gradient.html" title="Pending Orders" value="47" icon="clock" color="yellow"
|
|
||||||
progress=38 %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/stat-gradient.html" title="Cancelled Orders" value="12" icon="shopping-cart-x" color="red"
|
|
||||||
progress=8 %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-3">
|
|
||||||
<div class="row row-cards">
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/happy-birthday.html" %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/you-win.html" %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-3">
|
|
||||||
<div class="row row-cards">
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/weather.html" city="Warsaw, PL" temperature=3 color="rain" icon="cloud-rain"
|
|
||||||
description="Cloudy morning" %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/weather.html" city="Oslo, NO" temperature="-5" color="snow" icon="cloud"
|
|
||||||
description="Snowy day" %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/weather.html" city="Dubai, AE" temperature="32" color="sun" icon="sun" description="Sunny
|
|
||||||
day" %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/profile-contact.html" person=people[6] %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/small-stats.html" chart-type="line" chart-data="11,16,13,20,17,24,19,23,16,20,13,17,11,19"
|
|
||||||
color="primary" id="chart1" class="card-gradient card-gradient-end card-gradient-primary" %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/small-stats.html" id="sales" icon="arrow-up" color="green" title="$5,256.99"
|
|
||||||
description="Revenue last 30 days" description-value="+4%" class="card-gradient card-gradient-end
|
|
||||||
card-gradient-green" %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "cards/small-stats.html" id="orders" icon="arrow-down" color="red" title="342" description="Sales
|
|
||||||
last 30 days" description-value="-4.3%" description-value-color="red" class="card-gradient card-gradient-end
|
|
||||||
card-gradient-red" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@@ -108,7 +108,17 @@ permalink: cards.html
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-6 col-lg-3">
|
<div class="col-md-6 col-lg-3">
|
||||||
{% include "cards/card-background-icon.html" %}
|
<div class="card bg-primary text-primary-fg">
|
||||||
|
<div class="card-stamp">
|
||||||
|
<div class="card-stamp-icon bg-white text-primary">
|
||||||
|
{% include "ui/icon.html" icon="star" %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<h3 class="card-title">Card with background and icon</h3>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto at consectetur culpa ducimus eum fuga fugiat, ipsa iusto, modi nostrum recusandae reiciendis saepe.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-6 col-lg-3">
|
<div class="col-md-6 col-lg-3">
|
||||||
{% include "cards/card.html" status-top="danger" title="Card with top status" %}
|
{% include "cards/card.html" status-top="danger" title="Card with top status" %}
|
||||||
@@ -121,10 +131,22 @@ permalink: cards.html
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-md-6 col-lg-3">
|
<div class="col-md-6 col-lg-3">
|
||||||
{% include "cards/card-ribbon-top.html" %}
|
<div class="card">
|
||||||
|
<div class="ribbon ribbon-top bg-yellow">{% include "ui/icon.html" icon="star" %}</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<h3 class="card-title">Card with top ribbon</h3>
|
||||||
|
<p class="text-secondary">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto at consectetur culpa ducimus eum fuga fugiat, ipsa iusto, modi nostrum recusandae reiciendis saepe.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-6 col-lg-3">
|
<div class="col-md-6 col-lg-3">
|
||||||
{% include "cards/card-ribbon-text.html" %}
|
<div class="card">
|
||||||
|
<div class="ribbon bg-red">NEW</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<h3 class="card-title">Card with text ribbon</h3>
|
||||||
|
<p class="text-secondary">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto at consectetur culpa ducimus eum fuga fugiat, ipsa iusto, modi nostrum recusandae reiciendis saepe.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-6 col-lg-3">
|
<div class="col-md-6 col-lg-3">
|
||||||
{% include "cards/card.html" progress=true title="Card with progress bar" %}
|
{% include "cards/card.html" progress=true title="Card with progress bar" %}
|
||||||
@@ -177,8 +199,8 @@ permalink: cards.html
|
|||||||
|
|
||||||
<div class="col-md-6 col-lg-4">{% include "cards/card.html" header-tabs=true %}</div>
|
<div class="col-md-6 col-lg-4">{% include "cards/card.html" header-tabs=true %}</div>
|
||||||
<div class="col-md-6 col-lg-4">{% include "cards/card.html" header-pills=true %}</div>
|
<div class="col-md-6 col-lg-4">{% include "cards/card.html" header-pills=true %}</div>
|
||||||
<div class="col-md-6 col-lg-4">{% include "cards/card-tabs.html" %}</div>
|
<div class="col-md-6 col-lg-4">{% include "cards/card-tabs.html" count=4 %}</div>
|
||||||
<div class="col-md-6 col-lg-4">{% include "cards/card-tabs.html" bottom=true id="bottom" %}</div>
|
<div class="col-md-6 col-lg-4">{% include "cards/card-tabs.html" count=4 bottom=true id="bottom" %}</div>
|
||||||
|
|
||||||
|
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
@@ -256,6 +278,5 @@ permalink: cards.html
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-lg-4">{% include "cards/card.html" empty=true %}</div>
|
<div class="col-lg-4">{% include "cards/card.html" empty=true %}</div>
|
||||||
<div class="col-lg-4">{% include "cards/empty-team.html" %}</div>
|
|
||||||
<div class="col-lg-4">{% include "cards/credit-card.html" %}</div>
|
<div class="col-lg-4">{% include "cards/credit-card.html" %}</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -13,7 +13,17 @@ permalink: charts.html
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
{% include "cards/charts/social-referrals.html" %}
|
<div class="card">
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="d-flex">
|
||||||
|
<h3 class="card-title">Social referrals</h3>
|
||||||
|
<div class="ms-auto">
|
||||||
|
{% include "parts/dropdown/days.html" id="social-referrals" label="Select time range for sales data" %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% include "ui/chart.html" chart-id="social-referrals" legend=true %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
|
|||||||
@@ -21,7 +21,7 @@ permalink: colors.html
|
|||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<div class="row align-items-center">
|
<div class="row align-items-center">
|
||||||
<div class="col-auto">
|
<div class="col-auto">
|
||||||
<div class="avatar bg-{{ color[0] }} text-{{ color[0] }}-fg avatar-square">
|
<div class="avatar bg-{{ color[0] }} text-{{ color[0] }}-fg">
|
||||||
{{ color[1].abbr }}
|
{{ color[1].abbr }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -44,7 +44,7 @@ permalink: colors.html
|
|||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<div class="row align-items-center">
|
<div class="row align-items-center">
|
||||||
<div class="col-auto">
|
<div class="col-auto">
|
||||||
<div class="avatar bg-{{ color[0] }}-lt text-{{ color[0] }}-lt-fg avatar-square">
|
<div class="avatar bg-{{ color[0] }}-lt text-{{ color[0] }}-lt-fg">
|
||||||
{{ color[1].abbr }}
|
{{ color[1].abbr }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -67,7 +67,7 @@ permalink: colors.html
|
|||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<div class="row align-items-center">
|
<div class="row align-items-center">
|
||||||
<div class="col-auto">
|
<div class="col-auto">
|
||||||
<div class="avatar bg-{{ color[0] }} text-{{ color[0] }}-fg avatar-square">
|
<div class="avatar bg-{{ color[0] }} text-{{ color[0] }}-fg">
|
||||||
{{ color[1].abbr }}
|
{{ color[1].abbr }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -90,7 +90,7 @@ permalink: colors.html
|
|||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<div class="row align-items-center">
|
<div class="row align-items-center">
|
||||||
<div class="col-auto">
|
<div class="col-auto">
|
||||||
<div class="avatar bg-{{ color[0] }} text-{{ color[0] }}-fg avatar-square">
|
<div class="avatar bg-{{ color[0] }} text-{{ color[0] }}-fg">
|
||||||
{% include "ui/icon.html" icon=color[1].icon %}
|
{% include "ui/icon.html" icon=color[1].icon %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ permalink: form-layout.html
|
|||||||
page-libs: [litepicker]
|
page-libs: [litepicker]
|
||||||
---
|
---
|
||||||
|
|
||||||
<div class="row row-cards row-cols-1 row-cols-md-3">
|
<div class="row row-cards row-cols-1 row-cols-md-2">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<div class="row row-cards">
|
<div class="row row-cards">
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
@@ -360,8 +360,4 @@ page-libs: [litepicker]
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col">
|
|
||||||
{% include "cards/form/payment.html" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
@@ -6,8 +6,6 @@ layout: default
|
|||||||
permalink: logs.html
|
permalink: logs.html
|
||||||
---
|
---
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-6">
|
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<h4>
|
<h4>
|
||||||
@@ -32,37 +30,3 @@ permalink: logs.html
|
|||||||
<div>Entire team</div>
|
<div>Entire team</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<div class="col-lg-6">
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-body">
|
|
||||||
<h4>
|
|
||||||
Application Log
|
|
||||||
</h4>
|
|
||||||
<div>
|
|
||||||
<pre><code>2024-01-15 14:23:45 [INFO] Application started successfully
|
|
||||||
2024-01-15 14:23:46 [DEBUG] Database connection established
|
|
||||||
2024-01-15 14:23:47 [INFO] User authentication successful: user_id=12345
|
|
||||||
2024-01-15 14:23:48 [WARNING] Rate limit approaching: 85% of quota used
|
|
||||||
2024-01-15 14:23:49 [ERROR] Failed to process payment: transaction_id=tx_789
|
|
||||||
2024-01-15 14:23:50 [INFO] Cache cleared: keys=1523
|
|
||||||
2024-01-15 14:23:51 [DEBUG] API request completed: endpoint=/api/users, duration=234ms</code></pre>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<h4>Log Levels</h4>
|
|
||||||
<div>
|
|
||||||
<div class="mb-2">
|
|
||||||
{% include "ui/badge.html" text="INFO" color="success" %}
|
|
||||||
{% include "ui/badge.html" text="WARNING" color="warning" %}
|
|
||||||
{% include "ui/badge.html" text="ERROR" color="disabled" %}
|
|
||||||
{% include "ui/badge.html" text="DEBUG" color="disabled" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
<h4>Log Source</h4>
|
|
||||||
<div>Application Server (prod-01)</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|||||||
@@ -1,223 +0,0 @@
|
|||||||
---
|
|
||||||
title: Driver Tour
|
|
||||||
page-header: Driver Tour
|
|
||||||
page-libs: [driver.js]
|
|
||||||
page-menu: plugins.tour
|
|
||||||
layout: default
|
|
||||||
permalink: tour.html
|
|
||||||
---
|
|
||||||
|
|
||||||
<div class="row row-cards">
|
|
||||||
<div class="col-12">
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-header">
|
|
||||||
<h3 class="card-title">Product Tour Example</h3>
|
|
||||||
<div class="card-actions">
|
|
||||||
{% include "ui/button.html" id="start-tour" text="Start Tour" icon="play" color="primary" element="button" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-body">
|
|
||||||
<p>
|
|
||||||
Click the "Start Tour" button to begin an interactive tour of this page.
|
|
||||||
The tour will guide you through different elements and features.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-6">
|
|
||||||
<div class="card" id="tour-card-1">
|
|
||||||
<div class="card-header">
|
|
||||||
<h3 class="card-title">Welcome Section</h3>
|
|
||||||
</div>
|
|
||||||
<div class="card-body">
|
|
||||||
<p>This is the first card in our tour. It demonstrates how Driver.js highlights elements on the page.</p>
|
|
||||||
<div class="btn-list">
|
|
||||||
{% include "ui/button.html" text="Action Button" color="primary" element="button" %}
|
|
||||||
{% include "ui/button.html" text="Secondary" element="button" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-md-6">
|
|
||||||
<div class="card" id="tour-card-2">
|
|
||||||
<div class="card-header">
|
|
||||||
<h3 class="card-title">Features Section</h3>
|
|
||||||
</div>
|
|
||||||
<div class="card-body">
|
|
||||||
<p>This card shows additional features and demonstrates the tour's ability to navigate between different
|
|
||||||
elements.</p>
|
|
||||||
<div class="form-selectgroup">
|
|
||||||
<label class="form-selectgroup-item">
|
|
||||||
<input type="radio" name="options" value="1" class="form-selectgroup-input" checked>
|
|
||||||
<span class="form-selectgroup-label">Option 1</span>
|
|
||||||
</label>
|
|
||||||
<label class="form-selectgroup-item">
|
|
||||||
<input type="radio" name="options" value="2" class="form-selectgroup-input">
|
|
||||||
<span class="form-selectgroup-label">Option 2</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
<div class="card" id="tour-card-3">
|
|
||||||
<div class="card-header">
|
|
||||||
<h3 class="card-title">Navigation Example</h3>
|
|
||||||
</div>
|
|
||||||
<div class="card-body">
|
|
||||||
<p>This is a full-width card that demonstrates how the tour works with larger elements.</p>
|
|
||||||
<div class="table-responsive">
|
|
||||||
<table class="table table-vcenter">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>Name</th>
|
|
||||||
<th>Status</th>
|
|
||||||
<th>Role</th>
|
|
||||||
<th class="w-1"></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td>John Doe</td>
|
|
||||||
<td>{% include "ui/badge.html" text="Active" color="success" %}</td>
|
|
||||||
<td>Developer</td>
|
|
||||||
<td>
|
|
||||||
{% include "ui/button.html" text="Edit" size="sm" href="#" %}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>Jane Smith</td>
|
|
||||||
<td>{% include "ui/badge.html" text="Pending" color="warning" %}</td>
|
|
||||||
<td>Designer</td>
|
|
||||||
<td>
|
|
||||||
{% include "ui/button.html" text="Edit" size="sm" href="#" %}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-md-4">
|
|
||||||
<div class="card" id="tour-card-4">
|
|
||||||
<div class="card-body text-center">
|
|
||||||
<div class="mb-3">
|
|
||||||
{% include "ui/icon.html" icon="settings" size="48" %}
|
|
||||||
</div>
|
|
||||||
<h3 class="card-title">Settings</h3>
|
|
||||||
<p class="text-secondary">Configure your application settings here.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-md-4">
|
|
||||||
<div class="card" id="tour-card-5">
|
|
||||||
<div class="card-body text-center">
|
|
||||||
<div class="mb-3">
|
|
||||||
{% include "ui/icon.html" icon="users" size="48" %}
|
|
||||||
</div>
|
|
||||||
<h3 class="card-title">Users</h3>
|
|
||||||
<p class="text-secondary">Manage your team members and permissions.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-md-4">
|
|
||||||
<div class="card" id="tour-card-6">
|
|
||||||
<div class="card-body text-center">
|
|
||||||
<div class="mb-3">
|
|
||||||
{% include "ui/icon.html" icon="chart-bar" size="48" %}
|
|
||||||
</div>
|
|
||||||
<h3 class="card-title">Analytics</h3>
|
|
||||||
<p class="text-secondary">View your application statistics and reports.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const driverObj = driver.js.driver({
|
|
||||||
allowClose: true,
|
|
||||||
overlayClickNext: true,
|
|
||||||
showButtons: ['next', 'previous', 'close'],
|
|
||||||
showProgress: true,
|
|
||||||
steps: [
|
|
||||||
{
|
|
||||||
element: '#start-tour',
|
|
||||||
popover: {
|
|
||||||
title: 'Welcome to the Tour!',
|
|
||||||
description: 'This button starts the interactive tour. Click it to begin exploring the page.',
|
|
||||||
side: 'bottom',
|
|
||||||
align: 'start'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
element: '#tour-card-1',
|
|
||||||
popover: {
|
|
||||||
title: 'Welcome Section',
|
|
||||||
description: 'This is the first card in our tour. It demonstrates how Driver.js highlights elements on the page.',
|
|
||||||
side: 'right',
|
|
||||||
align: 'start'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
element: '#tour-card-2',
|
|
||||||
popover: {
|
|
||||||
title: 'Features Section',
|
|
||||||
description: 'This card shows additional features and demonstrates the tour\'s ability to navigate between different elements.',
|
|
||||||
side: 'left',
|
|
||||||
align: 'start'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
element: '#tour-card-3',
|
|
||||||
popover: {
|
|
||||||
title: 'Data Table',
|
|
||||||
description: 'This table shows how Driver.js works with larger elements. You can highlight entire sections of your page.',
|
|
||||||
side: 'top',
|
|
||||||
align: 'center'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
element: '#tour-card-4',
|
|
||||||
popover: {
|
|
||||||
title: 'Settings Card',
|
|
||||||
description: 'This card demonstrates how the tour works with smaller, centered elements.',
|
|
||||||
side: 'top',
|
|
||||||
align: 'center'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
element: '#tour-card-5',
|
|
||||||
popover: {
|
|
||||||
title: 'Users Card',
|
|
||||||
description: 'Another example card showing user management features.',
|
|
||||||
side: 'top',
|
|
||||||
align: 'center'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
element: '#tour-card-6',
|
|
||||||
popover: {
|
|
||||||
title: 'Analytics Card',
|
|
||||||
description: 'The final step of the tour. This card shows analytics features.',
|
|
||||||
side: 'top',
|
|
||||||
align: 'center'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
const startButton = document.getElementById('start-tour');
|
|
||||||
if (startButton) {
|
|
||||||
startButton.addEventListener('click', function () {
|
|
||||||
driverObj.drive();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
@@ -1 +1 @@
|
|||||||
["403","500","504","ai","archive","bad-news","bicycle","boy","boy-and-cat","boy-and-laptop","boy-girl","boy-gives-flowers","boy-refresh","boy-with-key","building","calendar","camping","cat","chart","chart-circle","chatbot","chill","chill-sofa","christmas-fireplace","christmas-gifts","christmas-tree","clock-and-cat","computer-fix","contract","conversation","dance","dart","discount","download","easter-bunny","easter-egg","electric-scooter","email","error","exit","fingerprint","flowers","folders","game","ghost","ghost-2","gift","girl-phone","girl-refresh","good-info","good-news","graduation","guitar","halloween","halloween-pumpkin","hybrid-work","ice-skates","icons","icons-drawing","icons-drawing-run","icons-ladder","icons-production","icons-workshop","kite","loading","map-destination","message","mobile-computer","morning","music","neutral-info","new-year","new-year-2","not-found","painting","payment","podcast","printer","project","reading","search","searching-for-a-signal","shield","shopping","snowman","telescope","tiredness","to-do","valentines-day-gift","valentines-day-heart","valentines-day-love","vampire","version-control","video","vr","wait","weightlifting","welcome-on-board","witch","witch-2"]
|
["weightlifting","wait","vr","video","valentines-day-love","valentines-day-heart","valentines-day-gift","to-do","tiredness","telescope","snowman","shopping","shield","searching-for-a-signal","search","project","printer","podcast","payment","painting","not-found","new-year","new-year-2","neutral-info","music","morning","mobile-computer","message","map-destination","loading","kite","icons","icons-workshop","icons-production","icons-ladder","icons-drawing","icons-drawing-run","ice-skates","hybrid-work","halloween-pumpkin","guitar","good-news","good-info","girl-refresh","girl-phone","gift","ghost","folders","flowers","fingerprint","exit","error","email","electric-scooter","easter-egg","easter-bunny","discount","dart","dance","conversation","computer-fix","clock-and-cat","christmas-tree","christmas-gifts","christmas-fireplace","chill","chill-sofa","chart","chart-circle","cat","calendar","building","boy","boy-with-key","boy-refresh","boy-gives-flowers","boy-girl","boy-and-laptop","boy-and-cat","bicycle","bad-news","archive","ai","500","403"]
|
||||||
@@ -105,11 +105,6 @@
|
|||||||
"title": "Card actions",
|
"title": "Card actions",
|
||||||
"badge": "New"
|
"badge": "New"
|
||||||
},
|
},
|
||||||
"gradients": {
|
|
||||||
"url": "card-gradients.html",
|
|
||||||
"title": "Card gradients",
|
|
||||||
"badge": "New"
|
|
||||||
},
|
|
||||||
"masonry": {
|
"masonry": {
|
||||||
"url": "cards-masonry.html",
|
"url": "cards-masonry.html",
|
||||||
"title": "Cards Masonry"
|
"title": "Cards Masonry"
|
||||||
@@ -479,10 +474,6 @@
|
|||||||
"url": "maps-vector.html",
|
"url": "maps-vector.html",
|
||||||
"title": "Map vector"
|
"title": "Map vector"
|
||||||
},
|
},
|
||||||
"tour": {
|
|
||||||
"url": "tour.html",
|
|
||||||
"title": "Tour"
|
|
||||||
},
|
|
||||||
"turbo": {
|
"turbo": {
|
||||||
"url": "turbo-loader.html",
|
"url": "turbo-loader.html",
|
||||||
"title": "Turbo loader"
|
"title": "Turbo loader"
|
||||||
|
|||||||
@@ -1,21 +1,21 @@
|
|||||||
{
|
{
|
||||||
"css": "sha384-8CTJ1aEYI+cbgqgYVub8YVfKOnKa/men0DZ4qZqmwvgzNGG1/anW0L4o7/8G171h",
|
"css": "sha384-b08Yxo9kzlsLLcHA4bMBkC8EAIBeP3G8rhhIT584owzLn88bcWJkSVtGZMc78Rax",
|
||||||
"css-rtl": "sha384-c4pkMIjCDw9LwOOYLU2NkDMg4rsDpqEj+xqDXhrTVRtDiAvk2083ZRDsxMOl9Qpw",
|
"css-rtl": "sha384-EVH/sV9+QVa/y7Vl1JFsVYjru0/gKkqDf8zBqdfu2R8t84BwCBeV7jsu7kQ93abg",
|
||||||
"css-flags": "sha384-Z+NVuLczJm4wqbXhRrVWeCqKJzY3VmwtOZTMpek7tjmZJU9Yqu+6F7aPT0KDBTvS",
|
"css-flags": "sha384-kmvP0hkBXZ2hMSZlbvE1Q2HIXzPCQRL3ijUeqNiwaPd2nl2Aks+s3gW+V5fAHOX9",
|
||||||
"css-flags-rtl": "sha384-9zdt+TQAk+aAdQAyWQ158584Cr9KDLcgJMDG5iDvrYE2Ha/sZdG6l3FcjWyHAFx8",
|
"css-flags-rtl": "sha384-Q/h6koANGclsGnwB8rvF8h84H54NKHDeNWFj6yiE4WLLEXyHcz+Zu6Afkh2ssYTC",
|
||||||
"css-marketing": "sha384-O1oTT08rQgRZEq0WgPfYFyGadtTu90+tM9zTv+9yYv1qgNw8ldbGTr6levIIXXNl",
|
"css-marketing": "sha384-4dAlYnPzCom9yeC/5++PFq2FG/szJRlUPsDSrjZ3EWP8IAzK7g7rrsnSfqrS67Se",
|
||||||
"css-marketing-rtl": "sha384-jU6iDpXSyHHkiqBvDtPRuDWr+4ccgr3SNjNYMN0FtyaDaIi4Qe6WNn5Ir1+jr/aZ",
|
"css-marketing-rtl": "sha384-c6gNhuNYjp+lqluSdArbL8ciLEBq7IVU00XnPM2Eogj8RAjMapccvOM/pGhk3vV6",
|
||||||
"css-payments": "sha384-xWIXbKxPLGG/ZEGUKxDjJn3xmUgd2PC2CSZUKJ4PyTse49DiuvJx2WT5wSNJRyw9",
|
"css-payments": "sha384-xWIXbKxPLGG/ZEGUKxDjJn3xmUgd2PC2CSZUKJ4PyTse49DiuvJx2WT5wSNJRyw9",
|
||||||
"css-payments-rtl": "sha384-69CxgA+uEPtM07SLA8MMAdnBmwtVGndDJf8nIPdfvNrDayBfPqOK3wS3nvV5yyk+",
|
"css-payments-rtl": "sha384-69CxgA+uEPtM07SLA8MMAdnBmwtVGndDJf8nIPdfvNrDayBfPqOK3wS3nvV5yyk+",
|
||||||
"css-socials": "sha384-eWmz8gyiLzrDw3JcT/PJxjGyKizQjvByfHqocjrMMkIrbKFCnOuP/qMwAz3bHmsC",
|
"css-socials": "sha384-eWmz8gyiLzrDw3JcT/PJxjGyKizQjvByfHqocjrMMkIrbKFCnOuP/qMwAz3bHmsC",
|
||||||
"css-socials-rtl": "sha384-yobKDIyTOxB1z7t/uZ2ImuXrcKWF24vDYg2vR1n7x2msF09iWnvyIxQtfEl9+OFl",
|
"css-socials-rtl": "sha384-yobKDIyTOxB1z7t/uZ2ImuXrcKWF24vDYg2vR1n7x2msF09iWnvyIxQtfEl9+OFl",
|
||||||
"css-props": "sha384-41GCSlvwCdfsb6AHZx7QXQq17CAqXvvToJCecMxqvUUsap3aYqIvR3ARxb5ug/o7",
|
"css-props": "sha384-HpzBfAj1xJcNLtdedYZunJBHqgdO12KqrCrc6/7pmKDiP8YmUF71cm+iGBtVawWM",
|
||||||
"css-props-rtl": "sha384-JgFdeK5dAxT/nZPtUTt3cnBng9TLxoF6ZetumffFIzqF/4XXLEQIemFDshpleF/f",
|
"css-props-rtl": "sha384-/vKK+yuQsAI8lJmR4uothydKQAHFK+fp1QrbJnfk2deAzII9WUj3h5rXUxZPyUAo",
|
||||||
"css-themes": "sha384-jTe/MdN6BlY4S3eYe6Qw++yTjuezmVnxWp/l7GAG1qXGC+jttphHqsAN/bGPvJOk",
|
"css-themes": "sha384-jTe/MdN6BlY4S3eYe6Qw++yTjuezmVnxWp/l7GAG1qXGC+jttphHqsAN/bGPvJOk",
|
||||||
"css-themes-rtl": "sha384-WTp4aZ+OGqnkNR6Xe0sJwwfd0JHGq3dZTLU2ITKxTK2zjcJTBUMY/+Z4eXgm8ipF",
|
"css-themes-rtl": "sha384-WTp4aZ+OGqnkNR6Xe0sJwwfd0JHGq3dZTLU2ITKxTK2zjcJTBUMY/+Z4eXgm8ipF",
|
||||||
"css-vendors-rtl": "sha384-fHhTRXlGYaUjLAbSnADjVs2DrSBSKbnTDhjiOgVT0+aWDjKbwtPZU6y54bLo2FCm",
|
"css-vendors-rtl": "sha384-V555LUGE2xyN4wNbzdVMgsajsKmJdlLFm20Ws72jEyPiSsTXXITV0PebNzVeBjnb",
|
||||||
"css-vendors": "sha384-9R1luLy+gN6Ob3LEWsGiGo3nyPVDzVGyEBcDlat6sH2lF7zHZhnpDILTEgEvalsh",
|
"css-vendors": "sha384-+X7+c/noY2B9ieq9daEaVStkUhIFyJTO5T6Occ6jZisx57sbECetvloLqcvGahUv",
|
||||||
"js": "sha384-dUqGQ2Iu2WGMnF+glqmZxV78vxbRuwGaM3diaq+Wp0a6mek1k5samXVe60XqZcTT",
|
"js": "sha384-pku3birjgGovaJ9ngF7SaxKkF/eYUvBjiMJ+jTtWbNesIj2Rud2K63+4JD7EF4gk",
|
||||||
"js-theme": "sha384-SoDJmj40r6f9Rfxi6Fq+bNS8ofhlZMyxHk9dq9Y8e1M17PZGkBRN/XUpx8swn0i5",
|
"js-theme": "sha384-SoDJmj40r6f9Rfxi6Fq+bNS8ofhlZMyxHk9dq9Y8e1M17PZGkBRN/XUpx8swn0i5",
|
||||||
"demo-css": "sha384-BUDq2P684xwRBf0GDlySvob+KJg4ko8y2K7njgvYBscmEuqoVVqJ75zcTDozwkFA",
|
"demo-css": "sha384-BUDq2P684xwRBf0GDlySvob+KJg4ko8y2K7njgvYBscmEuqoVVqJ75zcTDozwkFA",
|
||||||
"demo-js": "sha384-UcTgbM9IZSOPHHuFa0R9H4TegQWoZkJKpeTjLV5hjem2k0CZ67Q4/bW2rT/Edf4Z"
|
"demo-js": "sha384-UcTgbM9IZSOPHHuFa0R9H4TegQWoZkJKpeTjLV5hjem2k0CZ67Q4/bW2rT/Edf4Z"
|
||||||
|
|||||||
@@ -1,16 +1,10 @@
|
|||||||
import { readFileSync } from "fs";
|
import { readFileSync } from "fs";
|
||||||
import { join, dirname } from "path";
|
import { join } from "path";
|
||||||
|
|
||||||
import { fileURLToPath } from "url";
|
|
||||||
|
|
||||||
export function appData(eleventyConfig) {
|
export function appData(eleventyConfig) {
|
||||||
const currentDir = dirname(fileURLToPath(import.meta.url));
|
eleventyConfig.addGlobalData("package", JSON.parse(readFileSync(join("..", "core", "package.json"), "utf-8")));
|
||||||
|
eleventyConfig.addGlobalData("changelog", readFileSync(join("..", "core", "CHANGELOG.md"), "utf-8"));
|
||||||
console.log('currentDir', currentDir);
|
eleventyConfig.addGlobalData("libs", JSON.parse(readFileSync(join("..", "core", "libs.json"), "utf-8")));
|
||||||
|
|
||||||
eleventyConfig.addGlobalData("package", JSON.parse(readFileSync(join(currentDir, "..", "..", "core", "package.json"), "utf-8"))) ;
|
|
||||||
eleventyConfig.addGlobalData("changelog", readFileSync(join(currentDir, "..", "..", "core", "CHANGELOG.md"), "utf-8"));
|
|
||||||
eleventyConfig.addGlobalData("libs", JSON.parse(readFileSync(join(currentDir, "..", "..", "core", "libs.json"), "utf-8")));
|
|
||||||
|
|
||||||
// Analytics Environment Variables
|
// Analytics Environment Variables
|
||||||
eleventyConfig.addGlobalData("posthogApiKey", process.env.NEXT_PUBLIC_POSTHOG_KEY);
|
eleventyConfig.addGlobalData("posthogApiKey", process.env.NEXT_PUBLIC_POSTHOG_KEY);
|
||||||
|
|||||||
@@ -29,6 +29,14 @@ export function appFilters(eleventyConfig) {
|
|||||||
.replace(/[\r\n]/g, ' ');
|
.replace(/[\r\n]/g, ' ');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
eleventyConfig.addFilter("strip_trailing_slash", (text) => {
|
||||||
|
return text?.replace(/\/$/, '');
|
||||||
|
});
|
||||||
|
|
||||||
|
eleventyConfig.addFilter("strip_leading_slash", (text) => {
|
||||||
|
return text?.replace(/^\//, '');
|
||||||
|
});
|
||||||
|
|
||||||
eleventyConfig.addFilter("contains", (items, item) => {
|
eleventyConfig.addFilter("contains", (items, item) => {
|
||||||
return items && Array.isArray(items) && items.includes(item);
|
return items && Array.isArray(items) && items.includes(item);
|
||||||
});
|
});
|
||||||
@@ -138,6 +146,11 @@ export function appFilters(eleventyConfig) {
|
|||||||
return 0;
|
return 0;
|
||||||
})
|
})
|
||||||
|
|
||||||
|
eleventyConfig.addFilter("debug", function (elem) {
|
||||||
|
console.log(elem);
|
||||||
|
return elem;
|
||||||
|
})
|
||||||
|
|
||||||
eleventyConfig.addFilter("first", function (elem) {
|
eleventyConfig.addFilter("first", function (elem) {
|
||||||
if (elem instanceof Object) {
|
if (elem instanceof Object) {
|
||||||
return elem[Object.keys(elem)[0]];
|
return elem[Object.keys(elem)[0]];
|
||||||
@@ -160,36 +173,31 @@ export function appFilters(eleventyConfig) {
|
|||||||
|
|
||||||
// time ago from today
|
// time ago from today
|
||||||
eleventyConfig.addFilter("timeago", function (date) {
|
eleventyConfig.addFilter("timeago", function (date) {
|
||||||
let seconds;
|
const seconds = Math.floor((new Date() - date) / 1000);
|
||||||
if (typeof date === 'number') {
|
|
||||||
seconds = date;
|
|
||||||
} else {
|
|
||||||
seconds = Math.floor((new Date() - date) / 1000);
|
|
||||||
}
|
|
||||||
|
|
||||||
let interval = Math.floor(seconds / 31536000);
|
let interval = Math.floor(seconds / 31536000);
|
||||||
|
|
||||||
if (interval >= 1) {
|
if (interval > 1) {
|
||||||
return `${interval} year${interval > 1 ? 's' : ''} ago`;
|
return interval + " years ago";
|
||||||
}
|
}
|
||||||
interval = Math.floor(seconds / 2592000);
|
interval = Math.floor(seconds / 2592000);
|
||||||
if (interval >= 1) {
|
if (interval > 1) {
|
||||||
return `${interval} month${interval > 1 ? 's' : ''} ago`;
|
return interval + " months ago";
|
||||||
}
|
}
|
||||||
interval = Math.floor(seconds / 86400);
|
interval = Math.floor(seconds / 86400);
|
||||||
if (interval >= 1) {
|
if (interval > 1) {
|
||||||
return `${interval} day${interval > 1 ? 's' : ''} ago`;
|
return interval + " days ago";
|
||||||
}
|
}
|
||||||
interval = Math.floor(seconds / 3600);
|
interval = Math.floor(seconds / 3600);
|
||||||
if (interval >= 1) {
|
if (interval > 1) {
|
||||||
return `${interval} hour${interval > 1 ? 's' : ''} ago`;
|
return interval + " hours ago";
|
||||||
}
|
}
|
||||||
interval = Math.floor(seconds / 60);
|
interval = Math.floor(seconds / 60);
|
||||||
if (interval >= 1) {
|
if (interval > 1) {
|
||||||
return `${interval} minute${interval > 1 ? 's' : ''} ago`;
|
return interval + " minutes ago";
|
||||||
}
|
}
|
||||||
if (seconds > 0) {
|
if (seconds > 0) {
|
||||||
return `${Math.floor(seconds)} second${Math.floor(seconds) > 1 ? 's' : ''} ago`;
|
return Math.floor(seconds) + " seconds ago";
|
||||||
}
|
}
|
||||||
|
|
||||||
return "now";
|
return "now";
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
{% assign width = include.width | default: 400 %}
|
{% assign width = include.width | default: 400 %}
|
||||||
{% assign height = include.height | default: 200 %}
|
{% assign height = include.height | default: 200 %}
|
||||||
<div class="card-body{% if include.class %} {{ include.class }}{% endif %}">
|
<div class="card-body p-0{% if include.class %} {{ include.class }}{% endif %}">
|
||||||
{% include "ui/svg.html" width=width height=height ratio=include.ratio class="w-100 border rounded" %}
|
{% include "ui/svg.html" width=width height=height ratio=include.ratio class="w-100" %}
|
||||||
</div>
|
</div>
|
||||||
@@ -1,12 +0,0 @@
|
|||||||
<div class="card bg-primary text-primary-fg">
|
|
||||||
<div class="card-stamp">
|
|
||||||
<div class="card-stamp-icon bg-white text-primary">
|
|
||||||
{% include "ui/icon.html" icon="star" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-body">
|
|
||||||
<h3 class="card-title">Card with background and icon</h3>
|
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto at consectetur culpa ducimus eum fuga fugiat, ipsa iusto, modi nostrum recusandae reiciendis saepe.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -1,8 +0,0 @@
|
|||||||
<div class="card">
|
|
||||||
<div class="ribbon bg-red">NEW</div>
|
|
||||||
<div class="card-body">
|
|
||||||
<h3 class="card-title">Card with text ribbon</h3>
|
|
||||||
<p class="text-secondary">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto at consectetur culpa ducimus eum fuga fugiat, ipsa iusto, modi nostrum recusandae reiciendis saepe.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -1,8 +0,0 @@
|
|||||||
<div class="card">
|
|
||||||
<div class="ribbon ribbon-top bg-yellow">{% include "ui/icon.html" icon="star" %}</div>
|
|
||||||
<div class="card-body">
|
|
||||||
<h3 class="card-title">Card with top ribbon</h3>
|
|
||||||
<p class="text-secondary">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto at consectetur culpa ducimus eum fuga fugiat, ipsa iusto, modi nostrum recusandae reiciendis saepe.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -1,12 +1,12 @@
|
|||||||
{% assign tabs-count = include.count | default: 3 %}
|
{% assign tabs-count = include.count | default: 3 %}
|
||||||
{% assign id = include.id | default: 'top' %}
|
{% assign id = include.id | default: 'top' %}
|
||||||
{% assign tabs = 'Activity,Profile,Settings' | split: "," %}
|
{% assign tabs = (1..tabs-count) %}
|
||||||
|
|
||||||
{% capture tabs-html %}
|
{% capture tabs-html %}
|
||||||
<!-- Cards navigation -->
|
<!-- Cards navigation -->
|
||||||
<ul class="nav nav-tabs{% if include.bottom %} nav-tabs-bottom{% endif %}">
|
<ul class="nav nav-tabs{% if include.bottom %} nav-tabs-bottom{% endif %}">
|
||||||
{% for tab in tabs %}
|
{% for tab in tabs %}
|
||||||
<li class="nav-item"><a href="#tab-{{ id }}-{{ forloop.index }}" class="nav-link{% if forloop.first %} active{% endif %}" data-bs-toggle="tab">{{ tab }}</a></li>
|
<li class="nav-item"><a href="#tab-{{ id }}-{{ tab }}" class="nav-link{% if forloop.first %} active{% endif %}" data-bs-toggle="tab">Tab {{ tab }}</a></li>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</ul>
|
</ul>
|
||||||
{%- endcapture %}
|
{%- endcapture %}
|
||||||
@@ -15,9 +15,9 @@
|
|||||||
<div class="tab-content">
|
<div class="tab-content">
|
||||||
{% for tab in tabs %}
|
{% for tab in tabs %}
|
||||||
<!-- Content of card #{{ tab }} -->
|
<!-- Content of card #{{ tab }} -->
|
||||||
<div id="tab-{{ id }}-{{ forloop.index }}" class="card tab-pane{% if forloop.first %} active show{% endif %}">
|
<div id="tab-{{ id }}-{{ tab }}" class="card tab-pane{% if forloop.first %} active show{% endif %}">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="card-title">{{ tab }}</div>
|
<div class="card-title">Content of tab #{{ tab }}</div>
|
||||||
<p class="text-secondary">
|
<p class="text-secondary">
|
||||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, alias aliquid distinctio dolorem expedita, fugiat hic magni molestiae molestias odit.
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, alias aliquid distinctio dolorem expedita, fugiat hic magni molestiae molestias odit.
|
||||||
</p>
|
</p>
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<{% if link %}a href="#"{% else %}div{% endif %} class="card{% if include.active %} card-active{% endif %}{% if include.inactive %} card-inactive{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
|
<{% if link %}a href="#"{% else %}div{% endif %} class="card{% if include.active %} card-active{% endif %}{% if include.inactive %} card-inactive{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
|
||||||
|
|
||||||
{% if include['empty'] %}
|
{% if include['empty'] %}
|
||||||
{% include "ui/empty.html" illustration="not-found" height=160 %}
|
{% include "ui/empty.html" illustration=true %}
|
||||||
|
|
||||||
{% else %}
|
{% else %}
|
||||||
|
|
||||||
@@ -78,7 +78,7 @@
|
|||||||
{% when "check" %}
|
{% when "check" %}
|
||||||
{% include "ui/form/check.html" empty=true checked=true class="m-0" %}
|
{% include "ui/form/check.html" empty=true checked=true class="m-0" %}
|
||||||
{% when "avatars" %}
|
{% when "avatars" %}
|
||||||
{% include "ui/avatar-list.html" stacked=true text="+3" size="sm" %}
|
{% include "ui/avatar-list.html" stacked=true text="+3" %}
|
||||||
{% when "more" %}
|
{% when "more" %}
|
||||||
<a href="#">More information</a>
|
<a href="#">More information</a>
|
||||||
{% endcase %}
|
{% endcase %}
|
||||||
|
|||||||
@@ -1,13 +0,0 @@
|
|||||||
<div class="card">
|
|
||||||
<div class="card-body">
|
|
||||||
<div class="subheader">Active Users</div>
|
|
||||||
<div class="d-flex align-items-baseline mb-2">
|
|
||||||
<div class="h1 mb-0 me-2">25,782</div>
|
|
||||||
<div class="me-auto">
|
|
||||||
{% include "ui/trending.html" value=-1 %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{% include "ui/chart.html" chart-id="active-users-3" height="12" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -13,5 +13,5 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% include "ui/chart.html" chart-id="revenue-bg" size="sm" class="rounded-bottom-3" %}
|
{% include "ui/chart.html" chart-id="revenue-bg" size="sm" class="rounded-bottom" %}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,12 +0,0 @@
|
|||||||
<div class="card">
|
|
||||||
<div class="card-body">
|
|
||||||
<div class="d-flex">
|
|
||||||
<h3 class="card-title">Social referrals</h3>
|
|
||||||
<div class="ms-auto">
|
|
||||||
{% include "parts/dropdown/days.html" id="social-referrals" label="Select time range for sales data" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{% include "ui/chart.html" chart-id="social-referrals" legend=true %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -1,14 +0,0 @@
|
|||||||
<div class="card">
|
|
||||||
<div class="card-body">
|
|
||||||
<div class="subheader">Total Users</div>
|
|
||||||
<div class="d-flex align-items-baseline">
|
|
||||||
<div class="h1 mb-0 me-2">75,782</div>
|
|
||||||
<div class="me-auto">
|
|
||||||
{% include "ui/trending.html" value=2 %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="text-secondary mt-2">24,635 users increased from last month</div>
|
|
||||||
</div>
|
|
||||||
{% include "ui/chart.html" chart-id="visitors" height="6" %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -1,12 +0,0 @@
|
|||||||
<div class="card card-gradient card-gradient-danger">
|
|
||||||
<div class="card-body p-5 text-center">
|
|
||||||
<h3 class="card-title">Are you sure to delete this card?</h3>
|
|
||||||
<p class="text-secondary">If you delete this card, you will not be able to recover it.</p>
|
|
||||||
|
|
||||||
<div class="btn-list btn-list-center mt-5">
|
|
||||||
{% include "ui/button.html" text="Yes, delete it" color="danger" %}
|
|
||||||
{% include "ui/button.html" text="Cancel" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -1,12 +0,0 @@
|
|||||||
<div class="card card-lg card-dashed card-transparent">
|
|
||||||
<div class="card-body text-center">
|
|
||||||
<div class="mb-3">
|
|
||||||
{% include "ui/avatar-list.html" stacked %}
|
|
||||||
</div>
|
|
||||||
<h3 class="card-title">No Team Members</h3>
|
|
||||||
<p class="text-secondary">Invite your team to<br>collaborate on this project.</p>
|
|
||||||
<div class="mt-4">
|
|
||||||
{% include "ui/button.html" text="Invite Members" color="primary" icon="plus" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@@ -1,91 +0,0 @@
|
|||||||
<form class="card">
|
|
||||||
<div class="card-body">
|
|
||||||
<h3 class="card-title">Payment Method</h3>
|
|
||||||
<p class="card-subtitle mb-4">All transactions are secure and encrypted</p>
|
|
||||||
|
|
||||||
<div class="mb-3">
|
|
||||||
<label class="form-label">Name on Card</label>
|
|
||||||
<input type="text" class="form-control" placeholder="John Doe">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-8">
|
|
||||||
<div class="mb-3">
|
|
||||||
<label class="form-label">Card Number</label>
|
|
||||||
<input type="text" class="form-control" placeholder="1234 5678 9012 3456">
|
|
||||||
<small class="form-hint">Enter your 16-digit number.</small>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-4">
|
|
||||||
<div class="mb-3">
|
|
||||||
<label class="form-label">CVV</label>
|
|
||||||
<input type="text" class="form-control" placeholder="123">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-6">
|
|
||||||
<div class="mb-3">
|
|
||||||
<label class="form-label">Month</label>
|
|
||||||
<select class="form-select">
|
|
||||||
<option value="">MM</option>
|
|
||||||
<option value="1">January</option>
|
|
||||||
<option value="2">February</option>
|
|
||||||
<option value="3">March</option>
|
|
||||||
<option value="4">April</option>
|
|
||||||
<option value="5">May</option>
|
|
||||||
<option value="6">June</option>
|
|
||||||
<option value="7">July</option>
|
|
||||||
<option value="8">August</option>
|
|
||||||
<option value="9">September</option>
|
|
||||||
<option value="10">October</option>
|
|
||||||
<option value="11">November</option>
|
|
||||||
<option value="12">December</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-6">
|
|
||||||
<div class="mb-3">
|
|
||||||
<label class="form-label">Year</label>
|
|
||||||
<select class="form-select">
|
|
||||||
<option value="">YYYY</option>
|
|
||||||
<option value="2025">2025</option>
|
|
||||||
<option value="2026">2026</option>
|
|
||||||
<option value="2027">2027</option>
|
|
||||||
<option value="2028">2028</option>
|
|
||||||
<option value="2029">2029</option>
|
|
||||||
<option value="2030">2030</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<hr class="my-4" />
|
|
||||||
|
|
||||||
<h3 class="card-title">Billing Address</h3>
|
|
||||||
<p class="card-subtitle mb-4">The billing address associated with your payment method</p>
|
|
||||||
|
|
||||||
<div class="mb-3">
|
|
||||||
<label class="form-check">
|
|
||||||
<input class="form-check-input" type="checkbox" checked>
|
|
||||||
<span class="form-check-label">Same as shipping address</span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<hr class="my-4" />
|
|
||||||
|
|
||||||
<div class="mb-3">
|
|
||||||
<label class="form-label">Comments</label>
|
|
||||||
<textarea class="form-control" rows="3" placeholder="Add any additional comments"></textarea>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mt-4">
|
|
||||||
<div class="btn-list">
|
|
||||||
{% include "ui/button.html" text="Submit" color="primary" %}
|
|
||||||
{% include "ui/button.html" text="Cancel" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
@@ -1,12 +0,0 @@
|
|||||||
<div class="card card-gradient card-gradient-rainbow">
|
|
||||||
<div class="card-body text-center p-5">
|
|
||||||
<div class="display-5 leading-none mb-2">🍾 🎉</div>
|
|
||||||
<h1>Happy Birthday, Andrew!</h1>
|
|
||||||
<p class="text-secondary">We truly hope your day is brimming with joy, laughter, and countless moments that bring a smile to your face!</p>
|
|
||||||
<p class="text-secondary">To celebrate your special day, here's a discount code just for you: <strong class="text-body">NWYR20</strong>. Enjoy <strong class="text-body">20% off</strong> your next purchase!</p>
|
|
||||||
<div class="mt-5">
|
|
||||||
{% include "ui/button.html" text="Grab my special deal" icon="gift" color="primary" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
{% assign icons-count = icons-info.count %}
|
{% assign icons-count = icons-info.count %}
|
||||||
|
|
||||||
<div class="card card-md{% if include.class %} {{ include.class }}{% endif %}">
|
<div class="card card-md sticky-top{% if include.class %} {{ include.class }}{% endif %}">
|
||||||
<div class="card-stamp card-stamp-lg">
|
<div class="card-stamp card-stamp-lg">
|
||||||
<div class="card-stamp-icon bg-primary">
|
<div class="card-stamp-icon bg-primary">
|
||||||
{% include "ui/icon.html" icon="ghost" %}
|
{% include "ui/icon.html" icon="ghost" %}
|
||||||
|
|||||||
@@ -84,8 +84,8 @@
|
|||||||
<td class="text-end">$5.000,00</td>
|
<td class="text-end">$5.000,00</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td colspan="4" class="font-weight-semibold text-uppercase text-end">Total Due</td>
|
<td colspan="4" class="font-weight-bold text-uppercase text-end">Total Due</td>
|
||||||
<td class="font-weight-semibold text-end">$30.000,00</td>
|
<td class="font-weight-bold text-end">$30.000,00</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
|
|||||||
@@ -1,37 +0,0 @@
|
|||||||
<div class="card card-gradient card-gradient-love">
|
|
||||||
<div class="ribbon bg-pink">
|
|
||||||
Featured
|
|
||||||
</div>
|
|
||||||
<div class="card-body">
|
|
||||||
<div class="h-subheader text-pink">
|
|
||||||
Professional
|
|
||||||
</div>
|
|
||||||
<div class="d-flex align-items-baseline mt-5">
|
|
||||||
<div class="display-5">$199</div>
|
|
||||||
<div class="fs-1 text-secondary">/ month</div>
|
|
||||||
</div>
|
|
||||||
<ul class="list-unstyled mt-6 space-y space-y-2">
|
|
||||||
<li class="d-flex gap-2">
|
|
||||||
<div>{% include "ui/icon.html" icon="check" color="success" %}</div>
|
|
||||||
<div><strong>Unlimited</strong> Target Audience</div>
|
|
||||||
</li>
|
|
||||||
<li class="d-flex gap-2">
|
|
||||||
<div>{% include "ui/icon.html" icon="check" color="success" %}</div>
|
|
||||||
<div><strong>1</strong> User Account</div>
|
|
||||||
</li>
|
|
||||||
<li class="d-flex gap-2">
|
|
||||||
<div>{% include "ui/icon.html" icon="check" color="success" %}</div>
|
|
||||||
<div><strong>100+</strong> Video Tuts</div>
|
|
||||||
</li>
|
|
||||||
<li class="d-flex gap-2">
|
|
||||||
<div>{% include "ui/icon.html" icon="x" color="secondary" %}</div>
|
|
||||||
<div class="text-secondary">Public Displays</div>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<p class="mt-4 text-muted">This plan is perfect for small businesses and startups. It includes all the features you need to get started.</p>
|
|
||||||
<div class="mt-6">
|
|
||||||
{% include "ui/button.html" text="Purchase Now" color="pink" block %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -1,20 +0,0 @@
|
|||||||
{% assign person = include.person | default: people[1] %}
|
|
||||||
<div class="card card-gradient card-gradient-{{ include.color | default: 'yellow' }}">
|
|
||||||
<div class="card-body text-center py-6">
|
|
||||||
<div class="position-absolute top-0 end-0 p-1">
|
|
||||||
<div class="btn btn-action">{% include "ui/icon.html" icon="star" color="yellow" type="filled" %}</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
{% include "ui/avatar.html" size="2xl" person=person shape="rounded-circle" %}
|
|
||||||
</div>
|
|
||||||
<div class="h1 mt-4 mb-1">{{ person.full_name }}</div>
|
|
||||||
<div class="text-secondary">{{ person.job_title }}</div>
|
|
||||||
|
|
||||||
<div class="btn-list justify-content-center mt-3">
|
|
||||||
<a href="#" class="btn btn-icon btn-pill" title="Message" data-bs-toggle="tooltip" data-bs-placement="top">{% include "ui/icon.html" icon="message" %}</a>
|
|
||||||
<a href="#" class="btn btn-icon btn-pill" title="Phone" data-bs-toggle="tooltip" data-bs-placement="top">{% include "ui/icon.html" icon="phone" %}</a>
|
|
||||||
<a href="#" class="btn btn-icon btn-pill" title="Email" data-bs-toggle="tooltip" data-bs-placement="top">{% include "ui/icon.html" icon="mail" %}</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -1,12 +1,11 @@
|
|||||||
{% assign chart-type = include.chart-type | default: 'line' %}
|
{% assign chart-type = include.chart-type | default: 'line' %}
|
||||||
{% assign chart-position = include.chart-position | default: 'right' %}
|
{% assign chart-position = include.chart-position | default: 'right' %}
|
||||||
{% assign chart-color = include.color | default: 'primary' %}
|
<div class="card card-sm">
|
||||||
<div class="card card-sm{% if include.class %} {{ include.class }}{% endif %}">
|
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="row align-items-center">
|
<div class="row align-items-center">
|
||||||
{% if include.icon %}
|
{% if include.icon %}
|
||||||
<div class="col-auto">
|
<div class="col-auto">
|
||||||
<span class="{% if include.color %}bg-{{ include.color }}{% if include.lt %}-lt{% else %} text-white{% endif %}{% endif %} avatar avatar-square">{% include "ui/icon.html" icon=include.icon %}</span>
|
<span class="{% if include.color %}bg-{{ include.color }}{% if include.lt %}-lt{% else %} text-white{% endif %}{% endif %} avatar">{% include "ui/icon.html" icon=include.icon %}</span>
|
||||||
</div>
|
</div>
|
||||||
{% elsif include.person-id %}
|
{% elsif include.person-id %}
|
||||||
<div class="col-auto">
|
<div class="col-auto">
|
||||||
@@ -31,24 +30,13 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="text-secondary">
|
<div class="text-secondary">
|
||||||
{{ include.description | default: "Users" }}
|
{{ include.description | default: "Users" }}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{% if include.chart-data and chart-position=="right" %}
|
{% if include.chart-data and chart-position=="right" %}
|
||||||
<div class="col-auto">
|
<div class="col-auto">
|
||||||
{% include "ui/chart-sparkline.html" id=include.id data=include.chart-data type=chart-type color=chart-color label=include.chart-label label-icon=include.chart-label-icon %}
|
{% include "ui/chart-sparkline.html" id=include.id data=include.chart-data type=chart-type color=include.color label=include.chart-label label-icon=include.chart-label-icon %}
|
||||||
</div>
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
{% if include.trending %}
|
|
||||||
<div class="col-auto">
|
|
||||||
{% include "ui/trending.html" value=include.trending %}
|
|
||||||
</div>
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
{% if include.button %}
|
|
||||||
<div class="col-auto">
|
|
||||||
{% include "ui/button.html" text=include.button size="sm" %}
|
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,23 +0,0 @@
|
|||||||
{% assign card-color = include.color | default: 'primary' %}
|
|
||||||
{% assign card-icon = include.icon | default: 'trending-up' %}
|
|
||||||
{% assign card-title = include.title | default: 'Total' %}
|
|
||||||
{% assign card-value = include.value | default: '0' %}
|
|
||||||
{% assign card-progress = include.progress | default: 0 %}
|
|
||||||
|
|
||||||
<div class="card card-gradient card-gradient-{{ card-color }} card-gradient-start">
|
|
||||||
<div class="card-body">
|
|
||||||
<div class="row g-3">
|
|
||||||
<div class="col">
|
|
||||||
<h4 class="subheader mb-1">{{ card-title }}</h4>
|
|
||||||
<div class="h3 m-0">{{ card-value }}</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-auto">
|
|
||||||
{% include "ui/avatar.html" icon=card-icon color=card-color %}
|
|
||||||
</div>
|
|
||||||
<div class="col-12">
|
|
||||||
{% include "ui/progress.html" value=card-progress color=card-color size="sm" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -1,33 +0,0 @@
|
|||||||
<div class="card">
|
|
||||||
<div class="card-body">
|
|
||||||
<p class="mb-3">Using Storage <strong>6854.45 MB </strong>of 8 GB</p>
|
|
||||||
<div class="progress progress-separated mb-3">
|
|
||||||
<div class="progress-bar bg-primary" role="progressbar" style="width: 44%" aria-label="Regular"></div>
|
|
||||||
<div class="progress-bar bg-info" role="progressbar" style="width: 19%" aria-label="System"></div>
|
|
||||||
<div class="progress-bar bg-success" role="progressbar" style="width: 9%" aria-label="Shared"></div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-auto d-flex align-items-center pe-2">
|
|
||||||
<span class="legend me-2 bg-primary"></span>
|
|
||||||
<span>Regular</span>
|
|
||||||
<span class="d-none d-md-inline d-lg-none d-xxl-inline ms-2 text-secondary">915MB</span>
|
|
||||||
</div>
|
|
||||||
<div class="col-auto d-flex align-items-center px-2">
|
|
||||||
<span class="legend me-2 bg-info"></span>
|
|
||||||
<span>System</span>
|
|
||||||
<span class="d-none d-md-inline d-lg-none d-xxl-inline ms-2 text-secondary">415MB</span>
|
|
||||||
</div>
|
|
||||||
<div class="col-auto d-flex align-items-center px-2">
|
|
||||||
<span class="legend me-2 bg-success"></span>
|
|
||||||
<span>Shared</span>
|
|
||||||
<span class="d-none d-md-inline d-lg-none d-xxl-inline ms-2 text-secondary">201MB</span>
|
|
||||||
</div>
|
|
||||||
<div class="col-auto d-flex align-items-center ps-2">
|
|
||||||
<span class="legend me-2"></span>
|
|
||||||
<span>Free</span>
|
|
||||||
<span class="d-none d-md-inline d-lg-none d-xxl-inline ms-2 text-secondary">612MB</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -3,7 +3,7 @@
|
|||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="mb-4 text-center">
|
<div class="mb-4 text-center">
|
||||||
<img src="{{ page | relative }}/static/products/{{ product.image }}" alt="{{ product.name }}" class="img-fluid">
|
<img src="{{ page | relative }}/img/products/{{ product.image }}" alt="Apple iPhone 7 128GB" class="img-fluid">
|
||||||
</div>
|
</div>
|
||||||
<h4 class="card-title"><a href="#">{{ product.name }}</a></h4>
|
<h4 class="card-title"><a href="#">{{ product.name }}</a></h4>
|
||||||
<div class="mt-5 d-flex align-items-center">
|
<div class="mt-5 d-flex align-items-center">
|
||||||
@@ -11,7 +11,7 @@
|
|||||||
<strong>{{ product.price }}</strong>
|
<strong>{{ product.price }}</strong>
|
||||||
</div>
|
</div>
|
||||||
<div class="ms-auto">
|
<div class="ms-auto">
|
||||||
<a href="#" class="btn btn-primary">{% include "ui/icon.html" icon='shopping-cart' %} Buy</a>
|
<a href="#" class="btn btn-primary">{% include "ui/icon.html" icon='plus' %} Add to cart</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,14 +0,0 @@
|
|||||||
<div class="card card-gradient card-gradient-success">
|
|
||||||
<div class="card-body p-5 text-center">
|
|
||||||
<div class="mb-3">
|
|
||||||
{% include "ui/icon.html" icon="circle-check" class="icon-lg" color="success" %}
|
|
||||||
</div>
|
|
||||||
<h3 class="card-title">Success!</h3>
|
|
||||||
<p class="text-secondary">Your changes have been saved successfully.</p>
|
|
||||||
|
|
||||||
<div class="btn-list btn-list-center mt-5">
|
|
||||||
{% include "ui/button.html" text="Continue" color="success" %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@@ -10,12 +10,12 @@
|
|||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{% for url in urls limit: 8 %}
|
{% for url in urls %}
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
{% include "ui/progressbg.html" value=url.bounce text=url.uri %}
|
{% include "ui/progressbg.html" value=url.bounce text=url.uri %}
|
||||||
</td>
|
</td>
|
||||||
<td class="w-1 fw-medium text-end">{{ url.visitors }}</td>
|
<td class="w-1 fw-bold text-end">{{ url.visitors }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</tbody>
|
</tbody>
|
||||||
|
|||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user