Subtitle: single-line ellipsis on narrow viewports (≤640px)
Browse files- static/index.html +9 -1
static/index.html
CHANGED
|
@@ -46,7 +46,15 @@
|
|
| 46 |
.btn-primary { font-size: 10px; padding: 6px 10px; }
|
| 47 |
.btn-primary .plus { font-size: 13px; margin-right: 4px; }
|
| 48 |
.title-row { gap: 10px; }
|
| 49 |
-
.subtitle {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 50 |
.chart-wrap { height: 260px; padding: 8px; }
|
| 51 |
}
|
| 52 |
|
|
|
|
| 46 |
.btn-primary { font-size: 10px; padding: 6px 10px; }
|
| 47 |
.btn-primary .plus { font-size: 13px; margin-right: 4px; }
|
| 48 |
.title-row { gap: 10px; }
|
| 49 |
+
.subtitle {
|
| 50 |
+
font-size: 12px;
|
| 51 |
+
/* On narrow viewports the description would otherwise wrap to many
|
| 52 |
+
lines and dominate the page. Single-line ellipsis is friendlier. */
|
| 53 |
+
white-space: nowrap;
|
| 54 |
+
overflow: hidden;
|
| 55 |
+
text-overflow: ellipsis;
|
| 56 |
+
max-width: 100%;
|
| 57 |
+
}
|
| 58 |
.chart-wrap { height: 260px; padding: 8px; }
|
| 59 |
}
|
| 60 |
|