angular2-boiler-plate
Version:
Angular 2 Boiler plate that integrated with WebPack, TypeScript, DatePicker, RxJs for Reactive Extensions in Java Script , Karma , Jasmine for unit testing , WebKit ,protractor e2e testing
672 lines (665 loc) • 14.7 kB
text/less
@black: #000000; // Appears 38 times
@white: #ffffff; // Appears 30 times
@pink: #e91e63; // Appears 6 times
@orange: #ff9800; // Appears 6 times
@purple: #9c27b0; // Appears 6 times
@deep-orange: #ff5722; // Appears 6 times
@red: #f44336; // Appears 6 times
@teal: #009688; // Appears 6 times
@sand: #fdf5e6; // Appears 6 times
@lime: #cddc39; // Appears 6 times
@amber: #ffc107; // Appears 6 times
@deep-purple: #673ab7; // Appears 6 times
@light-blue : #87ceeb; // Appears 6 times
@blue: #2196f3; // Appears 6 times
@aqua: #00ffff; // Appears 6 times
@brown: #795548; // Appears 6 times
@cyan: #00bcd4; // Appears 6 times
@indigo: #3f51b5; // Appears 6 times
@light-green: #8bc34a; // Appears 6 times
@green: #4caf50; // Appears 6 times
@yellow: #ffeb3b; // Appears 4 times
@pale-yellow : #ffffcc; // Appears 4 times
@khaki: #f0e68c; // Appears 4 times
@light-grey: #f1f1f1; // Appears 3 times
@blue-grey: #607d8b; // Appears 3 times
@hover-grey: #9e9e9e; // Appears 2 times
@dark-grey: #616161; // Appears 2 times
.sui-amber {
background-color: @amber;
color: @black;
}
.sui-hover-amber {
&:hover {
background-color: @amber;
color: @black;
}
}
.sui-aqua {
background-color: @aqua;
color: @black;
}
.sui-hover-aqua {
&:hover {
background-color: @aqua;
color: @black;
}
}
.sui-blue {
background-color: @blue;
color: @white;
}
.sui-hover-blue {
&:hover {
background-color: @blue;
color: @white;
}
}
.sui-light-blue {
background-color: @light-blue ;
color: @black;
}
.sui-hover-light-blue {
&:hover {
background-color: @light-blue ;
color: @black;
}
}
.sui-brown {
background-color: @brown;
color: @white;
}
.sui-hover-brown {
&:hover {
background-color: @brown;
color: @white;
}
}
.sui-cyan {
background-color: @cyan;
color: @black;
}
.sui-hover-cyan {
&:hover {
background-color: @cyan;
color: @black;
}
}
.sui-blue-grey, .sui-hover-blue-grey:hover, .sui-blue-gray, .sui-hover-blue-gray:hover {
background-color: @blue-grey;
color: @white;
}
.sui-green {
background-color: @green;
color: @white;
}
.sui-hover-green {
&:hover {
background-color: @green;
color: @white;
}
}
.sui-light-green {
background-color: @light-green;
color: @black;
}
.sui-hover-light-green {
&:hover {
background-color: @light-green;
color: @black;
}
}
.sui-indigo {
background-color: @indigo;
color: @white;
}
.sui-white {
background-color: @white;
color: @black;
}
.sui-hover-indigo {
&:hover {
background-color: @indigo;
color: @white;
}
}
.sui-khaki {
background-color: @khaki;
color: @black;
}
.sui-hover-khaki {
&:hover {
background-color: @khaki;
color: @black;
}
}
.sui-lime {
background-color: @lime;
color: @black;
}
.sui-hover-lime {
&:hover {
background-color: @lime;
color: @black;
}
}
.sui-orange {
background-color: @orange;
color: @black;
}
.sui-hover-orange {
&:hover {
background-color: @orange;
color: @black;
}
}
.sui-deep-orange {
background-color: @deep-orange;
color: @white;
}
.sui-hover-deep-orange {
&:hover {
background-color: @deep-orange;
color: @white;
}
}
.sui-pink {
background-color: @pink;
color: @white;
}
.sui-hover-pink {
&:hover {
background-color: @pink;
color: @white;
}
}
.sui-purple {
background-color: @purple;
color: @white;
}
.sui-hover-purple {
&:hover {
background-color: @purple;
color: @white;
}
}
.sui-deep-purple {
background-color: @deep-purple;
color: @white;
}
.sui-hover-deep-purple {
&:hover {
background-color: @deep-purple;
color: @white;
}
}
.sui-red {
background-color: @red;
color: @white;
}
.sui-hover-red {
&:hover {
background-color: @red;
color: @white;
}
}
.sui-sand {
background-color: @sand;
color: @black;
}
.sui-hover-sand {
&:hover {
background-color: @sand;
color: @black;
}
}
.sui-teal {
background-color: @teal;
color: @white;
}
.sui-hover-teal {
&:hover {
background-color: @teal;
color: @white;
}
}
.sui-yellow {
background-color: @yellow;
color: @black;
}
.sui-hover-yellow {
&:hover {
background-color: @yellow;
color: @black;
}
}
.sui-white {
background-color: @white;
color: @black;
}
.sui-hover-white {
&:hover {
background-color: @white;
color: @black;
}
}
.sui-black {
background-color: @black;
color: @white;
}
.sui-hover-black {
&:hover {
background-color: @black;
color: @white;
}
}
.sui-grey, .sui-hover-grey:hover, .sui-gray, .sui-hover-gray:hover {
background-color: @hover-grey;
color: @black;
}
.sui-light-grey, .sui-hover-light-grey:hover, .sui-light-gray, .sui-hover-light-gray:hover {
background-color: @light-grey;
color: @black;
}
.sui-dark-grey, .sui-hover-dark-grey:hover, .sui-dark-gray, .sui-hover-dark-gray:hover {
background-color: @dark-grey;
color: @white;
}
.sui-pale-yellow {
background-color: @pale-yellow ;
color: @black;
}
.sui-hover-pale-yellow {
&:hover {
background-color: @pale-yellow ;
color: @black;
}
}
.sui-text-amber {
color: @amber;
}
.sui-hover-text-amber {
&:hover {
color: @amber;
}
}
.sui-text-aqua {
color: @aqua;
}
.sui-hover-text-aqua {
&:hover {
color: @aqua;
}
}
.sui-text-blue {
color: @blue;
}
.sui-hover-text-blue {
&:hover {
color: @blue;
}
}
.sui-text-light-blue {
color: @light-blue ;
}
.sui-hover-text-light-blue {
&:hover {
color: @light-blue ;
}
}
.sui-text-brown {
color: @brown;
}
.sui-hover-text-brown {
&:hover {
color: @brown;
}
}
.sui-text-cyan {
color: @cyan;
}
.sui-hover-text-cyan {
&:hover {
color: @cyan;
}
}
.sui-text-blue-grey, .sui-hover-text-blue-grey:hover, .sui-text-blue-gray, .sui-hover-text-blue-gray:hover {
color: @blue-grey;
}
.sui-text-green {
color: @green;
}
.sui-hover-text-green {
&:hover {
color: @green;
}
}
.sui-text-light-green {
color: @light-green;
}
.sui-hover-text-light-green {
&:hover {
color: @light-green;
}
}
.sui-text-indigo {
color: @indigo;
}
.sui-hover-text-indigo {
&:hover {
color: @indigo;
}
}
.sui-text-khaki {
color: @khaki;
}
.sui-hover-text-khaki {
&:hover {
color: @khaki;
}
}
.sui-text-lime {
color: @lime;
}
.sui-hover-text-lime {
&:hover {
color: @lime;
}
}
.sui-text-orange {
color: @orange;
}
.sui-hover-text-orange {
&:hover {
color: @orange;
}
}
.sui-text-deep-orange {
color: @deep-orange;
}
.sui-hover-text-deep-orange {
&:hover {
color: @deep-orange;
}
}
.sui-text-pink {
color: @pink;
}
.sui-hover-text-pink {
&:hover {
color: @pink;
}
}
.sui-text-purple {
color: @purple;
}
.sui-hover-text-purple {
&:hover {
color: @purple;
}
}
.sui-text-deep-purple {
color: @deep-purple;
}
.sui-hover-text-deep-purple {
&:hover {
color: @deep-purple;
}
}
.sui-text-red {
color: @red;
}
.sui-hover-text-red {
&:hover {
color: @red;
}
}
.sui-text-sand {
color: @sand;
}
.sui-hover-text-sand {
&:hover {
color: @sand;
}
}
.sui-text-teal {
color: @teal;
}
.sui-hover-text-teal {
&:hover {
color: @teal;
}
}
.sui-text-yellow {
color: @yellow;
}
.sui-hover-text-yellow {
&:hover {
color: @yellow;
}
}
.sui-text-white {
color: @white;
}
.sui-hover-text-white {
&:hover {
color: @white;
}
}
.sui-text-black {
color: @black;
}
.sui-hover-text-black {
&:hover {
color: @black;
}
}
.sui-text-grey, .sui-hover-text-grey:hover, .sui-text-gray, .sui-hover-text-gray:hover {
color: #757575;
}
.sui-text-light-grey, .sui-hover-text-light-grey:hover, .sui-text-light-gray, .sui-hover-text-light-gray:hover {
color: @light-grey;
}
.sui-text-dark-grey, .sui-hover-text-dark-grey:hover, .sui-text-dark-gray, .sui-hover-text-dark-gray:hover {
color: #3a3a3a;
}
.sui-border-amber {
border-color: @amber;
}
.sui-hover-border-amber {
&:hover {
border-color: @amber;
}
}
.sui-border-aqua {
border-color: @aqua;
}
.sui-hover-border-aqua {
&:hover {
border-color: @aqua;
}
}
.sui-border-blue {
border-color: @blue;
}
.sui-hover-border-blue {
&:hover {
border-color: @blue;
}
}
.sui-border-light-blue {
border-color: @light-blue ;
}
.sui-hover-border-light-blue {
&:hover {
border-color: @light-blue ;
}
}
.sui-border-brown {
border-color: @brown;
}
.sui-hover-border-brown {
&:hover {
border-color: @brown;
}
}
.sui-border-cyan {
border-color: @cyan;
}
.sui-hover-border-cyan {
&:hover {
border-color: @cyan;
}
}
.sui-border-blue-grey, .sui-hover-blue-grey:hover, .sui-border-blue-gray, .sui-hover-blue-gray:hover {
border-color: @blue-grey;
}
.sui-border-green {
border-color: @green;
}
.sui-hover-border-green {
&:hover {
border-color: @green;
}
}
.sui-border-light-green {
border-color: @light-green;
}
.sui-hover-border-light-green {
&:hover {
border-color: @light-green;
}
}
.sui-border-indigo {
border-color: @indigo;
}
.sui-hover-border-indigo {
&:hover {
border-color: @indigo;
}
}
.sui-border-khaki {
border-color: @khaki;
}
.sui-hover-border-khaki {
&:hover {
border-color: @khaki;
}
}
.sui-border-lime {
border-color: @lime;
}
.sui-hover-border-lime {
&:hover {
border-color: @lime;
}
}
.sui-border-orange {
border-color: @orange;
}
.sui-hover-border-orange {
&:hover {
border-color: @orange;
}
}
.sui-border-deep-orange {
border-color: @deep-orange;
}
.sui-hover-border-deep-orange {
&:hover {
border-color: @deep-orange;
}
}
.sui-border-pink {
border-color: @pink;
}
.sui-hover-border-pink {
&:hover {
border-color: @pink;
}
}
.sui-border-purple {
border-color: @purple;
}
.sui-hover-border-purple {
&:hover {
border-color: @purple;
}
}
.sui-border-deep-purple {
border-color: @deep-purple;
}
.sui-hover-border-deep-purple {
&:hover {
border-color: @deep-purple;
}
}
.sui-border-red {
border-color: @red;
}
.sui-hover-border-red {
&:hover {
border-color: @red;
}
}
.sui-border-sand {
border-color: @sand;
}
.sui-hover-border-sand {
&:hover {
border-color: @sand;
}
}
.sui-border-teal {
border-color: @teal;
}
.sui-hover-border-teal {
&:hover {
border-color: @teal;
}
}
.sui-border-yellow {
border-color: @yellow;
}
.sui-hover-border-yellow {
&:hover {
border-color: @yellow;
}
}
.sui-border-white {
border-color: @white;
}
.sui-hover-border-white {
&:hover {
border-color: @white;
}
}
.sui-border-black {
border-color: @black;
}
.sui-hover-border-black {
&:hover {
border-color: @black;
}
}
.sui-border-grey, .sui-hover-border-grey:hover, .sui-border-gray, .sui-hover-border-gray:hover {
border-color: @hover-grey;
}
.sui-border-light-grey, .sui-hover-border-light-grey:hover, .sui-border-light-gray, .sui-hover-border-light-gray:hover {
border-color: @light-grey;
}
.sui-border-dark-grey, .sui-hover-border-dark-grey:hover, .sui-border-dark-gray, .sui-hover-border-dark-gray:hover {
border-color: @dark-grey;
}
.sui-border-pale-yellow {
border-color: @pale-yellow ;
}
.sui-hover-border-pale-yellow {
&:hover {
border-color: @pale-yellow ;
}
}
.sui-hover-amber, .sui-hover-aqua, .sui-hover-blue, .sui-hover-light-blue, .sui-hover-brown, .sui-hover-cyan, .sui-hover-blue-grey, .sui-hover-green, .sui-hover-light-green, .sui-hover-indigo, .sui-hover-khaki, .sui-hover-lime, .sui-hover-orange, .sui-hover-deep-orange, .sui-hover-pink, .sui-hover-purple, .sui-hover-deep-purple, .sui-hover-red, .sui-hover-sand, .sui-hover-teal, .sui-hover-yellow, .sui-hover-white, .sui-hover-black, .sui-hover-grey, .sui-hover-light-grey, .sui-hover-dark-grey, .sui-hover-text-amber, .sui-hover-text-aqua, .sui-hover-text-blue, .sui-hover-text-light-blue, .sui-hover-text-brown, .sui-hover-text-cyan, .sui-hover-text-blue-grey, .sui-hover-text-green, .sui-hover-text-light-green, .sui-hover-text-indigo, .sui-hover-text-khaki, .sui-hover-text-lime, .sui-hover-text-orange, .sui-hover-text-deep-orange, .sui-hover-text-pink, .sui-hover-text-purple, .sui-hover-text-deep-purple, .sui-hover-text-red, .sui-hover-text-sand, .sui-hover-text-teal, .sui-hover-text-yellow, .sui-hover-text-white, .sui-hover-text-black, .sui-hover-text-grey, .sui-hover-text-light-grey, .sui-hover-text-dark-grey {
-webkit-transition: background-color .3s, color .15s, box-shadow .3s, opacity 0.3s, filter 0.3s;
transition: background-color .3s, color .15s, box-shadow .3s, opacity 0.3s, filter 0.3s;
}