Adding new datepicker

arian · Apr 4, 2013 · a65d508 · a65d508
1 parent 6147ce4
commit a65d508
Show file tree

Hide file tree

Showing 6 changed files with 579 additions and 4 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,3 @@
 *.tmp*
 *~
+.sass-cache/
diff --git a/Source/datepicker_bootstrap/_mixins_and_vars.scss b/Source/datepicker_bootstrap/_mixins_and_vars.scss
@@ -0,0 +1,76 @@
+$grayLight              : #999;
+$grayLighter            : #EEE;
+$orange                 : #f89406;
+$linkColor              : #08c;
+$btnPrimaryBackground   : $linkColor;
+
+
+
+// Mixins
+// Border Radius
+@mixin border-radius($radius) {
+  -webkit-border-radius: $radius;
+     -moz-border-radius: $radius;
+          border-radius: $radius;
+}
+
+// Button backgrounds
+@mixin buttonBackground($startColor, $endColor, $textColor: #fff, $textShadow: 0 -1px 0 rgba(0,0,0,.25)) {
+  // gradientBar will set the background to a pleasing blend of these, to support IE<=9
+  @include gradientBar($startColor, $endColor, $textColor, $textShadow);
+  *background-color: $endColor; /* Darken IE7 buttons by default so they stand out more given they won't have borders */
+  @include reset-filter();
+
+  // in these cases the gradient won't cover the background, so we override
+  &:hover, &:active, &.active, &.disabled, &[disabled] {
+    color: $textColor;
+    background-color: $endColor;
+    *background-color: darken($endColor, 5%);
+  }
+
+  // IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves
+  &:active,
+  &.active {
+    background-color: darken($endColor, 10%) \9;
+  }
+}
+
+// Reset filters for IE
+@mixin reset-filter() {
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
+
+// Gradient Bar Colors for buttons and alerts
+// Gradient Bar Colors for buttons and alerts
+@mixin gradientBar($primaryColor, $secondaryColor, $textColor: #fff, $textShadow: 0 -1px 0 rgba(0,0,0,.25)) {
+  color: $textColor;
+  text-shadow: $textShadow;
+  @include gradient-vertical($primaryColor, $secondaryColor);
+  border-color: $secondaryColor $secondaryColor darken($secondaryColor, 15%);
+  border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fade-in(rgba(0,0,0,.1), 0.15);
+}
+
+// Gradients
+@mixin gradient-vertical($startColor: #555, $endColor: #333) {
+  background-color: mix($startColor, $endColor, 62.5%);
+  background-image: -moz-linear-gradient(top, $startColor, $endColor); // FF 3.6+
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
+  background-image: -webkit-linear-gradient(top, $startColor, $endColor); // Safari 5.1+, Chrome 10+
+  background-image: -o-linear-gradient(top, $startColor, $endColor); // Opera 11.10
+  background-image: linear-gradient(to bottom, $startColor, $endColor); // Standard, IE10
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($startColor)}', endColorstr='#{ie-hex-str($endColor)}', GradientType=0); // IE9 and down
+}
+// #gradient {
+//   .vertical(@startColor: #555, @endColor: #333) {
+//     background-color: mix(@startColor, @endColor, 60%);
+//     background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
+//     background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10
+//     background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
+//     background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
+//     background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
+//     background-image: linear-gradient(top, @startColor, @endColor); // The standard
+//     background-repeat: repeat-x;
+//     filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down
+//   }
+// }
diff --git a/Source/datepicker_bootstrap/datepicker_bootstrap.css b/Source/datepicker_bootstrap/datepicker_bootstrap.css
@@ -0,0 +1,212 @@
+/*
+ * Datepicker for Bootstrap
+ *
+ * Copyright 2012 Stefan Petre
+ * Improvements by Andrew Rowls
+ * Licensed under the Apache License v2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ */
+.datepicker_bootstrap {
+  position: absolute;
+  font-size: 1em;
+  color: #000;
+  line-height: normal;
+  width: 17.2em;
+  height: 13.5em;
+  padding: 0.3em;
+  background-color: white;
+  border: 1px solid #eeeeee;
+  box-shadow: 1px 1px 5px #eeeeee; }
+
+/* header
+********************************************************/
+.datepicker_bootstrap .header {
+  position: relative;
+  text-align: center; }
+  .datepicker_bootstrap .header .title {
+    text-align: center;
+    margin: auto;
+    display: inline-block; }
+    .datepicker_bootstrap .header .title .titleText {
+      margin: auto;
+      padding: 0.5em;
+      -webkit-border-radius: 3px;
+      -moz-border-radius: 3px;
+      border-radius: 3px; }
+      .datepicker_bootstrap .header .title .titleText:hover {
+        background-color: #eeeeee; }
+  .datepicker_bootstrap .header .previous, .datepicker_bootstrap .header .next {
+    position: absolute;
+    cursor: pointer;
+    text-indent: -4em;
+    overflow: hidden;
+    width: 1.2em;
+    height: 1.2em;
+    top: 0.2em;
+    display: block;
+    border-top: 6px solid white;
+    border-bottom: 6px solid white;
+    height: 0px;
+    margin-top: .4em; }
+  .datepicker_bootstrap .header .previous {
+    left: 0.4em;
+    border-right: 7px solid black; }
+    .datepicker_bootstrap .header .previous:hover {
+      border-right-color: #999999; }
+  .datepicker_bootstrap .header .next {
+    right: 0.4em;
+    border-left: 7px solid black; }
+    .datepicker_bootstrap .header .next:hover {
+      border-left-color: #999999; }
+  .datepicker_bootstrap .header .closeButton {
+    display: none; }
+
+/* body
+********************************************************/
+.datepicker_bootstrap .body {
+  position: relative;
+  top: 0;
+  left: 0.2em;
+  width: 16.8em;
+  height: 11.2em;
+  overflow: hidden; }
+
+/* days-grid
+********************************************************/
+.datepicker_bootstrap .days .day {
+  float: left;
+  text-align: center;
+  overflow: hidden;
+  width: 2.3em;
+  padding-top: .1em;
+  height: 1.4em;
+  margin: 0 .1em .1em 0;
+  font-weight: normal; }
+.datepicker_bootstrap .days .titles {
+  height: 1.5em;
+  margin-bottom: .2em;
+  text-transform: uppercase; }
+
+/* days-colors
+********************************************************/
+.datepicker_bootstrap .days .week .day {
+  cursor: pointer;
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  border-radius: 3px; }
+
+.datepicker_bootstrap .days .week .day:hover {
+  background-color: #eeeeee; }
+
+.datepicker_bootstrap .days .otherMonth {
+  color: #999999; }
+
+.datepicker_bootstrap .days .selected, .datepicker_bootstrap .days .selected:hover {
+  background-color: #999999;
+  color: #FFF; }
+
+/* months-grid
+********************************************************/
+.datepicker_bootstrap .months .month {
+  float: left;
+  cursor: pointer;
+  text-align: center;
+  padding-top: .6em;
+  width: 5.5em;
+  overflow: hidden;
+  height: 2.1em;
+  margin: 0 .1em .1em 0; }
+
+.datepicker_bootstrap .months .month3,
+.datepicker_bootstrap .months .month6,
+.datepicker_bootstrap .months .month9,
+.datepicker_bootstrap .months .month12 {
+  margin-right: 0; }
+
+.datepicker_bootstrap .months .month10,
+.datepicker_bootstrap .months .month11,
+.datepicker_bootstrap .months .month12 {
+  margin-bottom: 0; }
+
+/* months-colors
+********************************************************/
+/* years-grid
+********************************************************/
+.datepicker_bootstrap .years .year {
+  float: left;
+  cursor: pointer;
+  text-align: center;
+  padding-top: .6em;
+  width: 3.2em;
+  overflow: hidden;
+  height: 2.1em;
+  margin: 0 .1em .1em 0; }
+
+.datepicker_bootstrap .years .year4,
+.datepicker_bootstrap .years .year9,
+.datepicker_bootstrap .years .year14,
+.datepicker_bootstrap .years .year19 {
+  margin-right: 0; }
+
+.datepicker_bootstrap .years .year15,
+.datepicker_bootstrap .years .year16,
+.datepicker_bootstrap .years .year17,
+.datepicker_bootstrap .years .year18,
+.datepicker_bootstrap .years .year19 {
+  margin-bottom: 0; }
+
+/* years-colors
+********************************************************/
+/* global
+********************************************************/
+.datepicker_bootstrap .unavailable {
+  color: #eeeeee !important;
+  cursor: default !important;
+  text-decoration: line-through; }
+
+.datepicker_bootstrap table {
+  border-spacing: 0; }
+
+.datepicker_bootstrap th,
+.datepicker_bootstrap td {
+  padding: 0; }
+
+/* time
+********************************************************/
+.datepicker_bootstrap .time {
+  position: relative;
+  width: 100%;
+  height: 100%; }
+
+.datepicker_bootstrap .time .hour,
+.datepicker_bootstrap .time .separator,
+.datepicker_bootstrap .time .minutes {
+  background: #333;
+  border: 0px;
+  width: 5em;
+  font-size: 3.2em;
+  color: #fff;
+  position: absolute;
+  top: 1em;
+  text-align: center;
+  padding: 0.2em; }
+
+.datepicker_bootstrap .time .hour {
+  left: 15px; }
+
+.datepicker_bootstrap .time .separator {
+  background: transparent;
+  width: 10px;
+  left: 76px; }
+
+.datepicker_bootstrap .time .minutes {
+  left: 95px; }
+
+.datepicker_bootstrap .time .ok {
+  position: absolute;
+  top: 65px;
+  height: 32px;
+  width: 136px;
+  left: 15px;
+  font-size: 20px; }