diff --git a/frontend/index.html b/frontend/index.html index 5576587..529d6dd 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -134,6 +134,53 @@ box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.1); } + /* ── Windows Chrome / Edge — rounded top only, more angular ── */ + .os-windows.browser-chrome .tab, + .os-windows.browser-edge .tab { + border-radius: 0; + margin: 3px 2px; + padding: 3px 12px; + height: 30px; + position: relative; + } + + .os-windows.browser-chrome .tab::before, + .os-windows.browser-edge .tab::before { + content: ""; + position: absolute; + left: -2px; + top: 25%; + height: 50%; + width: 1px; + background: var(--tab-border); + } + + .os-windows.browser-chrome .tab:hover::before, + .os-windows.browser-chrome .tab-active::before, + .os-windows.browser-chrome .tab:hover + .tab::before, + .os-windows.browser-chrome .tab-active + .tab::before, + .os-windows.browser-edge .tab:hover::before, + .os-windows.browser-edge .tab-active::before, + .os-windows.browser-edge .tab:hover + .tab::before, + .os-windows.browser-edge .tab-active + .tab::before { + background: transparent; + } + + .os-windows.browser-chrome .tab:hover, + .os-windows.browser-edge .tab:hover { + background: var(--tab-hover); + border-radius: 8px 8px 0 0; + } + + .os-windows.browser-chrome .tab-active, + .os-windows.browser-chrome .tab-active:hover, + .os-windows.browser-edge .tab-active, + .os-windows.browser-edge .tab-active:hover { + background: var(--tab-bg); + border-radius: 8px 8px 0 0; + box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.1); + } + /* ── Safari (Mac only) ── */ /* Compact, flat, evenly spaced, no icons on inactive tabs */ .browser-safari .tab {