toolbox_esten 1.0.0

data/assets/stylesheets/toolbox_esten/tabs.scss

@@ -0,0 +1,42 @@
+/* -------------------- Tabs -------------------- */
+.tab-container {
+  .tabs {
+    position: relative;
+    margin: 0 16px;
+    li {
+      @extend .inline-top;
+      &.active a { @include opacity(100); }
+      a {
+        @include transition(0.4s);
+        @include line-height(100%, 40px);
+        @include opacity(70);
+        display: block;
+        min-width: 60px;
+        padding: 0 24px;
+        font-weight: 500;
+        text-align: center;
+        text-transform: uppercase;
+        cursor: pointer;
+        &:hover { @include opacity(80); }
+        &[data-with_noti="true"]:after {
+          @include tblr(-10px, auto, auto, 1px);
+          @include size(20px, 20px);
+        }
+      }
+    }
+  }
+  .tab-content {
+    height: 100%;
+    overflow: auto;
+  }
+}
+
+.section {
+  .section-head {
+    > .tabs {
+      @include line-height(40px, 40px);
+      margin-bottom: -8px;
+    }
+  }
+}
+/* -------------------- END Tabs -------------------- */

data/assets/stylesheets/toolbox_esten/textfield.scss

@@ -0,0 +1,43 @@
+.textfield {
+  @include box-sizing(border-box);
+  @include transition(0.4s);
+  display: inline-block;
+  vertical-align: middle;
+  height: 30px;
+  padding: 0 8px;
+  outline: 0;
+  &.textarea {
+    @include font(16px, 300);
+    @include transition(0s);
+  }
+  &.search {
+    padding: 0 5px 0 30px;
+    margin: 0;
+  }
+  &.datefield {
+    font-size: 13px;
+    line-height: 27px;
+    text-align: center;
+  }
+  &.select {
+    @include border-radius(0);
+    @include appearance(none);
+  }
+}
+
+.textfield {
+  background: none;
+  border: none;
+  border-bottom: solid 2px $grey_300;
+  color: $grey_700;
+  &[disabled] { @include opacity(70); }
+  &.focus, &:focus { border-bottom: solid 2px $blue_400; }
+  &.disabled {
+    color: $grey_500;
+    border-bottom-style: dotted;
+  }
+  &.field_with_errors {
+    color: $red_400;
+    border-bottom-color: $red_400;
+  }
+}

data/assets/stylesheets/toolbox_esten/top_bar.scss

@@ -0,0 +1,80 @@
+.topbar {
+  @include size(100%, 40px);
+  position: absolute;
+  > *:not(.clear) {
+    height: 100%;
+    margin: 0 8px;
+  }
+  > div:first-child { margin-left: 0; }
+
+  /* ---------- Drawer ---------- */
+  .drawer {
+    @include size(40px, 100%);
+    > a {
+      @include size(100%, 100%);
+      display: block;
+    }
+  }
+  /* ---------- END Drawer ---------- */
+
+  /* ---------- Logo ---------- */
+  .logo {
+    padding: 0 8px;
+    a {
+      @include size(200px, 100%);
+      display: block;
+    }
+  }
+  /* ---------- END Logo ---------- */
+
+  /* ---------- Main Nav ---------- */
+  .main_nav {
+    > ul > li {
+      float: left;
+      height: 100%;
+      > a {
+        @include line-height(100%, 40px);
+        @include transition(0.4s);
+        display: block;
+        padding: 0 8px;
+        color: #FFFFFF;
+        &[class^="icon-"]:before,
+        &[class*=" icon-"]:before {
+          float: left;
+          font-size: 16px;
+        }
+        &:hover { background: $blue_600; }
+        span { margin: 0 5px; }
+      }
+      &.dropdown-container,
+      .dropdown-container {
+        > a:after {
+          margin-top: 19px;
+          border-top-color: #FFFFFF;
+        }
+        .dropdown {
+          > li a {
+            &[class^="icon-"]:before,
+            &[class*=" icon-"]:before {
+              width: 20px;
+            }
+            &:hover {
+              &, &[class^="icon-"]:before,
+              &, &[class*=" icon-"]:before {
+                color: #FFFFFF;
+              }
+            }
+          }
+        }
+      }
+    }
+    > ul { height: 100%; }
+  }
+  /* ---------- END Main Nav ---------- */
+
+  /* ---------- Global Tool ---------- */
+  .global_tool {
+    @extend .main_nav;
+  }
+  /* ---------- END Global Tool ---------- */
+}

data/assets/stylesheets/toolbox_esten/variables.scss

@@ -0,0 +1,260 @@
+/* -------------------- Font Family -------------------- */
+$helvetica: "helvetica neue", arial, helvetica, sans-serif;
+$geneva:    geneva, tahoma, "dejavu sans condensed", sans-serif;
+$lucida:    "lucida grande", "lucida sans unicode", "lucida sans", lucida, sans-serif;
+$verdana:   verdana, "bitstream vera sans", "dejavu sans", "liberation sans", geneva, sans-serif;
+$cambria:   cambria, georgia, "bitstream charter", "century schoolbook l", "liberation serif", times, serif;
+$palatino:  "palatino linotype", palatino, palladio, "urw palladio l", "book antiqua", "liberation serif", times, serif;
+$times:     times, "times new roman", "nimbus roman no9 l", freeserif, "liberation serif", serif;
+$courier:   "courier new", courier, freemono, "nimbus mono l", "liberation mono", monospace;
+$monaco:    monaco, "lucida console", "dejavu sans mono", "bitstream vera sans mono", "liberation mono", monospace;
+/* -------------------- END Font Family -------------------- */
+
+/* -------------------- Colors -------------------- */
+/* ---------- Red ---------- */
+$red_50:  #FFEBEE;
+$red_100: #FFCDD2;
+$red_200: #EF9A9A;
+$red_300: #E57373;
+$red_400: #EF5350;
+$red_500: #F44336;
+$red_600: #E53935;
+$red_700: #D32F2F;
+$red_800: #C62828;
+$red_900: #B71C1C;
+/* ---------- END Red ---------- */
+
+/* ---------- Pink ---------- */
+$pink_50:  #FCE4EC;
+$pink_100: #F8BBD0;
+$pink_200: #F48FB1;
+$pink_300: #F06292;
+$pink_400: #EC407A;
+$pink_500: #E91E63;
+$pink_600: #D81B60;
+$pink_700: #C2185B;
+$pink_800: #AD1457;
+$pink_900: #880E4F;
+/* ---------- END Pink ---------- */
+
+/* ---------- Purple ---------- */
+$purple_50:  #F3E5F5;
+$purple_100: #E1BEE7;
+$purple_200: #CE93D8;
+$purple_300: #BA68C8;
+$purple_400: #AB47BC;
+$purple_500: #9C27B0;
+$purple_600: #8E24AA;
+$purple_700: #7B1FA2;
+$purple_800: #6A1B9A;
+$purple_900: #4A148C;
+/* ---------- END Purple ---------- */
+
+/* ---------- Deep Purple ---------- */
+$deep_purple_50:  #EDE7F6;
+$deep_purple_100: #D1C4E9;
+$deep_purple_200: #B39DDB;
+$deep_purple_300: #9575CD;
+$deep_purple_400: #7E57C2;
+$deep_purple_500: #673AB7;
+$deep_purple_600: #5E35B1;
+$deep_purple_700: #512DA8;
+$deep_purple_800: #4527A0;
+$deep_purple_900: #311B92;
+/* ---------- END Deep Purple ---------- */
+
+/* ---------- Indigo ---------- */
+$indigo_50:  #E8EAF6;
+$indigo_100: #C5CAE9;
+$indigo_200: #9FA8DA;
+$indigo_300: #7986CB;
+$indigo_400: #5C6BC0;
+$indigo_500: #3F51B5;
+$indigo_600: #3949AB;
+$indigo_700: #303F9F;
+$indigo_800: #283593;
+$indigo_900: #1A237E;
+/* ---------- END Indigo ---------- */
+
+/* ---------- Blue ---------- */
+$blue_50:  #E3F2FD;
+$blue_100: #BBDEFB;
+$blue_200: #90CAF9;
+$blue_300: #64B5F6;
+$blue_400: #42A5F5;
+$blue_500: #2196F3;
+$blue_600: #1E88E5;
+$blue_700: #1976D2;
+$blue_800: #1565C0;
+$blue_900: #0D47A1;
+/* ---------- END Blue ---------- */
+
+/* ---------- Light Blue ---------- */
+$light_blue_50:  #E1F5FE;
+$light_blue_100: #B3E5FC;
+$light_blue_200: #81D4FA;
+$light_blue_300: #4FC3F7;
+$light_blue_400: #29B6F6;
+$light_blue_500: #03A9F4;
+$light_blue_600: #039BE5;
+$light_blue_700: #0288D1;
+$light_blue_800: #0277BD;
+$light_blue_900: #01579B;
+/* ---------- END Light Blue ---------- */
+
+/* ---------- Cyan ---------- */
+$cyan_50:  #E0F7FA;
+$cyan_100: #B2EBF2;
+$cyan_200: #80DEEA;
+$cyan_300: #4DD0E1;
+$cyan_400: #26C6DA;
+$cyan_500: #00BCD4;
+$cyan_600: #00ACC1;
+$cyan_700: #0097A7;
+$cyan_800: #00838F;
+$cyan_900: #006064;
+/* ---------- END Cyan ---------- */
+
+/* ---------- Teal ---------- */
+$teal_50:  #E0F2F1;
+$teal_100: #B2DFDB;
+$teal_200: #80CBC4;
+$teal_300: #4DB6AC;
+$teal_400: #26A69A;
+$teal_500: #009688;
+$teal_600: #00897B;
+$teal_700: #00796B;
+$teal_800: #00695C;
+$teal_900: #004D40;
+/* ---------- END Teal ---------- */
+
+/* ---------- Green ---------- */
+$green_50:  #E8F5E9;
+$green_100: #C8E6C9;
+$green_200: #A5D6A7;
+$green_300: #81C784;
+$green_400: #66BB6A;
+$green_500: #4CAF50;
+$green_600: #43A047;
+$green_700: #388E3C;
+$green_800: #2E7D32;
+$green_900: #1B5E20;
+/* ---------- END Green ---------- */
+
+/* ---------- Light Green ---------- */
+$light_green_50:  #F1F8E9;
+$light_green_100: #DCEDC8;
+$light_green_200: #C5E1A5;
+$light_green_300: #AED581;
+$light_green_400: #9CCC65;
+$light_green_500: #8BC34A;
+$light_green_600: #7CB342;
+$light_green_700: #689F38;
+$light_green_800: #558B2F;
+$light_green_900: #33691E;
+/* ---------- END Light Green ---------- */
+
+/* ---------- Lime ---------- */
+$lime_50:  #F9FBE7;
+$lime_100: #F0F4C3;
+$lime_200: #E6EE9C;
+$lime_300: #DCE775;
+$lime_400: #D4E157;
+$lime_500: #CDDC39;
+$lime_600: #C0CA33;
+$lime_700: #AFB42B;
+$lime_800: #9E9D24;
+$lime_900: #827717;
+/* ---------- END Lime ---------- */
+
+/* ---------- Yellow ---------- */
+$yellow_50:  #FFFDE7;
+$yellow_100: #FFF9C4;
+$yellow_200: #FFF59D;
+$yellow_300: #FFF176;
+$yellow_400: #FFEE58;
+$yellow_500: #FFEB3B;
+$yellow_600: #FDD835;
+$yellow_700: #FBC02D;
+$yellow_800: #F9A825;
+$yellow_900: #F57F17;
+/* ---------- END Yellow ---------- */
+
+/* ---------- Amber ---------- */
+$amber_50:  #FFF8E1;
+$amber_100: #FFECB3;
+$amber_200: #FFE082;
+$amber_300: #FFD54F;
+$amber_400: #FFCA28;
+$amber_500: #FFC107;
+$amber_600: #FFB300;
+$amber_700: #FFA000;
+$amber_800: #FF8F00;
+$amber_900: #FF6F00;
+/* ---------- END Amber ---------- */
+
+/* ---------- Orange ---------- */
+$orange_50:  #FFF3E0;
+$orange_100: #FFE0B2;
+$orange_200: #FFCC80;
+$orange_300: #FFB74D;
+$orange_400: #FFA726;
+$orange_500: #FF9800;
+$orange_600: #FB8C00;
+$orange_700: #F57C00;
+$orange_800: #EF6C00;
+$orange_900: #E65100;
+/* ---------- END Orange ---------- */
+
+/* ---------- Deep Orange ---------- */
+$deep_orange_50:  #FBE9E7;
+$deep_orange_100: #FFCCBC;
+$deep_orange_200: #FFAB91;
+$deep_orange_300: #FF8A65;
+$deep_orange_400: #FF7043;
+$deep_orange_500: #FF5722;
+$deep_orange_600: #F4511E;
+$deep_orange_700: #E64A19;
+$deep_orange_800: #D84315;
+$deep_orange_900: #BF360C;
+/* ---------- END Deep Orange ---------- */
+
+/* ---------- Brown ---------- */
+$brown_50:  #EFEBE9;
+$brown_100: #D7CCC8;
+$brown_200: #BCAAA4;
+$brown_300: #A1887F;
+$brown_400: #8D6E63;
+$brown_500: #795548;
+$brown_600: #6D4C41;
+$brown_700: #5D4037;
+$brown_800: #4E342E;
+$brown_900: #3E2723;
+/* ---------- END Brown ---------- */
+
+/* ---------- Grey ---------- */
+$grey_50:  #FAFAFA;
+$grey_100: #F5F5F5;
+$grey_200: #EEEEEE;
+$grey_300: #E0E0E0;
+$grey_400: #BDBDBD;
+$grey_500: #9E9E9E;
+$grey_600: #757575;
+$grey_700: #616161;
+$grey_800: #424242;
+$grey_900: #212121;
+/* ---------- END Grey ---------- */
+
+/* ---------- Blue Grey ---------- */
+$blue_grey_50:  #ECEFF1;
+$blue_grey_100: #CFD8DC;
+$blue_grey_200: #B0BEC5;
+$blue_grey_300: #90A4AE;
+$blue_grey_400: #78909C;
+$blue_grey_500: #607D8B;
+$blue_grey_600: #546E7A;
+$blue_grey_700: #455A64;
+$blue_grey_800: #37474F;
+$blue_grey_900: #263238;
+/* ---------- END Blue Grey ---------- */
+/* -------------------- END Colors -------------------- */

data/bower.json

@@ -0,0 +1,26 @@
+{
+  "name": "toolbox_esten",
+  "homepage": "https://github.com/shaunshang2010/toolbox_esten",
+  "authors": "Shang Chuan Chuan",
+  "description": "",
+  "moduleType": "globals",
+  "main": "assets/stylesheets/_toolbox_esten.scss",
+  "keywords": [
+    "toolbox_esten",
+    "sass"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "lib",
+    "tasks",
+    "templates",
+    "test",
+    "*.gemspec",
+    "Rakefile",
+    "Gemfile"
+  ],
+  "dependencies": {
+    "jquery": ">= 1.9.0"
+  }
+}