balmet.com

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs

redux-spinner.scss (4428B)

      1 .redux-container-spinner {
      2     .spinner-wrpr {
      3         position: relative;
      4         display: block;
      5         height: 30px;
      6         overflow: hidden;
      7 
      8         .spinner-input {
      9             position: relative !important;
     10             z-index: 1;
     11             width: 75px !important;
     12             height: 30px !important;
     13             background: #eee !important;
     14             border: 1px solid #bfbfbf !important;
     15             border-right: 0 !important;
     16             border-left: 0 !important;
     17             -webkit-border-radius: 0 !important;
     18             -moz-border-radius: 0 !important;
     19             border-radius: 0 !important;
     20         }
     21     }
     22 
     23     .ui-spinner {
     24         position: static;
     25         display: inline;
     26     }
     27 
     28 
     29     .ui-spinner-buttons {
     30         position: absolute;
     31         padding: 0;
     32     }
     33 
     34     .ui-widget .ui-spinner-button {
     35         color: #fff;
     36         position: absolute;
     37         top: 0;
     38         padding: 0 0 30px;
     39         overflow: hidden;
     40         cursor: pointer;
     41         background: -moz-linear-gradient(#fff, #f3f3f3);
     42         background: -o-linear-gradient(#fff, #f3f3f3);
     43         background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f3f3f3));
     44         background: linear-gradient(#fff, #f3f3f3);
     45         background-color: #fff;
     46         border: none;
     47         -webkit-box-shadow: none;
     48         -moz-box-shadow: none;
     49         box-shadow: none;
     50     }
     51 
     52     .ui-spinner-button:hover,
     53     .ui-state-hover {
     54         background: -moz-linear-gradient(#f3f3f3, #fff);
     55         background: -o-linear-gradient(#f3f3f3, #fff);
     56         background: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3), to(#fff));
     57         background: linear-gradient(#f3f3f3, #fff);
     58         background-color: #f3f3f3;
     59     }
     60 
     61     .ui-corner-tr,
     62     .ui-spinner-button .ui-icon-triangle-1-n {
     63         -webkit-border-radius: 0 5px 5px 0;
     64         -moz-border-radius: 0 3px 3px 0;
     65         border-radius: 0 3px 3px 0;
     66     }
     67 
     68     .ui-corner-br,
     69     .ui-spinner-button .ui-icon-triangle-1-s {
     70         -webkit-border-radius: 5px 0 0 5px;
     71         -moz-border-radius: 3px 0 0 3px;
     72         border-radius: 3px 0 0 3px;
     73     }
     74 
     75     .ui-spinner-button {
     76         .ui-icon {
     77             top: 0;
     78             display: block;
     79             width: 28px;
     80             height: 28px;
     81             margin: 0;
     82             border: 1px solid #b7b7b7;
     83             background-image: initial;
     84             text-indent: 0;
     85             text-align: center;
     86             font-size: 18px;
     87             line-height: 26px;
     88         }
     89 
     90         .ui-icon-triangle-1-n {
     91             // background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAKCAYAAACXDi8zAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADxJREFUeNpsjwsKADAIQu3u3tsRY6M5gz7w0AqSQFLdZ3ZRgmf44JQ/EOZ9oYOsiDviVemP2oYoWCwBBgDpO6VXVo3RyQAAAABJRU5ErkJggg==) 10px 10px no-repeat!important;
     92         }
     93 
     94         .ui-icon-triangle-1-s {
     95             // background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAKCAYAAACXDi8zAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUeNpi+P//PwM6bmlpwS4IorEKokggC8Il0AVhEv9x6sAmiaz9P05XIUsygmVRAUiAESDAAFHcpVdWtdj/AAAAAElFTkSuQmCC) 10px 10px no-repeat!important;
     96         }
     97     }
     98 }
     99 
    100 .dp-numberPicker,
    101 .dp-numberPicker-add,
    102 .dp-numberPicker-sub,
    103 .dp-numberPicker-input {
    104     display: inline-block;
    105     box-sizing: border-box;
    106     -moz-box-sizing: border-box;
    107     text-align: center;
    108     vertical-align: top;
    109     height: 30px;
    110 }
    111 
    112 .dp-numberPicker {
    113     border-radius: 3px;
    114 }
    115 
    116 .redux-container .redux-container-spinner .dp-numberPicker-add,
    117 .redux-container .redux-container-spinner .dp-numberPicker-sub {
    118     width: 30px;
    119     font-size: 21px;
    120     cursor: pointer;
    121     -moz-user-select: none;
    122     -khtml-user-select: none;
    123     -webkit-user-select: none;
    124     -o-user-select: none;
    125     background-color: #33b5e5;
    126     color: #fff;
    127     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    128     height: 29px !important;
    129 
    130     &.disabled {
    131         background-color: #2c6a81;
    132     }
    133 }
    134 
    135 .dp-numberPicker-add {
    136     border-top-right-radius: 3px;
    137     border-bottom-right-radius: 3px;
    138 }
    139 
    140 .dp-numberPicker-sub {
    141     border-top-left-radius: 3px;
    142     border-bottom-left-radius: 3px;
    143 }
    144 
    145 .dp-numberPicker-input {
    146     width: 70px;
    147     background-color: #eee;
    148     border: 0;
    149     margin: 0 !important;
    150     box-shadow:
    151         inset 0px 1px 1px rgba(255, 255, 255, 0.5),
    152         inset 0px -1px 1px rgba(0, 0, 0, 0.5);
    153 
    154     &:disabled {
    155         background-color: #eee;
    156     }
    157 }