diff options
| author | julia.kirschenheuter <julia.kirschenheuter@nextcloud.com> | 2022-11-29 17:55:23 +0100 |
|---|---|---|
| committer | Christoph Wurst <christoph@winzerhof-wurst.at> | 2022-12-20 10:21:30 +0100 |
| commit | 443206965d23a1fcfbbbb9b6a13ce7a5318ba9a0 (patch) | |
| tree | 56e02c72dcc7bc6b4ca4cb55f8eb1b9578b13b3a /core/css/header.css | |
| parent | 0af4e9d4fe80ad3cffc6f3ff6a3d19d5f808cba9 (diff) | |
| download | nextcloud-server-443206965d23a1fcfbbbb9b6a13ce7a5318ba9a0.tar.gz nextcloud-server-443206965d23a1fcfbbbb9b6a13ce7a5318ba9a0.zip | |
Change focused items behavior that neighbor elements (text and border) have no overlapping.
Add native tooltips to items.
Signed-off-by: julia.kirschenheuter <julia.kirschenheuter@nextcloud.com>
Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>
Diffstat (limited to 'core/css/header.css')
| -rw-r--r-- | core/css/header.css | 30 |
1 files changed, 28 insertions, 2 deletions
diff --git a/core/css/header.css b/core/css/header.css index cf613ebd66a..1dc751ad910 100644 --- a/core/css/header.css +++ b/core/css/header.css @@ -45,10 +45,36 @@ #expanddiv a:not(.button):focus-visible, #expanddiv button:not(.button-vue):focus-visible, #expanddiv div[role=button]:focus-visible { - box-shadow: inset 0 0 0 2px var(--color-primary-text); - border-radius: var(--border-radius); outline: none; } +#header a:not(.button):focus-visible::after, #header .button-vue:focus-visible::after, #header div[role=button]:focus-visible::after, +#expanddiv a:not(.button):focus-visible::after, +#expanddiv .button-vue:focus-visible::after, +#expanddiv div[role=button]:focus-visible::after { + content: " "; + position: absolute; + transform: translateX(-50%); + width: 12px; + height: 2px; + border-radius: 3px; + background-color: var(--color-primary-text); + left: 50%; + opacity: 1; +} +#header a:not(.button):focus-visible::after, #header .button-vue:focus-visible::after, +#expanddiv a:not(.button):focus-visible::after, +#expanddiv .button-vue:focus-visible::after { + bottom: 2px; +} +#header .header-right a:not(.button):focus-visible::after, #header .header-right div[role=button]:focus-visible::after, +#expanddiv .header-right a:not(.button):focus-visible::after, +#expanddiv .header-right div[role=button]:focus-visible::after { + bottom: 4px; +} +#header .header-right #expand.menutoggle:focus-visible::after, +#expanddiv .header-right #expand.menutoggle:focus-visible::after { + left: 40%; +} /* HEADERS ------------------------------------------------------------------ */ #body-user #header, |