mirror of
https://github.com/getgrav/grav-plugin-admin.git
synced 2026-04-15 00:57:35 +02:00
121 lines
3.9 KiB
SCSS
121 lines
3.9 KiB
SCSS
// Add percentage of white to a color
|
|
@function tint($color, $percent) {
|
|
@return mix(white, $color, $percent);
|
|
}
|
|
|
|
// Add percentage of black to a color
|
|
@function shade($color, $percent) {
|
|
@return mix(black, $color, $percent);
|
|
}
|
|
|
|
@function _linear-positions-parser($pos) {
|
|
$type: type-of(nth($pos, 1));
|
|
$spec: null;
|
|
$degree: null;
|
|
$side: null;
|
|
$corner: null;
|
|
$length: length($pos);
|
|
// Parse Side and corner positions
|
|
@if ($length > 1) {
|
|
@if nth($pos, 1) == "to" { // Newer syntax
|
|
$side: nth($pos, 2);
|
|
|
|
@if $length == 2 { // eg. to top
|
|
// Swap for backwards compatability
|
|
$degree: _position-flipper(nth($pos, 2));
|
|
}
|
|
@else if $length == 3 { // eg. to top left
|
|
$corner: nth($pos, 3);
|
|
}
|
|
}
|
|
@else if $length == 2 { // Older syntax ("top left")
|
|
$side: _position-flipper(nth($pos, 1));
|
|
$corner: _position-flipper(nth($pos, 2));
|
|
}
|
|
|
|
@if ("#{$side} #{$corner}" == "left top") or ("#{$side} #{$corner}" == "top left") {
|
|
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
|
}
|
|
@else if ("#{$side} #{$corner}" == "right top") or ("#{$side} #{$corner}" == "top right") {
|
|
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
|
}
|
|
@else if ("#{$side} #{$corner}" == "right bottom") or ("#{$side} #{$corner}" == "bottom right") {
|
|
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
|
}
|
|
@else if ("#{$side} #{$corner}" == "left bottom") or ("#{$side} #{$corner}" == "bottom left") {
|
|
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
|
}
|
|
$spec: to $side $corner;
|
|
}
|
|
@else if $length == 1 {
|
|
// Swap for backwards compatability
|
|
@if $type == string {
|
|
$degree: $pos;
|
|
$spec: to _position-flipper($pos);
|
|
}
|
|
@else {
|
|
$degree: -270 - $pos; //rotate the gradient opposite from spec
|
|
$spec: $pos;
|
|
}
|
|
}
|
|
$degree: unquote($degree + ",");
|
|
$spec: unquote($spec + ",");
|
|
@return $degree $spec;
|
|
}
|
|
|
|
@function _position-flipper($pos) {
|
|
@return if($pos == left, right, null)
|
|
if($pos == right, left, null)
|
|
if($pos == top, bottom, null)
|
|
if($pos == bottom, top, null);
|
|
}
|
|
|
|
|
|
@mixin placeholder {
|
|
$placeholders: ":-webkit-input" ":-moz" "-moz" "-ms-input";
|
|
@each $placeholder in $placeholders {
|
|
&:#{$placeholder}-placeholder {
|
|
@content;
|
|
}
|
|
}
|
|
}
|
|
|
|
@mixin linear-gradient($pos, $G1, $G2: null,
|
|
$G3: null, $G4: null,
|
|
$G5: null, $G6: null,
|
|
$G7: null, $G8: null,
|
|
$G9: null, $G10: null,
|
|
$fallback: null) {
|
|
// Detect what type of value exists in $pos
|
|
$pos-type: type-of(nth($pos, 1));
|
|
$pos-spec: null;
|
|
$pos-degree: null;
|
|
|
|
// If $pos is missing from mixin, reassign vars and add default position
|
|
@if ($pos-type == color) or (nth($pos, 1) == "transparent") {
|
|
$G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5;
|
|
$G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos;
|
|
$pos: null;
|
|
}
|
|
|
|
@if $pos {
|
|
$positions: _linear-positions-parser($pos);
|
|
$pos-degree: nth($positions, 1);
|
|
$pos-spec: nth($positions, 2);
|
|
}
|
|
|
|
$full: $G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10;
|
|
|
|
// Set $G1 as the default fallback color
|
|
$fallback-color: nth($G1, 1);
|
|
|
|
// If $fallback is a color use that color as the fallback color
|
|
@if (type-of($fallback) == color) or ($fallback == "transparent") {
|
|
$fallback-color: $fallback;
|
|
}
|
|
|
|
background-color: $fallback-color;
|
|
background-image: -webkit-linear-gradient($pos-degree $full); // Safari 5.1+, Chrome
|
|
background-image: unquote("linear-gradient(#{$pos-spec}#{$full})");
|
|
}
|