Skip to content
This repository has been archived by the owner on Mar 6, 2021. It is now read-only.

Latest commit

 

History

History
65 lines (47 loc) · 1.17 KB

TERMINOLOGY.md

File metadata and controls

65 lines (47 loc) · 1.17 KB

Terminology

Gradient

Gradient instance, resulting of a sg-gradient call.

// Example
$gradient: (
  "fallback": red,
  "direction": to bottom right,
  "legacy-direction": top left,
  "color-stops": (red 20%, yellow 31.6666666667%, green 43.3333333333%, blue 55%, red 55%, green 100%),
  "colors": (red, yellow, green, blue, red, green),
  "length": 6
);

Color

Value whom type is color.

// Example
$color: hotpink;

Stop

Length that comes with a color in a color-stop. Usually expressed in % but can be any unit.

// Example
$stop: 42%;

Color-stop

Breakpoint used in a gradient. Consists on a color which may or may not come with a stop, separated with a space.

// Example
$color-stop: hotpink;
$color-stop: hotpink 42%;

Full color-stop

Color-stop composed of a color and a stop.

// Example
$color-stop: hotpink 42%;

Fallback

When related to gradients, the fallback is the color being used before any linear-gradient declaration for browsers that do not support CSS gradients.

.selector {
    background: hotpink;
    background: linear-gradient(to right, hotpink, tomato);
}