Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit 2840cd5

Browse files
Significantly improve syntax support
Things now supported: • Fractions: hsl(25.7, 100%, 53.3%) = #f71. • Hue units deg, rad, grad, turn. • Negative hue rotations. • The fairly new commaless syntax: rgb(0 255 0) = rgb(0, 255, 0), hsl(210 50% 50% / 50%) = hsla(210, 50%, 50%, 0.5). I’ve added just one simple demonstration test. I’m too lazy to add it to more sample files.
1 parent 1c4b78f commit 2840cd5

File tree

2 files changed

+27
-11
lines changed

2 files changed

+27
-11
lines changed

‎autoload/css_color.vim

Lines changed: 25 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -11,17 +11,31 @@ if ! ( v:version >= 700 && has('syntax') && ( has('gui_running') || has('nvim')
1111
finish
1212
endif
1313

14-
function! s:rgb2color(r,g,b)
14+
" (v = value, u = unit)
15+
function! s:rgb2color(rv,ru,gv,gu,bv,bu)
1516
" Convert 80% -> 204, 100% -> 255, etc.
16-
let rgb = map( [a:r,a:g,a:b], 'v:val =~ "%$" ? ( 255 * v:val ) / 100 : v:val' )
17-
return printf( '%02x%02x%02x', rgb[0], rgb[1], rgb[2] )
17+
return printf('%02x%02x%02x',
18+
\ a:ru == "%" ? a:rv * 255 : a:rv,
19+
\ a:gu == "%" ? a:gv * 255 : a:gv,
20+
\ a:bu == "%" ? a:bv * 255 : a:bv)
1821
endfunction
1922

20-
function! s:hsl2color(h,s,l)
23+
function! s:hsl2color(hv,hu,sv,su,lv,lu)
2124
" Convert 80% -> 0.8, 100% -> 1.0, etc.
22-
let [s,l] = map( [a:s, a:l], 'v:val =~ "%$" ? v:val / 100.0 : v:val + 0.0' )
25+
let s = a:su == "%" ? str2float(a:sv) / 100.0 : str2float(a:sv)
26+
let l = a:lu == "%" ? str2float(a:lv) / 100.0 : str2float(a:lv)
27+
" Units: convert turn, grad, rad, assume anything else is unitless or deg.
28+
let hh = str2float(a:hv) / (
29+
\ a:hu == "turn" ? 1.0 :
30+
\ a:hu == "grad" ? 400.0 :
31+
\ a:hu == "rad" ? 6.283185307179586 :
32+
\ 360.0
33+
\ )
34+
" Get the floored remainder, so negative values work correctly.
35+
" (Can’t use % with floats, and it’s truncated modulo anyway.)
36+
let hh = hh < 0 ? hh - float2nr(hh) + 1 : hh - float2nr(hh)
37+
" Now hh is in the range [0, 1), as required.
2338
" algorithm transcoded to vim from http://www.w3.org/TR/css3-color/#hsl-color
24-
let hh = ( a:h % 360 ) / 360.0
2539
let m2 = l <= 0.5 ? l * ( s + 1 ) : l + s - l * s
2640
let m1 = l * 2 - m2
2741
let rgb = []
@@ -187,8 +201,8 @@ function! s:create_syn_match()
187201
let funcname = submatch(2)
188202

189203
let rgb_color
190-
\ = funcname == 'rgb' ? s:rgb2color(submatch(3),submatch(4),submatch(5))
191-
\ : funcname == 'hsl' ? s:hsl2color(submatch(3),submatch(4),submatch(5))
204+
\ = funcname == 'rgb' ? s:rgb2color(submatch(3),submatch(4),submatch(5),submatch(6),submatch(7),submatch(8))
205+
\ : funcname == 'hsl' ? s:hsl2color(submatch(3),submatch(4),submatch(5),submatch(6),submatch(7),submatch(8))
192206
\ : strlen(hex) >= 6 ? tolower(hex[0:5])
193207
\ : strlen(hex) >= 3 ? tolower(hex[0].hex[0].hex[1].hex[1].hex[2].hex[2])
194208
\ : ''
@@ -247,9 +261,9 @@ let s:_hexcolor = '#\(\x\{3}\%(\>\|\x\{3}\>\)\)' " submatch 1
247261
let s:_rgbacolor = '#\(\x\{3}\%(\>\|\x\%(\>\|\x\{2}\%(\>\|\x\{2}\>\)\)\)\)' " submatch 1
248262
let s:_funcname = '\(rgb\|hsl\)a\?' " submatch 2
249263
let s:_ws_ = '\s*'
250-
let s:_numval = s:_ws_ . '\(\d\{1,3}%\?\)' " submatch 3,4,5
251-
let s:_listsep = s:_ws_ . ','
252-
let s:_otherargs_ = '\%(,[^)]*\)\?'
264+
let s:_numval = s:_ws_ . '\(-\?\%(\d\+\%(\.\d\+\)\?\|\.\d\+\)\)\(%\|deg\|grad\|rad\|turn\)\?' " submatch 3,4,5,6,7,8
265+
let s:_listsep = '\%(\s*,\|\s\+\)'
266+
let s:_otherargs_ = '\%([,/][^)]*\)\?'
253267
let s:_funcexpr = s:_funcname . '[(]' . s:_numval . s:_listsep . s:_numval . s:_listsep . s:_numval . s:_ws_ . s:_otherargs_ . '[)]'
254268
let s:_csscolor = s:_rgbacolor . '\|' . s:_funcexpr
255269
" N.B. sloppy heuristic constants for performance reasons:

‎tests/example.css

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,13 @@ i { background: #359 }
22
b { background: #335599 }
33
u { background: rgba(144, 0, 0, .5) }
44
s { background: hsl(0, 100%, 50%) }
5+
a { background: hsl(-12.3rad 45.6% 78.9% / 01.2%) }
56

67
*::color1 { -x-: #359 }
78
*::color2 { -x-: #335599 }
89
*::color3 { -x-: rgba(144, 0, 0, .5) }
910
*::color4 { -x-: hsl(0, 100%, 50%) }
11+
*::color5 { -x-: hsl(-12.3rad 45.6% 78.9% / 01.2%) }
1012

1113
/*
1214
* #123, #456

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /