From b96194ee005450a9fae295b3a4aa58d68f59a93c Mon Sep 17 00:00:00 2001 From: Alan Fernandes Date: Sun, 13 Apr 2025 15:32:08 -0300 Subject: [PATCH 1/6] Fix rich text styles Signed-off-by: Alan Fernandes --- static/assets/scss/global/_index.scss | 6 +-- static/assets/scss/global/_reset.scss | 12 ++++- static/assets/scss/global/_text.scss | 63 +++++++++++++++---------- static/assets/scss/highlight.scss | 3 +- static/assets/scss/pages/_404.scss | 2 - static/assets/scss/pages/_search.scss | 4 ++ static/templates/404.html | 4 +- static/templates/components/footer.html | 8 ++-- static/templates/search.html | 2 +- 9 files changed, 59 insertions(+), 45 deletions(-) diff --git a/static/assets/scss/global/_index.scss b/static/assets/scss/global/_index.scss index e3520d4..9a78ca4 100644 --- a/static/assets/scss/global/_index.scss +++ b/static/assets/scss/global/_index.scss @@ -151,13 +151,9 @@ main { display: flex; flex-wrap: wrap; justify-content: center; + font-size: 1rem; gap: 1rem; padding-block: 1rem; - - &__link { - - @extend %link; - } } .pageDescription { diff --git a/static/assets/scss/global/_reset.scss b/static/assets/scss/global/_reset.scss index ec17f8e..dece05e 100644 --- a/static/assets/scss/global/_reset.scss +++ b/static/assets/scss/global/_reset.scss @@ -8,7 +8,6 @@ *::before, *::after { box-sizing: border-box; - padding: 0; border: none; border-radius: 0; margin: 0; @@ -16,7 +15,6 @@ font-family: inherit; font-size: inherit; line-height: inherit; - list-style: none; text-align: inherit; text-transform: inherit; } @@ -54,6 +52,16 @@ a:where([class]:visited) { text-decoration: none; } +/* Reset styles on lists with classes. */ +ul:where([class]), +ol:where([class]) { + padding: 0; +} + +li:where([class]) { + list-style: none; +} + /* Add the correct font size in all browsers. */ small { font-size: 80%; diff --git a/static/assets/scss/global/_text.scss b/static/assets/scss/global/_text.scss index db7dea2..682fe8d 100644 --- a/static/assets/scss/global/_text.scss +++ b/static/assets/scss/global/_text.scss @@ -6,10 +6,10 @@ @use "variables" as *; -html { +body { color: $fgSecondary; font-family: system-ui, sans-serif; - font-size: 1rem; + font-size: 1.125rem; line-height: 1.5; } @@ -27,23 +27,46 @@ h6, .h6 { margin-bottom: 0.25em; color: $fgPrimary; - line-height: 1.1; + line-height: 1; text-wrap: balance; } +h1, +.h1, +%h1 { + font-size: 2rem; +} + +h2, +.h2, +%h2 { + font-size: 1.5rem; +} + +h3, +.h3, +%h3 { + font-size: 1.25rem; +} + .uRichText { - max-width: 65ch; line-height: 1.5; text-wrap: pretty; - :where(p), - :where(img), - :where(picture) { - margin-bottom: 1em; + :where(p) { + margin-top: 0.75em; + } - &:last-child { - margin-bottom: 0; - } + :where(ul, ol, pre, img, picture) { + margin-top: 0.25em; + } + + :where(h1, h2, h3, h4, h5, h6) { + margin-top: 1.5em; + } + + > :where(:first-child) { + margin-top: 0; } } @@ -61,23 +84,11 @@ code { } a:where(:not([class])), -%link { - color: $fgSecondary; +.a { + color: $fgPrimary; text-decoration: underline; &:hover { - color: $fgPrimary; + color: $fgSecondary; } } - -%h1 { - font-size: 2rem; -} - -%h2 { - font-size: 1.5rem; -} - -%h3 { - font-size: 1.25rem; -} diff --git a/static/assets/scss/highlight.scss b/static/assets/scss/highlight.scss index f002778..3455454 100644 --- a/static/assets/scss/highlight.scss +++ b/static/assets/scss/highlight.scss @@ -6,8 +6,7 @@ .chroma code { width: 100%; - border-radius: 8px; - margin-bottom: 1rem; + border-radius: 6px; background-color: #242424; color: #fff; padding-block: 0.5em; diff --git a/static/assets/scss/pages/_404.scss b/static/assets/scss/pages/_404.scss index 8d1dfbc..4ce2bb9 100644 --- a/static/assets/scss/pages/_404.scss +++ b/static/assets/scss/pages/_404.scss @@ -40,8 +40,6 @@ } &__link { - - @extend %link; display: block; margin-top: 1rem; } diff --git a/static/assets/scss/pages/_search.scss b/static/assets/scss/pages/_search.scss index 14eddc2..8bf5ba4 100644 --- a/static/assets/scss/pages/_search.scss +++ b/static/assets/scss/pages/_search.scss @@ -10,4 +10,8 @@ display: grid; gap: 1rem; } + + &__link { + margin-top: 1em; + } } diff --git a/static/templates/404.html b/static/templates/404.html index 16d17ea..5028169 100644 --- a/static/templates/404.html +++ b/static/templates/404.html @@ -37,9 +37,7 @@

404 Not Found

-
-

The package or page {{.Path}} could not be found.

- Return to homepage + Return to homepage
diff --git a/static/templates/components/footer.html b/static/templates/components/footer.html index bf12b1e..c3bc8bd 100644 --- a/static/templates/components/footer.html +++ b/static/templates/components/footer.html @@ -6,12 +6,12 @@ {{define "footer"}} {{end}} diff --git a/static/templates/search.html b/static/templates/search.html index e8bd692..cee4149 100644 --- a/static/templates/search.html +++ b/static/templates/search.html @@ -41,7 +41,7 @@

Search results for: {{if .NoResults}}

No packages found matching "{{.Query}}".

- Return to homepage + Return to homepage
{{else}}
    From 739c6652283060ab71f71fdabcbe5346a5c73d2d Mon Sep 17 00:00:00 2001 From: Alan Fernandes Date: Sun, 13 Apr 2025 15:33:24 -0300 Subject: [PATCH 2/6] Add bg to headers and standardize surfaces styles Signed-off-by: Alan Fernandes --- static/assets/scss/global/_index.scss | 37 +++++++++++------ static/assets/scss/global/_utility.scss | 8 ++++ static/assets/scss/main.scss | 2 - static/assets/scss/pages/_package.scss | 33 --------------- static/assets/scss/pages/_privacy.scss | 33 --------------- static/templates/index.html | 2 +- static/templates/package.html | 30 ++++++-------- static/templates/privacy.html | 54 ++++++++++++------------- static/templates/search.html | 4 +- 9 files changed, 75 insertions(+), 128 deletions(-) delete mode 100644 static/assets/scss/pages/_package.scss delete mode 100644 static/assets/scss/pages/_privacy.scss diff --git a/static/assets/scss/global/_index.scss b/static/assets/scss/global/_index.scss index 9a78ca4..2b30524 100644 --- a/static/assets/scss/global/_index.scss +++ b/static/assets/scss/global/_index.scss @@ -157,23 +157,36 @@ main { } .pageDescription { - padding-left: 16px; - border-radius: 8px; - border-left: 12px solid $fgPrimary; - margin-bottom: $layoutPadding; - padding-block: 6px; - &__title { + &__text:not(:last-child) { + margin-bottom: #{calc($layoutPadding / 2)}; + } - @extend %h1; + &.mNoCard { + padding-left: 1rem; + border-radius: 0.5rem; + border-left: 0.75rem solid $fgPrimary; + margin-bottom: $layoutPadding; + padding-block: 0.25rem; } - &__text { - color: $fgPrimary; - font-size: 1.125rem; + &.mCard { + + @extend %uSurface; + position: relative; + padding-left: 2.5rem; + margin-bottom: calc($layoutPadding / 2); + padding-block: 1rem; - &:not(:last-child) { - margin-bottom: #{calc($layoutPadding / 2)}; + &::before { + position: absolute; + top: 0; + left: 0; + width: 1rem; + height: 100%; + border-radius: 1rem 0 0 1rem; + background: $fgPrimary; + content: ""; } } } diff --git a/static/assets/scss/global/_utility.scss b/static/assets/scss/global/_utility.scss index a803544..91786b1 100644 --- a/static/assets/scss/global/_utility.scss +++ b/static/assets/scss/global/_utility.scss @@ -34,3 +34,11 @@ .uDisabled { pointer-events: none; } + +%uSurface, +.uSurface { + padding: 1.5rem; + border: 1px solid $borderPrimary; + border-radius: 1rem; + background: $bgPrimary; +} diff --git a/static/assets/scss/main.scss b/static/assets/scss/main.scss index e8693ea..758f001 100644 --- a/static/assets/scss/main.scss +++ b/static/assets/scss/main.scss @@ -5,7 +5,5 @@ */ @use "./pages/index"; -@use "./pages/package"; -@use "./pages/privacy"; @use "./pages/search"; @use "./pages/404" as *; diff --git a/static/assets/scss/pages/_package.scss b/static/assets/scss/pages/_package.scss deleted file mode 100644 index 0835258..0000000 --- a/static/assets/scss/pages/_package.scss +++ /dev/null @@ -1,33 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2025 The Cipher Host Team - * - * SPDX-License-Identifier: EUPL-1.2 - */ - -@use "../global"; -@use "../global/variables" as *; - -.package { - - &__instructions { - display: grid; - padding: 24px; - border: 1px solid $borderPrimary; - border-radius: 16px; - background: $bgPrimary; - gap: 3rem; - } - - &__instructionsSection { - min-width: 0; - } - - &__instructionsTitle { - - @extend %h2; - } - - &__instructionsText { - font-size: 1.125rem; - } -} diff --git a/static/assets/scss/pages/_privacy.scss b/static/assets/scss/pages/_privacy.scss deleted file mode 100644 index 11c16f8..0000000 --- a/static/assets/scss/pages/_privacy.scss +++ /dev/null @@ -1,33 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2025 The Cipher Host Team - * - * SPDX-License-Identifier: EUPL-1.2 - */ - -@use "../global"; -@use "../global/variables" as *; - -.privacy { - - &__instructions { - display: grid; - padding: 24px; - border: 1px solid $borderPrimary; - border-radius: 16px; - background: $bgPrimary; - gap: 3rem; - } - - &__instructionsSection { - min-width: 0; - } - - &__instructionsTitle { - - @extend %h2; - } - - &__instructionsText { - font-size: 1.125rem; - } -} diff --git a/static/templates/index.html b/static/templates/index.html index bf8e2e0..189c46b 100644 --- a/static/templates/index.html +++ b/static/templates/index.html @@ -61,7 +61,7 @@ {{template "header" .}}
    -
    +

    {{.Service.Name}}

    {{.Service.Description}} diff --git a/static/templates/package.html b/static/templates/package.html index 2bf6bf5..fd34c17 100644 --- a/static/templates/package.html +++ b/static/templates/package.html @@ -73,7 +73,7 @@ {{template "header" .}}

    -
    +

    {{.Name}}

    {{.Description}}

    @@ -89,20 +89,17 @@

    {{.Name}}

    -
    -
    -

    Installation

    -

    To install {{.Name}} and use it in your project, run:

    -
    1go get '{{.ImportPath}}@v{{.Version}}'
    -
    +
    +

    Installation

    +

    To install {{.Name}} and use it in your project, run:

    +
    1go get '{{.ImportPath}}@v{{.Version}}'
    -
    -

    Usage

    -

    To use this package in your code:

    - {{if .Usage}} - {{.Usage}} - {{else}} -
    1package main
    +        

    Usage

    +

    To use this package in your code:

    + {{if .Usage}} + {{.Usage}} + {{else}} +
    1package main
     2
     3import "{{.ImportPath}}"
     4
    @@ -110,9 +107,8 @@ 

    Usage

    6 // Do something with the package. 7}
    - {{end}} -

    For more examples and usage details, please check the Go reference documentation.

    -
    + {{end}} +

    For more examples and usage details, please check the Go reference documentation.

    diff --git a/static/templates/privacy.html b/static/templates/privacy.html index 761b05c..10863d7 100644 --- a/static/templates/privacy.html +++ b/static/templates/privacy.html @@ -50,38 +50,36 @@ {{template "header" .}}
    -
    +

    Privacy policy

    Last modified:

    -
    -
    -

    This privacy policy explains how we handle your data when you use our service. We believe in minimal data collection and maximum privacy, so we never sell your data and we collect only what is absolutely necessary to provide you with the service.

    -

    What we collect

    -

    We collect very little data. The only information we collect is partially anonymized IP addresses for security purposes.

    -

    These IP addresses have their last two segments removed, which makes it almost impossible to identify individual users while still allowing us to protect our service from abuse.

    -

    We do not:

    -
      -
    • Use cookies.
    • -
    • Track your behavior.
    • -
    • Use any analytics service.
    • -
    • Load resources from external sources.
    • -
    • Store any personal information.
    • -
    -

    How we use the data

    -

    The truncated IP addresses we collect are used solely for security purposes, such as preventing denial of service attacks and abuse.

    -

    This data is automatically deleted from our servers within 72 hours.

    -

    Your rights

    -

    Under the GDPR and other privacy laws, you have certain rights regarding your personal data. However, since we collect virtually no personal information, most of these rights (such as the right to access, correct, or delete your data) don't apply in practice.

    -

    Changes to this policy

    -

    If we make any changes to this privacy policy, we'll update the modification date at the top of this document.

    -

    Since we're committed to minimal data collection, any changes would likely be minor and related to security improvements.

    -

    Questions or concerns

    -

    If you have any questions about - this privacy policy or how we handle data, please contact us at {{.Service.Contact}}.

    -

    We take privacy seriously and will try to respond to your inquiry as quickly as possible.

    -
    +
    +

    This privacy policy explains how we handle your data when you use our service. We believe in minimal data collection and maximum privacy, so we never sell your data and we collect only what is absolutely necessary to provide you with the service.

    +

    What we collect

    +

    We collect very little data. The only information we collect is partially anonymized IP addresses for security purposes.

    +

    These IP addresses have their last two segments removed, which makes it almost impossible to identify individual users while still allowing us to protect our service from abuse.

    +

    We do not:

    +
      +
    • Use cookies.
    • +
    • Track your behavior.
    • +
    • Use any analytics service.
    • +
    • Load resources from external sources.
    • +
    • Store any personal information.
    • +
    +

    How we use the data

    +

    The truncated IP addresses we collect are used solely for security purposes, such as preventing denial of service attacks and abuse.

    +

    This data is automatically deleted from our servers within 72 hours.

    +

    Your rights

    +

    Under the GDPR and other privacy laws, you have certain rights regarding your personal data. However, since we collect virtually no personal information, most of these rights (such as the right to access, correct, or delete your data) don't apply in practice.

    +

    Changes to this policy

    +

    If we make any changes to this privacy policy, we'll update the modification date at the top of this document.

    +

    Since we're committed to minimal data collection, any changes would likely be minor and related to security improvements.

    +

    Questions or concerns

    +

    If you have any questions about + this privacy policy or how we handle data, please contact us at {{.Service.Contact}}.

    +

    We take privacy seriously and will try to respond to your inquiry as quickly as possible.

    diff --git a/static/templates/search.html b/static/templates/search.html index cee4149..15b6708 100644 --- a/static/templates/search.html +++ b/static/templates/search.html @@ -34,12 +34,12 @@ {{template "header" .}}
    -
    +

    Search results for: {{.Query}}

    {{if .NoResults}} -
    +

    No packages found matching "{{.Query}}".

    Return to homepage
    From ebb2b8d73a0156bb5025a9ed858ec8828b0179f5 Mon Sep 17 00:00:00 2001 From: Alan Fernandes Date: Sun, 13 Apr 2025 15:33:59 -0300 Subject: [PATCH 3/6] Adjust package cards spacings Signed-off-by: Alan Fernandes --- static/assets/scss/global/_index.scss | 12 +++++------- static/assets/scss/pages/_index.scss | 3 ++- 2 files changed, 7 insertions(+), 8 deletions(-) diff --git a/static/assets/scss/global/_index.scss b/static/assets/scss/global/_index.scss index 2b30524..b7f6e61 100644 --- a/static/assets/scss/global/_index.scss +++ b/static/assets/scss/global/_index.scss @@ -195,6 +195,7 @@ main { display: flex; flex-wrap: wrap; justify-content: space-between; + font-size: 1rem; &__item { display: flex; @@ -220,7 +221,6 @@ main { } &__stat { - strong { margin-right: 0.2em; } @@ -237,15 +237,13 @@ main { &__links { display: flex; flex-wrap: wrap; - - @include media("tablet") { - &:hover { border-color: $borderPrimary; background: $bgSecondary; diff --git a/static/assets/scss/pages/_index.scss b/static/assets/scss/pages/_index.scss index 8d20a60..b5e07ef 100644 --- a/static/assets/scss/pages/_index.scss +++ b/static/assets/scss/pages/_index.scss @@ -49,6 +49,7 @@ } &__description { - margin-bottom: 1em; + font-size: 1rem; + margin-bottom: 1.5em; } } From 84f678bb7fd3ff3ab2bc314daf4a3ba683e5f220 Mon Sep 17 00:00:00 2001 From: Alan Fernandes Date: Sun, 13 Apr 2025 15:34:45 -0300 Subject: [PATCH 4/6] Adjust header spacings and fix logo being cut off Signed-off-by: Alan Fernandes --- static/assets/scss/global/_index.scss | 13 +++++++++---- static/assets/scss/pages/_index.scss | 2 +- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/static/assets/scss/global/_index.scss b/static/assets/scss/global/_index.scss index b7f6e61..9a37254 100644 --- a/static/assets/scss/global/_index.scss +++ b/static/assets/scss/global/_index.scss @@ -57,22 +57,25 @@ main { width: 100%; max-width: none; justify-content: center; + padding: 0; border-bottom: 1px solid $borderSecondary; background: $bgPrimary; - padding-block: 12px; + padding-block: 0.75rem; &__inner { display: flex; width: 100%; max-width: $layoutWidth; align-items: center; - gap: 16px; + gap: 1rem; padding-inline: $layoutPadding; } &__logo { position: relative; + z-index: 1; display: block; + aspect-ratio: 1/1; color: $fgPrimary; &::after { @@ -221,6 +224,7 @@ main { } &__stat { + strong { margin-right: 0.2em; } @@ -243,12 +247,12 @@ main { &__link { position: relative; padding: 0.5em; - margin: -0.5em; border: 1px solid transparent; border-radius: 8px; + margin: -0.5em; text-decoration: underline; - --_icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' d='M9.75 4h.516A3.74 3.74 0 0 1 14 7.75c0 2.003-1.565 3.641-3.53 3.745l-.197.005l-.516.005a.75.75 0 0 1-.115-1.493l.101-.007l.523-.005A2.24 2.24 0 0 0 12.5 7.75c0-1.192-.92-2.166-2.081-2.245l-.153-.005H9.75a.75.75 0 0 1-.102-1.493zh.516zM5.752 4h.498a.75.75 0 0 1 .102 1.493L6.25 5.5h-.498a2.252 2.252 0 0 0-.154 4.5l.154.005h.498a.75.75 0 0 1 .102 1.493l-.102.007h-.498a3.752 3.752 0 0 1-.199-7.5zh.497zM5.75 7h4.5a.75.75 0 0 1 .102 1.493l-.102.007h-4.5a.75.75 0 0 1-.102-1.493zh4.5z'/%3E%3C/svg%3E"); transition: border-color 0.12s, background-color 0.12s, color 0.12s; + --_icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' d='M9.75 4h.516A3.74 3.74 0 0 1 14 7.75c0 2.003-1.565 3.641-3.53 3.745l-.197.005l-.516.005a.75.75 0 0 1-.115-1.493l.101-.007l.523-.005A2.24 2.24 0 0 0 12.5 7.75c0-1.192-.92-2.166-2.081-2.245l-.153-.005H9.75a.75.75 0 0 1-.102-1.493zh.516zM5.752 4h.498a.75.75 0 0 1 .102 1.493L6.25 5.5h-.498a2.252 2.252 0 0 0-.154 4.5l.154.005h.498a.75.75 0 0 1 .102 1.493l-.102.007h-.498a3.752 3.752 0 0 1-.199-7.5zh.497zM5.75 7h4.5a.75.75 0 0 1 .102 1.493l-.102.007h-4.5a.75.75 0 0 1-.102-1.493zh4.5z'/%3E%3C/svg%3E"); @include media("tablet") { + &:hover { border-color: $borderPrimary; background: $bgSecondary; diff --git a/static/assets/scss/pages/_index.scss b/static/assets/scss/pages/_index.scss index b5e07ef..c18f0e5 100644 --- a/static/assets/scss/pages/_index.scss +++ b/static/assets/scss/pages/_index.scss @@ -49,7 +49,7 @@ } &__description { - font-size: 1rem; margin-bottom: 1.5em; + font-size: 1rem; } } From b6d83820f2e714226a26662240b13a6c7dfc8964 Mon Sep 17 00:00:00 2001 From: Alan Fernandes Date: Sun, 13 Apr 2025 15:35:05 -0300 Subject: [PATCH 5/6] Use rems for padding and reduce padding on mobile Signed-off-by: Alan Fernandes --- static/assets/scss/global/_variables.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/static/assets/scss/global/_variables.scss b/static/assets/scss/global/_variables.scss index 98ed4ab..0079a8e 100644 --- a/static/assets/scss/global/_variables.scss +++ b/static/assets/scss/global/_variables.scss @@ -5,7 +5,7 @@ */ $layoutWidth: 750px; -$layoutPadding: 32px; +$layoutPadding: min(5%, 2rem); $fgPrimary: hsl(0deg 0% 14%); $fgSecondary: hsl(0deg 0% 30%); From 0eba8e4772fe4ec5ce6c26c4b8a6d6935c5a02eb Mon Sep 17 00:00:00 2001 From: Alan Fernandes Date: Sun, 13 Apr 2025 15:37:46 -0300 Subject: [PATCH 6/6] Add surface to 404 page Signed-off-by: Alan Fernandes --- static/templates/404.html | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/static/templates/404.html b/static/templates/404.html index 5028169..a54276d 100644 --- a/static/templates/404.html +++ b/static/templates/404.html @@ -37,6 +37,10 @@

    404 Not Found

    +
    +

    + The package or page {{.Path}} could not be found. +

    Return to homepage