Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2026-07-24 03:54:42 +04:00
Code Issues Projects Releases Wiki Activity

menu badges

Browse Source 
fixes: #1014
This commit is contained in:
codecalm
2022-02-03 22:11:38 +01:00
parent 1b6ce20aa7
commit 01b1c48950
5 changed files with 26 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/_data/menu.yml
+7 -15
View File
@@ -22,6 +22,7 @@ base:
title: Buttons
cards:
title: Cards
badge: New
children:
base:
url: cards.html
@@ -29,6 +30,7 @@ base:
actions:
url: card-actions.html
title: Card actions
badge: New
masonry:
url: cards-masonry.html
title: Cards Masonry
@@ -38,9 +40,6 @@ base:
dropdowns:
url: dropdowns.html
title: Dropdowns
icons:
url: icons.html
title: Icons
modals:
url: modals.html
title: Modals
@@ -158,6 +157,7 @@ extra:
uptime:
title: Uptime monitor
url: uptime.html
badge: New
widgets:
title: Widgets
url: widgets.html
@@ -217,15 +217,7 @@ docs:
icon: file-text
url: docs/index.html
#changelog:
# url: changelog.html
# title: Changelog
# icon: file-plus
# label: v1.0
#components:
# url: components.html
# title: Components
# icon: truck
changelog:
url: changelog.html
title: Changelog
icon: file-plus
src/pages/_includes/layout/navbar-menu.html
+12 -2
View File
@@ -26,7 +26,7 @@
</span>
{% if level-1[1].badge %}
<span class="badge bg-red">{{ level-1[1].badge }}</span>
<span class="badge badge-sm bg-red">{{ level-1[1].badge }}</span>
{% endif %}
</a>
@@ -50,12 +50,22 @@
<a class="dropdown-item{% if level-2[1].children %} dropdown-toggle{% endif %}{% if level-1[0] == current-page[0] and level-2[0] == current-page[1] and current-page.size == 2 %} active{% endif %}" {% if level-2[1].children %}href="#sidebar-{{ level-2[0] }}" data-bs-toggle="dropdown" data-bs-auto-close="{% if include.keep-open %}false{% else %}outside{% endif %}" role="button" aria-expanded="false" {% else %}href="{{ site.base }}/{{ level-2[1].url }}" {% endif %}>
{{ level-2[1].title }}
{% if level-2[1].badge %}
<span class="badge badge-sm bg-green text-uppercase ms-2">{{ level-2[1].badge }}</span>
{% endif %}
</a>
{% if level-2[1].children %}
<div class="dropdown-menu">
{% for level-3 in level-2[1].children %}
<a href="{{ site.base }}/{{ level-3[1].url }}" class="dropdown-item">{{ level-3[1].title }}</a>
<a href="{{ site.base }}/{{ level-3[1].url }}" class="dropdown-item">
{{ level-3[1].title }}
{% if level-3[1].badge %}
<span class="badge badge-sm bg-green text-uppercase ms-2">{{ level-3[1].badge }}</span>
{% endif %}
</a>
{% endfor %}
</div>
{% endif %}
src/pages/playground-dark.html
-81
View File
@@ -1,81 +0,0 @@
---
title: Dark mode playground
page-header: Dark mode playground
---
{% assign colors = '' | split: ',' %}
{% for color in site.theme-colors %}
{% assign colors = colors | push: color[0] %}
{% endfor %}
{% for color in site.colors %}
{% assign colors = colors | push: color[0] %}
{% endfor %}
{% capture html %}
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias magni minus omnis provident qui repudiandae saepe sunt vel, veniam voluptatibus? Cum eius est harum molestias necessitatibus quasi repellat velit voluptatum.</p>
<div class="card">
<div class="card-body">
<div class="space-y">
<div>
<div class="btn-list">
{% include ui/button.html text="Default" icon="check" %}
{% for color in colors %}
{% assign title = color | capitalize %}
{% include ui/button.html color=color text=title icon="check" %}
{% endfor %}
</div>
</div>
<div>
<div class="btn-list">
{% include ui/button.html text="Default" disabled=true %}
{% for color in colors %}
{% assign title = color | capitalize %}
{% include ui/button.html color=color text=title icon="check" disabled=true %}
{% endfor %}
</div>
</div>
<div>
<div class="btn-list">
{% for color in colors %}
{% assign title = color | capitalize %}
{% include ui/button.html color=color text=title icon="check" ghost=true %}
{% endfor %}
</div>
</div>
<div>
<div class="btn-list">
{% for color in colors %}
{% assign title = color | capitalize %}
{% include ui/button.html color=color text=title icon="check" ghost=true disabled=true %}
{% endfor %}
</div>
</div>
<div>
<div class="btn-list">
{% for color in colors %}
{% assign title = color | capitalize %}
{% include ui/button.html color=color text=title icon="check" outline=true %}
{% endfor %}
</div>
</div>
<div>
<div class="btn-list">
{% for color in colors %}
{% assign title = color | capitalize %}
{% include ui/button.html color=color text=title icon="check" outline=true disabled=true %}
{% endfor %}
</div>
</div>
</div>
</div>
</div>
{% endcapture %}
<div class="row g-5">
<div class="col-lg py-3">{{ html }}</div>
<div class="col-lg py-3 theme-dark">
{{ html }}
</div>
</div>
src/scss/_variables.scss
+1 -1
View File
@@ -19,7 +19,7 @@ $font-local: 'Inter' !default;
$font-icons: () !default;
$font-family-sans-serif: unquote("#{if($font-local, "#{$font-local}, ", '')} #{if($font-google, "#{$font-google}, ", '')}") -apple-system, BlinkMacSystemFont, San Francisco, Segoe UI, Roboto, Helvetica Neue, sans-serif !default;
$font-family-monospace: unquote("#{if($font-google-monospaced, "#{$font-google-monospaced}, ", '')}"), Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
$font-family-monospace: unquote("#{if($font-google-monospaced, "#{$font-google-monospaced}, ", '')}") Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
$font-family-serif: "Georgia", "Times New Roman", times, serif !default;
src/scss/ui/_badges.scss
+6
View File
@@ -40,6 +40,12 @@
}
}
.badge-sm {
font-size: $h6-font-size;
line-height: $h6-line-height;
padding: 0 .25rem;
}
// bordered
.badge-outline {
background-color: transparent;