kea-rails 2.0.0.pre.alpha5 → 2.0.0.pre.alpha6

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 6a1b12e6b2039c2ed49311640ed5be2623f25497
-  data.tar.gz: 898ff0fc35249cf0b09723ab07c34828d65baa38
+  metadata.gz: af54eff7023152d3ecb1c55c4b2a2d7c60c5f262
+  data.tar.gz: 92d6efe82fac551cc364b7239524430ad68fe705
 SHA512:
-  metadata.gz: 01b7de32be403bf456f177470513daec2fd97e25297039411c2750bcbb7cbb91eead5e435c928e8ad959e259549b0b64c7260582809095d7c45c2a8ab018fbfa
-  data.tar.gz: bc27481bbfcbbc3a4e927889b6f045d54f7429b5aa42a7e15724a4101b8e11c72b4d3047cbeddf84edf79433971a7e34b58ea8d2971eb166817894eea088e1ec
+  metadata.gz: fc35ed50c8757faa11bb9656a5739a086080795a7bd09bd7dbd7a20f6686feb36b0cc750d1deff3c313253601b3e97c0df6c83a64b1c119365ca3de7d303872b
+  data.tar.gz: 453afc42614917b3218cb424cdfb935c045fb8aae5d00b972e2822e5c0aefa0caf09b61d09d2e704f6734f2e100bf00eddea94225bd1344fab3be931b3b94c39

data/app/assets/javascripts/kea/bindings/date_picker.js

@@ -0,0 +1,33 @@
+(function(ko, $) {
+  "use strict";
+
+  ko.bindingHandlers.datePicker = {
+    init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
+      var $element      = $(element),
+          observable    = valueAccessor(),
+          options       = allBindingsAccessor().options || {},
+          defaultOptions;
+
+      defaultOptions = {
+        field: element,
+        firstDay: 1,
+        defaultDate: observable.date(),
+        format: observable.date.options.external,
+        onSelect: function() {
+          observable.date.fromMoment( this.getMoment() );
+        }
+      };
+
+      options = $.extend({}, defaultOptions, options);
+      
+      $element.data('pikaday', new Pikaday(options));
+    },
+    update: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
+      var observable  = valueAccessor(),
+          pikaday     = $(element).data('pikaday');
+          
+      pikaday.setMoment( observable.date.toMoment() );
+    }
+  };
+
+})(ko, $);

data/app/assets/javascripts/kea/extenders/date.js

@@ -23,6 +23,16 @@
           target(formatted);
         }
       }, this);
+      
+      target.date.toMoment = function toMoment() {
+        return moment(target(), options.internal);
+      };
+      
+      target.date.fromMoment = function fromMoment(moment) {
+        target( moment.format(options.internal) );
+      };
+      
+      target.date.options = options;
    
       //return the original observable
       return target;

data/app/assets/javascripts/kea/kea_dependencies.js

@@ -13,6 +13,7 @@
 //= require knockout-sortable/build/knockout-sortable
 //= require humane-js/humane
 //= require Keypress/keypress.js
+//= require pikaday/pikaday.js
 
 //= require ./kea_init
 

data/app/assets/stylesheets/kea/kea.css.sass

@@ -11,6 +11,6 @@
  * file per style scope.
  *
  *= require humane-js/themes/flatty
- *= require pikaday
+ *= require pikaday/scss/pikaday
  *= require_self
  */

data/lib/kea-rails/version.rb

@@ -1,3 +1,3 @@
 module Kea
-  VERSION = "2.0.0-alpha5"
+  VERSION = "2.0.0-alpha6"
 end

data/vendor/assets/components/pikaday/CHANGELOG.md

@@ -0,0 +1,68 @@
+# Changelog
+
+## 1.4.0 - TBA
+
+
+## 1.3.2 - 2015-02-17
+
+- Add options to disable days, see #171
+- Add SCSS file, see #130
+
+## 1.3.1 - 2015-02-04
+
+- Fix for bug introduced in #166; fixes #224, #230
+
+## 1.3.0 - 2015-01-09
+
+- Fix #79 moving through months can cause calendar to "bounce around"
+- Add configurable number of shown months
+- #51 Add unit tests with ci: [testling](https://ci.testling.com/rikkert/pikaday)
+- Fix #94 blur input field after date selection
+- Add configuable container to render calendar into 
+- Add option to show week numbers, see #147
+- Positioning is now optional, see #192
+
+## 1.2.0 - 2014-01-28
+
+- Fix #8 Automatically adjust datepicker position
+- Merge #45 Adjusting position
+- Merge #11 Allow using a different element to open and bind the datepicker to
+- Use new Bower package filename: bower.json
+- Merge #90 Configuration options for the title, useful for Asian languages.
+- Merge #96 Use proper UMD-wrapper
+- Merge #92 Export as CommonJS module
+- Merge #119 Use a px text-indent on .pika-prev/next to prevent Firefox bug
+- Merge #60 Add customizable position option
+- Add Component package definition
+
+## 1.1.0 - 2013-03-29
+
+- Add Ruby on Rails [gem](https://rubygems.org/gems/pikaday-gem)
+- Add project configuration files. (jshint and editorconfig)
+- Add AMD support to pikaday and pikaday.jquery
+
+- Fix #52 check if date is valid when moment.js is available
+- Fix #54 add CSS support for IE8
+
+Notes:
+
+- jQuery plugin needs pikaday.js loaded first
+- See the examples/ dir:
+  - amd.html module loading example
+  - jquery-amd.html module loading the jQuery plugin example
+  - jquery.html jQuery plugin example
+  - moment.html moment.js library example
+
+## 1.0.0 - 2013-03-15
+
+- Fix issue #41 (minDate does not include the specified date)
+- Add Bower package definition
+
+## 0.0.2 - 2012-10-10
+
+- jQuery plugin version
+
+## 0.0.1 - 2012-10-08
+
+- Basic documentation written
+- GitHub repository is ready to go…

data/vendor/assets/components/pikaday/LICENSE

@@ -0,0 +1,36 @@
+Copyright (c) 2014 David Bushell BSD & MIT license
+
+The MIT License (MIT)
+
+Copyright (c) 2014 David Bushell
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
+
+The BSD License
+
+Copyright (c) 2014 David Bushell
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+
+1. Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+
+2. Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

data/vendor/assets/components/pikaday/README.md

@@ -0,0 +1,321 @@
+Pikaday
+========
+
+### A refreshing JavaScript Datepicker
+
+* Lightweight (less than 5kb minified and gzipped)
+* No dependencies (but plays well with [Moment.js][moment])
+* Modular CSS classes for easy styling
+
+[**Try Pikaday Demo →**][Pikaday]
+
+![Pikaday Screenshot][screenshot]
+
+**Production ready?** Since version 1.0.0 Pikaday is stable and used in production. If you do however find bugs or have feature requests please submit them to the [GitHub issue tracker][issues].  
+Also see the [changelog](CHANGELOG.md)
+
+
+## Usage
+
+**Pikaday** can be bound to an input field:
+
+```html
+<input type="text" id="datepicker">
+```
+
+Add the JavaScript to the end of your document:
+
+```html
+<script src="pikaday.js"></script>
+<script>
+    var picker = new Pikaday({ field: document.getElementById('datepicker') });
+</script>
+```
+
+If you're using **jQuery** make sure to pass only the first element:
+
+```javascript
+var picker = new Pikaday({ field: $('#datepicker')[0] });
+```
+
+If the Pikaday instance is not bound to a field you can append the element anywhere:
+
+```javascript
+var field = document.getElementById('datepicker');
+var picker = new Pikaday({
+    onSelect: function(date) {
+        field.value = picker.toString();
+    }
+});
+field.parentNode.insertBefore(picker.el, field.nextSibling);
+```
+
+For advanced formatting load [Moment.js][moment] prior to Pikaday:  
+See the [moment.js example][] for a full version.
+
+```html
+<input type="text" id="datepicker" value="9 Oct 2014">
+
+<script src="moment.js"></script>
+<script src="pikaday.js"></script>
+<script>
+    var picker = new Pikaday({
+        field: document.getElementById('datepicker'),
+        format: 'D MMM YYYY',
+        onSelect: function() {
+            console.log(this.getMoment().format('Do MMMM YYYY'));
+        }
+    });
+</script>
+```
+
+### Configuration
+
+As the examples demonstrate above
+Pikaday has many useful options:
+
+* `field` bind the datepicker to a form field
+* `trigger` use a different element to trigger opening the datepicker, see [trigger example][] (default to `field`)
+* `bound` automatically show/hide the datepicker on `field` focus (default `true` if `field` is set)
+* `position` preferred position of the datepicker relative to the form field, e.g.: `top right`, `bottom right` **Note:** automatic adjustment may occur to avoid datepicker from being displayed outside the viewport, see [positions example][] (default to 'bottom left')
+* `reposition` can be set to false to not reposition datepicker within the viewport, forcing it to take the configured `position` (default: true)
+* `container` DOM node to render calendar into, see [container example][] (default: undefined) 
+* `format` the default output format for `.toString()` and `field` value (requires [Moment.js][moment] for custom formatting)
+* `defaultDate` the initial date to view when first opened
+* `setDefaultDate` make the `defaultDate` the initial selected value
+* `firstDay` first day of the week (0: Sunday, 1: Monday, etc)
+* `minDate` the minimum/earliest date that can be selected (this should be a native Date object - e.g. `new Date()` or `moment().toDate()`)
+* `maxDate` the maximum/latest date that can be selected (this should be a native Date object - e.g. `new Date()` or `moment().toDate()`)
+* `disableWeekends` disallow selection of Saturdays or Sundays
+* `disableDayFn` callback function that gets passed a Date object for each day in view. Should return true to disable selection of that day.
+* `yearRange` number of years either side (e.g. `10`) or array of upper/lower range (e.g. `[1900,2015]`)
+* `showWeekNumber` show the ISO week number at the head of the row (default `false`)
+* `isRTL` reverse the calendar for right-to-left languages
+* `i18n` language defaults for month and weekday names (see internationalization below)
+* `yearSuffix` additional text to append to the year in the title
+* `showMonthAfterYear` render the month after year in the title (default `false`)
+* `numberOfMonths` number of visible calendars
+* `mainCalendar` when `numberOfMonths` is used, this will help you to choose where the main calendar will be (default `left`, can be set to `right`). Only used for the first display or when a selected date is not already visible
+* `onSelect` callback function for when a date is selected
+* `onOpen` callback function for when the picker becomes visible
+* `onClose` callback function for when the picker is hidden
+* `onDraw` callback function for when the picker draws a new month
+
+## jQuery Plugin
+
+The normal version of Pikaday does not require jQuery, however there is a jQuery plugin if that floats your boat (see `plugins/pikaday.jquery.js` in the repository). This version requires jQuery, naturally, and can be used like other plugins:  
+See the [jQuery example][] for a full version.
+
+```html
+<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
+<script src="pikaday.js"></script>
+<script src="plugins/pikaday.jquery.js"></script>
+<script>
+
+// activate datepickers for all elements with a class of `datepicker`
+$('.datepicker').pikaday({ firstDay: 1 });
+
+// chain a few methods for the first datepicker, jQuery style!
+$('.datepicker').eq(0).pikaday('show').pikaday('gotoYear', 2042);
+
+</script>
+```
+
+## AMD support
+
+If you use a modular script loader than Pikaday is not bound to the global object and will fit nicely in your build process. You can require Pikaday just like any other module.  
+See the [AMD example][] for a full version.
+
+```javascript
+require(['pikaday'], function(Pikaday) {
+    var picker = new Pikaday({ field: document.getElementById('datepicker') });
+});
+```
+The same applies for the jQuery plugin mentioned above.  
+See the [jQuery AMD example][] for a full version.
+
+```javascript
+require(['jquery', 'pikaday.jquery'], function($) {
+    $('#datepicker').pikaday();
+});
+```
+
+## CommonJS module support
+
+If you use a CommonJS compatible environment you can use the require function to import Pikaday.
+
+
+```javascript
+var pikaday = require('pikaday');
+```
+
+When you bundle all your required modules with [Browserify][browserify] and you don't use [Moment.js][moment] specify the ignore option:
+
+`browserify main.js -o bundle.js -i moment`
+
+## Ruby on Rails
+
+If you're using **Ruby on Rails**, make sure to check out the [Pikaday gem][gem].
+
+## Methods
+
+You can control the date picker after creation:
+
+```javascript
+var picker = new Pikaday({ field: document.getElementById('datepicker') });
+```
+
+### Get and set date
+
+`picker.toString('YYYY-MM-DD')`
+
+Returns the selected date in a string format. If [Moment.js][moment] exists (recommended) then Pikaday can return any format that Moment understands, otherwise you're stuck with JavaScript's default.
+
+`picker.getDate()`
+
+Returns a basic JavaScript `Date` object of the selected day, or `null` if no selection.
+
+`picker.setDate('2015-01-01')`
+
+Set the current selection. This will be restricted within the bounds of `minDate` and `maxDate` options if they're specified. You can optionally pass a boolean as the second parameter to prevent triggering of the onSelect callback (true), allowing the date to be set silently.
+
+`picker.getMoment()`
+
+Returns a [Moment.js][moment] object for the selected date (Moment must be loaded before Pikaday).
+
+`picker.setMoment(moment('14th February 2014', 'DDo MMMM YYYY'))`
+
+Set the current selection with a [Moment.js][moment] object (see `setDate` for details).
+
+### Change current view
+
+`picker.gotoDate(new Date(2014, 1))`
+
+Change the current view to see a specific date. This example will jump to February 2014 ([month is a zero-based index][mdn_date]).
+
+`picker.gotoToday()`
+
+Shortcut for `picker.gotoDate(new Date())`
+
+`picker.gotoMonth(2)`
+
+Change the current view by month (0: January, 1: Februrary, etc).
+
+`picker.nextMonth()`
+`picker.prevMonth()`
+
+Go to the next or previous month (this will change year if necessary).
+
+`picker.gotoYear()`
+
+Change the year being viewed.
+
+`picker.setMinDate()`
+
+Update the minimum/earliest date that can be selected.
+
+`picker.setMaxDate()`
+
+Update the maximum/latest date that can be selected.
+
+### Show and hide datepicker
+
+`picker.isVisible()`
+
+Returns `true` or `false`.
+
+`picker.show()`
+
+Make the picker visible.
+
+`picker.adjustPosition()`
+
+Recalculate and change the position of the picker.
+
+`picker.hide()`
+
+Hide the picker making it invisible.
+
+`picker.destroy()`
+
+Hide the picker and remove all event listeners — no going back!
+
+### Internationalization
+
+The default `i18n` configuration format looks like this:
+
+```javascript
+i18n: {
+    previousMonth : 'Previous Month',
+    nextMonth     : 'Next Month',
+    months        : ['January','February','March','April','May','June','July','August','September','October','November','December'],
+    weekdays      : ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'],
+    weekdaysShort : ['Sun','Mon','Tue','Wed','Thu','Fri','Sat']
+}
+```
+
+You must provide 12 months and 7 weekdays (with abbreviations). Always specify weekdays in this order with Sunday first. You can change the `firstDay` option to reorder if necessary (0: Sunday, 1: Monday, etc). You can also set `isRTL` to `true` for languages that are read right-to-left.
+
+
+## Extensions
+
+### Timepicker
+
+Pikaday is a pure datepicker. It will not support picking a time of day. However, there have been efforts to add time support to Pikaday.  
+See [#1][issue1] and [#18][issue18]. These reside in their own fork.
+
+You can use the work [@owenmead][owenmead] did most recently at [owenmead/Pikaday][owen Pika]  
+A more simple time selection approach done by [@xeeali][xeeali] at [xeeali/Pikaday][xeeali Pika] is based on version 1.2.0.  
+Also [@stas][stas] has a fork [stas/Pikaday][stas Pika], but is now quite old
+
+
+## Browser Compatibility
+
+* IE 7+
+* Chrome 8+
+* Firefox 3.5+
+* Safari 3+
+* Opera 10.6+
+
+[![browser compatibility](https://ci.testling.com/rikkert/pikaday.png)
+](https://ci.testling.com/rikkert/pikaday)
+
+
+* * *
+
+## Authors
+
+* David Bushell [http://dbushell.com][Bushell] [@dbushell][Bushell Twitter]
+* Ramiro Rikkert [GitHub][Rikkert] [@RamRik][Rikkert Twitter]
+
+Thanks to [@shoogledesigns][shoogledesigns] for the name.
+
+Copyright © 2014 David Bushell | BSD & MIT license
+
+  [Pikaday]:     http://dbushell.github.com/Pikaday/                              "Pikaday"
+  [moment]:      http://momentjs.com/                                             "moment.js"
+  [browserify]:  http://browserify.org/                                           "browserify"
+  [screenshot]:  https://raw.github.com/dbushell/Pikaday/gh-pages/screenshot.png  "Screenshot"
+  [issues]:      https://github.com/dbushell/Pikaday/issues                       "Issue tracker"
+  [gem]:         https://rubygems.org/gems/pikaday-gem                            "RoR gem"
+  [mdn_date]:    https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Date  "Date"
+  [Bushell]:     http://dbushell.com/                                             "dbushell.com"
+  [Bushell Twitter]: https://twitter.com/dbushell                                 "@dbushell"
+  [Rikkert]:     https://github.com/rikkert                                       "Rikkert GitHub"
+  [Rikkert Twitter]: https://twitter.com/ramrik                                   "@ramrik"
+  [shoogledesigns]:  https://twitter.com/shoogledesigns/status/255209384261586944 "@shoogledesigns"
+  [issue1]:      https://github.com/dbushell/Pikaday/issues/1                     "Issue 1"
+  [issue18]:     https://github.com/dbushell/Pikaday/issues/18                    "Issue 18"
+  [stas]:        https://github.com/stas                                          "@stas"
+  [stas Pika]:   https://github.com/stas/Pikaday                                  "Pikaday"
+  [owenmead]:    https://github.com/owenmead                                      "@owenmead"
+  [owen Pika]:   https://github.com/owenmead/Pikaday                              "Pikaday"
+  [xeeali]:      https://github.com/xeeali                                        "@xeeali"
+  [xeeali Pika]: https://github.com/xeeali/Pikaday                                "Pikaday"
+  [moment.js example]: http://dbushell.github.com/Pikaday/examples/moment.html    "Pikaday w/ moment.js"
+  [jQuery example]: http://dbushell.github.com/Pikaday/examples/jquery.html       "Pikaday w/ jQuery"
+  [AMD example]: http://dbushell.github.com/Pikaday/examples/amd.html             "Pikaday w/ AMD"
+  [jQuery AMD example]: http://dbushell.github.com/Pikaday/examples/jquery-amd.html "Pikaday w/ jQuery + AMD"
+  [trigger example]: http://dbushell.github.com/Pikaday/examples/trigger.html     "Pikaday using custom trigger"
+  [positions example]: http://dbushell.github.com/Pikaday/examples/positions.html "Pikaday using different position options"
+  [container example]: http://dbushell.github.com/Pikaday/examples/container.html "Pikaday using custom calendar container"

data/vendor/assets/components/pikaday/bower.json

@@ -0,0 +1,29 @@
+{
+  "name": "pikaday",
+  "version": "1.3.2",
+  "description": "A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS",
+  "keywords": [
+    "datepicker",
+    "calendar",
+    "date"
+  ],
+  "main": [
+    "./pikaday.js",
+    "./css/pikaday.css"
+  ],
+  "dependencies": {},
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "components"
+  ],
+  "license" : [
+    "BSD",
+    "MIT"
+  ],
+  "homepage": "http://dbushell.github.io/Pikaday/",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/dbushell/Pikaday.git"
+  }
+}

data/vendor/assets/components/pikaday/component.json

@@ -0,0 +1,17 @@
+{
+  "name": "pikaday",
+  "repo": "dbushell/Pikaday",
+  "description": "A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS",
+  "version": "1.3.2",
+  "keywords": [
+    "datepicker",
+    "calendar",
+    "date"
+  ],
+  "main": "pikaday.js",
+  "scripts": ["pikaday.js"],
+  "styles":  ["css/pikaday.css"],
+  "dependencies": {},
+  "demo": "http://dbushell.github.io/Pikaday/",
+  "license": "MIT"
+}

data/vendor/assets/{stylesheets → components/pikaday/css}/pikaday.css

@@ -2,15 +2,13 @@
 
 /*!
  * Pikaday
- * Copyright © 2012 David Bushell | BSD & MIT license | http://dbushell.com/
+ * Copyright © 2014 David Bushell | BSD & MIT license | http://dbushell.com/
  */
 
 .pika-single {
     z-index: 9999;
     display: block;
     position: relative;
-    width: 240px;
-    padding: 8px;
     color: #333;
     background: #fff;
     border: 1px solid #ccc;
@@ -18,6 +16,18 @@
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
 
+/*
+clear child float (pika-lendar), using the famous micro clearfix hack
+http://nicolasgallagher.com/micro-clearfix-hack/
+*/
+.pika-single:before,
+.pika-single:after {
+    content: " ";
+    display: table;
+}
+.pika-single:after { clear: both }
+.pika-single { *zoom: 1 }
+
 .pika-single.is-hidden {
     display: none;
 }
@@ -27,6 +37,12 @@
     box-shadow: 0 5px 15px -5px rgba(0,0,0,.5);
 }
 
+.pika-lendar {
+    float: left;
+    width: 240px;
+    margin: 8px;
+}
+
 .pika-title {
     position: relative;
     text-align: center;
@@ -66,13 +82,14 @@
     padding: 0;
     width: 20px;
     height: 30px;
+    /* hide text using text-indent trick, using width value (it's enough) */
+    text-indent: 20px;
+    white-space: nowrap;
+    overflow: hidden;
     background-color: transparent;
     background-position: center center;
     background-repeat: no-repeat;
     background-size: 75% 75%;
-    white-space: nowrap;
-    text-indent: 100%;
-    overflow: hidden;
     opacity: .5;
     *position: absolute;
     *top: 0;
@@ -118,6 +135,7 @@
 .pika-table th,
 .pika-table td {
     width: 14.285714285714286%;
+    padding: 0;
 }
 
 .pika-table th {
@@ -131,6 +149,8 @@
 .pika-button {
     cursor: pointer;
     display: block;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
     outline: none;
     border: 0;
     margin: 0;
@@ -143,6 +163,11 @@
     background: #f5f5f5;
 }
 
+.pika-week {
+    font-size: 11px;
+    color: #999;
+}
+
 .is-today .pika-button {
     color: #33aaff;
     font-weight: bold;
@@ -168,4 +193,11 @@
     background: #ff8000 !important;
     box-shadow: none !important;
     border-radius: 3px !important;
-}
+}
+
+/* styling for abbr */
+.pika-table abbr {
+    border-bottom: none;
+    cursor: help;
+}
+