mirror/hugo
1
0
Fork 0
mirror of https://github.com/gohugoio/hugo.git synced 2025-08-27 22:09:53 +02:00
Code Issues Packages Projects Releases Wiki Activity

tocss: Simplify the hugo:vars type handling

Browse Source 
Instead of maintaing a list of all CSS units and functions this commit:

* Uses 3 regexps to detect typed CSS values (e.g. `24px`) + properly handle numeric Go types.
* These regexps may have some false positives -- e.g. strings that needs to be quoted.
* For that rare case, you can mark the string with e.g. `"32xxx" | css.Quoted`
* For the opposite case:  `"32" | css.Unquoted`

Updates #10632
This commit is contained in:
Bjørn Erik Pedersen
2023-02-21 18:32:09 +01:00
parent a1a9c08b5f
commit ecf3cd514f
9 changed files with 206 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
resources/resource_transformers/tocss/internal/sass/cssValues.go
View File

@@ -15,65 +15,67 @@ package sass
type cssValue struct {
prefix []string
sufix []string
suffix []string
}
var (
cssValues = cssValue{
// https://developer.mozilla.org/en-US/docs/Web/CSS/color_value
prefix: []string{
"#",
"rgb(",
"attr(",
"calc(",
"clamp(",
"hsl(",
"hwb(",
"lch(",
"lab(",
"calc(",
"min(",
"lch(",
"max(",
"min(",
"minmax(",
"clamp(",
"attr(",
"rgb(",
},
sufix: []string{
"em",
"ex",
// https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Values_and_Units#dimensions
suffix: []string{
"%",
"cap",
"ch",
"ic",
"rem",
"lh",
"rlh",
"vw",
"vh",
"vi",
"vb",
"vmin",
"vmax",
"cqw",
"cm",
"cqb",
"cqh",
"cqi",
"cqb",
"cqmin",
"cqmax",
"cm",
"mm",
"Q",
"cqmin",
"cqw",
"deg",
"dpcm",
"dpi",
"dppx",
"em",
"ex",
"fr",
"grad",
"ic",
"in",
"lh",
"mm",
"ms",
"pc",
"pt",
"px",
"deg",
"grad",
"Q",
"rad",
"turn",
"rem",
"rlh",
"s",
"ms",
"fr",
"dpi",
"dpcm",
"dppx",
"turn",
"vb",
"vh",
"vi",
"vmax",
"vmin",
"vw",
"x",
"%",
},
}
)

64
resources/resource_transformers/tocss/internal/sass/helpers.go
View File

@@ -1,4 +1,4 @@
// Copyright 2022 The Hugo Authors. All rights reserved.
// Copyright 2023 The Hugo Authors. All rights reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
@@ -15,15 +15,18 @@ package sass
import (
"fmt"
"regexp"
"sort"
"strings"
"github.com/gohugoio/hugo/common/types/css"
)
const (
HugoVarsNamespace = "hugo:vars"
)
func CreateVarsStyleSheet(vars map[string]string) string {
func CreateVarsStyleSheet(vars map[string]any) string {
if vars == nil {
return ""
}
@@ -35,35 +38,56 @@ func CreateVarsStyleSheet(vars map[string]string) string {
if !strings.HasPrefix(k, "$") {
prefix = "$"
}
// These variables can be a combination of Sass identifiers (e.g. sans-serif), which
// should not be quoted, and URLs et, which should be quoted.
// unquote() is knowing what to do with each.
// Use quoteVar() to check if the variables should be quoted or not.
if quoteVar(v) {
varsSlice = append(varsSlice, fmt.Sprintf("%s%s: unquote(%q);", prefix, k, v))
} else {
varsSlice = append(varsSlice, fmt.Sprintf("%s%s: %s;", prefix, k, v))
switch v.(type) {
case css.QuotedString:
// Marked by the user as a string that needs to be quoted.
varsSlice = append(varsSlice, fmt.Sprintf("%s%s: %q;", prefix, k, v))
default:
if isTypedCSSValue(v) {
// E.g. 24px, 1.5rem, 10%, hsl(0, 0%, 100%), calc(24px + 36px), #fff, #ffffff.
varsSlice = append(varsSlice, fmt.Sprintf("%s%s: %v;", prefix, k, v))
} else {
// unquote will preserve quotes around URLs etc. if needed.
varsSlice = append(varsSlice, fmt.Sprintf("%s%s: unquote(%q);", prefix, k, v))
}
}
}
sort.Strings(varsSlice)
varsStylesheet = strings.Join(varsSlice, "\n")
fmt.Println(varsStylesheet)
fmt.Println(varsStylesheet)
return varsStylesheet
}
func quoteVar(v string) bool {
v = strings.Trim(v, "\"")
for _, p := range cssValues.prefix {
if strings.HasPrefix(v, p) {
return false
var (
isCSSColor = regexp.MustCompile(`^#[0-9a-fA-F]{3,6}$`)
isCSSFunc = regexp.MustCompile(`^([a-zA-Z-]+)\(`)
isCSSUnit = regexp.MustCompile(`^([0-9]+)(\.[0-9]+)?([a-zA-Z-%]+)$`)
)
// isTypedCSSValue returns true if the given string is a CSS value that
// we should preserve the type of, as in: Not wrap it in quotes.
func isTypedCSSValue(v any) bool {
switch s := v.(type) {
case int, int8, int16, int32, int64, uint, uint8, uint16, uint32, uint64, float32, float64, css.UnquotedString:
return true
case string:
if isCSSColor.MatchString(s) {
return true
}
}
for _, s := range cssValues.sufix {
if strings.HasSuffix(v, s) {
return false
if isCSSFunc.MatchString(s) {
return true
}
if isCSSUnit.MatchString(s) {
return true
}
}
return true
return false
}

44
resources/resource_transformers/tocss/internal/sass/helpers_test.go Normal file
View File

@@ -0,0 +1,44 @@
// Copyright 2023 The Hugo Authors. All rights reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
package sass
import (
"testing"
qt "github.com/frankban/quicktest"
)
func TestIsUnquotedCSSValue(t *testing.T) {
c := qt.New(t)
for _, test := range []struct {
in any
out bool
}{
{"24px", true},
{"1.5rem", true},
{"10%", true},
{"hsl(0, 0%, 100%)", true},
{"calc(24px + 36px)", true},
{"24xxx", true}, // a false positive.
{123, true},
{123.12, true},
{"#fff", true},
{"#ffffff", true},
{"#ffffffff", false},
} {
c.Assert(isTypedCSSValue(test.in), qt.Equals, test.out)
}
}