wcc-styles 0.1.0

data/lib/assets/stylesheets/wcc/styles/base.css.scss

@@ -0,0 +1,90 @@
+/*
+Title: Watermark Base Pattern Library Styles
+Release Date: 08/12/14
+Version: 1.0.7
+*/
+
+@import "compass/layout/stretching";
+@import "compass";
+
+@import "variables/mixins";
+@import "variables/colors";
+@import "variables/typography";
+
+/*===========================================
+  Base Styles and Resets
+============================================*/
+
+* {
+  @include box-sizing (border-box);
+}
+
+html, body {
+  height: 100%;
+  overflow-x: hidden;
+  -webkit-text-size-adjust: 100%;
+  -ms-text-size-adjust: 100%;
+}
+
+html {
+  font-size: 62.5%;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+  font-family: sans-serif;
+}
+
+body {
+  @include primary-font;
+  color: $text;
+  font-size: 14px;
+  line-height: 1.42857143;
+  overflow-y: scroll; /* has to be scroll, not auto */
+  -webkit-overflow-scrolling: touch;
+}
+
+a {
+  @include primary-font;
+  color: $orange;
+  text-decoration: none;
+
+  &:focus { outline: thin dotted; }
+  &:active { outline: 0; }
+  &:hover { outline: 0; }
+}
+
+[class*="col"] img {
+  max-width: 100%;
+}
+
+:focus {
+  outline: none;
+}
+
+/*===========================================
+  Normalize
+============================================*/
+
+@import "snippets/normalize";
+
+/*===========================================
+  The Grid
+============================================*/
+
+@import "snippets/grid";
+
+/*===========================================
+  All Snippets
+============================================*/
+
+@import "snippets/all";
+
+/*===========================================
+  All Admin Styles
+============================================*/
+
+@import "admin/all";
+
+/*===========================================
+  All App Specific Styles
+============================================*/
+
+@import "apps/all";

data/lib/assets/stylesheets/wcc/styles/base/all.css.scss

@@ -0,0 +1,4 @@
+@import "wcc/styles/base";
+@import "wcc/styles/base/icons";
+@import "wcc/styles/base/custom_selects";
+@import "wcc/styles/base/custom_file_inputs";

data/lib/assets/stylesheets/wcc/styles/base/custom_file_inputs.css.scss

@@ -0,0 +1,7 @@
+@import "dropzone";
+
+.dropzone {
+  border: 1px solid #D8D5D0;
+  margin: 10px 0 15px 0;
+  min-height: 0;
+}

data/lib/assets/stylesheets/wcc/styles/base/custom_selects.css.scss

@@ -0,0 +1,8 @@
+.select-style {
+  overflow: visible;
+}
+
+div.option.selected {
+  background-color: $medium-grey;
+  color: white;
+}

data/lib/assets/stylesheets/wcc/styles/base/icons.css.scss

@@ -0,0 +1,2 @@
+@import "font-awesome";
+

data/lib/assets/stylesheets/wcc/styles/snippets/_alerts.scss

@@ -0,0 +1,95 @@
+// Styles for Alerts - Managed in /theme/sass/snippets/_alerts.scss
+
+.alert {
+  font-size: 12px;
+  padding: 10px 15px;
+  margin: 10px 0 20px 0;
+  border: 1px solid transparent;
+  border-radius: 4px;
+  text-align: center;
+}
+
+.alert h4 {
+  margin-top: 0;
+  color: inherit;
+}
+
+.alert .alert-link {
+  font-weight: bold;
+}
+
+.alert > p,
+.alert > ul {
+  margin-bottom: 0;
+}
+
+.alert > p + p {
+  margin-top: 5px;
+}
+
+.alert-dismissable {
+  padding-right: 35px;
+}
+
+.alert-dismissable .close {
+  position: relative;
+  top: -2px;
+  right: -21px;
+  color: inherit;
+}
+
+.alert-success {
+  color: #468847;
+  background-color: #dff0d8;
+  border-color: #d6e9c6;
+}
+
+.alert-success hr {
+  border-top-color: #c9e2b3;
+}
+
+.alert-success .alert-link {
+  color: #356635;
+}
+
+.alert-info {
+  color: #3a87ad;
+  background-color: #d9edf7;
+  border-color: #bce8f1;
+}
+
+.alert-info hr {
+  border-top-color: #a6e1ec;
+}
+
+.alert-info .alert-link {
+  color: #2d6987;
+}
+
+.alert-warning {
+  color: #c09853;
+  background-color: #fcf8e3;
+  border-color: #fbeed5;
+}
+
+.alert-warning hr {
+  border-top-color: #f8e5be;
+}
+
+.alert-warning .alert-link {
+  color: #a47e3c;
+}
+
+.alert-danger {
+  color: #7D5B8C;
+  background-color: rgba(125,91,140,0.15);
+  border-color: #7D5B8C;
+}
+
+.alert-danger hr {
+  border-top-color: #e6c1c7;
+}
+
+.alert-danger .alert-link {
+  color: #953b39;
+}

data/lib/assets/stylesheets/wcc/styles/snippets/_all.scss

@@ -0,0 +1,12 @@
+@import "alerts";
+@import "buttons";
+@import "datetimepicker";
+@import "elements";
+@import "forms";
+@import "labels";
+@import "navs";
+@import "pagination";
+@import "selectize";
+@import "sidebar_slideout";
+@import "tables";
+@import "top_nav";

data/lib/assets/stylesheets/wcc/styles/snippets/_buttons.scss

@@ -0,0 +1,126 @@
+.button {
+  @include border-radius(4px);
+  @include primary-font;
+  display: inline-block;
+  font-weight: normal;
+  text-align: center;
+  vertical-align: middle;
+  cursor: pointer;
+  color: white;
+  background-image: none;
+  border: 2px solid transparent;
+  white-space: nowrap;
+  padding: 10px 20px;
+  margin: 0 3px;
+  font-size: 14px;
+  line-height: 1.42857143;
+  -webkit-appearance: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+
+  a {
+    color: white;
+  }
+
+  @include button-theme($medium-grey);
+
+  &.primary {
+    @include button-theme($orange);
+  }
+
+  &.success {
+    @include button-theme($green);
+  }
+
+  &.warning {
+    @include button-theme($yellow);
+  }
+
+  &.info {
+    @include button-theme($blue);
+  }
+
+  &.danger {
+    @include button-theme($red);
+
+    &.ghost {
+      background-color: transparent;
+      border: 2px solid $red;
+      color: $red;
+    }
+  }
+
+  &.disabled {
+    @include button-theme($light-grey);
+    color: $medium-grey;
+  }
+
+  &.ghost {
+    background-color: transparent;
+    border: 2px solid $light-grey;
+    color: $light-grey;
+  }
+
+  &.signout {
+    @include border-radius(0px);
+    background-color: transparent;
+    border: 1px solid $orange;
+    color: $orange;
+    font-size: 10px;
+    font-weight: 600;
+    margin-left: 10px;
+    padding: 5px 10px;
+  }
+
+  &.large {
+    padding: 15px 30px;
+  }
+
+  &.small {
+    padding: 5px 10px;
+    font-size: 12px;
+  }
+
+  &.xsmall {
+    padding: 0 4px;
+    font-size: 75%;
+  }
+
+  &.fullwide {
+    width: 100%;
+    margin: 10px 0 0 0;
+    display: block;
+  }
+}
+
+.button-group {
+  position: relative;
+  display: inline-block;
+  vertical-align: middle;
+
+  > .button {
+    position: relative;
+    float: left;
+
+    &:first-child {
+      margin-right: 0;
+      &:not(:last-child) {
+        @include border-right-radius(0)
+      }
+    }
+
+    &:not(:first-child):not(:last-child) {
+      margin-left: 0;
+      margin-right: 0;
+      border-radius: 0;
+    }
+
+    &:last-child {
+      margin-left: 0;
+      &:not(:first-child) {
+        @include border-left-radius(0);
+      }
+    }
+  }
+}

data/lib/assets/stylesheets/wcc/styles/snippets/_datetimepicker.scss

@@ -0,0 +1,555 @@
+//data-uris
+$data_uri_0: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAAeCAYAAADaW7vzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6Q0NBRjI1NjM0M0UwMTFFNDk4NkFGMzJFQkQzQjEwRUIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6Q0NBRjI1NjQ0M0UwMTFFNDk4NkFGMzJFQkQzQjEwRUIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpDQ0FGMjU2MTQzRTAxMUU0OTg2QUYzMkVCRDNCMTBFQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpDQ0FGMjU2MjQzRTAxMUU0OTg2QUYzMkVCRDNCMTBFQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PoNEP54AAAIOSURBVHja7Jq9TsMwEMcxrZD4WpBYeKUCe+kTMCACHZh4BFfHO/AAIHZGFhYkBBsSEqxsLCAgXKhbXYOTxh9pfJVP+qutnZ5s/5Lz2Y5I03QhWji2GIcgAokWgfCxNvcOCCGKqiSqhUp0laHOne05vdEyGMfkdxJDVjgwDlEQgYQBgx+ULJaWSXXS6r/ER5FBVR8VfGftTKcITNs+a1XpcFoExREIDF14AVIFxgQUS+h520cdud6wNkC0UBw6BCO/HoCYwBhD8QCkQ/x1mwDyD4plh4D6DDV0TAGyo4HcawLIBBSLDkHeH0Mg2yVP3l4TQMZQDDsEOl/MgHQqhMNuE0D+oBh0CIr8MAKyazBH9WyBuKxDWgbXfjNf32TZ1KWm/Ap1oSk/R53UtQ5xTh3LUlMmT8gt6g51Q9p+SobxgJQ/qmsfZhWywGFSl0yBjCLJCMgXail3b7+rumdVJ2YRss4cN+r6qAHDkPWjPjdJCF4n9RmAD/V9A/Wp4NQassDjwlB6XBiCxcJQWmZZb8THFilfy/lfrTvLghq2TqTHrRMTKNJ0sIhdo15RT+RpyWwFdY96UZ/LdQKBGjcXpcc1AlSFEfLmouD+1knuxBDUVrvOBmoOC/rEcN7OQxKVeJTCiAdUzUJhA2Oez9QTkp72OTVcxDcXY8iKNkxGAJXmJCOQwOa6dhyXsOa6XwEGAKdeb5ET3rQdAAAAAElFTkSuQmCC";
+$data_uri_1: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAAeCAYAAADaW7vzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QUExQUUzOTA0M0UyMTFFNDlBM0FFQTJENTExRDVBODYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QUExQUUzOTE0M0UyMTFFNDlBM0FFQTJENTExRDVBODYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpBQTFBRTM4RTQzRTIxMUU0OUEzQUVBMkQ1MTFENUE4NiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpBQTFBRTM4RjQzRTIxMUU0OUEzQUVBMkQ1MTFENUE4NiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pp0VxGEAAAIASURBVHja7JrNSgMxEMebtgh+3MSLr1T1Xn2CHoSKB08+QmR8Bx9A8e7RixdB9CKCoNdexIugxFlJa7rNZneTbLIpM/CnNLsdMvNjM8l0mRCiQ9Ye61IKCAgZAUnH+mU3MMZaHYChBnJUDzWOFZdVfc5+ZFLbrWDeXPwbxIqrLLfaeS0hEBVGIRQCEiZoHQwtlGSByCCdYBl8g8egTTAWoKQMRBRBcZxYlhzhKegqMOageErsCHVkk3hXIFooDgHB1KkHIHVgzKB4ADJQ/A1jAFmAYhkQqA5TOBtocrKrgXwQA8gcFIuAIO8sQSA7hidvPwaQGZSaAYHOUWJABhWWw2EMIH9QagQERU4SArJXo0ZZL18uvaxejXt/Em8xjVBXmvFr1KVm/AJ10tRe2XnraNqaJvKE3KHuUbfK1E+VHB0q40/y3sdQSxY4FHWeKJCunP8UyDdqJZenT3ntVV5jIYCAh20vT7ioP8tpf6E2lfEMwERe+whV1MHjwZB7PBiCxcGQWwKZKD62lfGNnP/1poFAA60T7rF1UgcKd2id3KDeUS+oLWV8DfWAepOfq00CgQabi9zjcgJVYVD7PVzQUAUGAQkbNJTBICDhgwYTjDYD6XeW08ZKh+A4pYkzenOxXUbvZcWz7E8ykRMnIHGX1XPl+1m2vPYpL+2qdb8CDAARlKFEz/ZVkAAAAABJRU5ErkJggg==";
+
+//urls
+$url_0: url($data_uri_0);
+
+//@extend-elements
+//original selectors
+//.xdsoft_datetimepicker .xdsoft_next, .xdsoft_datetimepicker .xdsoft_prev, .xdsoft_datetimepicker .xdsoft_today_button
+%extend_1 {
+  background-color: transparent;
+  background-repeat: no-repeat;
+  border: 0 none;
+  cursor: pointer;
+  display: block;
+  height: 30px;
+  opacity: 0.5;
+  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
+  outline: medium none;
+  overflow: hidden;
+  padding: 0;
+  position: relative;
+  text-indent: 100%;
+  white-space: nowrap;
+  width: 20px;
+  min-width: 0;
+}
+
+//original selectors
+//.xdsoft_datetimepicker .xdsoft_calendar td, .xdsoft_datetimepicker .xdsoft_calendar th
+%extend_2 {
+  width: 14.2857142%;
+  background: #f5f5f5;
+  border: 1px solid #ddd;
+  color: #666;
+  font-size: 12px;
+  text-align: right;
+  vertical-align: middle;
+  padding: 0;
+  border-collapse: collapse;
+  cursor: pointer;
+  height: 25px;
+}
+
+
+.xdsoft_datetimepicker {
+  box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.506);
+  background: #fff;
+  border-bottom: 1px solid #bbb;
+  border-left: 1px solid #ccc;
+  border-right: 1px solid #ccc;
+  border-top: 1px solid #ccc;
+  color: #333;
+  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
+  padding: 8px;
+  padding-left: 0;
+  padding-top: 2px;
+  position: absolute;
+  z-index: 9999;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  display: none;
+  iframe {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 75px;
+    height: 210px;
+    background: transparent;
+    border: none;
+  }
+  button {
+    border: none !important;
+  }
+  &.xdsoft_inline {
+    display: inline-block;
+    position: static;
+    box-shadow: none;
+  }
+  * {
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    padding: 0;
+    margin: 0;
+  }
+  .xdsoft_datepicker {
+    display: none;
+    width: 224px;
+    float: left;
+    margin-left: 8px;
+    &.active {
+      display: block;
+    }
+  }
+  .xdsoft_timepicker {
+    display: none;
+    width: 58px;
+    float: left;
+    text-align: center;
+    margin-left: 8px;
+    margin-top: 0;
+    &.active {
+      display: block;
+    }
+    .xdsoft_prev {
+      float: none;
+      background-position: -40px -15px;
+      height: 15px;
+      width: 30px;
+      display: block;
+      margin-left: 14px;
+      margin-top: 7px;
+      background-position: -40px 0;
+      margin-bottom: 7px;
+      margin-top: 0;
+    }
+    .xdsoft_next {
+      float: none;
+      background-position: -40px -15px;
+      height: 15px;
+      width: 30px;
+      display: block;
+      margin-left: 14px;
+      margin-top: 7px;
+    }
+    .xdsoft_time_box {
+      height: 151px;
+      overflow: hidden;
+      border-bottom: 1px solid #ddd;
+      >div {
+        >div {
+          background: #f5f5f5;
+          border-top: 1px solid #ddd;
+          color: #666;
+          font-size: 12px;
+          text-align: center;
+          border-collapse: collapse;
+          cursor: pointer;
+          border-bottom-width: 0;
+          height: 25px;
+          line-height: 25px;
+          &.xdsoft_current {
+            background: #EB7F4C;
+            box-shadow: #cc6e42 0 1px 3px 0 inset;
+            color: #fff;
+            font-weight: 700;
+          }
+          &:hover {
+            color: #fff !important;
+            background: #ff8000 !important;
+            box-shadow: none !important;
+          }
+          &.xdsoft_disabled:hover {
+            color: inherit !important;
+            background: inherit !important;
+            box-shadow: inherit !important;
+          }
+        }
+        > div:first-child {
+          border-top-width: 0;
+        }
+      }
+    }
+    .xdsoft_time_box>div>div.xdsoft_current.xdsoft_disabled:hover {
+      background: #EB7F4C !important;
+      box-shadow: #cc6e42 0 1px 3px 0 inset !important;
+      color: #fff !important;
+    }
+  }
+  &.xdsoft_showweeks {
+    .xdsoft_datepicker {
+      width: 256px;
+    }
+    .xdsoft_calendar {
+      td {
+        width: 12.5%;
+      }
+      th {
+        width: 12.5%;
+      }
+    }
+  }
+  .xdsoft_mounthpicker {
+    position: relative;
+    text-align: center;
+  }
+  .xdsoft_label {
+    display: inline;
+    position: relative;
+    z-index: 9999;
+    margin: 0;
+    padding: 5px 3px;
+    font-size: 14px;
+    line-height: 20px;
+    font-weight: bold;
+    background-color: #fff;
+    float: left;
+    width: 182px;
+    text-align: center;
+    cursor: pointer;
+    i {
+      background-image: $url_0;
+      opacity: 0.5;
+      background-position: -92px -19px;
+      display: inline-block;
+      width: 9px;
+      height: 20px;
+      vertical-align: middle;
+    }
+    &:hover>span {
+      text-decoration: underline;
+    }
+    &:hover i {
+      opacity: 1.0;
+    }
+    > .xdsoft_select {
+      border: 1px solid #ccc;
+      position: absolute;
+      right: 0;
+      top: 30px;
+      z-index: 101;
+      display: none;
+      background: #fff;
+      max-height: 160px;
+      overflow-y: hidden;
+      &.xdsoft_monthselect {
+        right: -7px;
+      }
+      &.xdsoft_yearselect {
+        right: 2px;
+      }
+      > div > .xdsoft_option {
+        padding: 2px 10px 2px 5px;
+        text-decoration: none !important;
+        &:hover {
+          color: #fff;
+          background: #ff8000;
+        }
+        &.xdsoft_current {
+          background: #EB7F4C;
+          box-shadow: #cc6e42 0 1px 3px 0 inset;
+          color: #fff;
+          font-weight: 700;
+        }
+      }
+    }
+  }
+  .xdsoft_prev {
+    background-image: $url_0;
+    float: left;
+    background-position: -20px 0;
+    @extend %extend_1;
+    &:hover {
+      opacity: 1;
+      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+    }
+  }
+  .xdsoft_next {
+    background-image: $url_0;
+    float: right;
+    background-position: 0 0;
+    @extend %extend_1;
+    &:hover {
+      opacity: 1;
+      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+    }
+  }
+  .xdsoft_today_button {
+    background-image: $url_0;
+    float: left;
+    background-position: -70px 0;
+    margin-left: 5px;
+    @extend %extend_1;
+    &:hover {
+      opacity: 1;
+      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+    }
+  }
+  .xdsoft_month {
+    width: 100px;
+    text-align: right;
+  }
+  .xdsoft_calendar {
+    clear: both;
+    table {
+      border-collapse: collapse;
+      width: 100%;
+    }
+    td {
+      @extend %extend_2;
+      &.xdsoft_today {
+        color: #EB7F4C;
+      }
+      &.xdsoft_default {
+        background: #EB7F4C;
+        box-shadow: #cc6e42 0 1px 3px 0 inset;
+        color: #fff;
+        font-weight: 700;
+      }
+      &.xdsoft_current {
+        background: #EB7F4C;
+        box-shadow: #cc6e42 0 1px 3px 0 inset;
+        color: #fff;
+        font-weight: 700;
+      }
+      &.xdsoft_other_month {
+        opacity: 0.5;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
+        cursor: default;
+      }
+      &.xdsoft_disabled {
+        opacity: 0.5;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
+        cursor: default;
+        &:hover {
+          color: inherit !important;
+          background: inherit !important;
+          box-shadow: inherit !important;
+        }
+      }
+      &:hover {
+        color: #fff !important;
+        background: #ff8000 !important;
+        box-shadow: none !important;
+      }
+      > div {
+        padding-right: 5px;
+      }
+    }
+    th {
+      height: 25px;
+      background: #f1f1f1;
+      font-weight: 700;
+      text-align: center;
+      color: #999;
+      cursor: default;
+      @extend %extend_2;
+    }
+    td.xdsoft_other_month.xdsoft_disabled {
+      opacity: 0.2;
+      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
+    }
+    td.xdsoft_current.xdsoft_disabled:hover {
+      background: #EB7F4C !important;
+      box-shadow: #cc6e42 0 1px 3px 0 inset !important;
+      color: #fff !important;
+    }
+  }
+  .xdsoft_year {
+    width: 48px;
+    margin-left: 5px;
+  }
+  .xdsoft_copyright {
+    color: #ccc !important;
+    font-size: 10px;
+    clear: both;
+    float: none;
+    margin-left: 8px;
+    a {
+      color: #eee !important;
+      &:hover {
+        color: #aaa !important;
+      }
+    }
+  }
+  &.xdsoft_dark {
+    box-shadow: 0 5px 15px -5px rgba(255, 255, 255, 0.506);
+    background: #000;
+    border-bottom: 1px solid #444;
+    border-left: 1px solid #333;
+    border-right: 1px solid #333;
+    border-top: 1px solid #333;
+    color: #ccc;
+    .xdsoft_label {
+      background-color: #000;
+      i {
+        background-image: url($data_uri_1);
+      }
+      > .xdsoft_select {
+        border: 1px solid #333;
+        background: #000;
+        > div > .xdsoft_option {
+          &:hover {
+            color: #000;
+            background: #b03e00;
+          }
+          &.xdsoft_current {
+            background: #cc5500;
+            box-shadow: #b03e00 0 1px 3px 0 inset;
+            color: #000;
+          }
+        }
+      }
+    }
+    .xdsoft_prev {
+      background-image: url($data_uri_1);
+    }
+    .xdsoft_next {
+      background-image: url($data_uri_1);
+    }
+    .xdsoft_today_button {
+      background-image: url($data_uri_1);
+    }
+    .xdsoft_calendar {
+      td {
+        background: #0a0a0a;
+        border: 1px solid #222;
+        color: #999;
+        &.xdsoft_today {
+          color: #cc5500;
+        }
+        &.xdsoft_default {
+          background: #cc5500;
+          box-shadow: #b03e00 0 1px 3px 0 inset;
+          color: #000;
+        }
+        &.xdsoft_current {
+          background: #cc5500;
+          box-shadow: #b03e00 0 1px 3px 0 inset;
+          color: #000;
+        }
+        &:hover {
+          color: #000 !important;
+          background: #b03e00 !important;
+        }
+      }
+      th {
+        background: #0a0a0a;
+        border: 1px solid #222;
+        color: #999;
+        background: #0e0e0e;
+        color: #666;
+      }
+    }
+    .xdsoft_copyright {
+      color: #333 !important;
+      a {
+        color: #111 !important;
+        &:hover {
+          color: #555 !important;
+        }
+      }
+    }
+    .xdsoft_timepicker .xdsoft_time_box {
+      border-bottom: 1px solid #222;
+      >div >div {
+        background: #0a0a0a;
+        border-top: 1px solid #222;
+        color: #999;
+        &.xdsoft_current {
+          background: #cc5500;
+          box-shadow: #b03e00 0 1px 3px 0 inset;
+          color: #000;
+        }
+        &:hover {
+          color: #000 !important;
+          background: #b03e00 !important;
+        }
+      }
+    }
+  }
+  .xdsoft_save_selected {
+    display: block;
+    border: 1px solid #dddddd !important;
+    margin-top: 5px;
+    width: 100%;
+    color: #454551;
+    font-size: 13px;
+  }
+  .blue-gradient-button {
+    font-family: museo-sans, Book Antiqua, sans-serif;
+    font-size: 12px;
+    font-weight: 300;
+    color: #82878c;
+    height: 28px;
+    position: relative;
+    padding: 4px 17px 4px 33px;
+    border: 1px solid #d7d8da;
+    background: linear-gradient(to bottom, #fff 0, #f4f8fa 73%);
+    filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#fff', endcolorstr='#f4f8fa',gradienttype=0 );
+    &:hover {
+      color: #454551;
+      background: linear-gradient(to bottom, #f4f8fa 0, #fff 73%);
+      filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#f4f8fa', endcolorstr='#fff',gradienttype=0 );
+      span {
+        color: #454551;
+        background: linear-gradient(to bottom, #f4f8fa 0, #fff 73%);
+        filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#f4f8fa', endcolorstr='#fff',gradienttype=0 );
+      }
+    }
+    &:focus {
+      color: #454551;
+      background: linear-gradient(to bottom, #f4f8fa 0, #fff 73%);
+      filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#f4f8fa', endcolorstr='#fff',gradienttype=0 );
+      span {
+        color: #454551;
+        background: linear-gradient(to bottom, #f4f8fa 0, #fff 73%);
+        filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#f4f8fa', endcolorstr='#fff',gradienttype=0 );
+      }
+    }
+  }
+  .xdsoft_datepicker.active+.xdsoft_timepicker {
+    margin-top: 8px;
+    margin-bottom: 3px;
+  }
+  .xdsoft_time_box >div >div.xdsoft_disabled {
+    opacity: 0.5;
+    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
+    cursor: default;
+  }
+}
+.xdsoft_noselect {
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  -o-user-select: none;
+  user-select: none;
+}
+.xdsoft_noselect::selection {
+  background: transparent;
+}
+.xdsoft_noselect::-moz-selection {
+  background: transparent;
+}
+.xdsoft_time_box {
+  position: relative;
+  border: 1px solid #ccc;
+}
+.xdsoft_scrollbar {
+  position: absolute;
+  width: 7px;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  cursor: pointer;
+  >.xdsoft_scroller {
+    background: #ccc !important;
+    height: 20px;
+    border-radius: 3px;
+  }
+}
+.xdsoft_scroller_box {
+  position: relative;
+}
+.xdsoft_dark {
+  .xdsoft_time_box {
+    border: 1px solid #333;
+  }
+  .xdsoft_scrollbar >.xdsoft_scroller {
+    background: #333 !important;
+  }
+}