vendor/assets/javascripts/webshims/shims/styles/scss/shim.scss in webshims-rails-1.11.1 vs vendor/assets/javascripts/webshims/shims/styles/scss/shim.scss in webshims-rails-1.11.2
- old
+ new
@@ -1,16 +1,7 @@
-%clearfix {
- zoom: 1;
+@import "_extends.scss";
- &:before,
- &:after {
- display: table;
- clear: both;
- content: ' ';
- }
-}
-
.ws-important-hide {
display: none !important;
visibility: hidden !important;
position: absolute;
top: -999999px;
@@ -228,385 +219,10 @@
.placeholder-focused.placeholder-visible {
color: #ccc;
}
-
-/* spinner control for time, number (usable for date, datetime-local) */
-.has-input-buttons {
- display: inline-block;
-}
-
-.input-buttons,
-.step-controls,
-.ws-popover-opener {
- zoom: 1;
- overflow: hidden;
- display: inline-block;
- font-size: 0;
- vertical-align: middle;
- margin-top: -3px;
- margin-left: -20px;
-}
-
-.step-controls,
-.ws-popover-opener {
- position: relative;
- float: left;
- margin: 0;
- height: 19px;
- width: 15px;
-}
-
-.ws-popover-opener {
- position: relative;
- zoom: 1;
- overflow: visible;
- margin: 0 0 0 2px;
- width: 19px;
- border-radius: 3px;
- cursor: pointer;
- background: #ccc;
-
- span {
- display: block;
- position: absolute;
- top: 50%;
- left: 50%;
- width: 16px;
- height: 16px;
- margin: -8px 0 0 -8px;
- background: url(forms.png) no-repeat -321px -1px;
-
-
- .color-input-buttons & {
- background-position: -348px 0;
- }
-
- .time-input-buttons & {
- background-position: -377px 1px;
- }
-
- &.ws-color-indicator-bg {
- background: url(../jpicker/images/preview-opacity.png) no-repeat 0;
- }
- &.ws-color-indicator {
- background: none;
- }
- }
-}
-
-input[type="color"] {
- width: 6.5em;
-}
-
-.input-buttons {
-
- &.color-input-buttons {
- margin-left: 2px;
- }
- &.input-button-size-1 {
- &.month-input-buttons,
- &.date-input-buttons {
- margin-left: -24px;
- }
- }
- &.input-button-size-2 {
- margin-left: -39px;
- }
- &.ws-disabled {
- opacity: 0.95;
- }
- &.ws-disabled *,
- &.ws-readonly * {
- cursor: default;
- }
-}
-
-.step-controls {
-
- span {
- position: absolute;
- display: inline-block;
- overflow: hidden;
- margin: 0 !important;
- padding: 0 !important;
- width: 15px;
- height: 9px;
- cursor: pointer;
- font-size: 0;
- line-height: 0;
- background: url(forms.png) no-repeat 0 0;
-
- &.step-up {
- top: 0;
- background-position: -80px 0;
- &:hover {
- background-position: -105px 0;
- }
- &.mousepress-ui {
- background-position: -105px -20px;
- }
- .ws-disabled & {
- background-position: -130px 0;
- }
- }
- &.step-down {
- bottom: 0;
- background-position: -155px 0;
- &:hover {
- background-position: -180px 0;
- }
- &.mousepress-ui {
- background-position: -180px -20px;
- }
- .ws-disabled & {
- background-position: -205px 0;
- }
- }
-
- }
-}
-
-
-.ws-input {
-
- letter-spacing: -0.31em;
- word-spacing: -0.43em;
-
- > * {
- text-align: center;
- letter-spacing: normal;
- word-spacing: normal;
- }
- .ws-input-seperator {
- vertical-align: middle;
- width: 2%;
- overflow: hidden;
- }
-
- & + .input-buttons {
- margin-left: 2px;
- }
-
- input,
- .ws-input-seperator {
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- text-align: center;
- display: inline-block;
-
- }
-
-
-}
-
-.ws-date {
-
- .mm,
- .dd {
- width: 23.5%;
-
- .no-boxsizing & {
- width: 16%;
- }
- }
- .yy {
- width: 48%;
-
- .no-boxsizing & {
- width: 40%;
- }
- }
- &.ws-month-select {
-
- .dd {
- width: 22%;
-
- .no-boxsizing & {
- width: 13%;
- }
- }
- .mm {
- width: 38%;
- }
-
- .yy {
- width: 36%;
-
- .no-boxsizing & {
- width: 30%;
- }
- }
- }
-}
-
-.ws-month {
- .mm,
- .yy {
- width: 47.9%;
-
- .no-boxsizing & {
- width: 41%;
- }
- }
-}
-
-/* range */
-.ws-range {
- position: relative;
- display: inline-block;
- vertical-align: middle;
- margin: 0;
- zoom: 1;
- border: none;
- height: 19px;
- width: 155px;
- border-radius: 1px;
- background: url(range-track.png) 0 center no-repeat;
- cursor: pointer;
- font-size: 0;
- line-height: 0;
-
- .ws-range-thumb {
- top: 0;
- position: absolute;
- display: block;
- z-index: 4;
- overflow: hidden;
- margin: -2px 0 0 -6px;
- height: 22px;
- width: 11px;
- background: url(forms.png) -3px 1px no-repeat;
- cursor: pointer;
- outline: none;
- font-size: 0;
- line-height: 0;
-
- &:hover {
- background-position: -20px 1px;
- }
- }
-
- &.ws-focus .ws-range-thumb {
- background-position: -20px 1px;
- }
-
- &.ws-active .ws-range-thumb {
- background-position: -37px 1px;
- }
-
- &[aria-disabled="true"],
- &[aria-readonly="true"] {
- cursor: default;
- opacity: 0.95;
- }
-
- &[aria-disabled="true"] .ws-range-thumb,
- &[aria-readonly="true"] .ws-range-thumb {
- cursor: default;
- }
-
- &[aria-disabled="true"] .ws-range-thumb {
- background-position: -54px 1px;
- }
-
- .ws-range-rail {
- position: absolute;
- display: block;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- margin: 0;
- zoom: 1;
- }
-
- .ws-range-min {
- position: absolute !important;
- display: block;
- margin: 9px 0 0;
- padding: 0 !important;
- top: 0;
- height: 1px;
- left: 0;
- z-index: 1;
- overflow: hidden;
- background: #b6e2fb;
- }
-
- .ws-range-ticks {
- overflow: hidden;
- position: absolute;
- bottom: 0px;
- left: 0;
- height: 4px;
- width: 1px;
- margin: 0 0 0 -1.5px;
- font-size: 0;
- line-height: 0;
- text-indent: -999px;
- background: #ccc;
- }
-
- &.vertical-range {
- background: url(vertical-range.png) center bottom no-repeat;
- width: 20px;
-
- .ws-range-thumb {
- top: 0;
- left: 3px;
- bottom: auto;
- background: url(vertical-range.png) 0 -51px no-repeat;
- margin: -6px 0 0 0;
- height: 11px;
- width: 22px;
-
- }
- .ws-range-thumb:hover,
- &.ws-focus .ws-range-thumb {
- background-position: 0 -34px;
- }
- &.ws-active .ws-range-thumb {
- background-position: 0 -17px;
- }
-
- &[aria-disabled="true"] .ws-range-thumb {
- background-position: 0 0;
- }
-
- .ws-range-min {
- top: auto;
- bottom: 1px;
- left: 0;
- width: 1px;
- height: 0;
- }
-
- .ws-range-rail {
- top: 5px;
- left: 0;
- right: 0;
- bottom: 5px;
- }
-
- .ws-range-ticks {
- bottom: auto;
- left: auto;
- right: 0;
- height: 1px;
- width: 4px;
- }
- }
-
-}
-
-
-
-
-
-
/*
* popovers
*/
.ws-popover {
display: block;
@@ -755,379 +371,9 @@
[data-vertical="bottom"] & {
top: -9px;
border-bottom: none;
border-top: 7px solid #fefefe;
}
- }
-}
-
-
-
-
-//date popover
-$border-light: 1px solid #ddd;
-$button-bgcolor: #f5f5f5;
-%ws-button {
- border-radius: 4px;
- background: #ccc;
- padding: 5px 8px;
- display: inline-block;
- border: 1px solid transparent;
-}
-.input-picker {
- outline: none;
- text-align: center;
- font-family: sans-serif;
- width: 330px;
-
- &.time-popover,
- &.datetime-local-popover {
- width: 415px;
- }
-
- &.time-popover {
-
- .ws-prev,
- .ws-next,
- .ws-super-prev,
- .ws-super-next {
- display: none;
- }
- }
-
-
- &.ws-size-2 {
- width: 645px;
- }
-
- &.ws-size-3 {
- width: 960px;
- }
-
- &.color-popover {
- width: 590px;
- }
-
- abbr[title] {
- cursor: help;
- }
-
- li,
- button {
- font-size: 13px;
- line-height: 16px;
- color: #000;
- transition: all 400ms;
- }
-
- .ws-focus,
- :focus {
- outline: 1px dotted #000;
- }
-
-
- .ws-po-box {
- position: relative;
- padding: 10px 20px 15px;
- border-radius: 5px;
- box-shadow: 0 0 2px rgba(0, 0, 0, .3);
- }
-
- .ws-prev,
- .ws-next,
- .ws-super-prev,
- .ws-super-next {
- @extend %ws-button;
- position: absolute;
- top: 10px;
- border: 1px solid #ccc;
- border-radius: 5px;
- padding: 0;
- width: 24px;
- height: 24px;
- background: #eee url(forms.png) no-repeat 0 0;
- z-index: 1;
-
- span {
- display: none;
- }
- }
-
-
- &.time-popover .ws-picker-body {
- padding-top: 36px;
- }
-
- .ws-picker-body {
- @extend %clearfix;
- position: relative;
- padding: 46px 0 0;
- zoom: 1;
- margin: 0 -10px;
- }
-
- .ws-prev,
- .ws-super-prev {
- left: 20px;
- background-position: -243px 5px;
- }
-
- .ws-super-prev {
- background-position: -243px -12px;
- }
-
- &.ws-year-buttons .ws-prev {
- left: 50px;
- }
-
- .ws-next,
- .ws-super-next {
- right: 20px;
- background-position: -275px 5px;
- }
-
- .ws-super-next {
- background-position: -275px -12px;
- }
-
- &.ws-year-buttons .ws-next {
- right: 50px;
- }
-
- .ws-prev:hover,
- .ws-next:hover,
- .ws-super-prev:hover,
- .ws-super-next:hover {
- border-color: #666;
- }
-
- .ws-prev[disabled],
- .ws-next[disabled],
- .ws-super-prev[disabled],
- .ws-super-next[disabled]{
- opacity: 0.4;
- border-color: #eee;
- }
-
- .ws-button-row {
- @extend %clearfix;
- position: relative;
- margin: 10px 0 0;
- border-top: 1px solid #eee;
- padding: 10px 0 0;
- text-align: left;
- z-index: 2;
-
- button {
- @extend %ws-button;
-
- border: 1px solid #ccc;
- border-radius: 5px;
- box-shadow: 1px 1px 0 #fff;
- background-color: #ddd;
- background-image: -webkit-linear-gradient(top, #ececec 0%, #ddd 100%);
- background-image: linear-gradient(to bottom, #ececec 0%, #ddd 100%);
- transition: border-color 200ms linear;
- float: left;
-
- &.ws-empty {
- float: right;
- }
- }
- }
-
- &[data-currentview="setMonthList"] .ws-picker-header select {
- max-width: 95%;
- }
-
- &[data-currentview="setDayList"] .ws-picker-header select {
- max-width: 40%;
- }
-
- &[data-currentview="setDayList"] .ws-picker-header select.month-select {
- max-width: 55%;
- }
-
- &.time-popover .ws-picker-header {
- top: -30px;
-
- button {
- font-size: 15px;
- }
- }
-
- &.ws-year-buttons .ws-picker-header {
- margin: 0 65px;
- }
-
-
- .ws-picker-header {
- position: absolute;
- top: -44px;
- right: 0;
- left: 0;
- margin: 0 40px;
-
- button {
- display: inline-block;
- width: 100%;
- margin: 0;
- padding: 4px 0;
- font-weight: 700;
- color: #000;
-
-
- &:hover {
- text-decoration: underline;
- }
-
- &[disabled]:hover {
- text-decoration: none;
- }
- }
- }
-
- .picker-grid {
- @extend %clearfix;
- position: relative;
- zoom: 1;
- overflow: hidden;
- }
-
- &.ws-size-1 .picker-list {
- float: none;
- width: auto;
- }
-
- .picker-list {
- @extend %clearfix;
- position: relative;
- zoom: 1;
- width: 290px;
- float: left;
- margin: 0 10px;
- background: #fff;
-
- tr {
- border: 0;
- }
-
- th,
- td {
- padding: 3px 5px;
- }
-
- &.day-list td {
- padding: 2px 1px;
- }
-
- &.day-list td button {
- padding: 4px 0;
- }
-
-
- td button {
- display: block;
- padding: 9px 0;
- width: 100%;
- border-radius: 5px;
- color: #000;
- background-color: #fff;
-
- &.othermonth {
- color: #888;
- }
-
- &:hover,
- &.checked-value {
- color: #fff;
- background: #000;
- }
-
- &[disabled],
- &[disabled]:hover {
- color: #888;
- background-color: #fff;
- }
-
-
- }
-
- table {
- width: 100%;
- border: 0 none;
- border-collapse: collapse;
- }
-
- th,
- td.week-cell{
- font-size: 13px;
- line-height: 1.1em;
- padding-bottom: 3px;
- text-transform: uppercase;
- font-weight: 700;
- }
-
- th, td {
- width: 14.2856%;
- }
- }
-
-
- .ws-options {
- margin: 10px 0 0;
- border-top: 1px solid #eee;
- padding: 10px 0 0;
- text-align: left;
-
- h5 {
- margin: 0 0 5px;
- padding: 0;
- font-size: 14px;
- font-weight: bold;
- }
-
- ul,
- li {
- padding: 0;
- margin: 0;
- list-style: none;
- }
-
- button {
- @extend %clearfix;
- display: block;
- padding: 4px;
- width: 100%;
- text-align: left;
- border-radius: 4px;
-
- &.ws-focus,
- &:focus,
- &:hover {
- color: #fff;
- background: #000;
- }
-
- &[disabled],
- &[disabled].ws-focus,
- &[disabled]:focus,
- &[disabled]:hover {
- color: #888;
- background: #fff;
- text-decoration: none;
- }
- .ws-value {
- float: left;
- }
-
- .ws-label {
- float: right;
- font-size: 96%;
- }
- }
-
-
}
}
//data list