restorando · gschammah · Mar 24, 2015 · Mar 24, 2015 · Mar 24, 2015
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-pickadate",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "homepage": "https://github.com/restorando/angular-pickadate",
   "authors": [
     "Gabriel Schammah <[email protected]>"

diff --git a/dist/angular-pickadate-dark.css b/dist/angular-pickadate-dark.css
@@ -0,0 +1,81 @@
+.pickadate {
+  font-family: 'Helvetica Neue', Helvetica, Helvetica, Arial, sans-serif; }
+  .pickadate a {
+    color: #666666; }
+    .pickadate a:visited {
+      color: #666666; }
+
+.pickadate-header {
+  position: relative; }
+
+.pickadate-main {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  text-align: center;
+  font-size: 12px; }
+
+.pickadate-cell {
+  overflow: hidden;
+  margin: 0;
+  padding: 0; }
+  .pickadate-cell li {
+    display: block;
+    float: left;
+    border: 1px solid #DCDCDC;
+    border-width: 0 1px 1px 0;
+    width: 14.285%;
+    padding: 3.3% 0 3.3% 0;
+    line-height: normal;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box; }
+    .pickadate-cell li:nth-child(7n+0) {
+      border-right: 1px solid #DCDCDC; }
+    .pickadate-cell li:nth-child(1), .pickadate-cell li:nth-child(8), .pickadate-cell li:nth-child(15), .pickadate-cell li:nth-child(22), .pickadate-cell li:nth-child(29), .pickadate-cell li:nth-child(36) {
+      border-left: 1px solid #DCDCDC; }
+  .pickadate-cell .pickadate-disabled {
+    color: #DCDCDC; }
+    .pickadate-cell .pickadate-disabled a {
+      color: #DCDCDC; }
+  .pickadate-cell .pickadate-enabled {
+    cursor: pointer;
+    font-size: 12px;
+    color: #666666; }
+  .pickadate-cell .pickadate-today {
+    background-color: #EAEAEA; }
+  .pickadate-cell .pickadate-active {
+    background-color: #B52A00;
+    color: #FFFFFF; }
+  .pickadate-cell .pickadate-head {
+    border-top: 1px solid #DCDCDC;
+    background: #F3F3F3;
+    font-size: 15px; }
+    .pickadate-cell .pickadate-head:nth-child(1), .pickadate-cell .pickadate-head:nth-child(7) {
+      background: #F3F3F3; }
+
+.pickadate-centered-heading {
+  font-weight: normal;
+  text-align: center;
+  font-size: 2em;
+  margin: 12px 0 12px 0;
+  line-height: normal; }
+
+.pickadate-controls {
+  position: absolute;
+  z-index: 10;
+  width: 100%; }
+  .pickadate-controls .pickadate-next {
+    float: right; }
+  .pickadate-controls a {
+    text-decoration: none;
+    font-size: 0.9em; }
+
+.pickadate-modal {
+  position: absolute;
+  background-color: #fff;
+  width: 300px;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+  padding: 0 5px 5px 5px;
+  z-index: 1000; }
diff --git a/dist/angular-pickadate.css → dist/angular-pickadate-default.css b/dist/angular-pickadate.css → dist/angular-pickadate-default.css
@@ -43,15 +43,16 @@
     font-size: 12px;
     color: #666666; }
   .pickadate-cell .pickadate-today {
-    background-color: #eaeaea; }
+    background-color: #EAEAEA; }
   .pickadate-cell .pickadate-active {
-    background-color: #b52a00;
-    color: white; }
+    background-color: #B52A00;
+    color: #FFFFFF; }
   .pickadate-cell .pickadate-head {
     border-top: 1px solid #DCDCDC;
-    background: #f3f3f3; }
+    background: #F3F3F3;
+    font-size: 12px; }
     .pickadate-cell .pickadate-head:nth-child(1), .pickadate-cell .pickadate-head:nth-child(7) {
-      background: #f3f3f3; }
+      background: #F3F3F3; }
 
 .pickadate-centered-heading {
   font-weight: normal;

diff --git a/example.html b/example.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <link rel="stylesheet" type="text/css" href="dist/angular-pickadate-dark.css">
+  <script src="test/lib/angular-1.4.0.js"></script>
+  <script src="dist/angular-pickadate.min.js"></script>
+</head>
+<body ng-app="TestApp" ng-init="date='2015-03-30'">
+  <div pickadate ng-model="date" style="width: 300px"></div>
+
+  <script type="text/javascript">
+    angular.module('TestApp', ['pickadate']);
+  </script>
+</body>
+</html>
diff --git a/gulpfile.js b/gulpfile.js
@@ -4,6 +4,8 @@ var gulp = require('gulp');
 var sass = require('gulp-sass');
 var uglify = require('gulp-uglify');
 var rename = require("gulp-rename");
+var footer = require('gulp-footer');
+var fs = require('fs');
 var del = require("del");
 var _ = require('lodash');
 var karma = require('karma').server;
@@ -35,8 +37,14 @@ gulp.task('uglify', function() {
 });
 
 gulp.task('sass', function () {
-  gulp.src('./src/*.scss')
+  var css = fs.readFileSync('./src/angular-pickadate.scss');
+
+  gulp.src('./src/themes/*.scss')
+    .pipe(footer(css.toString()))
     .pipe(sass({ errLogToConsole: true }))
+    .pipe(rename(function(path) {
+      path.basename = 'angular-pickadate-' + path.basename;
+    }))
     .pipe(gulp.dest('./dist'));
 });
 
@@ -61,6 +69,10 @@ gulp.task('test:legacy', legacyVersions.map(function(version) {
   return 'test:legacy:' + version;
 }));
 
+gulp.task('dev', function() {
+  gulp.watch('./src/**/*.scss', ['sass']);
+});
+
 /**
  * Run test once and exit
  */

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-pickadate",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "A simple and fluid inline datepicker for AngularJS with no extra dependencies",
   "main": "index.js",
   "scripts": {
@@ -24,6 +24,7 @@
   "devDependencies": {
     "del": "^1.1.1",
     "gulp": "^3.8.7",
+    "gulp-footer": "^1.0.5",
     "gulp-jshint": "^1.8.4",
     "gulp-rename": "^1.2.0",
     "gulp-sass": "^1.2.4",

diff --git a/src/angular-pickadate.scss b/src/angular-pickadate.scss
@@ -1,11 +1,11 @@
 .pickadate {
-  font-family: 'Helvetica Neue', Helvetica, Helvetica, Arial, sans-serif;
+  font-family: $font-family;
 
   a {
     &:visited {
-      color: #666666;
+      color: $anchor-font-color;
     }
-    color: #666666;
+    color: $anchor-font-color;
   }
 }
 
@@ -18,7 +18,7 @@
   padding: 0;
   width: 100%;
   text-align: center;
-  font-size: 12px;
+  font-size: $main-font-size;
 }
 
 .pickadate-cell {
@@ -28,53 +28,54 @@
   li {
     display: block;
     float: left;
-    border: 1px solid #DCDCDC;
-    border-width: 0 1px 1px 0;
+    border: $cell-border;
+    border-width: 0 $inner-cell-width $inner-cell-width 0;
     width: 14.285%;
-    padding: 1.3% 0 1.3% 0;
+    padding: $cell-default-padding 0 $cell-default-padding 0;
     line-height: normal;
     box-sizing: border-box;
     -moz-box-sizing: border-box;
     -webkit-box-sizing: border-box;
     &:nth-child(7n+0) {
-      border-right: 1px solid #DCDCDC;
+      border-right: $cell-border;
     }
     &:nth-child(1), &:nth-child(8), &:nth-child(15), &:nth-child(22), &:nth-child(29), &:nth-child(36) {
-      border-left: 1px solid #DCDCDC;
+      border-left: $cell-border;
     }
   }
   .pickadate-disabled {
-    color: #DCDCDC;
+    color: $disabled-color;
     a {
-      color: #DCDCDC;
+      color: $disabled-color;
     }
   }
   .pickadate-enabled {
     cursor: pointer;
-    font-size: 12px;
-    color: #666666;
+    font-size: $main-font-size;
+    color: $anchor-font-color;
   }
   .pickadate-today {
-    background-color: #eaeaea;
+    background-color: $cell-today-background-color;
   }
   .pickadate-active {
-    background-color: #b52a00;
-    color: white;
+    background-color: $cell-active-background-color;
+    color: $cell-active-font-color;
   }
   .pickadate-head {
-    border-top: 1px solid #DCDCDC;
-    background: #f3f3f3;
+    border-top: $cell-border;
+    background: $month-names-background-color;
+    font-size: $month-names-font-size;
     &:nth-child(1), &:nth-child(7) {
-      background: #f3f3f3;
+      background: $month-names-background-color;
     }
   }
 }
 
 .pickadate-centered-heading {
-  font-weight: normal;
+  font-weight: $heading-font-weight;
   text-align: center;
-  font-size: 1em;
-  margin: 13px 0 13px 0;
+  font-size: $heading-font-size;
+  margin: $heading-margin 0 $heading-margin 0;
   line-height: normal;
 }
 
@@ -87,7 +88,7 @@
   }
   a {
     text-decoration: none;
-    font-size: 0.9em;
+    font-size: $controls-font-size;
   }
 }
 

diff --git a/src/themes/dark.scss b/src/themes/dark.scss
@@ -0,0 +1,31 @@
+$anchor-font-color: #666666;
+
+$font-family: 'Helvetica Neue', Helvetica, Helvetica, Arial, sans-serif;
+
+$cell-border: 1px solid #DCDCDC;
+
+$inner-cell-width: 1px;
+
+$disabled-color: #DCDCDC;
+
+$cell-today-background-color: #EAEAEA;
+
+$cell-active-background-color: #B52A00;
+
+$cell-active-font-color: #FFFFFF;
+
+$month-names-background-color: #F3F3F3;
+
+$month-names-font-size: 15px;
+
+$cell-default-padding: 3.3%;
+
+$main-font-size: 12px;
+
+$heading-font-weight: normal;
+
+$heading-font-size: 2em;
+
+$heading-margin: 12px;
+
+$controls-font-size: 0.9em;
diff --git a/src/themes/default.scss b/src/themes/default.scss
@@ -0,0 +1,31 @@
+$anchor-font-color: #666666;
+
+$font-family: 'Helvetica Neue', Helvetica, Helvetica, Arial, sans-serif;
+
+$cell-border: 1px solid #DCDCDC;
+
+$inner-cell-width: 1px;
+
+$disabled-color: #DCDCDC;
+
+$cell-today-background-color: #EAEAEA;
+
+$cell-active-background-color: #B52A00;
+
+$cell-active-font-color: #FFFFFF;
+
+$month-names-background-color: #F3F3F3;
+
+$month-names-font-size: 12px;
+
+$cell-default-padding: 1.3%;
+
+$main-font-size: 12px;
+
+$heading-font-weight: normal;
+
+$heading-font-size: 1em;
+
+$heading-margin: 13px;
+
+$controls-font-size: 0.9em;