max / makenotwork
1 file changed,
+9 insertions,
-28 deletions
| @@ -787,18 +787,12 @@ | |||
| 787 | 787 | margin-bottom: 0; | |
| 788 | 788 | } | |
| 789 | 789 | ||
| 790 | - | /* The background is layout.css's: `.tab` is sunken, `:hover` steps to | |
| 791 | - | --hover-surface on a fine pointer, `:active` insets. This rule used to | |
| 792 | - | restate the sunken value verbatim, which is what B2 deleted. | |
| 793 | - | ||
| 794 | - | The opacity stays, and it is NOT the same signal said twice. It dims the | |
| 795 | - | label; the surface step changes the plate. Selection needs both, because | |
| 796 | - | the plate step is not reliable across themes: sunken to raised is lighter | |
| 797 | - | on makenotwork, DARKER on nord, and on tokyonight raised equals | |
| 798 | - | --surface-page, so a selected tab has no plate contrast at all and reads as | |
| 799 | - | selected only by merging with the panel below it. Dimming the ink is the | |
| 800 | - | part that survives a theme whose ramp collapses here. See task A4 on | |
| 801 | - | makenotwork's ramp being the thinnest in the house. */ | |
| 790 | + | /* Geometry and type only. The surface is layout.css's: `.tab` is sunken, | |
| 791 | + | `:hover` steps to --hover-surface on a fine pointer, `:active` insets. This | |
| 792 | + | rule used to restate the sunken background verbatim and then carry a second, | |
| 793 | + | redundant selection signal on top of it — opacity 0.6 unselected, 1 selected | |
| 794 | + | — so a tab said "not chosen" twice and the generated surface step did | |
| 795 | + | nothing. The opacity idiom is gone and the surface contrast is the signal. */ | |
| 802 | 796 | .tab { | |
| 803 | 797 | color: var(--content); | |
| 804 | 798 | border: none; | |
| @@ -809,18 +803,11 @@ | |||
| 809 | 803 | /* Tabs navigate, they don't commit, stay flat. Overrides the base | |
| 810 | 804 | `button` shadow if a tab is a <button>. */ | |
| 811 | 805 | box-shadow: none; | |
| 812 | - | transition: | |
| 813 | - | background 0.2s ease, | |
| 814 | - | opacity 0.2s ease; | |
| 815 | - | opacity: 0.6; | |
| 806 | + | transition: background 0.2s ease; | |
| 816 | 807 | white-space: nowrap; | |
| 817 | 808 | flex-shrink: 0; | |
| 818 | 809 | } | |
| 819 | 810 | ||
| 820 | - | .tab:hover { | |
| 821 | - | opacity: 1; | |
| 822 | - | } | |
| 823 | - | ||
| 824 | 811 | /* layout.css spells selection `.tab.chosen`; the site spells it | |
| 825 | 812 | `.is-selected`, and it spells it that way on git nav links, editor tabs, | |
| 826 | 813 | section tabs, issue tabs and filter buttons as well — one idiom across a | |
| @@ -832,7 +819,6 @@ | |||
| 832 | 819 | .tab.is-selected { | |
| 833 | 820 | background: var(--surface-raised); | |
| 834 | 821 | box-shadow: var(--bevel-raised); | |
| 835 | - | opacity: 1; | |
| 836 | 822 | } | |
| 837 | 823 | ||
| 838 | 824 | .tab-more-wrap { | |
| @@ -852,18 +838,13 @@ | |||
| 852 | 838 | } | |
| 853 | 839 | ||
| 854 | 840 | /* The overflow menu restates the tab as a menu row: block, full width, left | |
| 855 | - | aligned, tighter, and one step less dim than the strip because a menu row | |
| 856 | - | is already isolated on its own surface. */ | |
| 841 | + | aligned, tighter. It carried the same opacity pair the strip did and it goes | |
| 842 | + | for the same reason; hover and selection are the generated surface steps. */ | |
| 857 | 843 | .tab-overflow-menu .tab { | |
| 858 | 844 | display: block; | |
| 859 | 845 | width: 100%; | |
| 860 | 846 | text-align: left; | |
| 861 | 847 | padding: var(--gap-group) var(--gap-section); | |
| 862 | - | opacity: 0.7; | |
| 863 | - | } | |
| 864 | - | ||
| 865 | - | .tab-overflow-menu .tab.is-selected { | |
| 866 | - | opacity: 1; | |
| 867 | 848 | } | |
| 868 | 849 | ||
| 869 | 850 |