diff --git a/static/assets/scss/global/_index.scss b/static/assets/scss/global/_index.scss index e3520d4..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 { @@ -151,33 +154,42 @@ main { display: flex; flex-wrap: wrap; justify-content: center; + font-size: 1rem; gap: 1rem; padding-block: 1rem; - - &__link { - - @extend %link; - } } .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: ""; } } } @@ -186,6 +198,7 @@ main { display: flex; flex-wrap: wrap; justify-content: space-between; + font-size: 1rem; &__item { display: flex; @@ -228,10 +241,7 @@ main { &__links { display: flex; flex-wrap: wrap; - - @include media("tablet") { 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/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/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%); 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/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/_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/_index.scss b/static/assets/scss/pages/_index.scss index 8d20a60..c18f0e5 100644 --- a/static/assets/scss/pages/_index.scss +++ b/static/assets/scss/pages/_index.scss @@ -49,6 +49,7 @@ } &__description { - margin-bottom: 1em; + margin-bottom: 1.5em; + font-size: 1rem; } } 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/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..a54276d 100644 --- a/static/templates/404.html +++ b/static/templates/404.html @@ -37,9 +37,11 @@

404 Not Found

-
-

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

- Return to homepage +
+

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

+ 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/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 e8bd692..15b6708 100644 --- a/static/templates/search.html +++ b/static/templates/search.html @@ -34,14 +34,14 @@ {{template "header" .}}
-
+

Search results for: {{.Query}}

{{if .NoResults}} -
+

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

- Return to homepage + Return to homepage
{{else}}