Browse Source

fix(personalization): rename accent color to trim color

accent color has a specific meaning in a design setting, trim is more appropriate
Josh Habdas 1 year ago
parent
commit
88cd373200
Signed by: Josh Habdas <jhabdas@protonmail.com> GPG Key ID: B148B31154C75A74
2 changed files with 8 additions and 8 deletions
  1. 7
    7
      README.md
  2. 1
    1
      layouts/partials/meta/theme-color.html

+ 7
- 7
README.md View File

@@ -32,7 +32,7 @@ Feature | Summary
32 32
 [Section Menu](#section-menu) | Display an accessible site-wide navigation with links to content sections.
33 33
 [Display Variants](#display-variants) | Customize look-and-feel with one of six included display variations.
34 34
 [Custom Styles](#custom-styles) | Add to, override or disable theme styles for complete design control.
35
-[Accent Color](#accent-color) | Tell supporting browsers and OSes how they should style the UI surrounding your content.
35
+[Trim Color](#trim-color) | Tell supporting browsers and OS's how they should style the UI surrounding your content.
36 36
 [SVG Favicon](#svg-favicon) | Help push browser standards forward by decorating your site with an SVG favicon.
37 37
 [Fuzzy Search](#fuzzy-search) | Find and share indexable content anywhere on your site. No registration required.
38 38
 [Code Highlighter](#code-highlighter) | Highlight code in over 160 languages without requiring JavaScript.
@@ -583,7 +583,7 @@ The default display variant uses the `dark` color palette with the `hack` displa
583 583
   palette = "dark" # Optional, choose from 'dark', 'dark-grey' and 'solarized-dark'
584 584
 ```
585 585
 
586
-Once updated review the [404 Page](#404-page), [Accent Color](#accent-color) and tweak your [Custom Styles](#custom-styles) to suit your personal taste.
586
+Once updated review the [404 Page](#404-page), [Trim Color](#trim-color) and tweak your [Custom Styles](#custom-styles) to suit your personal taste.
587 587
 
588 588
 #### Custom Styles
589 589
 
@@ -626,19 +626,19 @@ With `hugo serve` running, changes to your site `custom.css` will trigger an aut
626 626
 
627 627
 Finally, if you wish to disable all theme styles, disable the [Display Variant](#display-variants) after creating your `custom.css`.
628 628
 
629
-#### Accent Color
629
+#### Trim Color
630 630
 
631
-Use [`theme-color` meta extension](https://html.spec.whatwg.org/multipage/semantics.html#meta-theme-color) in the `<head>` of your pages to suggest the color that browsers and OSes should use if they customize the display of individual pages in their UIs with varying colors.
631
+Uses the [`theme-color` meta extension](https://html.spec.whatwg.org/multipage/semantics.html#meta-theme-color) in the `<head>` of your pages to suggest the color that browsers and OS's should use if they customize the display of individual pages in their UIs with varying colors.
632 632
 
633
-If left unchanged, accent color is set automatically to background color of the [Display Variant](#display-variants). To customize the accent color add a CSS variable called `--accent-color` to your [Custom Styles](#custom-styles):
633
+If left unchanged, color is set automatically to background color of the [Display Variant](#display-variants). To customize the trim color add a CSS variable called `--trim-color` to your [Custom Styles](#custom-styles):
634 634
 
635 635
 ```css
636 636
 :root {
637
-  --accent-color: rgba(1e2, .5e1, .5e0, +.25e2%); // functional syntax with floats value
637
+  --trim-color: rgba(1e2, .5e1, .5e0, +.25e2%); // functional syntax with floats value
638 638
 }
639 639
 ```
640 640
 
641
-You may then start adding and [Using CSS variables](https://devdocs.io/css/using_css_variables) within your `custom.css` anywhere accent colors or other variables are desired.
641
+You may then start adding and [Using CSS variables](https://devdocs.io/css/using_css_variables) within your `custom.css` anywhere colors or other variables are desired.
642 642
 
643 643
 #### SVG Favicon
644 644
 

+ 1
- 1
layouts/partials/meta/theme-color.html View File

@@ -1,4 +1,4 @@
1
-{{ $cssvar := "--accent-color:\\s*([^!;}]*).*" }}
1
+{{ $cssvar := "--trim-color:\\s*([^!;}]*).*" }}
2 2
 {{ $hackbg := "pre{background-color:([^!;}]*).*" }}
3 3
 {{ with index (findRE $cssvar . 1) 0 }}
4 4
   <meta name="theme-color" content={{ strings.TrimRight " " (. | replaceRE $cssvar "$1") }}>

Loading…
Cancel
Save