diff --git a/css/css.go b/css/css.go index a8a76e53e..87ffd5111 100644 --- a/css/css.go +++ b/css/css.go @@ -539,12 +539,15 @@ func (c *cssMinifier) minifyProperty(prop css.Hash, values []Token) []Token { values = []Token{{css.IdentToken, []byte("none"), nil}} } case css.Background: + // TODO: multiple background layers separated by comma hasSize := false for i := 0; i < len(values); i++ { if values[i].TokenType == css.DelimToken && values[i].Data[0] == '/' { hasSize = true - if i+1 < len(values) && (values[i+1].TokenType == css.NumberToken || values[i+1].TokenType == css.PercentageToken || values[i+1].TokenType == css.IdentToken && bytes.Equal(values[i+1].Data, []byte("auto"))) { - if i+2 < len(values) && (values[i+2].TokenType == css.NumberToken || values[i+2].TokenType == css.PercentageToken || values[i+2].TokenType == css.IdentToken && bytes.Equal(values[i+2].Data, []byte("auto"))) { + // background-size consists of either [ | auto | cover | contain] or [ | auto]{2} + // we can only minify the latter + if i+1 < len(values) && (values[i+1].TokenType == css.NumberToken || values[i+1].TokenType == css.PercentageToken || values[i+1].TokenType == css.IdentToken && bytes.Equal(values[i+1].Data, []byte("auto")) || values[i+1].TokenType == css.FunctionToken) { + if i+2 < len(values) && (values[i+2].TokenType == css.NumberToken || values[i+2].TokenType == css.PercentageToken || values[i+2].TokenType == css.IdentToken && bytes.Equal(values[i+2].Data, []byte("auto")) || values[i+2].TokenType == css.FunctionToken) { sizeValues := c.minifyProperty(css.Background_Size, values[i+1:i+3]) if len(sizeValues) == 1 && bytes.Equal(sizeValues[0].Data, []byte("auto")) { values = append(values[:i], values[i+3:]...) @@ -554,10 +557,6 @@ func (c *cssMinifier) minifyProperty(prop css.Hash, values []Token) []Token { values = append(values[:i+1], append(sizeValues, values[i+3:]...)...) i += len(sizeValues) - 1 } - } else if values[i+1].TokenType == css.IdentToken && bytes.Equal(values[i+1].Data, []byte("auto")) { - values = append(values[:i], values[i+2:]...) - hasSize = false - i-- } } } @@ -600,6 +599,7 @@ func (c *cssMinifier) minifyProperty(prop css.Hash, values []Token) []Token { continue } + // background-position or background-size if values[i].TokenType == css.NumberToken || values[i].TokenType == css.PercentageToken || values[i].TokenType == css.IdentToken && (h == css.Left || h == css.Right || h == css.Top || h == css.Bottom || h == css.Center) { j := i + 1 for ; j < len(values); j++ { diff --git a/css/css_test.go b/css/css_test.go index 675c72906..a545bd570 100644 --- a/css/css_test.go +++ b/css/css_test.go @@ -95,9 +95,9 @@ func TestCSSInline(t *testing.T) { {"color: rgba(255,0,0,1);", "color:red"}, {"color: rgba(255,0,0,2);", "color:red"}, {"color: rgba(255,0,0,0.5);", "color:rgba(255,0,0,.5)"}, // {"color: rgba(255,0,0,0.5);", "color:#ff000080"}, - {"color: rgba(255,0,0,-1);", "color:transparent"}, // {"color: rgba(255,0,0,-1);", "color:#0000"}, + {"color: rgba(255,0,0,-1);", "color:transparent"}, // {"color: rgba(255,0,0,-1);", "color:#0000"}, // {"color: rgba(0%,15%,25%,0.2);", "color:rgba(0,15%,25%,.2)"}, TODO: zero percentage to zero // {"color: rgba(0%,15%,25%,0.2);", "color:#00264033"}, - {"color: rgba(0,0,0,0.5);", "color:rgba(0,0,0,.5)"}, // {"color: rgba(0,0,0,0.5);", "color:#00000080"}, + {"color: rgba(0,0,0,0.5);", "color:rgba(0,0,0,.5)"}, // {"color: rgba(0,0,0,0.5);", "color:#00000080"}, {"color: rgba(0,0,0,0.264705882);", "color:rgba(0,0,0,.264705882)"}, // {"color: rgba(0,0,0,0.264705882);", "color:#0004"}, {"color: rgb(255 0 0 / 1);", "color:red"}, {"color: hsla(5,0%,10%,0.75);", "color:hsla(5,0%,10%,.75)"}, // {"color: hsla(5,0%,10%,0.75);", "color:#1a1a1abf"}, @@ -143,6 +143,10 @@ func TestCSSInline(t *testing.T) { {"background:no-repeat repeat", "background:repeat-y"}, {"background:top right", "background:100% 0"}, {"background:bottom left", "background:0 100%"}, + {"background:#fff url(foo.svg) no-repeat right .75rem center / auto calc(100% - 1.5rem)", "background:#fff url(foo.svg) no-repeat 100% .75rem 50%/auto calc(100% - 1.5rem)"}, + {"background:#fff / 5% auto", "background:#fff/5%"}, + {"background:#fff / auto 5%", "background:#fff/auto 5%"}, + {"background:calc(5%-2%) center", "background:calc(5%-2%)"}, {"font-weight: bold; font-weight: normal;", "font-weight:700;font-weight:400"}, {"font: caption;", "font:caption"}, {"font: bold 5px \"Times new Roman\",\"Sans-Serif\";", "font:700 5px times new roman,sans-serif"},