content: fix UX issue with highlight above "Discover Packages"
This change modifies the CSS for the header tabs. The goal of this
change is for improved UX design and to provide a clearer connection
between tab highlight and page content. Tab position is changed from top
to bottom and tab hover color is changed from red to white.
Fixes golang/go#39847
Change-Id: I26c96ba538fbefbfa7ffbc61809fa0e5d872d725
Reviewed-on: https://go-review.googlesource.com/c/pkgsite/+/275952
Trust: Jamal Carvalho <jamal@golang.org>
Trust: Julie Qiu <julie@golang.org>
Reviewed-by: Julie Qiu <julie@golang.org>
diff --git a/content/static/css/stylesheet.css b/content/static/css/stylesheet.css
index e19e52d..abb4e10 100644
--- a/content/static/css/stylesheet.css
+++ b/content/static/css/stylesheet.css
@@ -283,11 +283,11 @@
}
.Header-menuItem--active a:link,
.Header-menuItem--active a:visited {
- border-top-color: var(--turq-med);
+ border-bottom-color: var(--turq-med);
font-weight: bold;
}
.Header-menuItem a:hover {
- border-top-color: var(--pink);
+ border-bottom-color: var(--white);
}
.Header-navOpen {
background: no-repeat center/2rem url('/static/img/menu-24px-white.svg');