diff --git a/copyparty/web/browser.css b/copyparty/web/browser.css index 32fa4a6a..efa9c905 100644 --- a/copyparty/web/browser.css +++ b/copyparty/web/browser.css @@ -43,7 +43,7 @@ --btn-fg: var(--a); --btn-bg: rgba(128,128,128,0.15); --btn-h-fg: var(--a-hil); - --btn-h-bg: hsl(from var(--a) h 0 35%); + --btn-h-bg: hsl(from color-mix(var(--a-gray) 45%, var(--bg-max) 55%) h 0 l); --btn-1-fg: rgb(25, 19, 12); --btn-1-bg: var(--a); --btn-h-bs: var(--btn-bs); @@ -163,12 +163,9 @@ html.y { --row-alt: #f2f2f2; --a: #06a; - --a-gray: #bbb; - --a-dark: #c0f; --btn-fg: #555; --btn-h-fg: #222; - --btn-h-bg: #caf; --btn-1-fg: #fff; --btn-1-bg: #4a0; --btn-1h-bg: #5c0; @@ -2840,6 +2837,7 @@ html.y #bbox-overlay figcaption a { font-size: 1.3em; padding: 1em 2em; cursor: pointer; + box-shadow: .4em .4em 0 var(--bg-d1); } #u2btn sup { font-size: 1.1em; diff --git a/copyparty/web/splash.css b/copyparty/web/splash.css index 410d4e42..b877d950 100644 --- a/copyparty/web/splash.css +++ b/copyparty/web/splash.css @@ -264,6 +264,6 @@ html.bz .vols img { top: 1em; left: 1em; border-radius: .3em; - background: #333; + background: var(--bg-u5); position: fixed; } diff --git a/copyparty/web/ui.css b/copyparty/web/ui.css index d6f9b3ad..5aa44179 100644 --- a/copyparty/web/ui.css +++ b/copyparty/web/ui.css @@ -218,7 +218,7 @@ html { line-height: 1.7em; } #tt em { - color: #f6a; + color: var(--a); } html.y #tt { border-color: #888 #000 #777 #000; @@ -235,9 +235,6 @@ html.y #toast { background: transparent; border: 1px solid #ccc; } -html.y #tt em { - color: #d38; -} html.y #tth { color: #000; background: #fff; @@ -378,13 +375,6 @@ html.y #tth { 30% {outline: color-mix(var(--a) 75%, transparent 25%) solid .1em;} 100% {outline: transparent solid .1em;} } -html.y *:focus, -html.y *:focus+label, -html.y #pctl *:focus, -html.y .btn:focus { - box-shadow: 0 .1em .2em #037 inset; - outline: #037 solid .1em; -} input, button { font-family: var(--font-main), sans-serif; }