date_picker 0.0.8 → 0.0.9

data/test/dummy/vendor/assets/components/pickadate/lib/themes-source/base.less

@@ -0,0 +1,55 @@
+
+/* ==========================================================================
+   $BASE-PICKER
+   ========================================================================== */
+
+@import "_variables.less";
+
+
+/**
+ * Note: the root picker element should *NOT* be styled more than what’s here.
+ */
+.picker {
+
+    // The base font stylings.
+    font-size: @base-font-size;
+    text-align: left;
+    line-height: @base-line-height;
+    color: @black;
+
+    // The picker shouldn’t affect or be affected by elements around it.
+    position: absolute;
+    z-index: @picker-z-index;
+
+    // The picker shouldn’t be selectable.
+    user-select: none;
+}
+
+
+/**
+ * The picker input element.
+ */
+.picker__input {
+    cursor: default;
+}
+
+
+/**
+ * When the picker is opened, the input element is “activated”.
+ */
+.picker__input.picker__input--active {
+    border-color: @input-active-border;
+}
+
+
+/**
+ * The holder is the only “scrollable” top-level container element.
+ */
+.picker__holder {
+    width: 100%;
+    overflow-y: auto;
+    -webkit-overflow-scrolling: touch;
+}
+
+
+

data/test/dummy/vendor/assets/components/pickadate/lib/themes-source/base.time.less

@@ -0,0 +1,119 @@
+
+/* ==========================================================================
+   $BASE-TIME-PICKER
+   ========================================================================== */
+
+@import "_variables.less";
+
+
+/**
+ * The list of times.
+ */
+.picker__list {
+    list-style: none;
+    padding: 0.75em 0 4.2em;
+    margin: 0;
+}
+
+
+/**
+ * The times on the clock.
+ */
+.picker__list-item {
+    border-bottom: 1px solid @border-grey-light;
+    border-top: 1px solid @border-grey-light;
+    margin-bottom: -1px; // Prevent border from doubling up.
+    position: relative;
+    background: @bg-white;
+    padding: .75em 1.25em;
+
+    // For `large` screens, reduce the padding to show more in view.
+    @media ( min-height: @breakpoint-large ) {
+        padding: .5em 1em;
+    }
+}
+
+/* Hovered time */
+.picker__list-item:hover {
+    .picker-item-hovered;
+    border-color: @blue;
+    z-index: 10;
+}
+
+/* Highlighted and hovered/focused time */
+.picker__list-item--highlighted {
+    .picker-item-highlighted;
+    z-index: 10;
+}
+.picker__list-item--highlighted:hover,
+.picker--focused .picker__list-item--highlighted {
+    .picker-item-hovered;
+}
+
+/* Selected and hovered/focused time */
+.picker__list-item--selected,
+.picker__list-item--selected:hover,
+.picker--focused .picker__list-item--selected {
+    .picker-item-selected;
+    z-index: 10;
+}
+
+/* Disabled time */
+.picker__list-item--disabled,
+.picker__list-item--disabled:hover,
+.picker--focused .picker__list-item--disabled {
+    .picker-item-disabled;
+    border-color: @border-grey-light;
+    z-index: auto;
+}
+
+
+
+
+/**
+ * The clear button
+ */
+.picker--time {
+
+    .picker__button--clear {
+        display: block;
+        width: 80%;
+        margin: 1em auto 0;
+        padding: 1em 1.25em;
+
+        background: none;
+        border: 0;
+
+        font-weight: 500;
+        font-size: .67em;
+        text-align: center;
+        text-transform: uppercase;
+        color: #666;
+    }
+
+    .picker__button--clear:hover,
+    .picker__button--clear:focus {
+        .picker-item-hovered;
+        background: @clear-red;
+        border-color: @clear-red;
+        cursor: pointer;
+        color: @white;
+        outline: none;
+    }
+
+    .picker__button--clear:before {
+        top: -.25em;
+        color: #666;
+        font-size: 1.25em;
+        font-weight: bold;
+    }
+
+    .picker__button--clear:hover:before,
+    .picker__button--clear:focus:before {
+        color: @white;
+        border-color: @white;
+    }
+}
+
+
+

data/test/dummy/vendor/assets/components/pickadate/lib/themes-source/classic.date.less

@@ -0,0 +1,9 @@
+
+/* ==========================================================================
+   $CLASSIC-DATE-PICKER
+   ========================================================================== */
+
+@import "_variables.less";
+
+
+

data/test/dummy/vendor/assets/components/pickadate/lib/themes-source/classic.less

@@ -0,0 +1,103 @@
+/*!
+ * Classic picker styling for pickadate.js
+ * Demo: http://amsul.github.io/pickadate.js
+ */
+
+@import "_variables.less";
+
+
+/**
+ * Note: the root picker element should *NOT* be styled more than what’s here.
+ */
+.picker {
+
+    // Make it full-width so that it doesn’t collapse.
+    width: 100%;
+}
+
+
+
+/**
+ * The holder is the base of the picker.
+ */
+.picker__holder {
+
+    // The base stylings.
+    position: absolute;
+    background: @bg-white;
+
+    // Add a light border - except top & bottom to let it collapse.
+    border: 1px solid lighten( @border-grey, 20% );
+    border-top-width: 0;
+    border-bottom-width: 0;
+
+    // Round the bottom corners.
+    border-radius: 0 0 @picker-border-radius @picker-border-radius;
+
+    // Let’s not go 100% + 2px.
+    box-sizing: border-box;
+
+    // Specify the min & max widths.
+    min-width: @classic-min-width;
+    max-width: @classic-max-width;
+
+    // Hide everything to begin with.
+    max-height: 0;
+    .opacity( 0 );
+
+    // Tilt the picker.
+    transform: translateY( -1em ) perspective( 600px ) rotateX( 10deg );
+
+    // Everything should be smoothly animated – the height & border should wait till the rest is done.
+    transition: transform @speed-animate-in ease-out,
+                opacity @speed-animate-in ease-out,
+                max-height 0s @speed-animate-in,
+                border-width 0s @speed-animate-in;
+}
+
+
+
+/**
+ * The frame and wrap work together to ensure that
+ * clicks within the picker don’t reach the holder.
+ */
+.picker__frame {
+    padding: 1px;
+}
+.picker__wrap {
+    margin: -1px;
+}
+
+
+
+/**
+ * When the picker opens...
+ */
+.picker--opened {
+
+    .picker__holder {
+
+        // Reveal the content.
+        max-height: @classic-max-height;
+        .opacity( 1 );
+
+        // Expand the top & bottom borders.
+        border-top-width: 1px;
+        border-bottom-width: 1px;
+
+        // Straighten the picker.
+        transform: translateY( 0 ) perspective( 600px ) rotateX( 0 );
+
+        // Everything should be smoothly animated – except the height & border.
+        transition: transform @speed-animate-in ease-out,
+                    opacity @speed-animate-in ease-out,
+                    max-height 0s,
+                    border-width 0s;
+
+        // Add a light shadow.
+        box-shadow: @classic-box-shadow;
+    }
+}
+
+
+

data/test/dummy/vendor/assets/components/pickadate/lib/themes-source/classic.time.less

@@ -0,0 +1,49 @@
+
+/* ==========================================================================
+   $CLASSIC-TIME-PICKER
+   ========================================================================== */
+
+@import "_variables.less";
+
+
+/**
+ * Note: the root picker element should __NOT__ be styled
+ * more than what’s here. Style the `.picker__holder` instead.
+ */
+.picker--time {
+
+    // Adjust the min & max widths.
+    min-width: @time-min-width;
+    max-width: @time-max-width;
+}
+
+
+/**
+ * The holder is the base of the picker.
+ */
+.picker--time .picker__holder {
+
+    // Add a slight background color.
+    background: @bg-grey-light;
+
+    // For `medium` screens, reduce the font-size a bit to get more in view.
+    @media ( min-height: @breakpoint-medium ) {
+        font-size: .875em;
+    }
+}
+
+
+/**
+ * The box contains the list of times.
+ */
+.picker--time .picker__box {
+
+    // Remove any stylings overflowing from the date picker.
+    padding: 0;
+
+    // Make the “viewset” time position relative to the box.
+    position: relative;
+}
+
+
+

data/test/dummy/vendor/assets/components/pickadate/lib/themes-source/default.date.less

@@ -0,0 +1,9 @@
+
+/* ==========================================================================
+   $DEFAULT-DATE-PICKER
+   ========================================================================== */
+
+@import "_variables.less";
+
+
+

data/test/dummy/vendor/assets/components/pickadate/lib/themes-source/default.less

@@ -0,0 +1,192 @@
+/*!
+ * Default mobile-first, responsive styling for pickadate.js
+ * Demo: http://amsul.github.io/pickadate.js
+ */
+
+@import "_variables.less";
+
+
+/**
+ * Note: the root picker element should *NOT* be styled more than what’s here.
+ */
+.picker {}
+
+
+/**
+ * Make the holder and frame fullscreen.
+ */
+.picker__holder,
+.picker__frame {
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+
+    // Nudge everything off-screen to begin with.
+    transform: translateY(100%);
+}
+
+
+/**
+ * The holder should overlay the entire screen.
+ */
+.picker__holder {
+
+    // Fill the screen and fix the position.
+    position: fixed;
+
+    // Fade out the background, then immediately shift the holder out of view.
+    transition: background @speed-animate-in ease-out, transform 0s @speed-animate-in;
+
+    // Avoid flickering of the page on webkit browsers
+    -webkit-backface-visibility: hidden;
+}
+
+
+
+/**
+ * The frame that bounds the box contents of the picker.
+ */
+.picker__frame {
+
+    position: absolute;
+
+    // Specify the min & max widths and center align it.
+    margin: 0 auto;
+    min-width: @picker-min-width;
+    max-width: @picker-max-width;
+    width: 100%; // For IE9 & 10 to keep it centered.
+
+    // Hide it to begin with.
+    .opacity( 0 );
+
+    // Animate the frame in and out of view.
+    transition: all @speed-animate-in ease-out;
+
+    // For `small` screens...
+    @media ( min-height: @breakpoint-small ) {
+
+        // Reveal what’s beyond to allow drop shadows, et al.
+        overflow: visible;
+
+        // Align to the bottom edge instead of top.
+        top: auto;
+        bottom: -100%;
+
+        // Prevent it from overflowing over the top edge.
+        max-height: 80%;
+    }
+
+    // For `medium` screens...
+    @media ( min-height: @breakpoint-medium ) {
+
+        // Move away from the bottom edge.
+        margin-bottom: 7.5%;
+    }
+}
+
+/**
+ * The wrapper sets the stage to vertically align the box contents.
+ */
+.picker__wrap {
+    display: table;
+    width: 100%;
+    height: 100%;
+
+    // For `small` screens, remove the “middle-aligned” styling
+    @media ( min-height: @breakpoint-small ) {
+        display: block;
+    }
+}
+
+
+
+/**
+ * The box contains all the picker contents.
+ */
+.picker__box {
+    background: @bg-white;
+
+    // To start with, vertically align to center
+    display: table-cell;
+    vertical-align: middle;
+
+    // For `tiny` screens, increase the font size a bit
+    @media ( min-height: @breakpoint-tiny ) {
+        font-size: 1.25em;
+    }
+
+    // For `small` screens...
+    @media ( min-height: @breakpoint-small ) {
+
+        // Remove the “middle-aligned” styling
+        display: block;
+
+        // Increase the font size a bit more
+        font-size: 1.33em;
+
+        // Add the borders except the bottom one
+        border: 1px solid @border-grey;
+        border-top-color: lighten( @border-grey, 7% );
+        border-bottom-width: 0;
+
+        // Make ‘em rounded at the top corners
+        border-radius: @picker-border-radius @picker-border-radius 0 0;
+
+        // And finally, add a nice shadow
+        box-shadow: @picker-box-shadow;
+    }
+
+    // For `medium` screens...
+    @media ( min-height: @breakpoint-medium ) {
+
+        // Increase the font size.
+        font-size: 1.5em;
+
+        // Reveal all borders and round all corners.
+        border-bottom-width: 1px;
+        border-radius: @picker-border-radius;
+    }
+}
+
+
+/**
+ * When the picker opens...
+ */
+.picker--opened {
+
+    // Immediately move the holder to the top edge then fade in an overlay
+    .picker__holder {
+
+        // Move it to the top edge
+        transform: translateY(0);
+
+        // Show a translucent black background (order is important for IE)
+        background: transparent;
+        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#1E000000,endColorstr=#1E000000)"; // IE8
+              zoom: 1;
+        background: rgba(0,0,0,.32); // Normal browsers
+
+        // Animate in the background
+        transition: background @speed-animate-in ease-out;
+    }
+
+
+    // Smoothly move the content to the top edge while fading it in
+    .picker__frame {
+
+        // Move to the top edge
+        transform: translateY(0);
+
+        // Ånd then reveal the content
+        .opacity( 1 );
+
+        // For `small` screens, move to the bottom edge instead
+        @media ( min-height: @breakpoint-small ) {
+            top: auto;
+            bottom: 0;
+        }
+    }
+}
+
+