From 8eae35af3ea02b2f004d0a63a195c76a6c3c290c Mon Sep 17 00:00:00 2001 From: max Date: Fri, 11 Sep 2026 16:37:57 +0200 Subject: [PATCH] Stand the pin upright once a tab is pinned The pinned state and the hover affordance drew the same slanted pin, so the only difference was opacity. Rotating the pinned one to vertical separates "this is pinned" from "click to pin", and the short transition reads as the toggle landing. Co-Authored-By: Claude Opus 5 --- media/tabs.css | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/media/tabs.css b/media/tabs.css index 93f22dd..fa8f90a 100644 --- a/media/tabs.css +++ b/media/tabs.css @@ -160,6 +160,16 @@ button.marker:focus-visible { outline-offset: -1px; } +/* The pin leans over while it is only an offer; once the tab is really pinned it + stands upright, so the state reads apart from the hover affordance. */ +button.pin svg { + transition: transform 80ms ease-out; +} + +button.pin.on svg { + transform: rotate(-45deg); +} + /* An unsaved file shows a dot, which the close button replaces on hover. */ .dirty { flex: 0 0 auto;