1
0
mirror of https://github.com/tabler/tabler.git synced 2025-12-26 11:16:12 +04:00

Enhance pagination component with new styles and documentation (#2384)

This commit is contained in:
Paweł Kuna
2025-05-17 17:04:59 +02:00
committed by GitHub
parent a1af8014e8
commit 8850f6128f
9 changed files with 154 additions and 40 deletions

View File

@@ -1,7 +1,7 @@
<!--EXAMPLE-->
<div
class="example fs-base border rounded my-5{% unless include.raw %} d-flex flex-wrap justify-content-center{% endunless %} overflow-{{ include.overflow | default: 'auto' }} position-relative {% if include.bg %}bg-{{ include.bg }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}"{% if include.height %} style="height: {{ include.height }}"{% endif %}{% unless include.bg %} style="background: url('data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\' width=\'20\' height=\'20\' viewBox=\'0 0 20 20\'><rect fill=\'rgba(0, 0, 0, .01)\' x=\'0\' y=\'0\' width=\'10\' height=\'10\' /><rect fill=\'rgba(0, 0, 0, .01)\' x=\'10\' y=\'10\' width=\'10\' height=\'10\' /></svg>')"{% endunless %}}>
{%- unless include.raw -%}<div class="p-6 w-full{% if include.column %} d-flex gap-3 flex-column{% elsif include.centered %} d-flex flex-fill flex-wrap gap-2{% if include.vertical %} align-items-center flex-column{% else %} justify-content-center{% endif %}{% endif %}" {% if include.column %}style="max-width: 25rem;"{% endif %}>{%- endunless -%}
{%- unless include.raw -%}<div class="p-6 w-full{% if include.column %} d-flex gap-3 flex-column{% elsif include.centered %} d-flex flex-fill flex-wrap gap-2 justify-content-center{% if include.vertical %} align-items-center flex-column{% else %} justify-content-center{% endif %}{% endif %}" {% if include.column %}style="max-width: 25rem;"{% endif %}>{%- endunless -%}
{{ include.html | remove-href }}
{%- unless include.raw -%}</div>{%- endunless -%}
</div>

View File

@@ -33,10 +33,15 @@
</a>
</li>
<li class="nav-item">
<a href="{{ site.githubUrl }}" class="btn btn-icon btn-github" target="_blank">
<a href="{{ site.githubUrl }}" class="btn btn-icon" target="_blank">
{% include "ui/icon.html" icon="brand-github" %}
</a>
</li>
<li class="nav-item">
<a href="{{ site.previewUrl }}" class="btn btn-primary" target="_blank">
{% include "ui/icon.html" icon="eye" %} Preview
</a>
</li>
</ul>
</div>
</div>