From nobody Wed Jun 22 19:49:16 2022 X-Original-To: dev-commits-doc-all@mlmmj.nyi.freebsd.org Received: from mx1.freebsd.org (mx1.freebsd.org [IPv6:2610:1c1:1:606c::19:1]) by mlmmj.nyi.freebsd.org (Postfix) with ESMTP id C850185D869 for ; Wed, 22 Jun 2022 19:49:16 +0000 (UTC) (envelope-from git@FreeBSD.org) Received: from mxrelay.nyi.freebsd.org (mxrelay.nyi.freebsd.org [IPv6:2610:1c1:1:606c::19:3]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (4096 bits) server-digest SHA256 client-signature RSA-PSS (4096 bits) client-digest SHA256) (Client CN "mxrelay.nyi.freebsd.org", Issuer "R3" (verified OK)) by mx1.freebsd.org (Postfix) with ESMTPS id 4LSv8r5JLgz3nkk; Wed, 22 Jun 2022 19:49:16 +0000 (UTC) (envelope-from git@FreeBSD.org) DKIM-Signature: v=1; a=rsa-sha256; c=relaxed/relaxed; d=freebsd.org; s=dkim; t=1655927356; h=from:from:reply-to:subject:subject:date:date:message-id:message-id: to:to:cc:mime-version:mime-version:content-type:content-type: content-transfer-encoding:content-transfer-encoding; bh=ikaflJ7jvBjlnMtxBXpxpEYuoF4rl87o7ByGrzlK9Ic=; b=n6xkKlwDloRGHTD7qNT8RvxfOYJ+089s4ikw2J6DS2xbVrJfXV8A9Wy1skeGFZt4cbIege 2XP1nszuYLa1hBMlQdPhwaKikZycKHiRY83R1DilYa60cRgdgiO+Da0d14czXiIw49p65C YvS2UeTTTiaWn6hgM3xRmObaMEfTnEtjsuW7K+KobegNJueBhqC743nPbuG8XQXKXewjau +xv7boEGZH3dLjmLimyRsBKIygFv+exLDktMvN12jXa9EF907f/jl98xt6BTS7xs82ls2Z OJr/1V1/mzRrEdDHDaE97ug9NJw6+0dx1zJs8sPGY2cZPH1wz97Z44QSs0lUZg== Received: from gitrepo.freebsd.org (gitrepo.freebsd.org [IPv6:2610:1c1:1:6068::e6a:5]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (4096 bits) server-digest SHA256) (Client did not present a certificate) by mxrelay.nyi.freebsd.org (Postfix) with ESMTPS id 969244AAB; Wed, 22 Jun 2022 19:49:16 +0000 (UTC) (envelope-from git@FreeBSD.org) Received: from gitrepo.freebsd.org ([127.0.1.44]) by gitrepo.freebsd.org (8.16.1/8.16.1) with ESMTP id 25MJnG8D079710; Wed, 22 Jun 2022 19:49:16 GMT (envelope-from git@gitrepo.freebsd.org) Received: (from git@localhost) by gitrepo.freebsd.org (8.16.1/8.16.1/Submit) id 25MJnGq9079709; Wed, 22 Jun 2022 19:49:16 GMT (envelope-from git) Date: Wed, 22 Jun 2022 19:49:16 GMT Message-Id: <202206221949.25MJnGq9079709@gitrepo.freebsd.org> To: doc-committers@FreeBSD.org, dev-commits-doc-all@FreeBSD.org From: Sergio Carlavilla Delgado Subject: git: f46f0f22f0 - main - Improve user experience in Documentation Portal List-Id: Commit messages for all branches of the doc repository List-Archive: https://lists.freebsd.org/archives/dev-commits-doc-all List-Help: List-Post: List-Subscribe: List-Unsubscribe: Sender: owner-dev-commits-doc-all@freebsd.org X-BeenThere: dev-commits-doc-all@freebsd.org MIME-Version: 1.0 Content-Type: text/plain; charset=utf-8 Content-Transfer-Encoding: 8bit X-Git-Committer: carlavilla X-Git-Repository: doc X-Git-Refname: refs/heads/main X-Git-Reftype: branch X-Git-Commit: f46f0f22f07fa76f52112cd6b5c227e4f160da8d Auto-Submitted: auto-generated ARC-Message-Signature: i=1; a=rsa-sha256; c=relaxed/relaxed; d=freebsd.org; s=dkim; t=1655927356; h=from:from:reply-to:subject:subject:date:date:message-id:message-id: to:to:cc:mime-version:mime-version:content-type:content-type: content-transfer-encoding:content-transfer-encoding; bh=ikaflJ7jvBjlnMtxBXpxpEYuoF4rl87o7ByGrzlK9Ic=; b=apDB9vRnQqesAixkI9Cmj2E2b4sUaIGMb2onITon67yqS4ZjPxd6VOC1l8Q7so7w7vEjZx 6JZbVneCgP1ZYLwbqrbtF5Mxjfjkk4E4KxoWF1IgWiAMDecgh5q0JwgIa+Q2t2y1qdGdX8 dp7vqSogzcyJhBaBFnznmTl493Je2aXqjHe9OQMEeanmUZlhiwFAoqHgSRHfZjf9p4ZqjG 8NNOE4P6wzdTorM+vS2yzA+fS2sTRb4BACyBtXRfo30Y1u7G94GjGRLG8AXoB5f2LmzbK/ Me6eOwuSL8M7da4EYOaOGLCfslpJa1lMafsVrK5pAhlbx9kn7M3rLK3WLgfQjw== ARC-Seal: i=1; s=dkim; d=freebsd.org; t=1655927356; a=rsa-sha256; cv=none; b=X7Uf4nD07O9X6c/psGEDIQV0PNt16qZmcVINZhawjEVwzCNYWRGF7oIxggfcI+MPclo5n1 lua3f+5cHdDBIuU04Tzu0cIseIkE/Z0mNmMlyB+3u69OdVKSLxp78CPvwbOvydchZgPNEY dVgVnbdwcSI4t5q6Q2w0ia9yZs6FFiLWitZFdAdYgKIalzZrmb8+9rIrZ8nA0MJH3jwg0v TJ8dW4oKC4Ce6HVRBZjKgmzKwJxMB6aklAg33VZCSI9xXkW/RwW1a8Lx7mMwrmjXsCmPrB INNjcPQEjpUXh6PeoPKHHyIS1zuqsxSbxLDPEx5GlSjq9NRIPEYIwOJT+JwAHg== ARC-Authentication-Results: i=1; mx1.freebsd.org; none X-ThisMailContainsUnwantedMimeParts: N The branch main has been updated by carlavilla: URL: https://cgit.FreeBSD.org/doc/commit/?id=f46f0f22f07fa76f52112cd6b5c227e4f160da8d commit f46f0f22f07fa76f52112cd6b5c227e4f160da8d Author: Sergio Carlavilla Delgado AuthorDate: 2022-06-22 19:48:40 +0000 Commit: Sergio Carlavilla Delgado CommitDate: 2022-06-22 19:48:40 +0000 Improve user experience in Documentation Portal * Remove scrollbar thin * Increase fonts size in books menu and TOC * Improve fonts using system font stack as fallback * Improve UI in big screens * Add some margin in trademarks section * Change background color in light theme --- .../beastie/assets/styles/documentation.scss | 36 ++++--- .../themes/beastie/assets/styles/footer.scss | 13 ++- .../themes/beastie/assets/styles/global.scss | 30 +++--- .../themes/beastie/assets/styles/header.scss | 9 +- .../themes/beastie/assets/styles/variables.scss | 4 +- .../beastie/layouts/partials/site-footer.html | 118 +++++++++++---------- 6 files changed, 123 insertions(+), 87 deletions(-) diff --git a/documentation/themes/beastie/assets/styles/documentation.scss b/documentation/themes/beastie/assets/styles/documentation.scss index 28e15c5544..7826480db8 100644 --- a/documentation/themes/beastie/assets/styles/documentation.scss +++ b/documentation/themes/beastie/assets/styles/documentation.scss @@ -48,6 +48,11 @@ .main-wrapper-article { display: flex; margin-top: var(--header-height); + justify-content: center; + margin-left: auto; + margin-right: auto; + max-width: 1440px; + width: 100%; .article { flex-grow: 1; @@ -66,6 +71,11 @@ .main-wrapper-book { display: flex; margin-top: var(--header-height); + justify-content: center; + margin-left: auto; + margin-right: auto; + max-width: 1440px; + width: 100%; .book-menu { flex: 0 0 16rem; @@ -84,12 +94,12 @@ h3 { margin: 1rem 0; - border-bottom: none; padding-left: .5rem; + border-bottom: none; } #search-book { - margin: 0 0 .75rem .75rem; + margin-bottom: .75rem; border: 1px solid #CCC; border-radius: 4px; box-shadow: inset 0 1px 3px #DDD; @@ -97,6 +107,7 @@ background-color: #FCFCFD; color: #444; width: 95%; + margin-left: .5rem; } input.toggle ~ .icon::after { @@ -128,8 +139,9 @@ line-height: 2; ul { - margin: 0 0 0 .75rem; + margin: 0; padding: 0; + padding-left: .5rem; li { list-style: none; @@ -138,12 +150,15 @@ label { position: absolute; cursor: pointer; + font-size: 0.875rem; } a { color: var(--global-font-color); display: block; padding-left: 1rem; + padding-right: .5rem; + font-size: 0.875rem; } } } @@ -156,8 +171,7 @@ padding: var(--documentation-padding); width: 90vw; min-width: 20rem; - margin-left: auto; - margin-right: auto; + max-width: 1440px; padding-left: 1.5rem; padding-right: 1.5rem; transition-duration: 0.2s; @@ -259,16 +273,13 @@ a { color: var(--global-font-color); display: inline-block; - padding: .25rem 0 .25rem .5rem; + padding: .25rem .5rem .25rem .5rem; margin-left: .5rem; + font-size: 0.875rem; text-decoration: none; - i { - margin-right: .5rem; - } - &:hover { - font-weight: 500; + text-decoration: underline; } } } @@ -291,7 +302,8 @@ a { color: var(--global-font-color); display: inline-block; - padding: .25rem 0 .25rem .5rem; + padding: .25rem .5rem .25rem .5rem; + font-size: 0.875rem; } i { diff --git a/documentation/themes/beastie/assets/styles/footer.scss b/documentation/themes/beastie/assets/styles/footer.scss index 97981c93a7..aece947208 100644 --- a/documentation/themes/beastie/assets/styles/footer.scss +++ b/documentation/themes/beastie/assets/styles/footer.scss @@ -34,6 +34,13 @@ footer { background-color: var(--footer-background); border-top: 1px solid var(--footer-border-color); align-items: center; + justify-content: center; + + .container { + display: flex; + max-width: 1440px; + flex-flow: row wrap; + } > * { flex: 1 100%; @@ -59,7 +66,6 @@ footer { select { border: 1px solid #CCC; border-radius: 4px; - //box-shadow: inset 0 1px 3px #DDD; box-sizing: border-box; background-color: #FCFCFD; color: #444; @@ -129,9 +135,14 @@ footer { } } + .footer-nav > li { + margin-bottom: 2rem; + } + .copyright { display: flex; flex-wrap: wrap; + width: 100%; color: var(--global-font-color); .love { diff --git a/documentation/themes/beastie/assets/styles/global.scss b/documentation/themes/beastie/assets/styles/global.scss index 157cfd669c..c6e2bbaf6d 100644 --- a/documentation/themes/beastie/assets/styles/global.scss +++ b/documentation/themes/beastie/assets/styles/global.scss @@ -27,21 +27,14 @@ */ html { - font-family: 'Inter', sans-serif; + font-family: 'Inter', -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif; scroll-padding-top: var(--header-height); scroll-behavior: auto; } @supports (font-variation-settings: normal) { html { - font-family: 'Inter var', sans-serif; - } -} - -@supports (scrollbar-width:thin) { - body * { - scrollbar-width: thin; - scrollbar-color: #D9D9D9 transparent; + font-family: 'Inter var', -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif; } } @@ -56,7 +49,7 @@ body { color: var(--global-font-color); padding: 0; margin: 0; - font-size: 16px; + font-size: 100%; font-weight: 400; font-style: normal; cursor: auto; @@ -67,11 +60,20 @@ body { .main-wrapper { display: flex; flex-direction: column; - padding: 0rem 2rem 2rem 2rem; margin-top: var(--header-height); + justify-content: center; + margin-left: auto; + margin-right: auto; + max-width: 1440px; transition: padding .15s; background-color: var(--global-background-color); + .article { + .paragraph { + padding-left: .5rem; + } + } + .welcome-container { display: flex; width: 100%; @@ -407,7 +409,7 @@ figcaption { pre { border-radius: 0.25rem; - font-family: monospace; + font-family: Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, monospace; background-color: var(--pre-background-color); font-size: 1rem; color: var(--pre-font-color); @@ -708,7 +710,7 @@ table.stretch { } code { - font-family: "DejaVu Sans Mono", monospace; + font-family: "DejaVu Sans Mono", Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, monospace; font-size: 0.75rem; } @@ -717,6 +719,8 @@ code { } details { + margin: 1rem 0; + summary { cursor: pointer; } diff --git a/documentation/themes/beastie/assets/styles/header.scss b/documentation/themes/beastie/assets/styles/header.scss index bdc53aeb2f..04c953103e 100644 --- a/documentation/themes/beastie/assets/styles/header.scss +++ b/documentation/themes/beastie/assets/styles/header.scss @@ -33,6 +33,14 @@ header { width: 100%; z-index: 9999; + nav { + display: block; + max-width: 1440px; + width: 100%; + margin-left: auto; + margin-right: auto; + } + ul { margin: 0; padding: 0; @@ -162,5 +170,4 @@ header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after { header .menu-icon { display: none; } - } diff --git a/documentation/themes/beastie/assets/styles/variables.scss b/documentation/themes/beastie/assets/styles/variables.scss index 48a87f7c14..717f154347 100644 --- a/documentation/themes/beastie/assets/styles/variables.scss +++ b/documentation/themes/beastie/assets/styles/variables.scss @@ -49,14 +49,14 @@ --global-font-color: #444; --header-background: #9F0E0F; --header-font-color: #FFF; - --global-background-color: #FCFCFD; + --global-background-color: #FFF; --card-background-color: #F0F1F5; --card-border-color: #F0F1F5; --table-header-background-color: #F1F3F1; --table-header-font-color: #444; --footer-background: #F0F1F5; --footer-border-color: #F0F1F5; - --lines-color: #E6ECF1; + --lines-color: #DDD; --links-color: #0645AD; --pre-background-color: #F4F4F4; --pre-font-color: #444; diff --git a/documentation/themes/beastie/layouts/partials/site-footer.html b/documentation/themes/beastie/layouts/partials/site-footer.html index 7e00948dd1..06099138e9 100755 --- a/documentation/themes/beastie/layouts/partials/site-footer.html +++ b/documentation/themes/beastie/layouts/partials/site-footer.html @@ -1,65 +1,67 @@