Commit 579d1f5953b53c39e3c97eb628713affeabd63be
fancy css (use variable)
mixmix committed on 5/13/2019, 5:37:54 AMParent: d0c49fdc39ca332b0de5cdef47f760b02213e88d
Files changed
| app/html/settings/friend-pub.js | changed |
| app/html/settings/friend-pub.mcss | changed |
| app/html/settings/friend-pub.js | ||
|---|---|---|
| @@ -42,9 +42,9 @@ | ||
| 42 | 42 … | h('datalist', { id: 'pub-gossip-datalist' }, [ |
| 43 | 43 … | h('option', { value: 0, label: 'My pub' }), |
| 44 | 44 … | h('option', { value: 1, label: 'My friend' }), |
| 45 | 45 … | h('option', { value: 2, label: 'A friends friend' }), |
| 46 | - h('option', { value: 3, label: 'No limit' }) | |
| 46 … | + h('option', { value: 3, label: 'Any pub' }) | |
| 47 | 47 … | ]), |
| 48 | 48 … | h('input', { |
| 49 | 49 … | type: 'range', |
| 50 | 50 … | attributes: { list: 'pub-gossip-datalist' }, |
| app/html/settings/friend-pub.mcss | |||
|---|---|---|---|
| @@ -3,24 +3,27 @@ | |||
| 3 | 3 … | grid-gap: 1rem | |
| 4 | 4 … | ||
| 5 | 5 … | div.description {} | |
| 6 | 6 … | ||
| 7 … | + --range-options: 4 | ||
| 8 … | + --cols: calc(2 * var(--range-options)) | ||
| 9 … | + | ||
| 7 | 10 … | div.slider { | |
| 8 | 11 … | display: grid | |
| 9 | - grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr | ||
| 12 … | + grid-template-columns: repeat(var(--cols), 1fr) | ||
| 10 | 13 … | ||
| 11 | 14 … | datalist { | |
| 12 | 15 … | grid-row: 1 | |
| 13 | - grid-column: 1 / 9 | ||
| 16 … | + grid-column: 1 / calc(var(--cols) + 1) | ||
| 14 | 17 … | ||
| 15 | 18 … | display: grid | |
| 16 | 19 … | grid-template-columns: 1fr 1fr 1fr 1fr | |
| 17 | 20 … | justify-items: center | |
| 18 | 21 … | } | |
| 19 | 22 … | ||
| 20 | 23 … | input[type=range] { | |
| 21 | 24 … | grid-row: 2 | |
| 22 | - grid-column: 2 / 8 | ||
| 25 … | + grid-column: 2 / var(--cols) | ||
| 23 | 26 … | ||
| 24 | 27 … | margin-left: 0 | |
| 25 | 28 … | } | |
| 26 | 29 … | } | |
Built with git-ssb-web