Tightening up scope page and adding mouseover hints

This commit is contained in:
Ian Roddis committed 2026-08-17 15:06:44 -03:00
1 parent 2318a6daeb
commit bdb6c7ebfc
2 files changed
+85 -32

No files matched your search

+81 -25
View File
@@ -486,10 +486,24 @@ textarea:focus {
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
.ap-item-name { font-weight: 500; flex: 0 0 auto; } .ap-item-name {
.ap-item-type { color: var(--muted); flex: 0 0 auto; font-size: 0.8rem; } font-weight: 500;
.ap-item-conn { flex: 1; } flex: 0 0 auto;
.ap-item .row-actions { margin-left: auto; } }
.ap-item-type {
color: var(--muted);
flex: 0 0 auto;
font-size: 0.8rem;
}
.ap-item-conn {
flex: 1;
}
.ap-item .row-actions {
margin-left: auto;
}
.fit-item { .fit-item {
padding: 0.5rem 0; padding: 0.5rem 0;
@@ -497,7 +511,9 @@ textarea:focus {
font-size: 0.9rem; font-size: 0.9rem;
} }
.fit-item:last-of-type { border-bottom: none; } .fit-item:last-of-type {
border-bottom: none;
}
.fit-item-main { .fit-item-main {
display: flex; display: flex;
@@ -507,22 +523,41 @@ textarea:focus {
margin-bottom: 0.3rem; margin-bottom: 0.3rem;
} }
.fit-item-arrow { color: var(--muted); } .fit-item-arrow {
color: var(--muted);
.fit-badge {
font-size: 0.7rem;
text-transform: uppercase;
letter-spacing: 0.03em;
padding: 0.1rem 0.5rem;
border-radius: 999px;
font-weight: 600;
} }
.fit-badge-possible { background: var(--surface-2); color: var(--muted); } .fit-badge {
.fit-badge-exact { background: #16a34a26; color: #16a34a; } text-transform: uppercase;
.fit-badge-none { background: #dc262626; color: #dc2626; } }
.fit-notes { margin-top: 0.4rem; padding-left: 0.25rem; } /*
/*font-size: 0.7rem;
letter-spacing: 0.03em;
padding: 0.1rem 0.5rem;
font-weight: 600;
}
*/
.fit-badge-possible a {
background: var(--surface-2);
color: var(--muted);
}
.fit-badge-exact a {
background: #16a34a26;
color: #16a34a;
}
.fit-badge-none a {
background: #dc262626;
color: #dc2626;
}
.fit-notes {
margin-top: 0.4rem;
padding-left: 0.25rem;
}
/* Scope guide: stacked matching-part entries within a fit column cell. */ /* Scope guide: stacked matching-part entries within a fit column cell. */
.fit-cell-item { .fit-cell-item {
@@ -532,14 +567,33 @@ textarea:focus {
font-size: 0.85rem; font-size: 0.85rem;
white-space: nowrap; white-space: nowrap;
} }
.fit-cell-item + .fit-cell-item { margin-top: 0.3rem; }
.fit-note { font-size: 0.85rem; margin-bottom: 0.3rem; } .fit-cell-item+.fit-cell-item {
.fit-note-meta { color: var(--muted); font-size: 0.75rem; } margin-top: 0.3rem;
.fit-note-body { margin: 0.1rem 0 0; } }
.fit-note-form { margin-top: 0.3rem; } .fit-note {
.fit-note-form input[type="text"] { flex: 1; min-width: 12rem; } font-size: 0.85rem;
margin-bottom: 0.3rem;
}
.fit-note-meta {
color: var(--muted);
font-size: 0.75rem;
}
.fit-note-body {
margin: 0.1rem 0 0;
}
.fit-note-form {
margin-top: 0.3rem;
}
.fit-note-form input[type="text"] {
flex: 1;
min-width: 12rem;
}
/* Pagination */ /* Pagination */
.pagination { .pagination {
@@ -670,7 +724,9 @@ textarea:focus {
gap: 0.4rem; gap: 0.4rem;
} }
.local-login-panel summary::-webkit-details-marker { display: none; } .local-login-panel summary::-webkit-details-marker {
display: none;
}
.local-login-panel summary::before { .local-login-panel summary::before {
content: '›'; content: '›';
+4 -7
View File
@@ -26,8 +26,6 @@
<th data-sort-off><input type="checkbox" id="scopes-select-all" title="Select all"></th> <th data-sort-off><input type="checkbox" id="scopes-select-all" title="Select all"></th>
{% endif %} {% endif %}
<th>Scope</th> <th>Scope</th>
<th>Manufacturer</th>
<th>Model</th>
<th>Type</th> <th>Type</th>
<th>Magnification</th> <th>Magnification</th>
<th>Objective thread</th> <th>Objective thread</th>
@@ -48,13 +46,11 @@
<strong><a href="/admin/augmented-parts/{{ scope.id }}">{{ scope.description }}</a></strong> <strong><a href="/admin/augmented-parts/{{ scope.id }}">{{ scope.description }}</a></strong>
{% if scope.sku %}<br><span class="muted">{{ scope.sku }}</span>{% endif %} {% if scope.sku %}<br><span class="muted">{{ scope.sku }}</span>{% endif %}
</td> </td>
<td>{{ scope.manufacturer.name if scope.manufacturer else "—" }}</td>
<td>{{ scope.scope_model.name if scope.scope_model else "—" }}</td>
<td>{{ scope.sub_part_type.name if scope.sub_part_type else "—" }}</td> <td>{{ scope.sub_part_type.name if scope.sub_part_type else "—" }}</td>
<td>{{ magnification(info) }}</td> <td>{{ magnification(info) }}</td>
<td> <td>
{% if row.objective_attachment_point %} {% if row.objective_attachment_point %}
<code>{{ connection_spec(row.objective_attachment_point) }}</code> {{ connection_spec(row.objective_attachment_point) }}
{% elif info and info.objective_thread_pitch %} {% elif info and info.objective_thread_pitch %}
{{ info.objective_thread_pitch }} {{ info.objective_thread_pitch }}
{% else %}<span class="muted">—</span>{% endif %} {% else %}<span class="muted">—</span>{% endif %}
@@ -65,8 +61,9 @@
{% if entries %} {% if entries %}
{% for e in entries %} {% for e in entries %}
<div class="fit-cell-item"> <div class="fit-cell-item">
<span class="fit-badge fit-badge-{{ e.label }}">{{ e.label | capitalize }}</span> <span class="fit-badge fit-badge-{{ e.label }}">
<a href="/admin/augmented-parts/{{ e.part.id }}">{{ e.part.description | truncate(48) }}</a> <a href="/admin/augmented-parts/{{ e.part.id }}" title="{{ e.part.description | truncate(48) }}">{{ e.part.sku }}</a>
</span>
</div> </div>
{% endfor %} {% endfor %}
{% else %} {% else %}