mirror of
https://github.com/simonw/datasette.git
synced 2026-06-11 11:36:58 +02:00
Stop facet counts from wrapping (#2754)
ul.tight-bullets li uses word-break: break-all so long facet labels can wrap, but that also let the count number break across lines. Wrap each count in a span.facet-count with white-space: nowrap so the label can still wrap while the count stays on one line. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
parent
154ea483ea
commit
92848c06b8
2 changed files with 7 additions and 2 deletions
|
|
@ -706,6 +706,11 @@ button.core[type=button] {
|
|||
color: #666;
|
||||
padding-right: 0.25em;
|
||||
}
|
||||
/* The label may wrap (word-break: break-all on the li) but the count should
|
||||
stay on one line - https://github.com/simonw/datasette/issues/2754 */
|
||||
.facet-count {
|
||||
white-space: nowrap;
|
||||
}
|
||||
.facet-info li,
|
||||
.facet-info ul {
|
||||
margin: 0;
|
||||
|
|
|
|||
|
|
@ -12,9 +12,9 @@
|
|||
<ul class="tight-bullets">
|
||||
{% for facet_value in facet_info.results %}
|
||||
{% if not facet_value.selected %}
|
||||
<li><a href="{{ facet_value.toggle_url }}" data-facet-value="{{ facet_value.value }}">{{ (facet_value.label | string()) or "-" }}</a> {{ "{:,}".format(facet_value.count) }}</li>
|
||||
<li><a href="{{ facet_value.toggle_url }}" data-facet-value="{{ facet_value.value }}">{{ (facet_value.label | string()) or "-" }}</a> <span class="facet-count">{{ "{:,}".format(facet_value.count) }}</span></li>
|
||||
{% else %}
|
||||
<li>{{ facet_value.label or "-" }} · {{ "{:,}".format(facet_value.count) }} <a href="{{ facet_value.toggle_url }}" class="cross">✖</a></li>
|
||||
<li>{{ facet_value.label or "-" }} · <span class="facet-count">{{ "{:,}".format(facet_value.count) }}</span> <a href="{{ facet_value.toggle_url }}" class="cross">✖</a></li>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if facet_info.truncated %}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue