Box shadow
Box shadow atomic classes allow you to change an element’s box shadow quickly.
Class | Output | Hover? | Focus? |
---|---|---|---|
.bs-none |
box-shadow: none; |
||
.bs-sm |
box-shadow: 0 @su2 @su8 fade(@black-700, 10%); |
||
.bs-md |
box-shadow: 0 @su4 @su8 fade(@black-700, 20%); |
||
.bs-lg |
box-shadow: 0 @su4 @su12 fade(@black-800, 20%); |
||
.bs-i-sm |
box-shadow: inset 0 @su2/2 @su8 0 fade(@black-700, 10%); |
||
.bs-i-md |
box-shadow: inset 0 @su2/2 @su8 0 fade(@black-700, 20%); |
||
.bs-i-lg |
box-shadow: inset 0 @su2/2 @su12 0 fade(@black-800, 20%); |
||
.bs-ring |
box-shadow: 0 0 0 @su4 fade(@blue-500, 15%); |