Remove KiteTail-specific colors and related utilities

This commit is contained in:
Adam Wathan 2017-08-01 17:04:18 -04:00
parent 483010e5c6
commit 5a09eb6369
4 changed files with 10 additions and 56 deletions

View File

@ -1,24 +1,6 @@
@hue-slate: 208;
@hue-cream: 50;
@hue-brand-primary: 171;
@color-brand-primary: #00ceae;
@color-brand-gradient-start: #00b8c6;
@color-brand-gradient-stop: #00c6a2;
@hue-blue: 193;
@color-blue: hsl(@hue-blue, 77%, 58%);
@hue-green: 167;
@color-green: hsl(@hue-green, 53%, 55%);
@hue-red: 2;
@color-danger: hsl(@hue-red, 75%, 55%);
@hue-gray: 208;
// @hue-gray: 50;
@color-gray-10: #fff;
@color-gray-10: hsl(@hue-gray, 20%, 100%);
@color-gray-9: hsl(@hue-gray, 20%, 98%);
@color-gray-8: hsl(@hue-gray, 25%, 96%);
@color-gray-7: hsl(@hue-gray, 25%, 90%);
@ -31,5 +13,3 @@
@color-white: @color-gray-10;
@color-black: @color-gray-1;
@color-blue-highlight: hsl(215, 99%, 63%);

View File

@ -1,15 +1,13 @@
@bg-light-hue: @hue-slate;
@bg-light-hue: @hue-gray;
@bg-light: hsl(@bg-light-hue, 0%, 100%);
@bg-light-soft: hsl(@bg-light-hue, 20%, 98%);
@bg-light-softer: hsl(@bg-light-hue, 20%, 96%);
@bg-dark-hue: @hue-slate;
@bg-dark-hue: @hue-gray;
@bg-dark: hsl(@bg-dark-hue, 14%, 33%);
@bg-dark-soft: hsl(@bg-dark-hue, 14%, 42%);
@bg-dark-softer: hsl(@bg-dark-hue, 14%, 52%);
@bg-primary: @color-brand-primary;
@bg-highlight: hsl(215, 99%, 63%);
.bg-light { background-color: @bg-light; }
@ -24,12 +22,6 @@
.bg-dark-soft { background-color: @bg-dark-soft; }
.bg-dark-softer { background-color: @bg-dark-softer; }
.bg-primary { background-color: @bg-primary; }
.bg-primary-soft { background-color: fade(@bg-primary, 35%); }
.bg-primary-dark { background-color: darken(@bg-primary, 20%); }
.bg-brand-gradient { background-image: linear-gradient(to right, @color-brand-gradient-start, @color-brand-gradient-stop); }
.bg-overlay-softest { background-color: rgba(0,0,0,0.15); }
.bg-overlay-soft { background-color: rgba(0,0,0,0.5); }
.bg-overlay-dark { background-color: rgba(0,0,0,0.75); }
@ -41,9 +33,6 @@
&bg-light { .bg-light; }
&bg-light-soft { .bg-light-soft; }
&bg-light-softer { .bg-light-softer; }
&bg-primary { .bg-primary; }
&bg-primary-soft { .bg-primary-soft; }
&bg-primary-dark { .bg-primary-dark; }
&bg-overlay-soft { .bg-overlay-soft; }
&bg-overlay-dark { .bg-overlay-dark; }
});

View File

@ -1,4 +1,4 @@
@border-dark-hue: @hue-slate;
@border-dark-hue: @hue-gray;
@border-dark: hsl(@border-dark-hue, 25%, 82%);
@border-dark-soft: hsl(@border-dark-hue, 25%, 90%);
@border-dark-softer: hsl(@border-dark-hue, 25%, 96%);
@ -7,11 +7,6 @@
@border-light-soft: fade(@color-white, 60%);
@border-light-softer: fade(@color-white, 35%);
@border-danger: @color-danger;
@border-danger-soft: fade(@color-danger, 50%);
@border-brand: @color-brand-primary;
@border-default-color: @border-dark-soft;
@border-radius-1: .125rem;
@ -95,11 +90,6 @@
.border-l-light-soft { border-left-color: @border-light-soft; }
.border-l-light-softer { border-left-color: @border-light-softer; }
.border-brand { border-color: @border-brand; }
.border-danger { border-color: @border-danger; }
.border-danger-soft { border-color: @border-danger-soft; }
.border-invisible { border-color: transparent; }
.hover-border-invisible { &:hover { .border-invisible; } }

View File

@ -28,14 +28,12 @@
@text-light-softer: fade(@color-white, 45%);
@text-light-softest: fade(@color-white, 35%);
@text-dark-hue: @hue-slate;
@text-dark: hsl(@text-dark-hue, 10%, 25%);
@text-dark-soft: hsl(@text-dark-hue, 10%, 50%);
@text-dark-softer: hsl(@text-dark-hue, 10%, 65%);
@text-dark-softest: hsl(@text-dark-hue, 10%, 75%);
@text-dark-hue: @hue-gray;
@text-dark: hsl(@text-dark-hue, 0%, 25%);
@text-dark-soft: hsl(@text-dark-hue, 0%, 50%);
@text-dark-softer: hsl(@text-dark-hue, 0%, 65%);
@text-dark-softest: hsl(@text-dark-hue, 0%, 75%);
@text-brand: hsl(@hue-brand-primary, 100%, 40%);
@text-danger: @color-danger;
// Sizes
.text-xs { font-size: @font-size-xs; }
@ -64,9 +62,6 @@
.text-dark-softer { color: @text-dark-softer; }
.text-dark-softest { color: @text-dark-softest; }
.text-brand { color: @text-brand; }
.text-danger { color: @text-danger; }
// Line heights
.leading-none { line-height: 1; }
.leading-tight { line-height: 1.25; }