snippet b1(\w+) "Border (1px)" r
`!p
import re
colors = {
		'r': 'red',
		'g': 'green',
		'b': 'blue',
		'y': 'yellow',
		'o': 'orange',
		'p': 'purple',
		'c': 'cyan',
		'm': 'magenta',
		'w': 'white',
}
color = colors.get(match.group(1), 'black')
snip.rv = f"border: 1px solid {color};"
`$0
endsnippet

snippet df "Use flexbox layout"
display: flex;
$0
endsnippet

snippet fr "Use row direction (flex)"
flex-direction: row;
$0
endsnippet

snippet fc "Use column direction (flex)"
flex-direction: column;
$0
endsnippet

snippet dfr "Use flexbox layout in row direction"
display: flex;
flex-direction: row;
$0
endsnippet

snippet dfr "Use flexbox layout in column direction"
display: flex;
flex-direction: column;
$0
endsnippet

snippet dg "Use CSS grid layout"
display: grid;
$0
endsnippet

snippet db "Use block layout"
display: block;
$0
endsnippet

snippet dn "Set display to 'none'"
display: none;
$0
endsnippet

snippet var "Use CSS variable"
var(--$1)$0
endsnippet

snippet m
margin: $0;
endsnippet

snippet p
padding: $0;
endsnippet