Merge pull request #64 from Daemonite/colour-update

colour update
Daemonite · Sep 10, 2015 · 2a33479 · 2a33479
2 parents faccff3 + 6e57486
commit 2a33479
Show file tree

Hide file tree

Showing 69 changed files with 2,033 additions and 2,847 deletions.
diff --git a/assets/js/datepicker.js b/assets/js/datepicker.js
diff --git a/assets/js/tile.js b/assets/js/tile.js
@@ -24,7 +24,7 @@
  keyboard: true,
  toggle: true
  };
- Tile.TRANSITION_DURATION = 300;
+ Tile.TRANSITION_DURATION = 150;
 
  Tile.prototype = $.extend({}, $.fn.collapse.Constructor.prototype);
 

diff --git a/assets/sass-project/project.scss b/assets/sass-project/project.scss
@@ -5,7 +5,7 @@
 @import "../sass/mixin/responsive";
 @import "../sass/mixin/utilities";
 
-@import "../sass/var/variable";
+@import "../sass/var/variables";
 
 // project
  body {
@@ -20,11 +20,6 @@
  padding-top: ($header-height + $margin-sm);
  }
 
- // colour
- @each $color in $palette-list {
- $i: index($palette-list, $color);
-
- .page-#{$color} .content-heading {
- background-image: url(#{$css-path}/images/bg/#{$color}.jpg);
- }
- }
+ .page-brand .content-heading {
+ background-image: url(#{$css-path}/images/bg/brand.jpg);
+ }
diff --git a/assets/sass/addons/_waves.scss b/assets/sass/addons/_waves.scss
@@ -29,15 +29,6 @@
  $gradient: rgba(255, 255, 255, 0.1) 0, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.3) 40%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0) 60%;
  background-image: radial-gradient($gradient);
  }
- @each $color in $palette-list {
- $i: index($palette-list, $color);
-
- &.waves-color-#{$color} .waves-ripple {
- background-color: nth($palette-color-light, $i);
- $gradient: rgba(red(nth($palette-color, $i)), green(nth($palette-color, $i)), blue(nth($palette-color, $i)), 0.1) 0, rgba(red(nth($palette-color, $i)), green(nth($palette-color, $i)), blue(nth($palette-color, $i)), 1) 100%;
- background-image: radial-gradient($gradient);
- }
- }
 }
 
 .waves-notransition {

diff --git a/assets/sass/addons/font-awesome/_variables.scss b/assets/sass/addons/font-awesome/_variables.scss
@@ -1,8 +1,8 @@
-$fa-border-color: $black-bg !default;
+$fa-border-color: $black-divider !default;
 $fa-css-prefix: fa !default;
 $fa-font-path: "#{$css-path}/fonts" !default;
 $fa-font-size-base: $font-size !default;
-$fa-inverse: $white !default;
+$fa-inverse: $white-text-solid !default;
 $fa-li-width: (30em / 14) !default;
 $fa-version: "4.3.0" !default;
 

diff --git a/assets/sass/base.scss b/assets/sass/base.scss
@@ -5,7 +5,7 @@
 @import "mixin/responsive";
 @import "mixin/utilities";
 
-@import "var/variable";
+@import "var/variables";
 
 // css
  @import "base/reset";

diff --git a/assets/sass/base/_reset.scss b/assets/sass/base/_reset.scss
@@ -1,5 +1,3 @@
-// @import url(http://fonts.googleapis.com/css?family=Roboto:300,300italic,400,400italic,700,700italic);
-
 *,
 *:after,
 *:before {
@@ -27,9 +25,9 @@
  }
 
  body {
- background-color: $white-bg-light;
+ background-color: $white;
  background-image: none;
- color: $black-text;
+ color: $black-text-solid;
  font-family: $font-fam;
  font-size: $font-size;
  font-weight: $font-weight-normal;
@@ -176,7 +174,7 @@
 
  legend {
  border: 0;
- color: $black-text;
+ color: $black-text-solid;
  display: block;
  font-size: $font-size-h3;
  font-weight: $font-weight-normal;
@@ -214,7 +212,8 @@
  }
 
  abbr {
- border-bottom: 1px dotted $black-hint;
+ border-bottom: 1px dotted $black-divider-solid;
+ border-bottom-color: $black-divider;
  cursor: help;
  }
 
@@ -241,15 +240,6 @@
  padding-right: ($grid-gutter * 2);
  padding-left: ($grid-gutter * 2);
  position: relative;
- &:before {
- border-right: 1px solid $brand-color-light;
- content: "";
- display: block;
- position: absolute;
- top: 0;
- bottom: 0;
- left: 0;
- }
  }
 
  dd,
@@ -341,7 +331,8 @@
  hr,
  .hr {
  border: 0;
- border-top: 1px solid $black-hint;
+ border-top: 1px solid $black-divider-solid;
+ border-top-color: $black-divider;
  box-sizing: content-box;
  display: block;
  height: 0;

diff --git a/assets/sass/components/_avatar.scss b/assets/sass/components/_avatar.scss
@@ -1,5 +1,5 @@
 .avatar {
- background-color: $black-bg;
+ background-color: $black-divider;
  border-radius: 50%;
  color: $black-text;
  display: block;
@@ -49,15 +49,15 @@
 }
 
 // colour
- @each $color in $palette-list {
- $i: index($palette-list, $color);
+ @each $color in $palette-list-class {
+ $i: index($palette-list-class, $color);
 
  .avatar-#{$color} {
- background-color: nth($palette-color, $i);
- color: $white;
+ background-color: nth($palette-list-color, $i);
+ color: nth($palette-list-text, $i);
  &:focus,
  &:hover {
- color: $white;
+ color: nth($palette-list-text, $i);
  }
  }
  }
@@ -91,7 +91,3 @@
 .avatar-inline {
  display: inline-block;
 }
-
-.avatar-transparent {
- background-color: transparent;
-}
diff --git a/assets/sass/components/_breadcrumb.scss b/assets/sass/components/_breadcrumb.scss
@@ -8,18 +8,18 @@
  float: left;
  + li:before {
  @extend .icon;
- color: $black-hint;
+ color: $black-hint-solid;
  content: "chevron_right";
  display: inline-block;
  line-height: $line-height;
  margin-left: 0.4em;
  }
  }
  > .active {
- color: $black-text;
+ color: $black-text-solid;
  > a,
  > .a {
- color: $black-text;
+ color: $black-text-solid;
  cursor: text;
  text-decoration: none;
  }

diff --git a/assets/sass/components/_button-flat.scss b/assets/sass/components/_button-flat.scss
@@ -4,29 +4,28 @@
  &:active,
  &:focus,
  &:hover {
- background-color: $black-bg;
- background-color: rgba(red($black-hint), green($black-hint), blue($black-hint), 0.18);
+ background-color: $btn-bg-color;
  box-shadow: none;
  }
  &:active {
- background-color: $black-hint;
- background-color: rgba(red($black-hint), green($black-hint), blue($black-hint), 0.36);
+ background-color: $btn-bg-color-hover;
  }
+ &.disabled,
  &[disabled],
  fieldset[disabled] & {
- color: $black-text;
+ background-color: transparent !important;
  }
 }
 
 // colour
- @each $color in $palette-list {
- $i: index($palette-list, $color);
+ @each $color in $palette-list-class {
+ $i: index($palette-list-class, $color);
 
  .btn-flat.btn-#{$color} {
- color: nth($palette-color, $i);
+ color: nth($palette-list-color, $i);
  &[disabled],
  fieldset[disabled] & {
- color: nth($palette-color, $i);
+ color: nth($palette-list-light, $i);
  }
  }
  }
diff --git a/assets/sass/components/_button-float.scss b/assets/sass/components/_button-float.scss
@@ -1,9 +1,9 @@
 .fbtn {
- background-color: $white;
+ background-color: $offwhite;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15), 0 1px 3px 1px rgba(0, 0, 0, 0.3);
  clear: both;
- color: $black-text;
+ color: $offwhite-text;
  cursor: pointer;
  display: block;
  font-size: $line-height;
@@ -18,31 +18,29 @@
  &:active,
  &:focus,
  &:hover {
- color: $black-text;
+ color: $offwhite-text;
  }
  &:active,
  &:focus {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15), 0 1px 3px 1px rgba(0, 0, 0, 0.3), 0 6px 9px rgba(0, 0, 0, 0.15);
  }
  &:active {
- background-color: $black-bg;
+ background-color: $offwhite-dark;
  }
 }
 
 // colour
- @each $color in $palette-list {
- $i: index($palette-list, $color);
+ @each $color in $palette-list-class {
+ $i: index($palette-list-class, $color);
 
  .fbtn-#{$color} {
- background-color: nth($palette-color, $i);
- color: $white;
+ background-color: nth($palette-list-color, $i);
+ color: nth($palette-list-text, $i);
  &:active,
  &:focus,
  &:hover {
- color: $white;
- }
- &:active {
- background-color: nth($palette-color-dark, $i);
+ background-color: nth($palette-list-color, $i);
+ color: nth($palette-list-text, $i);
  }
  }
  }
@@ -132,6 +130,10 @@
  }
 }
 
+.fbtn-inner {
+ position: relative;
+}
+
 .fbtn-ori,
 .fbtn-sub {
  transition: all 0.3s $timing;
@@ -157,24 +159,24 @@
 }
 
 .fbtn-sub {
+ margin-left: ($line-height / -2);
  opacity: 0;
  position: absolute;
  top: (($fbtn-height - $line-height) / 2);
- left: 0;
+ left: 50%;
  text-align: center;
  transform: rotate(-225deg);
- width: 100%;
+ width: $line-height;
  .fbtn-inner.open & {
  opacity: 1;
  transform: rotate(0);
  }
 }
 
 .fbtn-text {
- background-color: $black-text;
- background-color: rgba(0, 0, 0, 0.8);
+ background-color: $black-sec;
  border-radius: 2px;
- color: $white;
+ color: $white-text-solid;
  font-size: $font-size-h6;
  height: 0;
  line-height: $line-height;