diff --git a/frontend/src/styles/global.css b/frontend/src/styles/global.css index 741b151d..1f451a51 100644 --- a/frontend/src/styles/global.css +++ b/frontend/src/styles/global.css @@ -179,7 +179,7 @@ a:hover { } .target-switcher { position: relative; - padding: 0 10px var(--space-3); + padding: 0 var(--space-3) var(--space-3); } .target-trigger, .target-option, @@ -191,12 +191,12 @@ a:hover { } .target-trigger { width: 100%; - min-height: 56px; + min-height: 34px; display: grid; - grid-template-columns: 42px minmax(0, 1fr) 14px; + grid-template-columns: 34px minmax(0, 1fr) 8px; align-items: center; - gap: var(--space-3); - padding: 6px 8px; + gap: var(--space-2); + padding: 0 var(--space-2) 0 0; border: 1px solid transparent; border-radius: var(--radius-sm); background: transparent; @@ -211,17 +211,17 @@ a:hover { box-shadow: inset 0 0 0 1px var(--border); } .target-avatar { - width: 42px; - height: 42px; + width: 34px; + height: 34px; border-radius: var(--radius-sm); display: inline-flex; align-items: center; justify-content: center; background: var(--surface); border: 1px solid var(--border); - color: var(--accent); + color: var(--text); font-weight: var(--weight-semibold); - font-size: 1.05rem; + font-size: var(--text-sm); box-shadow: var(--shadow-sm); flex-shrink: 0; } @@ -245,10 +245,13 @@ a:hover { flex-direction: column; line-height: 1.25; } +.target-trigger-copy { + padding-left: var(--space-2); +} .target-name, .target-option-name { color: var(--text); - font-size: 1.05rem; + font-size: var(--text-sm); font-weight: var(--weight-semibold); overflow: hidden; text-overflow: ellipsis; @@ -269,10 +272,11 @@ a:hover { white-space: nowrap; } .target-caret { - width: 10px; - height: 10px; - border-right: 2px solid var(--text-secondary); - border-bottom: 2px solid var(--text-secondary); + width: 6px; + height: 6px; + border-right: 1.5px solid currentColor; + border-bottom: 1.5px solid currentColor; + color: var(--text-secondary); transform: rotate(45deg) translateY(-2px); transition: transform var(--transition-base); } @@ -281,15 +285,16 @@ a:hover { } .target-menu { position: absolute; - left: 10px; - right: 10px; - top: calc(100% - var(--space-1)); + left: var(--space-3); + right: var(--space-3); + top: 100%; z-index: 30; + margin-top: var(--space-2); padding: var(--space-2); border: 1px solid var(--border); - border-radius: var(--radius-sm); + border-radius: var(--radius); background: var(--surface); - box-shadow: var(--shadow-lg); + box-shadow: 0 12px 28px rgba(13, 12, 10, 0.12); } .target-options { display: flex;