Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2025-12-21 17:34:25 +04:00
Code Issues Projects Releases Wiki Activity

feat: enhance documentation layout and improve interaction examples for better usability

Browse Source
This commit is contained in:
codecalm
2025-04-19 13:26:33 +02:00
parent 9ebd9f1d24
commit 7fbe4b5bc9
4 changed files with 25 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
docs/.build/rollup.config.mjs
View File

@@ -21,6 +21,9 @@ const plugins = [
plugins.push( plugins.push(
replace({ replace({
'process.env.NODE_ENV': '"production"', 'process.env.NODE_ENV': '"production"',
'process.env.DOCSEARCH_APP_ID': process.env.DOCSEARCH_APP_ID,
'process.env.DOCSEARCH_INDEX_NAME': process.env.DOCSEARCH_INDEX_NAME,
'process.env.DOCSEARCH_API_KEY': process.env.DOCSEARCH_API_KEY,
preventAssignment: true preventAssignment: true
}), }),
nodeResolve() nodeResolve()

6
docs/content/ui/utilities/interactions.md
View File

@@ -20,9 +20,9 @@ Change the way in which the content is selected when the user interacts with it.
Tabler provides `.pe-none` and `.pe-auto` classes to prevent or add element interactions. Tabler provides `.pe-none` and `.pe-auto` classes to prevent or add element interactions.
{% capture html -%} {% capture html -%}
<p> <div>
<a href="#" class="pe-none" tabindex="-1" aria-disabled="true">This link</a> can not be clicked. <a href="#" class="pe-none" tabindex="-1" aria-disabled="true">This link</a> can not be clicked.
</p> </div>
<p><a href="#" class="pe-auto">This link</a> can be clicked (this is default behavior).</p> <div><a href="#" class="pe-auto">This link</a> can be clicked (this is default behavior).</div>
{%- endcapture %} {%- endcapture %}
{% include "docs/example.html" html=html %} {% include "docs/example.html" html=html %}

2
shared/includes/docs/docs-card.html
View File

@@ -8,7 +8,7 @@
</div> </div>
{%- endif -%} {%- endif -%}
<div class="col"> <div class="col">
<h3>{{ include.title }}</h3> <div class="h3">{{ include.title }}</div>
<p class="text-secondary m-0 fs-4 lh-base">{{ include.description }}</p> <p class="text-secondary m-0 fs-4 lh-base">{{ include.description }}</p>
</div> </div>
</div> </div>

22
shared/layouts/docs/default.html
View File

@@ -80,16 +80,30 @@
{% if next-prev.prev %} {% if next-prev.prev %}
<li class="page-item page-prev"> <li class="page-item page-prev">
<a class="page-link" href="{{ next-prev.prev.url }}"> <a class="page-link" href="{{ next-prev.prev.url }}">
<div class="page-item-subtitle">previous</div> <div class="row">
<div class="page-item-title">{{ next-prev.prev.data.title }}</div> <div class="col-auto">
{% include "ui/icon.html" icon="chevron-left" %}
</div>
<div class="col">
<div class="page-item-subtitle">previous</div>
<div class="page-item-title">{{ next-prev.prev.data.title }}</div>
</div>
</div>
</a> </a>
</li> </li>
{% endif %} {% endif %}
{% if next-prev.next %} {% if next-prev.next %}
<li class="page-item page-next"> <li class="page-item page-next">
<a class="page-link" href="{{ next-prev.next.url }}"> <a class="page-link" href="{{ next-prev.next.url }}">
<div class="page-item-subtitle">next</div> <div class="row">
<div class="page-item-title">{{ next-prev.next.data.title }}</div> <div class="col">
<div class="page-item-subtitle">next</div>
<div class="page-item-title">{{ next-prev.next.data.title }}</div>
</div>
<div class="col-auto">
{% include "ui/icon.html" icon="chevron-right" %}
</div>
</div>
</a> </a>
</li> </li>
{% endif %} {% endif %}