form input background gradients
This commit is contained in:
parent
5ad171c467
commit
3891b2e381
|
@ -16,7 +16,47 @@ $success: $color__accent-success-300;
|
||||||
}
|
}
|
||||||
|
|
||||||
.input, .textarea {
|
.input, .textarea {
|
||||||
|
$color-bg: $color__neutral-900;
|
||||||
|
$gradient-from: .1;
|
||||||
|
$gradient-to: .3;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
background-color: rgba($color__neutral-900, .7);
|
||||||
|
background: linear-gradient(
|
||||||
|
to bottom,
|
||||||
|
rgba($color-bg, $gradient-from),
|
||||||
|
rgba($color-bg, $gradient-to),
|
||||||
|
rgba($color-bg, $gradient-to),
|
||||||
|
rgba($color-bg, $gradient-from),
|
||||||
|
),
|
||||||
|
linear-gradient(
|
||||||
|
to right,
|
||||||
|
rgba($color-bg, $gradient-from),
|
||||||
|
rgba($color-bg, $gradient-to),
|
||||||
|
rgba($color-bg, $gradient-to),
|
||||||
|
rgba($color-bg, $gradient-from),
|
||||||
|
);
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
$color-bg: #fff;
|
||||||
|
$gradient-from: .1;
|
||||||
|
$gradient-to: .5;
|
||||||
|
|
||||||
|
background: $color-bg;
|
||||||
|
background: linear-gradient(
|
||||||
|
to bottom,
|
||||||
|
rgba($color-bg, $gradient-from),
|
||||||
|
rgba($color-bg, $gradient-to),
|
||||||
|
rgba($color-bg, $gradient-to),
|
||||||
|
rgba($color-bg, $gradient-from),
|
||||||
|
),
|
||||||
|
linear-gradient(
|
||||||
|
to right,
|
||||||
|
rgba($color-bg, $gradient-from),
|
||||||
|
rgba($color-bg, $gradient-to),
|
||||||
|
rgba($color-bg, $gradient-to),
|
||||||
|
rgba($color-bg, $gradient-from),
|
||||||
|
);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.help {
|
.help {
|
||||||
|
|
Loading…
Reference in New Issue