static/frontend: about page style improvements
- Adjusted the breakpoints.
- Removed border between left nav items.
- Matched responsive behavior of doc pages.
Change-Id: Iee518a79dc7c2b278f9bec51f880d20cbed3b1c7
Reviewed-on: https://go-review.googlesource.com/c/pkgsite/+/455955
TryBot-Result: kokoro <noreply+kokoro@google.com>
Reviewed-by: Hyang-Ah Hana Kim <hyangah@gmail.com>
Run-TryBot: Jamal Carvalho <jamal@golang.org>
diff --git a/static/frontend/about/about.css b/static/frontend/about/about.css
index 75a5125..40b1f3c 100644
--- a/static/frontend/about/about.css
+++ b/static/frontend/about/about.css
@@ -31,8 +31,7 @@
}
.about-Content {
- padding: 3rem 0;
- padding: 2rem var(--gutter);
+ padding: 0;
}
.about-Content ul {
overflow-wrap: break-word;
@@ -58,8 +57,13 @@
line-height: 1.5rem;
}
.about-Wrapper {
+ display: grid;
+ gap: var(--gap);
grid-template-areas:
"content";
+ margin: 2rem auto 0;
+ max-width: 110rem;
+ padding: 0 var(--gutter);
}
.about-Content {
grid-area: content;
@@ -67,8 +71,7 @@
.Sidebar {
display: none;
grid-area: Sidebar;
- padding: 3rem;
- padding-top: 9rem;
+ margin-top: 6rem;
}
.Sidebar a {
width: 7.5rem;
@@ -110,18 +113,11 @@
.LeftNav-sidebar {
display: none;
grid-area: LeftNav-sidebar;
- padding: 3rem;
+ padding: 0;
height: 100vh;
position: sticky;
top: 0;
overflow: auto;
- margin-bottom: 1rem;
-}
-
-.LeftNav-sidebar + article.Article {
- margin: unset;
- margin-top: 3rem;
- margin-bottom: 1.875rem;
}
.LeftNav {
@@ -135,7 +131,6 @@
padding-bottom: 0.675rem;
padding-top: 0.675rem;
text-decoration: none;
- border-bottom: var(--border);
}
.LeftNav a span {
@@ -186,10 +181,6 @@
padding-left: 1rem;
}
-.LeftSubnav + a {
- border-top: var(--border);
-}
-
.LeftSubnav img {
visibility: hidden;
flex: 1;
@@ -215,40 +206,28 @@
.LeftNav .LeftSubnav a {
border-bottom: unset;
}
-@media screen and (min-width: 78rem) {
- .Sidebar {
- display: block;
- }
+
+@media (min-width: 50rem) {
.about-Wrapper {
- display: grid;
+ margin-top: 3rem;
+ grid-template-columns: 1fr 3fr;
+ grid-template-areas:
+ "LeftNav-sidebar content";
}
.about-Content {
- padding: 3rem 0;
+ padding: 0
+ }
+ .LeftNav-sidebar {
+ display: block;
}
}
-@media (min-width: 31.25rem) {
- .about-Wrapper {
- grid-template-columns: 1fr 3fr;
- grid-template-areas:
- "content content";
- }
- nav.LeftNav ul {
- display: flex;
- justify-content: space-between;
- }
-}
-@media (min-width: 43.75rem) {
+@media only screen and (min-width: 90rem) {
.about-Wrapper {
grid-template-columns: 1.5fr 4fr 1.5fr;
grid-template-areas:
"LeftNav-sidebar content Sidebar";
}
- nav.LeftNav ul {
- flex-direction: column;
- }
-}
-@media only screen and (min-width: 90rem) {
- .LeftNav-sidebar {
+ .Sidebar {
display: block;
}
}
\ No newline at end of file
diff --git a/static/frontend/about/about.min.css b/static/frontend/about/about.min.css
index 9b90b1d..aad752b 100644
--- a/static/frontend/about/about.min.css
+++ b/static/frontend/about/about.min.css
@@ -3,5 +3,5 @@
* Use of this source code is governed by a BSD-style
* license that can be found in the LICENSE file.
*/
-.about-Wrapper ul{list-style-type:disc;padding-left:2em}.about-Wrapper li{margin:.5em 0}.about-Wrapper b{font-weight:700}a.btn{background:var(--color-button);font-style:normal;font-weight:400;font-size:1rem;line-height:1rem;border-radius:.3125rem;color:#fff;display:block;padding:.625rem;margin-top:1rem;text-align:center;text-decoration:none}.about-Content{padding:3rem 0;padding:2rem var(--gutter)}.about-Content ul{overflow-wrap:break-word}.about-Content h1{font-weight:400;font-size:2.25rem;line-height:2rem}.about-Content h2{font-weight:400;font-size:1.5rem;line-height:2rem}.about-Content h3{font-weight:400;font-size:1.125rem;line-height:2rem}.about-Content p{font-weight:400;font-size:.875rem;line-height:1.5rem}.about-Wrapper{grid-template-areas:"content"}.about-Content{grid-area:content}.Sidebar{display:none;grid-area:Sidebar;padding:9rem 3rem 3rem}.Sidebar a{width:7.5rem}.Sidebar h4{font-style:normal;font-weight:500;font-size:1rem;line-height:1.5rem}.Sidebar p,.Sidebar-faq .link{font-style:normal;font-weight:400;font-size:.875rem;line-height:1.5rem}.Sidebar-faq h4{font-size:.813rem;margin-top:1.25rem;margin-bottom:.375rem}.Sidebar-faq p{margin-top:0;margin-bottom:.625rem}.Sidebar-socialLinks{display:flex;align-items:center}.Sidebar-socialLinks a{display:flex;width:unset;margin-right:.675rem}.LeftNav-columns{display:flex}.LeftNav-sidebar{display:none;grid-area:LeftNav-sidebar;padding:3rem;height:100vh;position:sticky;top:0;overflow:auto;margin-bottom:1rem}.LeftNav-sidebar+article.Article{margin:unset;margin-top:3rem;margin-bottom:1.875rem}.LeftNav{display:flex;flex-direction:column}.LeftNav a{display:flex;align-items:center;padding-bottom:.675rem;padding-top:.675rem;text-decoration:none;border-bottom:var(--border)}.LeftNav a span{flex:30;margin:0 .75rem;font-style:normal;font-weight:500;font-size:1rem;line-height:1.5rem;color:var(--color-text-subtle)}.LeftNav .LeftSubnav a span{font-size:.875rem;font-weight:400}.LeftNav a.active,.LeftNav a:hover,.LeftNav a:active,.LeftNav a:focus{background:var(--color-background-info)}.LeftNav a.active span,.LeftNav a:hover span,.LeftNav a:active span,.LeftNav a:focus span{color:var(--color-text)}.LeftNav ul.LeftSubnav li a.active,.LeftNav ul.LeftSubnav li a:hover,.LeftNav ul.LeftSubnav li a:active,.LeftNav ul.LeftSubnav li a:focus{background:var(--color-background-accented)}.LeftSubnav{list-style:none;padding:unset;margin-top:unset;margin-bottom:unset}.LeftSubnav a{padding-left:1rem}.LeftSubnav+a{border-top:var(--border)}.LeftSubnav img{visibility:hidden;flex:1}.LeftSubnav a.active img,.LeftSubnav a:hover img,.LeftSubnav a:focus img,.LeftSubnav a:active img{visibility:visible}ul.LeftSubnav{padding-left:unset}.LeftSubnav li{margin:unset;list-style:none}.LeftNav-columns .LeftNav .LeftSubnav a,.LeftNav .LeftSubnav a{border-bottom:unset}@media screen and (min-width: 78rem){.Sidebar{display:block}.about-Wrapper{display:grid}.about-Content{padding:3rem 0}}@media (min-width: 31.25rem){.about-Wrapper{grid-template-columns:1fr 3fr;grid-template-areas:"content content"}nav.LeftNav ul{display:flex;justify-content:space-between}}@media (min-width: 43.75rem){.about-Wrapper{grid-template-columns:1.5fr 4fr 1.5fr;grid-template-areas:"LeftNav-sidebar content Sidebar"}nav.LeftNav ul{flex-direction:column}}@media only screen and (min-width: 90rem){.LeftNav-sidebar{display:block}}
+.about-Wrapper ul{list-style-type:disc;padding-left:2em}.about-Wrapper li{margin:.5em 0}.about-Wrapper b{font-weight:700}a.btn{background:var(--color-button);font-style:normal;font-weight:400;font-size:1rem;line-height:1rem;border-radius:.3125rem;color:#fff;display:block;padding:.625rem;margin-top:1rem;text-align:center;text-decoration:none}.about-Content{padding:0}.about-Content ul{overflow-wrap:break-word}.about-Content h1{font-weight:400;font-size:2.25rem;line-height:2rem}.about-Content h2{font-weight:400;font-size:1.5rem;line-height:2rem}.about-Content h3{font-weight:400;font-size:1.125rem;line-height:2rem}.about-Content p{font-weight:400;font-size:.875rem;line-height:1.5rem}.about-Wrapper{display:grid;gap:var(--gap);grid-template-areas:"content";margin:2rem auto 0;max-width:110rem;padding:0 var(--gutter)}.about-Content{grid-area:content}.Sidebar{display:none;grid-area:Sidebar;margin-top:6rem}.Sidebar a{width:7.5rem}.Sidebar h4{font-style:normal;font-weight:500;font-size:1rem;line-height:1.5rem}.Sidebar p,.Sidebar-faq .link{font-style:normal;font-weight:400;font-size:.875rem;line-height:1.5rem}.Sidebar-faq h4{font-size:.813rem;margin-top:1.25rem;margin-bottom:.375rem}.Sidebar-faq p{margin-top:0;margin-bottom:.625rem}.Sidebar-socialLinks{display:flex;align-items:center}.Sidebar-socialLinks a{display:flex;width:unset;margin-right:.675rem}.LeftNav-columns{display:flex}.LeftNav-sidebar{display:none;grid-area:LeftNav-sidebar;padding:0;height:100vh;position:sticky;top:0;overflow:auto}.LeftNav{display:flex;flex-direction:column}.LeftNav a{display:flex;align-items:center;padding-bottom:.675rem;padding-top:.675rem;text-decoration:none}.LeftNav a span{flex:30;margin:0 .75rem;font-style:normal;font-weight:500;font-size:1rem;line-height:1.5rem;color:var(--color-text-subtle)}.LeftNav .LeftSubnav a span{font-size:.875rem;font-weight:400}.LeftNav a.active,.LeftNav a:hover,.LeftNav a:active,.LeftNav a:focus{background:var(--color-background-info)}.LeftNav a.active span,.LeftNav a:hover span,.LeftNav a:active span,.LeftNav a:focus span{color:var(--color-text)}.LeftNav ul.LeftSubnav li a.active,.LeftNav ul.LeftSubnav li a:hover,.LeftNav ul.LeftSubnav li a:active,.LeftNav ul.LeftSubnav li a:focus{background:var(--color-background-accented)}.LeftSubnav{list-style:none;padding:unset;margin-top:unset;margin-bottom:unset}.LeftSubnav a{padding-left:1rem}.LeftSubnav img{visibility:hidden;flex:1}.LeftSubnav a.active img,.LeftSubnav a:hover img,.LeftSubnav a:focus img,.LeftSubnav a:active img{visibility:visible}ul.LeftSubnav{padding-left:unset}.LeftSubnav li{margin:unset;list-style:none}.LeftNav-columns .LeftNav .LeftSubnav a,.LeftNav .LeftSubnav a{border-bottom:unset}@media (min-width: 50rem){.about-Wrapper{margin-top:3rem;grid-template-columns:1fr 3fr;grid-template-areas:"LeftNav-sidebar content"}.about-Content{padding:0}.LeftNav-sidebar{display:block}}@media only screen and (min-width: 90rem){.about-Wrapper{grid-template-columns:1.5fr 4fr 1.5fr;grid-template-areas:"LeftNav-sidebar content Sidebar"}.Sidebar{display:block}}
/*# sourceMappingURL=about.min.css.map */
diff --git a/static/frontend/about/about.min.css.map b/static/frontend/about/about.min.css.map
index 75c7861..02fed0b 100644
--- a/static/frontend/about/about.min.css.map
+++ b/static/frontend/about/about.min.css.map
@@ -1,7 +1,7 @@
{
"version": 3,
"sources": ["about.css"],
- "sourcesContent": ["/*\n * Copyright 2022 The Go Authors. All rights reserved.\n * Use of this source code is governed by a BSD-style\n * license that can be found in the LICENSE file.\n */\n\n.about-Wrapper ul {\n list-style-type: disc;\n padding-left: 2em;\n}\n.about-Wrapper li {\n margin: 0.5em 0;\n}\n.about-Wrapper b {\n font-weight: bold;\n}\n\na.btn {\n background: var(--color-button);\n font-style: normal;\n font-weight: 400;\n font-size: 1rem;\n line-height: 1rem;\n border-radius: 0.3125rem;\n color: #FFF;\n display: block;\n padding: 0.625rem;\n margin-top: 1rem;\n text-align: center;\n text-decoration: none;\n}\n\n.about-Content {\n padding: 3rem 0;\n padding: 2rem var(--gutter);\n}\n.about-Content ul {\n overflow-wrap: break-word;\n}\n.about-Content h1 {\n font-weight: 400;\n font-size: 2.25rem;\n line-height: 2rem;\n}\n.about-Content h2 {\n font-weight: 400;\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.about-Content h3 {\n font-weight: 400;\n font-size: 1.125rem;\n line-height: 2rem;\n}\n.about-Content p {\n font-weight: 400;\n font-size: 0.875rem;\n line-height: 1.5rem;\n}\n.about-Wrapper {\n grid-template-areas:\n \"content\";\n}\n.about-Content {\n grid-area: content;\n}\n.Sidebar {\n display: none;\n grid-area: Sidebar;\n padding: 3rem;\n padding-top: 9rem;\n}\n.Sidebar a {\n width: 7.5rem;\n}\n.Sidebar h4 {\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.Sidebar p, .Sidebar-faq .link {\n font-style: normal;\n font-weight: 400;\n font-size: 0.875rem;\n line-height: 1.5rem;\n}\n.Sidebar-faq h4 {\n font-size: 0.813rem;\n margin-top: 1.25rem;\n margin-bottom: 0.375rem;\n}\n.Sidebar-faq p {\n margin-top: 0;\n margin-bottom: 0.625rem;\n}\n.Sidebar-socialLinks {\n display: flex;\n align-items: center;\n}\n.Sidebar-socialLinks a {\n display: flex;\n width: unset;\n margin-right: 0.675rem;\n}\n.LeftNav-columns {\n display: flex;\n}\n\n.LeftNav-sidebar {\n display: none;\n grid-area: LeftNav-sidebar;\n padding: 3rem;\n height: 100vh;\n position: sticky;\n top: 0;\n overflow: auto;\n margin-bottom: 1rem;\n}\n\n.LeftNav-sidebar + article.Article {\n margin: unset;\n margin-top: 3rem;\n margin-bottom: 1.875rem;\n}\n\n.LeftNav {\n display: flex;\n flex-direction: column;\n}\n\n.LeftNav a {\n display: flex;\n align-items: center;\n padding-bottom: 0.675rem;\n padding-top: 0.675rem;\n text-decoration: none;\n border-bottom: var(--border);\n}\n\n.LeftNav a span {\n flex: 30;\n margin: 0 0.75rem;\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n line-height: 1.5rem;\n color: var(--color-text-subtle);\n}\n\n\n.LeftNav .LeftSubnav a span {\n font-size: 0.875rem;\n font-weight: 400;\n}\n\n.LeftNav a.active,\n.LeftNav a:hover,\n.LeftNav a:active,\n.LeftNav a:focus {\n background: var(--color-background-info);\n}\n\n.LeftNav a.active span,\n.LeftNav a:hover span,\n.LeftNav a:active span,\n.LeftNav a:focus span {\n color: var(--color-text);\n}\n\n.LeftNav ul.LeftSubnav li a.active,\n.LeftNav ul.LeftSubnav li a:hover,\n.LeftNav ul.LeftSubnav li a:active,\n.LeftNav ul.LeftSubnav li a:focus {\n background: var(--color-background-accented);\n}\n\n.LeftSubnav {\n list-style: none;\n padding: unset;\n margin-top: unset;\n margin-bottom: unset;\n}\n\n.LeftSubnav a {\n padding-left: 1rem;\n}\n\n.LeftSubnav + a {\n border-top: var(--border);\n}\n\n.LeftSubnav img {\n visibility: hidden;\n flex: 1;\n}\n\n.LeftSubnav a.active img,\n.LeftSubnav a:hover img,\n.LeftSubnav a:focus img,\n.LeftSubnav a:active img {\n visibility: visible;\n}\n\nul.LeftSubnav {\n padding-left: unset;\n}\n\n.LeftSubnav li {\n margin: unset;\n list-style: none;\n}\n\n.LeftNav-columns .LeftNav .LeftSubnav a,\n.LeftNav .LeftSubnav a {\n border-bottom: unset;\n}\n@media screen and (min-width: 78rem) {\n .Sidebar {\n display: block;\n }\n .about-Wrapper {\n display: grid;\n }\n .about-Content {\n padding: 3rem 0;\n }\n}\n@media (min-width: 31.25rem) {\n .about-Wrapper {\n grid-template-columns: 1fr 3fr;\n grid-template-areas:\n \"content content\";\n }\n nav.LeftNav ul {\n display: flex;\n justify-content: space-between;\n }\n}\n@media (min-width: 43.75rem) {\n .about-Wrapper {\n grid-template-columns: 1.5fr 4fr 1.5fr;\n grid-template-areas:\n \"LeftNav-sidebar content Sidebar\";\n }\n nav.LeftNav ul {\n flex-direction: column;\n }\n}\n@media only screen and (min-width: 90rem) {\n .LeftNav-sidebar {\n display: block;\n }\n}"],
- "mappings": ";;;;;AAMA,kBACI,qBACA,iBAEJ,kBAVA,cAaA,iBACI,gBAGJ,MACI,+BACA,kBACA,gBACA,eACA,iBAtBJ,uBAwBI,WACA,cAzBJ,gBA2BI,gBACA,kBACA,qBAGJ,eAhCA,eAkCI,2BAEJ,kBACI,yBAEJ,kBACI,gBACA,kBACA,iBAEJ,kBACI,gBACA,iBACA,iBAEJ,kBACI,gBACA,mBACA,iBAEJ,iBACI,gBACA,kBACA,mBAEJ,eACI,8BAGJ,eACI,kBAEJ,SACI,aACA,kBApEJ,uBAwEA,WACI,aAEJ,YACI,kBACA,gBACA,eACA,mBAEJ,8BACI,kBACA,gBACA,kBACA,mBAEJ,gBACI,kBACA,mBACA,sBAEJ,eACI,aACA,sBAEJ,qBACI,aACA,mBAEJ,uBACI,aACA,YACA,qBAEJ,iBACI,aAGJ,iBACI,aACA,0BA/GJ,aAiHI,aACA,gBACA,MACA,cACA,mBAGJ,iCACI,aACA,gBACA,uBAGJ,SACI,aACA,sBAGJ,WACI,aACA,mBACA,uBACA,oBACA,qBACA,4BAGJ,gBACI,QA7IJ,gBA+II,kBACA,gBACA,eACA,mBACA,+BAIJ,4BACI,kBACA,gBAGJ,sEAII,wCAGJ,0FAII,wBAGJ,0IAII,4CAGJ,YACI,gBACA,cACA,iBACA,oBAGJ,cACI,kBAGJ,cACI,yBAGJ,gBACI,kBACA,OAGJ,kGAII,mBAGJ,cACI,mBAGJ,eACI,aACA,gBAGJ,+DAEI,oBAEJ,qCACI,SACI,cAEJ,eACI,aAEJ,eAhOJ,gBAoOA,6BACI,eACI,8BACA,sCAGJ,eACI,aACA,+BAGR,6BACI,eACI,sCACA,sDAGJ,eACI,uBAGR,0CACI,iBACI",
+ "sourcesContent": ["/*\n * Copyright 2022 The Go Authors. All rights reserved.\n * Use of this source code is governed by a BSD-style\n * license that can be found in the LICENSE file.\n */\n\n.about-Wrapper ul {\n list-style-type: disc;\n padding-left: 2em;\n}\n.about-Wrapper li {\n margin: 0.5em 0;\n}\n.about-Wrapper b {\n font-weight: bold;\n}\n\na.btn {\n background: var(--color-button);\n font-style: normal;\n font-weight: 400;\n font-size: 1rem;\n line-height: 1rem;\n border-radius: 0.3125rem;\n color: #FFF;\n display: block;\n padding: 0.625rem;\n margin-top: 1rem;\n text-align: center;\n text-decoration: none;\n}\n\n.about-Content {\n padding: 0;\n}\n.about-Content ul {\n overflow-wrap: break-word;\n}\n.about-Content h1 {\n font-weight: 400;\n font-size: 2.25rem;\n line-height: 2rem;\n}\n.about-Content h2 {\n font-weight: 400;\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.about-Content h3 {\n font-weight: 400;\n font-size: 1.125rem;\n line-height: 2rem;\n}\n.about-Content p {\n font-weight: 400;\n font-size: 0.875rem;\n line-height: 1.5rem;\n}\n.about-Wrapper {\n display: grid;\n gap: var(--gap);\n grid-template-areas:\n \"content\";\n margin: 2rem auto 0;\n max-width: 110rem;\n padding: 0 var(--gutter);\n}\n.about-Content {\n grid-area: content;\n}\n.Sidebar {\n display: none;\n grid-area: Sidebar;\n margin-top: 6rem;\n}\n.Sidebar a {\n width: 7.5rem;\n}\n.Sidebar h4 {\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.Sidebar p, .Sidebar-faq .link {\n font-style: normal;\n font-weight: 400;\n font-size: 0.875rem;\n line-height: 1.5rem;\n}\n.Sidebar-faq h4 {\n font-size: 0.813rem;\n margin-top: 1.25rem;\n margin-bottom: 0.375rem;\n}\n.Sidebar-faq p {\n margin-top: 0;\n margin-bottom: 0.625rem;\n}\n.Sidebar-socialLinks {\n display: flex;\n align-items: center;\n}\n.Sidebar-socialLinks a {\n display: flex;\n width: unset;\n margin-right: 0.675rem;\n}\n.LeftNav-columns {\n display: flex;\n}\n\n.LeftNav-sidebar {\n display: none;\n grid-area: LeftNav-sidebar;\n padding: 0;\n height: 100vh;\n position: sticky;\n top: 0;\n overflow: auto;\n}\n\n.LeftNav {\n display: flex;\n flex-direction: column;\n}\n\n.LeftNav a {\n display: flex;\n align-items: center;\n padding-bottom: 0.675rem;\n padding-top: 0.675rem;\n text-decoration: none;\n}\n\n.LeftNav a span {\n flex: 30;\n margin: 0 0.75rem;\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n line-height: 1.5rem;\n color: var(--color-text-subtle);\n}\n\n\n.LeftNav .LeftSubnav a span {\n font-size: 0.875rem;\n font-weight: 400;\n}\n\n.LeftNav a.active,\n.LeftNav a:hover,\n.LeftNav a:active,\n.LeftNav a:focus {\n background: var(--color-background-info);\n}\n\n.LeftNav a.active span,\n.LeftNav a:hover span,\n.LeftNav a:active span,\n.LeftNav a:focus span {\n color: var(--color-text);\n}\n\n.LeftNav ul.LeftSubnav li a.active,\n.LeftNav ul.LeftSubnav li a:hover,\n.LeftNav ul.LeftSubnav li a:active,\n.LeftNav ul.LeftSubnav li a:focus {\n background: var(--color-background-accented);\n}\n\n.LeftSubnav {\n list-style: none;\n padding: unset;\n margin-top: unset;\n margin-bottom: unset;\n}\n\n.LeftSubnav a {\n padding-left: 1rem;\n}\n\n.LeftSubnav img {\n visibility: hidden;\n flex: 1;\n}\n\n.LeftSubnav a.active img,\n.LeftSubnav a:hover img,\n.LeftSubnav a:focus img,\n.LeftSubnav a:active img {\n visibility: visible;\n}\n\nul.LeftSubnav {\n padding-left: unset;\n}\n\n.LeftSubnav li {\n margin: unset;\n list-style: none;\n}\n\n.LeftNav-columns .LeftNav .LeftSubnav a,\n.LeftNav .LeftSubnav a {\n border-bottom: unset;\n}\n\n@media (min-width: 50rem) {\n .about-Wrapper {\n margin-top: 3rem;\n grid-template-columns: 1fr 3fr;\n grid-template-areas:\n \"LeftNav-sidebar content\";\n }\n .about-Content {\n padding: 0\n }\n .LeftNav-sidebar {\n display: block;\n }\n}\n@media only screen and (min-width: 90rem) {\n .about-Wrapper {\n grid-template-columns: 1.5fr 4fr 1.5fr;\n grid-template-areas:\n \"LeftNav-sidebar content Sidebar\";\n }\n .Sidebar {\n display: block;\n }\n}"],
+ "mappings": ";;;;;AAMA,kBACI,qBACA,iBAEJ,kBAVA,cAaA,iBACI,gBAGJ,MACI,+BACA,kBACA,gBACA,eACA,iBAtBJ,uBAwBI,WACA,cAzBJ,gBA2BI,gBACA,kBACA,qBAGJ,eAhCA,UAmCA,kBACI,yBAEJ,kBACI,gBACA,kBACA,iBAEJ,kBACI,gBACA,iBACA,iBAEJ,kBACI,gBACA,mBACA,iBAEJ,iBACI,gBACA,kBACA,mBAEJ,eACI,aACA,eACA,8BA7DJ,mBAgEI,iBACA,wBAEJ,eACI,kBAEJ,SACI,aACA,kBACA,gBAEJ,WACI,aAEJ,YACI,kBACA,gBACA,eACA,mBAEJ,8BACI,kBACA,gBACA,kBACA,mBAEJ,gBACI,kBACA,mBACA,sBAEJ,eACI,aACA,sBAEJ,qBACI,aACA,mBAEJ,uBACI,aACA,YACA,qBAEJ,iBACI,aAGJ,iBACI,aACA,0BAlHJ,UAoHI,aACA,gBACA,MACA,cAGJ,SACI,aACA,sBAGJ,WACI,aACA,mBACA,uBACA,oBACA,qBAGJ,gBACI,QAxIJ,gBA0II,kBACA,gBACA,eACA,mBACA,+BAIJ,4BACI,kBACA,gBAGJ,sEAII,wCAGJ,0FAII,wBAGJ,0IAII,4CAGJ,YACI,gBACA,cACA,iBACA,oBAGJ,cACI,kBAGJ,gBACI,kBACA,OAGJ,kGAII,mBAGJ,cACI,mBAGJ,eACI,aACA,gBAGJ,+DAEI,oBAGJ,0BACI,eACI,gBACA,8BACA,8CAGJ,eAxNJ,UA2NI,iBACI,eAGR,0CACI,eACI,sCACA,sDAGJ,SACI",
"names": []
}
diff --git a/tests/screentest/testdata/about-540x1080.a.png b/tests/screentest/testdata/about-540x1080.a.png
index a76969a..126b528 100644
--- a/tests/screentest/testdata/about-540x1080.a.png
+++ b/tests/screentest/testdata/about-540x1080.a.png
Binary files differ
diff --git a/tests/screentest/testdata/about.a.png b/tests/screentest/testdata/about.a.png
index 76b3be4..e6ca479 100644
--- a/tests/screentest/testdata/about.a.png
+++ b/tests/screentest/testdata/about.a.png
Binary files differ
