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 fd9f4f8

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 14fd934 commit fd9f4f8

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 == "%" ? float2nr(a:rv * 2.55) : a:rv,
19+
\ a:gu == "%" ? float2nr(a:gv * 2.55) : a:gv,
20+
\ a:bu == "%" ? float2nr(a:bv * 2.55) : 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 = []
@@ -171,8 +185,8 @@ function! s:create_syn_match()
171185
let funcname = submatch(2)
172186

173187
let rgb_color
174-
\ = funcname == 'rgb' ? s:rgb2color(submatch(3),submatch(4),submatch(5))
175-
\ : funcname == 'hsl' ? s:hsl2color(submatch(3),submatch(4),submatch(5))
188+
\ = funcname == 'rgb' ? s:rgb2color(submatch(3),submatch(4),submatch(5),submatch(6),submatch(7),submatch(8))
189+
\ : funcname == 'hsl' ? s:hsl2color(submatch(3),submatch(4),submatch(5),submatch(6),submatch(7),submatch(8))
176190
\ : strlen(hex) >= 6 ? tolower(hex[0:5])
177191
\ : strlen(hex) >= 3 ? tolower(hex[0].hex[0].hex[1].hex[1].hex[2].hex[2])
178192
\ : ''
@@ -231,9 +245,9 @@ let s:_hexcolor = '#\(\x\{3}\%(\>\|\x\{3}\>\)\)' " submatch 1
231245
let s:_rgbacolor = '#\(\x\{3}\%(\>\|\x\%(\>\|\x\{2}\%(\>\|\x\{2}\>\)\)\)\)' " submatch 1
232246
let s:_funcname = '\(rgb\|hsl\)a\?' " submatch 2
233247
let s:_ws_ = '\s*'
234-
let s:_numval = s:_ws_ . '\(\d\{1,3}\%(%\|deg\)\?\)' " submatch 3,4,5
235-
let s:_listsep = s:_ws_ . ','
236-
let s:_otherargs_ = '\%(,[^)]*\)\?'
248+
let s:_numval = s:_ws_ . '\(-\?\%(\d\+\%(\.\d\+\)\?\|\.\d\+\)\)\(%\|deg\|grad\|rad\|turn\)\?' " submatch 3,4,5,6,7,8
249+
let s:_listsep = '\%(\s*,\|\s\+\)'
250+
let s:_otherargs_ = '\%([,/][^)]*\)\?'
237251
let s:_funcexpr = s:_funcname . '[(]' . s:_numval . s:_listsep . s:_numval . s:_listsep . s:_numval . s:_ws_ . s:_otherargs_ . '[)]'
238252
let s:_csscolor = s:_rgbacolor . '\|' . s:_funcexpr
239253
" 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 によって変換されたページ (->オリジナル) /