From e922b170b3affdea54449a731d16d046f6f457f8 Mon Sep 17 00:00:00 2001 From: berezinant Date: Mon, 3 Feb 2025 18:56:00 +0100 Subject: [PATCH 1/9] fix: version button layout --- .../plugin-base-frontend/src/main/ui-kit/button/styles.scss | 1 + .../src/main/ui-kit/library-version/styles.scss | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/styles.scss index bfef227222..f9b63e584b 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/styles.scss @@ -73,6 +73,7 @@ &_dropdown { padding: var(--size-s2); + padding-left: 12px; font: var(--font-text-s); diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-version/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-version/styles.scss index f33fe7c954..ba77b8ec34 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-version/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-version/styles.scss @@ -18,7 +18,7 @@ height: 52px; - padding-left: 12px; + padding-left: 8px; background-color: var(--color-text); } From 55a1d20ceb96b56b7be6cec3a5ed182aa99d3ff9 Mon Sep 17 00:00:00 2001 From: berezinant Date: Mon, 3 Feb 2025 19:17:56 +0100 Subject: [PATCH 2/9] fix: not active tag style in firefox --- .../src/main/ui-kit/platform-tag/styles.scss | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss index a4e9b1fb0e..0e5deae74e 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss @@ -6,6 +6,8 @@ .platform-tag { --platform-tag-color: #bababb; + position: relative; + padding: 10px 12px; cursor: pointer; @@ -83,10 +85,24 @@ button.platform-tag { } .filter-section .platform-tag:not([data-active]) { - text-decoration: line-through; + text-decoration: none; color: var(--color-w50); background-color: var(--color-w10); + + &::after { + position: absolute; + z-index: 1; + top: 20px; + right: 12px; + left: 12px; + + height: 1px; + + content: ''; + + background-color: currentColor; + } } .platform-tags .platform-tag::before { From 0a730c47476dafe39c182316bf5298b5c6ed4a9e Mon Sep 17 00:00:00 2001 From: berezinant Date: Wed, 5 Feb 2025 17:40:08 +0100 Subject: [PATCH 3/9] fix: removed unused assets copies --- .../src/main/ui-kit/button/assets/arrow-down.svg | 3 --- .../src/main/ui-kit/icon/assets/arrow-down.svg | 3 --- .../src/main/ui-kit/icon/assets/placeholder.svg | 3 --- .../src/main/ui-kit/navbar-button/assets/burger.svg | 0 .../src/main/ui-kit/navbar-button/assets/filter.svg | 0 5 files changed, 9 deletions(-) delete mode 100644 dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/assets/arrow-down.svg delete mode 100644 dokka-subprojects/plugin-base-frontend/src/main/ui-kit/icon/assets/arrow-down.svg delete mode 100644 dokka-subprojects/plugin-base-frontend/src/main/ui-kit/icon/assets/placeholder.svg delete mode 100644 dokka-subprojects/plugin-base-frontend/src/main/ui-kit/navbar-button/assets/burger.svg delete mode 100644 dokka-subprojects/plugin-base-frontend/src/main/ui-kit/navbar-button/assets/filter.svg diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/assets/arrow-down.svg b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/assets/arrow-down.svg deleted file mode 100644 index ca54658d3c..0000000000 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/assets/arrow-down.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/icon/assets/arrow-down.svg b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/icon/assets/arrow-down.svg deleted file mode 100644 index ca54658d3c..0000000000 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/icon/assets/arrow-down.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/icon/assets/placeholder.svg b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/icon/assets/placeholder.svg deleted file mode 100644 index e8129621d2..0000000000 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/icon/assets/placeholder.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/navbar-button/assets/burger.svg b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/navbar-button/assets/burger.svg deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/navbar-button/assets/filter.svg b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/navbar-button/assets/filter.svg deleted file mode 100644 index e69de29bb2..0000000000 From f81ff9653a694dae14638e2d6f4a316ebe55a015 Mon Sep 17 00:00:00 2001 From: berezinant Date: Wed, 5 Feb 2025 17:40:54 +0100 Subject: [PATCH 4/9] fix: proper hover for platform tags --- .../src/main/ui-kit/platform-tag/styles.scss | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss index 0e5deae74e..978d93487d 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss @@ -74,8 +74,7 @@ button.platform-tag { @media (hover: hover) { .filter-section .platform-tag[data-active]:hover { - color: #fff; - background-color: rgba(186, 186, 187, 0.7); + background-image: linear-gradient(var(--color-b08), var(--color-b08), var(--color-b08)); } } From 37bdb86898ac5caacbf25e4b56c2ea98fb3ef79a Mon Sep 17 00:00:00 2001 From: berezinant Date: Wed, 5 Feb 2025 19:54:27 +0100 Subject: [PATCH 5/9] fix: outline position for header elements --- .../src/main/ui-kit/filter-section/styles.scss | 2 ++ .../src/main/ui-kit/library-name/styles.scss | 2 ++ .../src/main/ui-kit/platform-tag/styles.scss | 4 ++++ .../src/main/resources/dokka/styles/multimodule.css | 4 ++++ 4 files changed, 12 insertions(+) diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/filter-section/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/filter-section/styles.scss index c5d408cdb3..2ca4cc584d 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/filter-section/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/filter-section/styles.scss @@ -48,6 +48,8 @@ } &--dropdown-toggle { + position: relative; + background-image: url('../_assets/filter.svg'); background-repeat: no-repeat; background-position: 50% 50%; diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-name/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-name/styles.scss index 71e7b98627..62a06cf2a8 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-name/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-name/styles.scss @@ -4,6 +4,8 @@ @import '../_tokens/index'; .library-name--link { + position: relative; + display: flex; align-items: center; diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss index 978d93487d..d5e12f157a 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/platform-tag/styles.scss @@ -22,9 +22,13 @@ } button.platform-tag { + position: relative; + cursor: pointer; &:focus-visible { + z-index: 1; + outline: var(--focus-outline); } } diff --git a/dokka-subprojects/plugin-versioning/src/main/resources/dokka/styles/multimodule.css b/dokka-subprojects/plugin-versioning/src/main/resources/dokka/styles/multimodule.css index 6f96df6a90..452d2bdf92 100644 --- a/dokka-subprojects/plugin-versioning/src/main/resources/dokka/styles/multimodule.css +++ b/dokka-subprojects/plugin-versioning/src/main/resources/dokka/styles/multimodule.css @@ -6,6 +6,10 @@ white-space: nowrap; } +.versions-dropdown-button { + position: relative; +} + @media (width < 900px) { .versions-dropdown { height: 52px; From 0ec867b3365a2f0a9bda631b551591cdd5a9ba6c Mon Sep 17 00:00:00 2001 From: berezinant Date: Tue, 11 Feb 2025 17:33:59 +0100 Subject: [PATCH 6/9] fix: dropdown list edge cases --- .../plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss | 3 +++ .../jetbrains/dokka/versioning/VersionsNavigationCreator.kt | 2 ++ .../src/main/resources/dokka/styles/multimodule.css | 3 ++- 3 files changed, 7 insertions(+), 1 deletion(-) diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss index 1f7ccd10a5..253e573b89 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss @@ -101,12 +101,15 @@ display: block; + overflow: hidden; + padding: var(--size-s2) var(--size-s3); list-style-type: none; cursor: pointer; letter-spacing: -0.03em; + text-overflow: ellipsis; color: var(--color-text-nav-dt); diff --git a/dokka-subprojects/plugin-versioning/src/main/kotlin/org/jetbrains/dokka/versioning/VersionsNavigationCreator.kt b/dokka-subprojects/plugin-versioning/src/main/kotlin/org/jetbrains/dokka/versioning/VersionsNavigationCreator.kt index 568a7e9c10..c5cf034e86 100644 --- a/dokka-subprojects/plugin-versioning/src/main/kotlin/org/jetbrains/dokka/versioning/VersionsNavigationCreator.kt +++ b/dokka-subprojects/plugin-versioning/src/main/kotlin/org/jetbrains/dokka/versioning/VersionsNavigationCreator.kt @@ -91,6 +91,7 @@ public class HtmlVersionsNavigationCreator( attributes["style"] = "display: block; padding: 5px; color: #fff" attributes["data-remove-style"] = "true" attributes["role"] = "option" + attributes["title"] = version text(version) } } else { @@ -115,6 +116,7 @@ public class HtmlVersionsNavigationCreator( attributes["style"] = "display: block; padding: 5px; color: #fff" attributes["data-remove-style"] = "true" attributes["role"] = "option" + attributes["title"] = version text(version) } } diff --git a/dokka-subprojects/plugin-versioning/src/main/resources/dokka/styles/multimodule.css b/dokka-subprojects/plugin-versioning/src/main/resources/dokka/styles/multimodule.css index 452d2bdf92..d2305f0a13 100644 --- a/dokka-subprojects/plugin-versioning/src/main/resources/dokka/styles/multimodule.css +++ b/dokka-subprojects/plugin-versioning/src/main/resources/dokka/styles/multimodule.css @@ -19,7 +19,8 @@ @media (width >= 900px) { .versions-dropdown .dropdown--list { - min-width: 60px; + min-width: 120px; + max-width: 200px; top: 44px; } } From 38d101322278918831b93aaf498438e4d409ab5e Mon Sep 17 00:00:00 2001 From: berezinant Date: Thu, 13 Feb 2025 17:53:20 +0100 Subject: [PATCH 7/9] fix: selected option style in dropdown --- .../src/main/ui-kit/_assets/check.svg | 3 + .../src/main/ui-kit/dropdown/styles.scss | 28 ++++++-- .../base/renderers/html/htmlPreprocessors.kt | 1 + .../resources/dokka/ui-kit/assets/check.svg | 3 + .../versioning/VersionsNavigationCreator.kt | 65 ++++++++++--------- 5 files changed, 66 insertions(+), 34 deletions(-) create mode 100644 dokka-subprojects/plugin-base-frontend/src/main/ui-kit/_assets/check.svg create mode 100644 dokka-subprojects/plugin-base/src/main/resources/dokka/ui-kit/assets/check.svg diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/_assets/check.svg b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/_assets/check.svg new file mode 100644 index 0000000000..291e5eedd2 --- /dev/null +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/_assets/check.svg @@ -0,0 +1,3 @@ + + + diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss index 253e573b89..58321885ac 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss @@ -99,17 +99,16 @@ &--option { position: relative; - display: block; + display: flex; - overflow: hidden; + align-items: center; - padding: var(--size-s2) var(--size-s3); + padding: var(--size-s2) 12px; list-style-type: none; cursor: pointer; letter-spacing: -0.03em; - text-overflow: ellipsis; color: var(--color-text-nav-dt); @@ -117,6 +116,7 @@ background-color: var(--color-background-nav-dt); font: var(--font-text-m); + gap: 8px; &:hover { background-color: lighten(rgb(50, 50, 55), 10%); // color-background-nav-dt @@ -159,6 +159,26 @@ } } + &--option-icon { + display: inline-block; + + flex-shrink: 0; + + width: var(--size-m1); + height: var(--size-m1); + + &_selected { + background-image: url('../_assets/check.svg'); + } + } + + &--option-text { + display: inline-block; + overflow: hidden; + + text-overflow: ellipsis; + } + &--overlay { position: absolute; z-index: 4; diff --git a/dokka-subprojects/plugin-base/src/main/kotlin/org/jetbrains/dokka/base/renderers/html/htmlPreprocessors.kt b/dokka-subprojects/plugin-base/src/main/kotlin/org/jetbrains/dokka/base/renderers/html/htmlPreprocessors.kt index 53f1594b8e..f4460765f4 100644 --- a/dokka-subprojects/plugin-base/src/main/kotlin/org/jetbrains/dokka/base/renderers/html/htmlPreprocessors.kt +++ b/dokka-subprojects/plugin-base/src/main/kotlin/org/jetbrains/dokka/base/renderers/html/htmlPreprocessors.kt @@ -111,6 +111,7 @@ public object AssetsInstaller : PageTransformer { "ui-kit/assets/annotation.svg", "ui-kit/assets/arrow-down.svg", "ui-kit/assets/burger.svg", + "ui-kit/assets/check.svg", "ui-kit/assets/checkbox-off.svg", "ui-kit/assets/checkbox-on.svg", "ui-kit/assets/class-kotlin.svg", diff --git a/dokka-subprojects/plugin-base/src/main/resources/dokka/ui-kit/assets/check.svg b/dokka-subprojects/plugin-base/src/main/resources/dokka/ui-kit/assets/check.svg new file mode 100644 index 0000000000..291e5eedd2 --- /dev/null +++ b/dokka-subprojects/plugin-base/src/main/resources/dokka/ui-kit/assets/check.svg @@ -0,0 +1,3 @@ + + + diff --git a/dokka-subprojects/plugin-versioning/src/main/kotlin/org/jetbrains/dokka/versioning/VersionsNavigationCreator.kt b/dokka-subprojects/plugin-versioning/src/main/kotlin/org/jetbrains/dokka/versioning/VersionsNavigationCreator.kt index c5cf034e86..cd8c81356f 100644 --- a/dokka-subprojects/plugin-versioning/src/main/kotlin/org/jetbrains/dokka/versioning/VersionsNavigationCreator.kt +++ b/dokka-subprojects/plugin-versioning/src/main/kotlin/org/jetbrains/dokka/versioning/VersionsNavigationCreator.kt @@ -8,10 +8,8 @@ import kotlinx.html.a import kotlinx.html.button import kotlinx.html.div import kotlinx.html.i -import kotlinx.html.li import kotlinx.html.span import kotlinx.html.stream.appendHTML -import kotlinx.html.ul import org.jetbrains.dokka.plugability.DokkaContext import org.jetbrains.dokka.plugability.configuration import org.jetbrains.dokka.plugability.plugin @@ -85,38 +83,45 @@ public class HtmlVersionsNavigationCreator( } } orderedVersions.forEach { (version, path) -> - div { - if (version == activeVersion?.key) { - a(classes = "dropdown--option dropdown--option-link", href = output.name) { - attributes["style"] = "display: block; padding: 5px; color: #fff" - attributes["data-remove-style"] = "true" - attributes["role"] = "option" - attributes["title"] = version + if (version == activeVersion?.key) { + a( + classes = "dropdown--option dropdown--option_active dropdown--option-link", + href = output.name + ) { + attributes["style"] = "display: block; padding: 5px; color: #fff" + attributes["data-remove-style"] = "true" + attributes["role"] = "option" + attributes["title"] = version + span(classes = "dropdown--option-icon dropdown--option-icon_selected") {} + span(classes = "dropdown--option-text") { text(version) } - } else { - val isExistsFile = - if (version == versioningStorage.currentVersion.name) - path?.resolve(relativePosition)?.exists() == true - else - versioningStorage.previousVersions[version]?.src?.resolve(relativePosition) - ?.exists() == true + } + } else { + val isExistsFile = + if (version == versioningStorage.currentVersion.name) + path?.resolve(relativePosition)?.exists() == true + else + versioningStorage.previousVersions[version]?.src?.resolve(relativePosition) + ?.exists() == true - val absolutePath = - if (isExistsFile) - path?.resolve(relativePosition) - else - versioningStorage.currentVersion.dir.resolve("not-found-version.html") + val absolutePath = + if (isExistsFile) + path?.resolve(relativePosition) + else + versioningStorage.currentVersion.dir.resolve("not-found-version.html") - a( - classes = "dropdown--option dropdown--option-link", - href = absolutePath?.toRelativeString(position) + - if (!isExistsFile) "?v=" + version.urlEncoded() else "" - ) { - attributes["style"] = "display: block; padding: 5px; color: #fff" - attributes["data-remove-style"] = "true" - attributes["role"] = "option" - attributes["title"] = version + a( + classes = "dropdown--option dropdown--option-link", + href = absolutePath?.toRelativeString(position) + + if (!isExistsFile) "?v=" + version.urlEncoded() else "" + ) { + attributes["style"] = "display: block; padding: 5px; color: #fff" + attributes["data-remove-style"] = "true" + attributes["role"] = "option" + attributes["title"] = version + span(classes = "dropdown--option-icon") {} + span(classes = "dropdown--option-text") { text(version) } } From 191f159b540b0a4068e759fac54da11c430f2349 Mon Sep 17 00:00:00 2001 From: berezinant Date: Thu, 13 Feb 2025 21:54:38 +0100 Subject: [PATCH 8/9] fix: misc outline and focus fixes --- .../src/main/components/search/search.scss | 3 +++ .../src/main/ui-kit/_tokens/colors.scss | 1 + .../src/main/ui-kit/button/styles.scss | 2 +- .../src/main/ui-kit/dropdown/styles.scss | 12 +++++++++++- .../src/main/ui-kit/filter-section/styles.scss | 6 ++++++ .../src/main/ui-kit/library-name/styles.scss | 3 +++ .../src/main/ui-kit/library-version/styles.scss | 1 + .../src/main/ui-kit/navbar-button/styles.scss | 4 ++++ .../src/main/ui-kit/toc-tree/styles.scss | 2 +- .../resources/dokka/templates/includes/header.ftl | 2 +- .../src/main/resources/dokka/styles/multimodule.css | 6 ++++++ 11 files changed, 38 insertions(+), 4 deletions(-) diff --git a/dokka-subprojects/plugin-base-frontend/src/main/components/search/search.scss b/dokka-subprojects/plugin-base-frontend/src/main/components/search/search.scss index 2688ef4ee8..8980f2e4d8 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/components/search/search.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/components/search/search.scss @@ -30,6 +30,9 @@ $secondary-font-color: rgba(255, 255, 255, 0.7); #pages-search { width: 52px; height: 52px; + + border-radius: 0; + outline-offset: -4px; } } diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/_tokens/colors.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/_tokens/colors.scss index 9528eca734..1a0689d20d 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/_tokens/colors.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/_tokens/colors.scss @@ -5,6 +5,7 @@ :root { // Interface --color-key-blue: rgb(48, 127, 255); //#307FFF; + --color-key-blue-hover: #458cff; --color-key-blue-50: rgb(48, 127, 255, 0.5); --color-background-nav: rgb(39, 40, 44); --color-background-nav-dt: rgb(50, 50, 55); diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/styles.scss index f9b63e584b..8b06b1e219 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/button/styles.scss @@ -104,7 +104,7 @@ &:hover, .theme-dark &:hover { - background-color: lighten(rgb(48, 127, 255), 10%); // color-key-blue + background-color: var(--color-key-blue-hover); } &::after { diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss index 58321885ac..63f47e40f7 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/dropdown/styles.scss @@ -126,6 +126,8 @@ z-index: 1; outline: var(--focus-outline); + + outline-offset: -4px; } &:visited { @@ -136,7 +138,7 @@ background-color: var(--color-key-blue); &:hover { - background-color: lighten(rgb(48, 127, 255), 10%); // color-key-blue + background-color: var(--color-key-blue-hover); } } @@ -147,6 +149,7 @@ &:focus-visible { outline: var(--focus-outline); + outline-offset: -4px; } } @@ -234,5 +237,12 @@ margin-top: 12px; } } + + & .button { + @media (width < $breakpoint-desktop-min) { + border-radius: 0; + outline-offset: -4px; + } + } } } diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/filter-section/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/filter-section/styles.scss index 2ca4cc584d..a5a68c3dc8 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/filter-section/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/filter-section/styles.scss @@ -57,6 +57,12 @@ &::after { display: none; } + + @media (width < $breakpoint-desktop-min) { + border-radius: 0; + + outline-offset: -4px; + } } } } diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-name/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-name/styles.scss index 62a06cf2a8..5d7692e8e6 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-name/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-name/styles.scss @@ -26,6 +26,9 @@ height: 52px; margin-left: 12px; + + border-radius: 0; + outline-offset: -4px; } } diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-version/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-version/styles.scss index ba77b8ec34..95cb1c5963 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-version/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/library-version/styles.scss @@ -17,6 +17,7 @@ align-items: center; height: 52px; + padding-top: 0; padding-left: 8px; diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/navbar-button/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/navbar-button/styles.scss index 761b0d9455..d7a92353d7 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/navbar-button/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/navbar-button/styles.scss @@ -65,6 +65,10 @@ @media (width < $breakpoint-desktop-min) { width: 52px; height: 52px; + + border-radius: 0; + + outline-offset: -4px; } } diff --git a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/toc-tree/styles.scss b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/toc-tree/styles.scss index bc8f832120..613052d28f 100644 --- a/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/toc-tree/styles.scss +++ b/dokka-subprojects/plugin-base-frontend/src/main/ui-kit/toc-tree/styles.scss @@ -245,7 +245,7 @@ background-color: var(--color-key-blue); &:hover { - background-color: #578af7; + background-color: var(--color-key-blue-hover); } &::after { diff --git a/dokka-subprojects/plugin-base/src/main/resources/dokka/templates/includes/header.ftl b/dokka-subprojects/plugin-base/src/main/resources/dokka/templates/includes/header.ftl index 5a96fb8e46..24d08376f6 100644 --- a/dokka-subprojects/plugin-base/src/main/resources/dokka/templates/includes/header.ftl +++ b/dokka-subprojects/plugin-base/src/main/resources/dokka/templates/includes/header.ftl @@ -2,7 +2,7 @@ <#macro display>