github.com/apremalal/vamps-core@v1.0.1-0.20161221121535-d430b56ec174/server/webapps/app/base/plugins/bootstrap-datetimepicker/less/datetimepicker.less (about)

     1  /*!
     2   * Datetimepicker for Bootstrap
     3   *
     4   * Copyright 2012 Stefan Petre
     5   * Improvements by Andrew Rowls
     6   * Improvements by Sébastien Malot
     7   * Licensed under the Apache License v2.0
     8   * http://www.apache.org/licenses/LICENSE-2.0
     9   *
    10   */
    11  
    12  .datetimepicker {
    13      padding: 4px;
    14      margin-top: 1px;
    15      white-space: normal;
    16      -webkit-border-radius: 4px;
    17      -moz-border-radius: 4px;
    18      border-radius: 4px;
    19      direction: ltr;
    20      &.datetimepicker-rtl {
    21          direction: rtl;
    22          table {
    23              tr {
    24                  td {
    25                      span {
    26                          float: right;
    27                      }
    28                  }
    29              }
    30          }
    31      }
    32      & > div {
    33          display: none;
    34      }
    35      &.minutes {
    36          div {
    37              &.datetimepicker-minutes {
    38                  display: block;
    39              }
    40          }
    41      }
    42      &.hours {
    43          div {
    44              &.datetimepicker-hours {
    45                  display: block;
    46              }
    47          }
    48      }
    49      &.days {
    50          div {
    51              &.datetimepicker-days {
    52                  display: block;
    53              }
    54          }
    55      }
    56      &.months {
    57          div {
    58              &.datetimepicker-months {
    59                  display: block;
    60              }
    61          }
    62      }
    63      &.years {
    64          div {
    65              &.datetimepicker-years {
    66                  display: block;
    67              }
    68          }
    69      }
    70      table {
    71          margin: 0;
    72          tr {
    73              td {
    74                  &.minute {
    75                      &:hover {
    76                          background: #eeeeee;
    77                          cursor: pointer;
    78                      }
    79                  }
    80                  &.hour {
    81                      &:hover {
    82                          background: #eeeeee;
    83                          cursor: pointer;
    84                      }
    85                  }
    86                  &.day {
    87                      &:hover {
    88                          background: #eeeeee;
    89                          cursor: pointer;
    90                      }
    91                  }
    92                  span {
    93                      display: block;
    94                      width: 23%;
    95                      height: 54px;
    96                      line-height: 54px;
    97                      float: left;
    98                      margin: 1%;
    99                      cursor: pointer;
   100                      -webkit-border-radius: 4px;
   101                      -moz-border-radius: 4px;
   102                      border-radius: 4px;
   103                      &:hover {
   104                          background: #eeeeee;
   105                      }
   106                      &.old {
   107                          color: #999999;
   108                      }
   109                  }
   110              }
   111          }
   112      }
   113      .datetimepicker-hours {
   114          span {
   115              height: 26px;
   116              line-height: 26px;
   117          }
   118      }
   119      .datetimepicker-minutes {
   120          span {
   121              height: 26px;
   122              line-height: 26px;
   123          }
   124      }
   125      th {
   126          &.switch {
   127              width: 145px;
   128          }
   129      }
   130  }
   131  .datetimepicker-inline {
   132      width: 220px;
   133  }
   134  .datetimepicker-dropdown, .datetimepicker-dropdown-left {
   135      top: 0;
   136      left: 0;
   137  }
   138  [class*="datetimepicker-dropdown"]:before {
   139      content: '';
   140      display: inline-block;
   141      border-left: 7px solid transparent;
   142      border-right: 7px solid transparent;
   143      border-bottom: 7px solid #ccc;
   144      border-bottom-color: rgba(0, 0, 0, 0.2);
   145      position: absolute;
   146  }
   147  [class*="datetimepicker-dropdown"]:after {
   148      content: '';
   149      display: inline-block;
   150      border-left: 6px solid transparent;
   151      border-right: 6px solid transparent;
   152      border-bottom: 6px solid #ffffff;
   153      position: absolute;
   154  }
   155  [class*="datetimepicker-dropdown-top"]:before {
   156      content: '';
   157      display: inline-block;
   158      border-left: 7px solid transparent;
   159      border-right: 7px solid transparent;
   160      border-top: 7px solid #ccc;
   161      border-top-color: rgba(0, 0, 0, 0.2);
   162      border-bottom: 0;
   163  }
   164  [class*="datetimepicker-dropdown-top"]:after {
   165      content: '';
   166      display: inline-block;
   167      border-left: 6px solid transparent;
   168      border-right: 6px solid transparent;
   169      border-top: 6px solid #ffffff;
   170      border-bottom: 0;
   171  }
   172  .datetimepicker-dropdown-bottom-left {
   173      &:before {
   174          top: -7px;
   175          right: 6px;
   176      }
   177      &:after {
   178          top: -6px;
   179          right: 7px;
   180      }
   181  }
   182  .datetimepicker-dropdown-bottom-right {
   183      &:before {
   184          top: -7px;
   185          left: 6px;
   186      }
   187      &:after {
   188          top: -6px;
   189          left: 7px;
   190      }
   191  }
   192  .datetimepicker-dropdown-top-left {
   193      &:before {
   194          bottom: -7px;
   195          right: 6px;
   196      }
   197      &:after {
   198          bottom: -6px;
   199          right: 7px;
   200      }
   201  }
   202  .datetimepicker-dropdown-top-right {
   203      &:before {
   204          bottom: -7px;
   205          left: 6px;
   206      }
   207      &:after {
   208          bottom: -6px;
   209          left: 7px;
   210      }
   211  }
   212  .datetimepicker  td,
   213  .datetimepicker th {
   214      text-align: center;
   215      width: 20px;
   216      height: 20px;
   217      -webkit-border-radius: 4px;
   218      -moz-border-radius: 4px;
   219      border-radius: 4px;
   220      border: none;
   221  }
   222  .table-striped .datetimepicker table tr td,
   223  .table-striped .datetimepicker table tr th {
   224      background-color: transparent;
   225  }
   226  .datetimepicker table tr td.old,
   227  .datetimepicker table tr td.new {
   228      color: #999999;
   229  }
   230  .datetimepicker table tr td.disabled,
   231  .datetimepicker table tr td.disabled:hover {
   232      background: none;
   233      color: #999999;
   234      cursor: default;
   235  }
   236  .datetimepicker table tr td.today,
   237  .datetimepicker table tr td.today:hover,
   238  .datetimepicker table tr td.today.disabled,
   239  .datetimepicker table tr td.today.disabled:hover {
   240      background-color: #fde19a;
   241      background-image: -moz-linear-gradient(top, #fdd49a, #fdf59a);
   242      background-image: -ms-linear-gradient(top, #fdd49a, #fdf59a);
   243      background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fdd49a), to(#fdf59a));
   244      background-image: -webkit-linear-gradient(top, #fdd49a, #fdf59a);
   245      background-image: -o-linear-gradient(top, #fdd49a, #fdf59a);
   246      background-image: linear-gradient(top, #fdd49a, #fdf59a);
   247      background-repeat: repeat-x;
   248      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdd49a', endColorstr='#fdf59a', GradientType=0);
   249      border-color: #fdf59a #fdf59a #fbed50;
   250      border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
   251      filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
   252  }
   253  .datetimepicker table tr td.today:hover,
   254  .datetimepicker table tr td.today:hover:hover,
   255  .datetimepicker table tr td.today.disabled:hover,
   256  .datetimepicker table tr td.today.disabled:hover:hover,
   257  .datetimepicker table tr td.today:active,
   258  .datetimepicker table tr td.today:hover:active,
   259  .datetimepicker table tr td.today.disabled:active,
   260  .datetimepicker table tr td.today.disabled:hover:active,
   261  .datetimepicker table tr td.today.active,
   262  .datetimepicker table tr td.today:hover.active,
   263  .datetimepicker table tr td.today.disabled.active,
   264  .datetimepicker table tr td.today.disabled:hover.active,
   265  .datetimepicker table tr td.today.disabled,
   266  .datetimepicker table tr td.today:hover.disabled,
   267  .datetimepicker table tr td.today.disabled.disabled,
   268  .datetimepicker table tr td.today.disabled:hover.disabled,
   269  .datetimepicker table tr td.today[disabled],
   270  .datetimepicker table tr td.today:hover[disabled],
   271  .datetimepicker table tr td.today.disabled[disabled],
   272  .datetimepicker table tr td.today.disabled:hover[disabled] {
   273      background-color: #fdf59a;
   274  }
   275  .datetimepicker table tr td.today:active,
   276  .datetimepicker table tr td.today:hover:active,
   277  .datetimepicker table tr td.today.disabled:active,
   278  .datetimepicker table tr td.today.disabled:hover:active,
   279  .datetimepicker table tr td.today.active,
   280  .datetimepicker table tr td.today:hover.active,
   281  .datetimepicker table tr td.today.disabled.active,
   282  .datetimepicker table tr td.today.disabled:hover.active {
   283      background-color: #fbf069 \9;
   284  }
   285  .datetimepicker table tr td.active,
   286  .datetimepicker table tr td.active:hover,
   287  .datetimepicker table tr td.active.disabled,
   288  .datetimepicker table tr td.active.disabled:hover {
   289      background-color: #006dcc;
   290      background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
   291      background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
   292      background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
   293      background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
   294      background-image: -o-linear-gradient(top, #0088cc, #0044cc);
   295      background-image: linear-gradient(top, #0088cc, #0044cc);
   296      background-repeat: repeat-x;
   297      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
   298      border-color: #0044cc #0044cc #002a80;
   299      border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
   300      filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
   301      color: #fff;
   302      text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
   303  }
   304  .datetimepicker table tr td.active:hover,
   305  .datetimepicker table tr td.active:hover:hover,
   306  .datetimepicker table tr td.active.disabled:hover,
   307  .datetimepicker table tr td.active.disabled:hover:hover,
   308  .datetimepicker table tr td.active:active,
   309  .datetimepicker table tr td.active:hover:active,
   310  .datetimepicker table tr td.active.disabled:active,
   311  .datetimepicker table tr td.active.disabled:hover:active,
   312  .datetimepicker table tr td.active.active,
   313  .datetimepicker table tr td.active:hover.active,
   314  .datetimepicker table tr td.active.disabled.active,
   315  .datetimepicker table tr td.active.disabled:hover.active,
   316  .datetimepicker table tr td.active.disabled,
   317  .datetimepicker table tr td.active:hover.disabled,
   318  .datetimepicker table tr td.active.disabled.disabled,
   319  .datetimepicker table tr td.active.disabled:hover.disabled,
   320  .datetimepicker table tr td.active[disabled],
   321  .datetimepicker table tr td.active:hover[disabled],
   322  .datetimepicker table tr td.active.disabled[disabled],
   323  .datetimepicker table tr td.active.disabled:hover[disabled] {
   324      background-color: #0044cc;
   325  }
   326  .datetimepicker table tr td.active:active,
   327  .datetimepicker table tr td.active:hover:active,
   328  .datetimepicker table tr td.active.disabled:active,
   329  .datetimepicker table tr td.active.disabled:hover:active,
   330  .datetimepicker table tr td.active.active,
   331  .datetimepicker table tr td.active:hover.active,
   332  .datetimepicker table tr td.active.disabled.active,
   333  .datetimepicker table tr td.active.disabled:hover.active {
   334      background-color: #003399 \9;
   335  }
   336  .datetimepicker .datetimepicker-hours table tr td span.hour_am,
   337  .datetimepicker .datetimepicker-hours table tr td span.hour_pm {
   338      width: 14.6%;
   339  }
   340  .datetimepicker .datetimepicker-hours fieldset legend,
   341  .datetimepicker .datetimepicker-minutes fieldset legend {
   342      margin-bottom: inherit;
   343      line-height: 30px;
   344  }
   345  .datetimepicker table tr td span.disabled,
   346  .datetimepicker table tr td span.disabled:hover {
   347      background: none;
   348      color: #999999;
   349      cursor: default;
   350  }
   351  .datetimepicker table tr td span.active,
   352  .datetimepicker table tr td span.active:hover,
   353  .datetimepicker table tr td span.active.disabled,
   354  .datetimepicker table tr td span.active.disabled:hover {
   355      background-color: #006dcc;
   356      background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
   357      background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
   358      background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
   359      background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
   360      background-image: -o-linear-gradient(top, #0088cc, #0044cc);
   361      background-image: linear-gradient(top, #0088cc, #0044cc);
   362      background-repeat: repeat-x;
   363      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
   364      border-color: #0044cc #0044cc #002a80;
   365      border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
   366      filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
   367      color: #fff;
   368      text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
   369  }
   370  .datetimepicker table tr td span.active:hover,
   371  .datetimepicker table tr td span.active:hover:hover,
   372  .datetimepicker table tr td span.active.disabled:hover,
   373  .datetimepicker table tr td span.active.disabled:hover:hover,
   374  .datetimepicker table tr td span.active:active,
   375  .datetimepicker table tr td span.active:hover:active,
   376  .datetimepicker table tr td span.active.disabled:active,
   377  .datetimepicker table tr td span.active.disabled:hover:active,
   378  .datetimepicker table tr td span.active.active,
   379  .datetimepicker table tr td span.active:hover.active,
   380  .datetimepicker table tr td span.active.disabled.active,
   381  .datetimepicker table tr td span.active.disabled:hover.active,
   382  .datetimepicker table tr td span.active.disabled,
   383  .datetimepicker table tr td span.active:hover.disabled,
   384  .datetimepicker table tr td span.active.disabled.disabled,
   385  .datetimepicker table tr td span.active.disabled:hover.disabled,
   386  .datetimepicker table tr td span.active[disabled],
   387  .datetimepicker table tr td span.active:hover[disabled],
   388  .datetimepicker table tr td span.active.disabled[disabled],
   389  .datetimepicker table tr td span.active.disabled:hover[disabled] {
   390      background-color: #0044cc;
   391  }
   392  .datetimepicker table tr td span.active:active,
   393  .datetimepicker table tr td span.active:hover:active,
   394  .datetimepicker table tr td span.active.disabled:active,
   395  .datetimepicker table tr td span.active.disabled:hover:active,
   396  .datetimepicker table tr td span.active.active,
   397  .datetimepicker table tr td span.active:hover.active,
   398  .datetimepicker table tr td span.active.disabled.active,
   399  .datetimepicker table tr td span.active.disabled:hover.active {
   400      background-color: #003399 \9;
   401  }
   402  .datetimepicker thead tr:first-child th,
   403  .datetimepicker tfoot tr:first-child th {
   404      cursor: pointer;
   405  }
   406  .datetimepicker thead tr:first-child th:hover,
   407  .datetimepicker tfoot tr:first-child th:hover {
   408      background: #eeeeee;
   409  }
   410  .input-append.date .add-on i,
   411  .input-prepend.date .add-on i {
   412      cursor: pointer;
   413      width: 14px;
   414      height: 14px;
   415  }
   416