Date: Mon, 15 Jul 2024 18:51:21 GMT From: Mateusz Piotrowski <0mp@FreeBSD.org> To: doc-committers@FreeBSD.org, dev-commits-doc-all@FreeBSD.org Subject: git: b2aebe4313 - main - website: Visually rearrange main buttons Message-ID: <202407151851.46FIpLoB099420@gitrepo.freebsd.org>
next in thread | raw e-mail | index | archive | help
The branch main has been updated by 0mp: URL: https://cgit.FreeBSD.org/doc/commit/?id=b2aebe4313f88ba587cbb30d181c296fa5a2e7e6 commit b2aebe4313f88ba587cbb30d181c296fa5a2e7e6 Author: Janek Szynal <mail@janek.ooo> AuthorDate: 2024-07-15 18:49:11 +0000 Commit: Mateusz Piotrowski <0mp@FreeBSD.org> CommitDate: 2024-07-15 18:49:20 +0000 website: Visually rearrange main buttons The current placement of the "New To FreeBSD?" button is slightly chaotic, as it's not visually aligned with anything else, and uses a background color not used anywhere else. The "Download FreeBSD" button is also visually misaligned and uses a font size not used anywhere else. This proposed change puts the two buttons together, aligns their left edge with the "Supported releases" section, adjusts width to make sure the titles fit on the same page, and aligns vertically with `beastie.png`. It unifies their font size at 1.3em (which is also used elsewhere) and changes the background color of "New To (..)" button to be lighter and the same as used below. Reviewed by: 0mp Differential Revision: https://reviews.freebsd.org/D45798 --- website/content/en/layout/css/layout.css | 19 +++++++++++------- website/themes/beastie/layouts/index.html | 30 ++++++++++++++-------------- website/themes/beastie/static/css/layout.css | 19 +++++++++++------- 3 files changed, 39 insertions(+), 29 deletions(-) diff --git a/website/content/en/layout/css/layout.css b/website/content/en/layout/css/layout.css index 668d2764a0..454a6bdd0a 100644 --- a/website/content/en/layout/css/layout.css +++ b/website/content/en/layout/css/layout.css @@ -181,7 +181,7 @@ #frontfeaturemiddle { float: left; margin-top: 20px; - background: url(../images/beastie.png) no-repeat top left; + background: url(../images/beastie.png) no-repeat center left; min-height: 196px; width: 30%; } @@ -343,7 +343,7 @@ #frontreleases { padding: 0; margin: 8px; - margin-left: 190px; + margin-left: 210px; margin-top: 5px; padding-bottom: 20px; color: #666; @@ -451,7 +451,7 @@ margin-top: -8px; margin-bottom: -8px; text-align: center; - font-size: 1.4em; + font-size: 1.3em; font-weight: bold; } @@ -461,14 +461,19 @@ } .frontgetroundbox { - margin-top: 50px; - margin-left: 160px; + margin-top: 10px; + margin-left: 210px; padding: 0; - width: 190px; - background-color: #FACC2E; + width: 325px; + background-color: #facc2e; border-radius: 15px; } +.frontgetroundbox.newtofreebsd { + margin-top: 50px; + background-color: #eee; +} + /* Secondary Pages */ @media screen { diff --git a/website/themes/beastie/layouts/index.html b/website/themes/beastie/layouts/index.html index ed91a74815..0cf789eb0d 100755 --- a/website/themes/beastie/layouts/index.html +++ b/website/themes/beastie/layouts/index.html @@ -25,6 +25,21 @@ </div> </div> <div id="frontfeaturemiddle"> + <div class="frontgetroundbox newtofreebsd"> + <div class="frontgettop"> + <div> + <b style="display: none">.</b> + </div> + </div> + <div class="frontgetcontent"> + <a href={{ "projects/newbies/" | absLangURL }}>{{ i18n "newFreeBSD" }}</a> + </div> + <div class="frontgetbot"> + <div> + <b style="display: none">.</b> + </div> + </div> + </div> <div class="frontgetroundbox"> <div class="frontgettop"> <div> @@ -120,21 +135,6 @@ </ul> </div> </div> - <div class="frontnewroundbox"> - <div class="frontnewtop"> - <div> - <b style="display: none">.</b> - </div> - </div> - <div class="frontnewcontent"> - <a href={{ "projects/newbies/" | absLangURL }}>{{ i18n "newFreeBSD" }}</a> - </div> - <div class="frontnewbot"> - <div> - <b style="display: none">.</b> - </div> - </div> - </div> </div> </div> {{ $language := "" }} diff --git a/website/themes/beastie/static/css/layout.css b/website/themes/beastie/static/css/layout.css index cf9e215e95..50f8625f7d 100644 --- a/website/themes/beastie/static/css/layout.css +++ b/website/themes/beastie/static/css/layout.css @@ -152,7 +152,7 @@ header { #frontfeaturemiddle { float: left; margin-top: 20px; - background: url(../images/beastie.png) no-repeat top left; + background: url(../images/beastie.png) no-repeat center left; min-height: 196px; width: 30%; } @@ -381,7 +381,7 @@ header { #frontreleases { padding: 0; margin: 8px; - margin-left: 190px; + margin-left: 210px; margin-top: 5px; padding-bottom: 20px; color: #666; @@ -473,7 +473,7 @@ header { margin-top: -8px; margin-bottom: -8px; text-align: center; - font-size: 1.4em; + font-size: 1.3em; font-weight: bold; } @@ -483,14 +483,19 @@ header { } .frontgetroundbox { - margin-top: 50px; - margin-left: 160px; + margin-top: 10px; + margin-left: 210px; padding: 0; - width: 190px; - background-color: #FACC2E; + width: 325px; + background-color: #facc2e; border-radius: 15px; } +.frontgetroundbox.newtofreebsd { + margin-top: 50px; + background-color: #eee; +} + /* Secondary Pages */ @media screen {
Want to link to this message? Use this URL: <https://mail-archive.FreeBSD.org/cgi/mid.cgi?202407151851.46FIpLoB099420>