alchemy_cms 3.3.3 → 3.4.0.rc1

data/app/assets/stylesheets/alchemy/buttons.scss

@@ -195,7 +195,8 @@ button.icon_button {
     }
   }
 
-  .select2-container {
+  .select2-container,
+  select {
     margin: 0;
     top: 0;
   }

data/app/assets/stylesheets/alchemy/form_fields.scss

@@ -93,3 +93,12 @@ fieldset {
   line-height: 1.5;
   color: $default-border-color;
 }
+
+.page-publication-date-fields {
+  padding-bottom: $default-padding;
+  @include clearfix;
+
+  &.hidden {
+    display: none;
+  }
+}

data/app/assets/stylesheets/alchemy/forms.scss

@@ -28,19 +28,19 @@ form {
     padding: $default-padding 0;
     @include pie-clearfix;
 
-    input[type="url"],
-    input[type="text"],
-    input[type="email"],
-    input[type="password"],
-    textarea,
-    .select2-container,
-    .autocomplete_tag_list,
-    .mce-tinymce {
+    > input[type="url"],
+    > input[type="text"],
+    > input[type="email"],
+    > input[type="password"],
+    > textarea,
+    > .select2-container,
+    > .autocomplete_tag_list,
+    > .mce-tinymce {
       width: $form-right-width;
       float: right;
     }
 
-    .autocomplete_tag_list {
+    > .autocomplete_tag_list {
 
       .select2-container, .select2-choices {
         width: 100%;
@@ -77,7 +77,7 @@ form {
 
       input {
         margin-right: $default-margin;
-        margin-left: $default-margin;
+        margin-left: 1px;
       }
     }
 
@@ -168,6 +168,27 @@ form {
     padding: $default-padding 0;
     text-align: right;
   }
+
+  .input-column {
+    @include box-sizing(border-box);
+    float: left;
+    padding: 0 $default-padding;
+    width: 50%;
+  }
+
+  .input-row {
+
+    .input-column {
+
+      &:first-of-type {
+        padding-left: 0;
+      }
+
+      &:last-of-type {
+        padding-right: 0;
+      }
+    }
+  }
 }
 
 textarea#essence_picture_caption {
@@ -200,3 +221,8 @@ textarea#essence_picture_caption {
     width: 100%;
   }
 }
+
+.input-column > label {
+  display: block;
+  margin-top: $default-margin +1;
+}

data/app/assets/stylesheets/alchemy/frame.scss

@@ -219,12 +219,19 @@ div#user_info {
     float: none;
     @include inline-block;
     color: #3265b1;
-    @extend %rounded-border;
     margin-right: 2px;
     font-size: 10px;
     text-transform: uppercase;
   }
 
+  .page_site {
+    float: none;
+    @include inline-block;
+    color: #847474;
+    margin-right: $default-margin;
+    font-size: 10px;
+  }
+
   .subnavi_tab {
     float: left;
     line-height: 21px;
@@ -291,6 +298,10 @@ div#user_info {
   img {
     float: left;
   }
+
+  .subnavi_tab > a {
+    padding-right: 0;
+  }
 }
 
 .full-iframe {

data/app/assets/stylesheets/alchemy/icons.scss

@@ -53,7 +53,7 @@
     &.small {
       background: none;
       @extend .icon-cross;
-      line-height: 0;
+      line-height: 1;
     }
   }
 

data/app/assets/stylesheets/alchemy/jquery-ui.scss

@@ -1230,266 +1230,6 @@
   visibility: hidden;
 }
 
-/*
- * jQuery UI Datepicker 1.8.7
- *
- * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Datepicker#theming
- */
-
-.ui-datepicker {
-  width: 17em;
-  padding: $default-padding;
-  display: none;
-
-  select {
-    height: 20px;
-    padding: 1px;
-  }
-}
-
-.ui-datepicker .ui-datepicker-header {
-  position: relative;
-  padding: $default-padding;
-  margin: -$default-padding;
-}
-
-.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
-  position: absolute;
-  top: $default-padding;
-  width: 1.8em;
-  height: 1.8em;
-}
-
-.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover {
-  top: $default-padding;
-}
-
-.ui-datepicker .ui-datepicker-prev {
-  left: $default-padding;
-}
-
-.ui-datepicker .ui-datepicker-next {
-  right: $default-padding;
-}
-
-.ui-datepicker .ui-datepicker-prev-hover {
-  top: $default-padding - 1;
-  left: $default-padding - 1;
-}
-
-.ui-datepicker .ui-datepicker-next-hover {
-  top: $default-padding - 1;
-  right: $default-padding - 1;
-}
-
-.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
-  display: block;
-  position: absolute;
-  left: 50%;
-  margin-left: -8px;
-  top: 50%;
-  margin-top: -8px;
-}
-
-.ui-datepicker .ui-datepicker-title {
-  margin: 0 2.3em;
-  line-height: 1.8em;
-  text-align: center;
-}
-
-.ui-datepicker .ui-datepicker-title select {
-  font-size: 1em;
-  margin: 1px 0;
-}
-
-.ui-datepicker select.ui-datepicker-month-year {
-  width: 100%;
-}
-
-.ui-datepicker select.ui-datepicker-month,
-.ui-datepicker select.ui-datepicker-year {
-  width: 49%;
-}
-
-.ui-datepicker table {
-  width: 100%;
-  font-size: 1em;
-  border-collapse: collapse;
-  margin: 0 0 .4em;
-}
-
-.ui-datepicker th {
-  padding: .7em .3em;
-  text-align: center;
-  font-weight: bold;
-  border: 0;
-}
-
-.ui-datepicker td {
-  border: 0;
-  padding: 1px;
-}
-
-.ui-datepicker td.ui-datepicker-week-col {
-  padding-left: $default-padding;
-}
-
-.ui-datepicker td.ui-datepicker-current-day {
-  background-color: $dark-gray;
-}
-
-.ui-datepicker td span, .ui-datepicker td a {
-  display: block;
-  padding: .2em;
-  text-align: right;
-  text-decoration: none;
-}
-
-.ui-datepicker .ui-datepicker-buttonpane {
-  background-image: none;
-  margin: .7em 0 0 0;
-  padding: 0 .2em;
-  border-left: 0;
-  border-right: 0;
-  border-bottom: 0;
-}
-
-.ui-datepicker .ui-datepicker-buttonpane button {
-  float: right;
-  margin: .5em .2em .4em;
-  cursor: pointer;
-  padding: .2em .6em .3em .6em;
-  width: auto;
-  overflow: visible;
-}
-
-.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
-  float: left;
-}
-
-/* with multiple calendars */
-
-.ui-datepicker.ui-datepicker-multi {
-  width: auto;
-}
-
-.ui-datepicker-multi .ui-datepicker-group {
-  float: left;
-}
-
-.ui-datepicker-multi .ui-datepicker-group table {
-  width: 95%;
-  margin: 0 auto .4em;
-}
-
-.ui-datepicker-multi-2 .ui-datepicker-group {
-  width: 50%;
-}
-
-.ui-datepicker-multi-3 .ui-datepicker-group {
-  width: 33.3%;
-}
-
-.ui-datepicker-multi-4 .ui-datepicker-group {
-  width: 25%;
-}
-
-.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header {
-  border-left-width: 0;
-}
-
-.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
-  border-left-width: 0;
-}
-
-.ui-datepicker-multi .ui-datepicker-buttonpane {
-  clear: left;
-}
-
-.ui-datepicker-row-break {
-  clear: both;
-  width: 100%;
-}
-
-/* RTL support */
-
-.ui-datepicker-rtl {
-  direction: rtl;
-}
-
-.ui-datepicker-rtl .ui-datepicker-prev {
-  right: 2px;
-  left: auto;
-}
-
-.ui-datepicker-rtl .ui-datepicker-next {
-  left: 2px;
-  right: auto;
-}
-
-.ui-datepicker-rtl .ui-datepicker-prev:hover {
-  right: 1px;
-  left: auto;
-}
-
-.ui-datepicker-rtl .ui-datepicker-next:hover {
-  left: 1px;
-  right: auto;
-}
-
-.ui-datepicker-rtl .ui-datepicker-buttonpane {
-  clear: right;
-}
-
-.ui-datepicker-rtl .ui-datepicker-buttonpane button {
-  float: left;
-}
-
-.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current {
-  float: right;
-}
-
-.ui-datepicker-rtl .ui-datepicker-group {
-  float: right;
-}
-
-.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header {
-  border-right-width: 0;
-  border-left-width: 1px;
-}
-
-.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
-  border-right-width: 0;
-  border-left-width: 1px;
-}
-
-/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
-
-.ui-datepicker-cover {
-  display: none;
-/*sorry for IE5*/
-  display /**/: block;
-/*sorry for IE5*/
-  position: absolute;
-/*must have*/
-  z-index: -1;
-/*must have*/
-  filter: mask();
-/*must have*/
-  top: -4px;
-/*must have*/
-  left: -4px;
-/*must have*/
-  width: 200px;
-/*must have*/
-  height: 200px;
-/*must have*/
-}
-
 /*
  * jQuery UI Progressbar 1.8.7
  *

data/app/assets/stylesheets/alchemy/jquery.datetimepicker.scss

@@ -0,0 +1,507 @@
+$datepicker_current_bg: $light-blue !default;
+$datepicker_current_color: $text-color !default;
+$datepicker_current_box_shadow: $blue 0 1px 3px 0 inset !default;
+$datepicker_hover_bg: $light_yellow !default;
+$datepicker_hover_color: $text-color !default;
+$datepicker_today_bg: $very-light-blue !default;
+$datepicker_today_color: $text-color !default;
+$datepicker_header_color: $text-color !default;
+$datepicker_day_bg: $light-gray !default;
+$datepicker_day_border: 1px solid $medium-gray !default;
+$datepicker_day_color: $text-color !default;
+
+.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;
+  border-radius: $default-border-radius;
+  color: $text-color;
+  padding: 8px;
+  padding-left: 0;
+  padding-top: 2px;
+  position: absolute;
+  z-index: 9999;
+  box-sizing: border-box;
+  display: none;
+}
+
+.xdsoft_datetimepicker.xdsoft_rtl {
+  padding: 8px 0 8px 8px;
+}
+
+.xdsoft_datetimepicker iframe {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 75px;
+  height: 210px;
+  background: transparent;
+  border: none;
+}
+
+/*For IE8 or lower*/
+.xdsoft_datetimepicker button {
+  border: none !important;
+}
+
+.xdsoft_noselect {
+  user-select: none;
+}
+
+.xdsoft_noselect::selection { background: transparent }
+.xdsoft_noselect::-moz-selection { background: transparent }
+
+.xdsoft_datetimepicker.xdsoft_inline {
+  display: inline-block;
+  position: static;
+  box-shadow: none;
+}
+
+.xdsoft_datetimepicker * {
+  box-sizing: border-box;
+  padding: 0;
+  margin: 0;
+}
+
+.xdsoft_datetimepicker .xdsoft_datepicker,
+.xdsoft_datetimepicker .xdsoft_timepicker {
+  display: none;
+}
+
+.xdsoft_datetimepicker .xdsoft_datepicker.active,
+.xdsoft_datetimepicker .xdsoft_timepicker.active {
+  display: block;
+}
+
+.xdsoft_datetimepicker .xdsoft_datepicker {
+  width: 230px;
+  float: left;
+  margin-left: 8px;
+}
+
+.xdsoft_datetimepicker.xdsoft_rtl .xdsoft_datepicker {
+  float: right;
+  margin-right: 8px;
+  margin-left: 0;
+}
+
+.xdsoft_datetimepicker.xdsoft_showweeks .xdsoft_datepicker {
+  width: 260px;
+}
+
+.xdsoft_datetimepicker .xdsoft_timepicker {
+  width: 60px;
+  float: left;
+  text-align: center;
+  margin-left: 8px;
+  margin-top: 0;
+}
+
+.xdsoft_datetimepicker.xdsoft_rtl .xdsoft_timepicker {
+  float: right;
+  margin-right: 8px;
+  margin-left: 0;
+}
+
+.xdsoft_datetimepicker .xdsoft_datepicker.active+.xdsoft_timepicker {
+  margin-top: 8px;
+  margin-bottom: 3px;
+}
+
+.xdsoft_datetimepicker .xdsoft_mounthpicker {
+  position: relative;
+  text-align: center;
+}
+
+.xdsoft_datetimepicker .xdsoft_label i,
+.xdsoft_datetimepicker .xdsoft_prev,
+.xdsoft_datetimepicker .xdsoft_next,
+.xdsoft_datetimepicker .xdsoft_today_button {
+  background-image: none;
+}
+
+.xdsoft_datetimepicker .xdsoft_label i {
+  opacity: 0.5;
+  display: inline-block;
+  width: 9px;
+  height: 20px;
+  vertical-align: middle;
+
+  &:before {
+    content: "";
+    position: absolute;
+    top: 50%;
+    right: 0;
+    transform: translateY(-50%);
+    width: 0;
+    height: 0;
+    border-style: solid;
+    border-width: 4px 4px 0 4px;
+    border-color: $text-color transparent transparent;
+  }
+}
+
+.xdsoft_datetimepicker .xdsoft_prev,
+.xdsoft_datetimepicker .xdsoft_next {
+  position: relative;
+
+  &:before {
+    content: "";
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 0;
+    height: 0;
+    border-style: solid;
+  }
+}
+
+.xdsoft_datetimepicker .xdsoft_prev {
+  float: left;
+
+  &:before {
+    border-width: 7px 7px 7px 0;
+    border-color: transparent $text-color transparent transparent;
+  }
+}
+
+.xdsoft_datetimepicker .xdsoft_today_button {
+  float: left;
+  margin: 0 5px;
+
+  &:before {
+    font-family: 'Alchemy Icons';
+    font-size: 16px;
+    line-height: 18px;
+    content: "\e00a";
+  }
+}
+
+.xdsoft_datetimepicker .xdsoft_next {
+  float: right;
+
+  &:before {
+    border-width: 7px 0 7px 7px;
+    border-color: transparent transparent transparent $text-color;
+  }
+}
+
+.xdsoft_datetimepicker .xdsoft_next,
+.xdsoft_datetimepicker .xdsoft_prev ,
+.xdsoft_datetimepicker .xdsoft_today_button {
+  background-color: transparent;
+  background-repeat: no-repeat;
+  border: 0 none;
+  cursor: pointer;
+  display: block;
+  height: 30px;
+  opacity: 0.5;
+  outline: medium none;
+  overflow: hidden;
+  padding: 0;
+  position: relative;
+  white-space: nowrap;
+  width: 20px;
+  min-width: 0;
+}
+
+.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev,
+.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_next {
+  float: none;
+  height: 15px;
+  width: 30px;
+  display: block;
+  margin-left: 14px;
+  margin-top: 7px;
+}
+
+.xdsoft_datetimepicker.xdsoft_rtl .xdsoft_timepicker .xdsoft_prev,
+.xdsoft_datetimepicker.xdsoft_rtl .xdsoft_timepicker .xdsoft_next {
+  float: none;
+  margin-left: 0;
+  margin-right: 14px;
+}
+
+.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev {
+  margin-bottom: 8px;
+  margin-top: 0;
+
+  &:before {
+    border-width: 0 8px 8px 8px;
+    border-color: transparent transparent $text-color;
+  }
+}
+
+.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_next {
+
+  &:before {
+    border-width: 8px 8px 0 8px;
+    border-color: $text-color transparent transparent;
+  }
+}
+
+.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box {
+  height: 151px;
+  overflow: hidden;
+  border-bottom: 1px solid #ddd;
+}
+
+.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >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_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div > div:first-child {
+  border-top-width: 0;
+}
+
+.xdsoft_datetimepicker .xdsoft_today_button:hover,
+.xdsoft_datetimepicker .xdsoft_next:hover,
+.xdsoft_datetimepicker .xdsoft_prev:hover {
+  opacity: 1;
+}
+
+.xdsoft_datetimepicker .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;
+}
+
+.xdsoft_datetimepicker .xdsoft_label:hover i {
+  opacity: 1;
+}
+
+.xdsoft_datetimepicker .xdsoft_label > .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_datetimepicker .xdsoft_label > .xdsoft_select.xdsoft_monthselect{ right: -7px }
+.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select.xdsoft_yearselect{ right: 2px }
+.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option:hover {
+  color: $datepicker_hover_color;
+  background: $datepicker_hover_bg;
+}
+
+.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option {
+  padding: 2px 10px 2px 5px;
+  text-decoration: none !important;
+}
+
+.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current {
+  background: $datepicker_current_bg;
+  box-shadow: $datepicker_current_box_shadow;
+  color: $datepicker_current_color;
+  font-weight: 700;
+}
+
+.xdsoft_datetimepicker .xdsoft_month {
+  width: 100px;
+  text-align: right;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar {
+  clear: both;
+}
+
+.xdsoft_datetimepicker .xdsoft_year {
+  width: 52px;
+  margin-left: 5px;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar table {
+  border-collapse: collapse;
+  width: 100%;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar td > div {
+  padding-right: 5px;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar th {
+  height: 25px;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar td,
+.xdsoft_datetimepicker .xdsoft_calendar th {
+  width: 14.2857142%;
+  background: $datepicker_day_bg;
+  border: $datepicker_day_border;
+  color: $datepicker_day_color;
+  font-size: 12px;
+  text-align: right;
+  vertical-align: middle;
+  padding: 0;
+  border-collapse: collapse;
+  cursor: pointer;
+  height: 25px;
+}
+
+.xdsoft_datetimepicker.xdsoft_showweeks .xdsoft_calendar td,
+.xdsoft_datetimepicker.xdsoft_showweeks .xdsoft_calendar th {
+  width: 12.5%;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar th {
+  background: #f1f1f1;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_today {
+  background: $datepicker_today_bg;
+  color: $datepicker_today_color;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_highlighted_default {
+  background: #ffe9d2;
+  box-shadow: #ffb871 0 1px 4px 0 inset;
+  color: #000;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_highlighted_mint {
+  background: #c1ffc9;
+  box-shadow: #00dd1c 0 1px 4px 0 inset;
+  color: #000;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_default,
+.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current,
+.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div.xdsoft_current {
+  background: $datepicker_current_bg;
+  box-shadow: $datepicker_current_box_shadow;
+  color: $datepicker_current_color;
+  font-weight: 700;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_other_month,
+.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_disabled,
+.xdsoft_datetimepicker .xdsoft_time_box >div >div.xdsoft_disabled {
+  opacity: 0.5;
+  cursor: default;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_other_month.xdsoft_disabled {
+  opacity: 0.2;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar td:hover,
+.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div:hover {
+  color: $datepicker_hover_color !important;
+  background: $datepicker_hover_bg !important;
+  box-shadow: none !important;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current.xdsoft_disabled:hover,
+.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box>div>div.xdsoft_current.xdsoft_disabled:hover {
+  background: $datepicker_current_bg !important;
+  box-shadow: $datepicker_current_box_shadow !important;
+  color: $datepicker_hover_color !important;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_disabled:hover,
+.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div.xdsoft_disabled:hover {
+  color: inherit  !important;
+  background: inherit !important;
+  box-shadow: inherit !important;
+}
+
+.xdsoft_datetimepicker .xdsoft_calendar th {
+  font-weight: 700;
+  text-align: center;
+  color: $datepicker_header_color;
+  cursor: default;
+}
+
+.xdsoft_datetimepicker .xdsoft_copyright {
+  color: #ccc !important;
+  font-size: 10px;
+  clear: both;
+  float: none;
+  margin-left: 8px;
+}
+
+.xdsoft_datetimepicker .xdsoft_copyright a { color: #eee !important }
+.xdsoft_datetimepicker .xdsoft_copyright a:hover { color: #aaa !important }
+
+.xdsoft_time_box {
+  position: relative;
+  border: 1px solid #ccc;
+}
+
+.xdsoft_scrollbar > .xdsoft_scroller {
+  background: #ccc !important;
+  height: 20px;
+  border-radius: 3px;
+}
+
+.xdsoft_scrollbar {
+  position: absolute;
+  width: 7px;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  cursor: pointer;
+}
+
+.xdsoft_datetimepicker.xdsoft_rtl .xdsoft_scrollbar {
+  left: 0;
+  right: auto;
+}
+
+.xdsoft_scroller_box {
+  position: relative;
+}
+
+.xdsoft_datetimepicker .xdsoft_save_selected {
+  display: block;
+  border: 1px solid #dddddd !important;
+  margin-top: 5px;
+  width: 100%;
+  color: #454551;
+  font-size: 13px;
+}
+
+.xdsoft_datetimepicker .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;
+  @include background(linear-gradient(top, #fff 0%, #f4f8fa 73%));
+}
+
+.xdsoft_datetimepicker .blue-gradient-button:hover, .xdsoft_datetimepicker .blue-gradient-button:focus, .xdsoft_datetimepicker .blue-gradient-button:hover span, .xdsoft_datetimepicker .blue-gradient-button:focus span {
+  color: #454551;
+  @include background(linear-gradient(top, #f4f8fa 0%, #FFF 73%));
+}