bootflat-rails 0.1.11 → 0.2.0

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 8aebd76fc5dc54cff5e3b3c7feef7b1d610343d4
4
- data.tar.gz: c4b9531887858b73e2fcc5d02773d1d825f9bc0a
3
+ metadata.gz: b2dd88895db46ed584bd5cd83a20c36ada39ba26
4
+ data.tar.gz: e8f2b53213521565e7a6823b7136f44779085382
5
5
  SHA512:
6
- metadata.gz: b1740608f2c438110acedc199d2049fecfbf68310fcb7e2187be5a30c675ab5f33573d972ab4cfaa9da36f6763c580992ed1c3d1c4fb91bb66684846836f34d5
7
- data.tar.gz: c312c2d0f7690729a16e36c559105b4f98a37de12d60c44e801b909a5c352857996b170f57ba01100f742f838b03e5ae160e6d602ca1f9b16c243cf840c40f9e
6
+ metadata.gz: b651de98928f429623ead31226460d947b77dd8c87924dd45c836b1b9bc6506adab528b11dd074dd91a7e4fe637909e875fa6c59b519d95d557c521268855ec0
7
+ data.tar.gz: ab5be2543e9b74779f74efaf985cb77f34fa4846a6f2e22b7c19c79f15c47e4e74f3143dd164ea77571f1443ba88aa8d30b30c2afbba7d1354cc61aeb424a173
@@ -1,3 +1,3 @@
1
1
  module BootflatRails
2
- VERSION = '0.1.11'
2
+ VERSION = '0.2.0'
3
3
  end
@@ -0,0 +1,134 @@
1
+ // Variables
2
+ //------------------------------------------------------
3
+ $calendar-background-color: $bittersweet-light !default;
4
+ $calendar-font-color: $white !default;
5
+ $calendar-current-color: $bittersweet-dark !default;
6
+
7
+ $calendar-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
8
+ $calendar-radius: 4px !default;
9
+
10
+
11
+
12
+ // Exports
13
+ //------------------------------------------------------
14
+
15
+ @include exports("calendar") {
16
+
17
+ /**
18
+ * calendar
19
+ * --------------------------------------------------
20
+ */
21
+ .calendar {
22
+ padding: 20px;
23
+ @include radius($type: border-radius, $value: $calendar-radius);
24
+ color: $white;
25
+ background-color: lighten($calendar-background-color, 10%);
26
+ @include box-shadow($value: $calendar-shadow);
27
+
28
+ & .unit {
29
+ float: left;
30
+ width: 14.28%;
31
+ text-align: center;
32
+ }
33
+
34
+ & .years {
35
+
36
+ & .prev {
37
+ text-align: left;
38
+ }
39
+ & .next {
40
+ text-align: right;
41
+ }
42
+ & .prev em,
43
+ & .next em {
44
+ position: relative;
45
+ display: inline-block;
46
+ @include radius($type: border-radius, $value: 50%);
47
+ border: 1px solid $calendar-font-color;
48
+ width: 34px;
49
+ height: 34px;
50
+ cursor: pointer;
51
+ }
52
+ & .prev em:before,
53
+ & .next em:before {
54
+ position: absolute;
55
+ display: block;
56
+ content: "";
57
+ margin-top: 6px;
58
+ border-style: solid;
59
+ border-width: 7px;
60
+ width: 0;
61
+ height: 0;
62
+ font-size: 0;
63
+ }
64
+ & .prev em:before {
65
+ top: 3px;
66
+ left: 4px;
67
+ border-color: transparent $calendar-font-color transparent transparent;
68
+ }
69
+ & .next em:before {
70
+ top: 3px;
71
+ left: 13px;
72
+ border-color: transparent transparent transparent $calendar-font-color;
73
+ }
74
+ & .prev em:hover,
75
+ & .next em:hover,
76
+ & .prev em:active,
77
+ & .next em:active {
78
+ border-color: $calendar-current-color;
79
+ }
80
+ & .prev em:hover:before,
81
+ & .prev em:active:before {
82
+ border-color: transparent $calendar-current-color transparent transparent;
83
+ }
84
+
85
+ & .next em:hover:before,
86
+ & .next em:active:before {
87
+ border-color: transparent transparent transparent $calendar-current-color;
88
+ }
89
+
90
+ & .monyear {
91
+ float: left;
92
+ width: 71.42%;
93
+ text-align: center;
94
+ height: 34px;
95
+ line-height: 34px;
96
+ }
97
+ }
98
+
99
+ & .days {
100
+ margin-top: 15px;
101
+ padding-top: 15px;
102
+ border-top: 1px solid lighten($calendar-current-color, 10%);
103
+ & .unit {
104
+ margin-bottom: 3px;
105
+ text-align: center;
106
+ height: 34px;
107
+ line-height: 34px;
108
+
109
+ & b {
110
+ @include radius($type: border-radius, $value: 50%);
111
+ font-weight: normal;
112
+ width: 34px;
113
+ height: 34px;
114
+ }
115
+ &:hover b,
116
+ &:active b,
117
+ &.active b {
118
+ display: inline-block;
119
+ background-color: $calendar-font-color;
120
+ color: $calendar-current-color;
121
+ cursor: pointer;
122
+ @include transition (all 0.2s ease-in-out);
123
+ }
124
+ &.older b {
125
+ color: $calendar-current-color;
126
+ background-color: transparent;
127
+ cursor: default;
128
+ width: auto;
129
+ height: auto;
130
+ }
131
+ }
132
+ }
133
+ }
134
+ }
@@ -0,0 +1,139 @@
1
+ // Variables
2
+ //------------------------------------------------------
3
+ $pricing-primary: $aqua-light !default;
4
+ $pricing-success: $grass-light !default;
5
+ $pricing-warning: $sunflower-light !default;
6
+
7
+ $pricing-foot-background-color: $lightgray-dark !default;
8
+ $pricing-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
9
+ $pricing-shadow-active: 0 0 8px rgba(0, 0, 0, .6) !default;
10
+ $pricing-radius: 4px !default;
11
+
12
+
13
+
14
+
15
+ // Exports
16
+ //------------------------------------------------------
17
+
18
+ @include exports("pricing") {
19
+
20
+ /**
21
+ * pricing
22
+ * --------------------------------------------------
23
+ */
24
+ .pricing {
25
+
26
+ & ul {
27
+ list-style: none;
28
+ padding: 0;
29
+ }
30
+
31
+ & .unit {
32
+ position: relative;
33
+ display: inline-block;
34
+ text-align: center;
35
+ min-width: 250px;
36
+ @include radius($type: border-radius, $value: $pricing-radius);
37
+ @include box-shadow($value: $pricing-shadow);
38
+
39
+ &.active {
40
+ top: 5px;
41
+ margin-left: -36px;
42
+ margin-right: -36px;
43
+ z-index: 1;
44
+ @include box-shadow($value: $pricing-shadow-active);
45
+
46
+ & .price-title h3 {
47
+ font-size: 40px;
48
+ }
49
+ }
50
+ }
51
+
52
+ @media screen and (max-width: 767px) {
53
+ & .unit {
54
+ display: block;
55
+ margin-bottom: 20px;
56
+
57
+ &.active {
58
+ top: 0;
59
+ margin-left: 0;
60
+ margin-right: 0;
61
+
62
+ & .price-title h3 {
63
+ font-size: 30px;
64
+ }
65
+ }
66
+ }
67
+ }
68
+
69
+ & .price-title {
70
+ padding: 20px 20px 10px;
71
+ @include radius($type: border-top-left-radius, $value: $pricing-radius);
72
+ @include radius($type: border-top-right-radius, $value: $pricing-radius);
73
+ color: #FFF;
74
+
75
+ & h3,
76
+ & h3 > p {
77
+ margin: 0;
78
+ }
79
+ }
80
+
81
+ & .price-body {
82
+ padding: 20px 20px 10px;
83
+
84
+ & ul {
85
+ padding-top: 10px;
86
+ }
87
+
88
+ & li {
89
+ margin-bottom: 10px;
90
+ }
91
+
92
+ & h4 {
93
+ margin: 0;
94
+ }
95
+ }
96
+
97
+ & .price-foot {
98
+ padding: 20px;
99
+ @include radius($type: border-bottom-left-radius, $value: $pricing-radius);
100
+ @include radius($type: border-bottom-right-radius, $value: $pricing-radius);
101
+
102
+ background-color: $pricing-foot-background-color;
103
+ }
104
+
105
+ & .price-primary {
106
+ & .price-title {
107
+ background-color: $pricing-primary;
108
+ }
109
+ & .price-body {
110
+ background-color: lighten($pricing-primary, 30%);
111
+ & ul {
112
+ border-top: 1px solid lighten($pricing-primary, 20%);
113
+ }
114
+ }
115
+ }
116
+ & .price-success {
117
+ & .price-title {
118
+ background-color: $pricing-success;
119
+ }
120
+ & .price-body {
121
+ background-color: lighten($pricing-success, 30%);
122
+ & ul {
123
+ border-top: 1px solid lighten($pricing-success, 20%);
124
+ }
125
+ }
126
+ }
127
+ & .price-warning {
128
+ & .price-title {
129
+ background-color: $pricing-warning;
130
+ }
131
+ & .price-body {
132
+ background-color: lighten($pricing-warning, 30%);
133
+ & ul {
134
+ border-top: 1px solid lighten($pricing-warning, 20%);
135
+ }
136
+ }
137
+ }
138
+ }
139
+ }
@@ -0,0 +1,258 @@
1
+ // Variables
2
+ //------------------------------------------------------
3
+ $selecter-primary: $aqua-dark !default;
4
+
5
+ $selecter-border-color: $mediumgray-dark !default;
6
+ $selecter-background-color: $white !default;
7
+ $selecter-disabled-color: $mediumgray-dark !default;
8
+ $selecter-disabled-background-color: $lightgray-dark !default;
9
+ $selecter-radius-value: 4px !default;
10
+ $selecter-arrow-width: 20px !default;
11
+
12
+ $selecter-group-color: $mediumgray-dark !default;
13
+ $selecter-group-background-color: $lightgray-light !default;
14
+
15
+ $selecter-item-border-color: $lightgray-dark !default;
16
+ $selecter-item-hover: $lightgray-dark !default;
17
+ $selecter-item-selected: $aqua-dark !default;
18
+ $selecter-item-selected-border-color: $aqua-light !default;
19
+
20
+
21
+ // Exports
22
+ //------------------------------------------------------
23
+
24
+ @include exports("selecter") {
25
+ .selecter {
26
+ display: block;
27
+ position: relative;
28
+ max-width: 100%;
29
+ z-index: 1;
30
+ outline: none;
31
+
32
+ & .selecter-element {
33
+ display: none;
34
+ *left: -999999px;
35
+ height: 100%;
36
+ left: 0;
37
+ position: absolute;
38
+ @include opacity($opacity: 0, $filter: true);
39
+ width: 100%;
40
+ z-index: 0;
41
+ }
42
+ & .selecter-element,
43
+ & .selecter-element:focus {
44
+ outline: none;
45
+ -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
46
+ -webkit-tap-highlight-color: transparent;
47
+ }
48
+
49
+ & .selecter-selected {
50
+ background-color: $selecter-background-color;
51
+ border: 1px solid $selecter-border-color;
52
+ @include radius($value: $selecter-radius-value);
53
+ cursor: pointer;
54
+ display: block;
55
+ overflow: hidden;
56
+ padding: 6px 10px;
57
+ position: relative;
58
+ text-overflow: clip;
59
+ z-index: 2;
60
+
61
+ &:after {
62
+ position: absolute;
63
+ top: 14px;
64
+ right: 10px;
65
+ content: "";
66
+ width: 0;
67
+ height: 0;
68
+ border-top: 4px solid $black;
69
+ border-left: 4px solid transparent;
70
+ border-right: 4px solid transparent;
71
+ }
72
+ }
73
+ & .selecter-options {
74
+ border: 1px solid $selecter-border-color;
75
+ border-width: 0 1px 1px;
76
+ @include radius($value: 0 0 $selecter-radius-value $selecter-radius-value);
77
+ @include box-shadow($value: 0 6px 12px rgba(0,0,0,.175));
78
+ background-color: $selecter-background-color;
79
+ display: none;
80
+ left: 0;
81
+ max-height: 260px;
82
+ overflow: auto;
83
+ overflow-x: hidden;
84
+ position: absolute;
85
+ top: 100%;
86
+ width: 100%;
87
+ *width: auto;
88
+ z-index: 50;
89
+ }
90
+ & .selecter-group {
91
+ border-bottom: 1px solid $selecter-item-border-color;
92
+ color: $selecter-group-color;
93
+ background-color: $selecter-group-background-color;
94
+ display: block;
95
+ font-size: 11px;
96
+ padding: 5px 10px 4px;
97
+ text-transform: uppercase;
98
+ }
99
+ & .selecter-item {
100
+ background-color: $selecter-background-color;
101
+ border-bottom: 1px solid $selecter-item-border-color;
102
+ cursor: pointer;
103
+ display: block;
104
+ margin: 0;
105
+ overflow: hidden;
106
+ padding: 6px 10px;
107
+ text-overflow: ellipsis;
108
+ width: 100%;
109
+
110
+ &.selected {
111
+ color: $white;
112
+ border-bottom-color: $selecter-item-selected-border-color;
113
+ background-color: $selecter-item-selected;
114
+ }
115
+ &.disabled {
116
+ color: $selecter-disabled-color;
117
+ cursor: default;
118
+ }
119
+ &:first-child {
120
+ @include radius($value: 0);
121
+ }
122
+ &:last-child {
123
+ @include radius($value: 0 0 $selecter-radius-value $selecter-radius-value);
124
+ border-bottom: 0;
125
+ }
126
+ }
127
+
128
+ & .selecter-item:hover {
129
+ background-color: $selecter-item-hover;
130
+ }
131
+ & .selecter-item.selected:hover {
132
+ background-color: $selecter-item-selected;
133
+ }
134
+
135
+ & .selecter-item.disabled:hover,
136
+ &:hover .selecter-selected,
137
+ &.disabled .selecter-item:hover {
138
+ background-color: $selecter-background-color;
139
+ }
140
+
141
+ /* Open */
142
+ &.open {
143
+ outline: 0;
144
+ z-index: 3;
145
+
146
+ & .selecter-selected {
147
+ border: 1px solid $selecter-primary;
148
+ @include radius($value: $selecter-radius-value $selecter-radius-value 0 0);
149
+ z-index: 51;
150
+ }
151
+ }
152
+
153
+ &.open .selecter-selected,
154
+ &.focus .selecter-selected {
155
+ background-color: $selecter-background-color;
156
+ }
157
+
158
+ /* 'Cover' Positioning */
159
+ &.cover {
160
+ & .selecter-options {
161
+ @include radius($value: $selecter-radius-value);
162
+ border-width: 1px;
163
+ top: 0;
164
+
165
+ & .selecter-item.first {
166
+ @include radius($value: $selecter-radius-value $selecter-radius-value 0 0);
167
+ }
168
+
169
+ }
170
+
171
+ &.open .selecter-selected {
172
+ @include radius($value: $selecter-radius-value $selecter-radius-value 0 0);
173
+ z-index: 49;
174
+ }
175
+ }
176
+
177
+
178
+ /* 'Bottom' Positioning */
179
+ &.bottom {
180
+ & .selecter-options {
181
+ border-width: 1px 1px 0;
182
+ bottom: 100%;
183
+ top: auto;
184
+ }
185
+ & .selecter-item:last-child {
186
+ @include radius($value: 0);
187
+ border: none;
188
+ }
189
+ &.open .selecter-selected {
190
+ @include radius($value: 0 0 $selecter-radius-value $selecter-radius-value);
191
+ }
192
+ &.open .selecter-options {
193
+ @include radius($value: $selecter-radius-value $selecter-radius-value 0 0);
194
+ }
195
+ }
196
+
197
+ /* 'Bottom' + 'Cover' Positioning */
198
+ &.bottom.cover {
199
+ & .selecter-options {
200
+ bottom: 0;
201
+ top: auto;
202
+ }
203
+ &.open .selecter-selected,
204
+ &.open .selecter-options {
205
+ @include radius($value: $selecter-radius-value);
206
+ }
207
+ }
208
+
209
+
210
+ /* Multiple Select */
211
+ &.multiple .selecter-options {
212
+ @include radius($value: $selecter-radius-value);
213
+ border-width: 1px;
214
+ box-shadow: none;
215
+ display: block;
216
+ position: static;
217
+ width: 100%;
218
+ }
219
+
220
+ /* 'Disabled' State */
221
+ &.disabled {
222
+ & .selecter-selected {
223
+ background-color: $selecter-disabled-background-color;
224
+ border-color: $selecter-disabled-background-color;
225
+ color: $selecter-disabled-color;
226
+ cursor: default;
227
+ }
228
+ & .selecter-options {
229
+ background-color: $selecter-disabled-background-color;
230
+ border-color: $selecter-disabled-background-color;
231
+ }
232
+ & .selecter-group,
233
+ & .selecter-item {
234
+ background-color: $selecter-disabled-background-color;
235
+ border-color: $selecter-item-border-color;
236
+ color: $selecter-disabled-color;
237
+ cursor: default;
238
+ }
239
+ & .selecter-item.selected {
240
+ background-color: $selecter-primary;
241
+ @include opacity($opacity: 45, $filter: true);
242
+ color: $white;
243
+ }
244
+ }
245
+
246
+
247
+ /* Scroller Support */
248
+ & .selecter-options.scroller {
249
+ overflow: hidden;
250
+
251
+ & .scroller-content {
252
+ max-height: 260px;
253
+ padding: 0;
254
+ }
255
+ }
256
+
257
+ }
258
+ }
@@ -0,0 +1,79 @@
1
+ // Variables
2
+ //------------------------------------------------------
3
+ $stepper-primary: $aqua-dark !default;
4
+ $stepper-primary-hover: $aqua-light !default;
5
+
6
+ $stepper-arrow-width: 20px !default;
7
+
8
+
9
+ // Exports
10
+ //------------------------------------------------------
11
+
12
+ @include exports("stepper") {
13
+
14
+ /**
15
+ * stepper
16
+ * --------------------------------------------------
17
+ */
18
+ .stepper {
19
+ & .stepper-input {
20
+ overflow: hidden;
21
+ -moz-appearance: textfield;
22
+
23
+ &::-webkit-inner-spin-button,
24
+ &::-webkit-outer-spin-button {
25
+ -webkit-appearance: none;
26
+ margin: 0;
27
+ }
28
+ }
29
+
30
+ & .stepper-arrow {
31
+ background-color: $stepper-primary;
32
+ cursor: pointer;
33
+ display: block;
34
+ height: 50%;
35
+ position: absolute;
36
+ right: 15px;
37
+ text-indent: -99999px;
38
+ width: $stepper-arrow-width;
39
+
40
+ &:hover,
41
+ &:active {
42
+ background-color: $stepper-primary-hover;
43
+ }
44
+ }
45
+ & .up {
46
+ @include prefixer($property: border-top-right-radius, $value: 3px, $prefixes: webkit moz spec);
47
+ border: 1px solid darken($stepper-primary, 7%);
48
+ top: 0;
49
+ }
50
+ & .down {
51
+ @include prefixer($property: border-bottom-right-radius, $value: 3px, $prefixes: webkit moz spec);
52
+ bottom: 0;
53
+ }
54
+ & .up::before,
55
+ & .down::before {
56
+ content: "";
57
+ position: absolute;
58
+ width: 0;
59
+ height: 0;
60
+ border-left: 4px solid transparent;
61
+ border-right: 4px solid transparent;
62
+ }
63
+ & .up::before {
64
+ top: 5px;
65
+ left: 5px;
66
+ border-bottom: 4px solid $white;
67
+ }
68
+ & .down:before {
69
+ bottom: 5px;
70
+ left: 6px;
71
+ border-top: 4px solid $white;
72
+ }
73
+ &.disabled .stepper-arrow {
74
+ background-color: $stepper-primary;
75
+ @include opacity($opacity: 45, $filter: true);
76
+ }
77
+ }
78
+
79
+ }
@@ -0,0 +1,189 @@
1
+ // Variables
2
+ //------------------------------------------------------
3
+ $timeline-division-background-color: $mediumgray-light !default;
4
+ $timeline-years-background-color: $mediumgray-dark !default;
5
+ $timeline-years-color: $white !default;
6
+ $timeline-dotted-color: $aqua-light !default;
7
+ $timeline-dotted-border-color: $lightgray-light !default;
8
+
9
+ $timeline-radius: 4px !default;
10
+
11
+ // Exports
12
+ //------------------------------------------------------
13
+
14
+ @include exports("timeline") {
15
+
16
+ /**
17
+ * timeline
18
+ * --------------------------------------------------
19
+ */
20
+
21
+ .timeline {
22
+ & dl {
23
+ position: relative;
24
+ top: 0;
25
+ margin: 0;
26
+ padding: 20px 0;
27
+
28
+ &:before {
29
+ position: absolute;
30
+ top: 0;
31
+ bottom: 0;
32
+ left: 50%;
33
+ margin-left: -1px;
34
+ width: 2px;
35
+ content: '';
36
+ background-color: $timeline-division-background-color;
37
+ z-index: 100;
38
+ }
39
+
40
+ & dt {
41
+ position: relative;
42
+ top: 30px;
43
+ padding: 3px 5px;
44
+ margin: 0 auto 30px;
45
+ text-align: center;
46
+ @include radius($type: border-radius, $value: $timeline-radius);
47
+ background-color: $timeline-years-background-color;
48
+ font-weight: normal;
49
+ color: $timeline-years-color;
50
+ width: 120px;
51
+ z-index: 200;
52
+ }
53
+
54
+ & dd {
55
+ position: relative;
56
+ z-index: 200;
57
+ & .circ {
58
+ position: absolute;
59
+ top: 40px;
60
+ left: 50%;
61
+ margin-left: -11px;
62
+ border: 4px solid $timeline-dotted-border-color;
63
+ width: 22px;
64
+ height: 22px;
65
+ @include radius($type: border-radius, $value: 50%);
66
+ background-color: $timeline-dotted-color;
67
+ z-index: 200;
68
+ }
69
+
70
+ & .time {
71
+ position: absolute;
72
+ top: 31px;
73
+ left: 50%;
74
+ padding: 10px 20px;
75
+ width: 100px;
76
+ display: inline-block;
77
+ color: $timeline-dotted-color;
78
+ }
79
+
80
+ & .events {
81
+ position: relative;
82
+ margin-top: 31px;
83
+ padding: 10px 10px 0;
84
+ @include radius($type: border-radius, $value: $timeline-radius);
85
+ background-color: $white;
86
+ width: 47%;
87
+
88
+ &:before {
89
+ position: absolute;
90
+ top: 12px;
91
+ width: 0;
92
+ height: 0;
93
+ content: '';
94
+ border-width: 6px;
95
+ border-style: solid;
96
+ }
97
+
98
+ & .events-object {
99
+ margin-right: 10px;
100
+ }
101
+
102
+ & .events-body {
103
+ overflow: hidden;
104
+ zoom: 1;
105
+
106
+ & .events-heading {
107
+ margin: 0 0 10px;
108
+ font-size: 14px;
109
+ }
110
+ }
111
+ }
112
+
113
+ &.pos-right {
114
+
115
+ & .time {
116
+ margin-left: -100px;
117
+ text-align: right;
118
+ }
119
+ & .events {
120
+ float: right;
121
+
122
+ &:before {
123
+ left: -12px;
124
+ border-color: transparent $white transparent transparent;
125
+ }
126
+ }
127
+ }
128
+ &.pos-left {
129
+ & .time {
130
+ margin-left: 0;
131
+ text-align: left;
132
+ }
133
+ & .events {
134
+ float: left;
135
+ &:before {
136
+ right: -12px;
137
+ border-color: transparent transparent transparent $white;
138
+ }
139
+ }
140
+ }
141
+ }
142
+ }
143
+ }
144
+ @media screen and (max-width: 767px) {
145
+ .timeline dl {
146
+ &:before {
147
+ left: 60px;
148
+ }
149
+ & dt {
150
+ margin: 0 0 30px;
151
+ }
152
+ & dd {
153
+ & .circ {
154
+ left: 60px;
155
+ }
156
+ & .time {
157
+ left: 0;
158
+ }
159
+ &.pos-left {
160
+ & .time {
161
+ margin-left: 0;
162
+ padding: 10px 0;
163
+ text-align: left;
164
+ }
165
+ & .events {
166
+ float: right;
167
+ width: 84%;
168
+ &:before {
169
+ left: -12px;
170
+ border-color: transparent $white transparent transparent;
171
+ }
172
+ }
173
+ }
174
+ &.pos-right {
175
+ & .time {
176
+ margin-left: 0;
177
+ padding: 10px 0;
178
+ text-align: left;
179
+ }
180
+ & .events {
181
+ float: right;
182
+ width: 84%;
183
+ }
184
+ }
185
+ }
186
+ }
187
+ }
188
+
189
+ }
@@ -0,0 +1,94 @@
1
+ // Variables
2
+ //------------------------------------------------------
3
+ $toggle-height: 32px !default;
4
+ $toggle-checkbox-opacity: 0 !default;
5
+
6
+ $toggle-transition-value: all .25s ease-in-out !default;
7
+
8
+ $toggle-default-background-color: $white !default;
9
+ $toggle-checked-background-color: $grass-light !default;
10
+ $toggle-disabled-background-color: $lightgray-dark !default;
11
+
12
+ $toggle-handle-width: 50px !default;
13
+ $toggle-handle-height: 32px !default;
14
+ $toggle-handle-radius: 19px !default;
15
+
16
+ $toggle-control-width: 30px !default;
17
+ $toggle-control-height: 30px !default;
18
+ $toggle-control-radius: 30px !default;
19
+
20
+ $toggle-shadow: inset 0 0 0 1px lighten($mediumgray-dark, 5%) !default;
21
+ $toggle-control-shadow: inset 0 0 0 1px lighten($mediumgray-dark, 5%), 1px 1px 1px lighten($mediumgray-dark, 10%) !default;
22
+ $toggle-checked-shadow: inset 0 0 0 1px $lightgray-light, 1px 1px 1px lighten($mediumgray-dark, 10%) !default;
23
+
24
+ // Exports
25
+ //------------------------------------------------------
26
+
27
+ @include exports("toggle") {
28
+
29
+ /**
30
+ * toggle
31
+ * --------------------------------------------------
32
+ */
33
+ .toggle {
34
+ height: $toggle-height;
35
+
36
+ & input[type="checkbox"],
37
+ & input[type="radio"] {
38
+ width: 0;
39
+ height: 0;
40
+ margin: 0;
41
+ padding: 0;
42
+ text-indent: -100000px;
43
+ @include opacity($opacity: $toggle-checkbox-opacity, $filter: true);
44
+ }
45
+
46
+ & .handle {
47
+ display: block;
48
+ position: relative;
49
+ top: -20px;
50
+ left: 0;
51
+ width: $toggle-handle-width;
52
+ height: $toggle-handle-height;
53
+ background-color: $toggle-default-background-color;
54
+ @include radius($value: $toggle-handle-radius);
55
+ @include box-shadow($value:$toggle-shadow);
56
+
57
+ &:before,
58
+ &:after {
59
+ content: "";
60
+ position: absolute;
61
+ top: 1px;
62
+ left: 1px;
63
+ display: block;
64
+ width: $toggle-control-width;
65
+ height: $toggle-control-height;
66
+ @include radius($value: $toggle-control-radius);
67
+ @include transition($toggle-transition-value);
68
+ background-color: $toggle-default-background-color;
69
+ @include box-shadow($value:$toggle-control-shadow);
70
+ }
71
+
72
+ }
73
+ & input[type="checkbox"]:disabled + .handle,
74
+ & input[type="radio"]:disabled + .handle,
75
+ & input[type="checkbox"]:disabled + .handle:before,
76
+ & input[type="radio"]:disabled + .handle:before,
77
+ & input[type="checkbox"]:disabled + .handle:after,
78
+ & input[type="radio"]:disabled + .handle:after {
79
+ @include opacity($opacity: 60, $filter: true);
80
+ background-color: $toggle-disabled-background-color;
81
+ }
82
+
83
+ & input[type="checkbox"]:checked + .handle:before,
84
+ & input[type="radio"]:checked + .handle:before {
85
+ width: $toggle-handle-width;
86
+ background-color: $toggle-checked-background-color;
87
+ }
88
+ & input[type="checkbox"]:checked + .handle:after,
89
+ & input[type="radio"]:checked + .handle:after {
90
+ left: 20px;
91
+ @include box-shadow($value:$toggle-checked-shadow);
92
+ }
93
+ }
94
+ }
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: bootflat-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.11
4
+ version: 0.2.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - Zak El Fassi
@@ -9,7 +9,7 @@ authors:
9
9
  autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2014-10-26 00:00:00.000000000 Z
12
+ date: 2015-12-15 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: sass-rails
@@ -89,6 +89,7 @@ files:
89
89
  - vendor/assets/stylesheets/bootflat/_breadcrumb.scss
90
90
  - vendor/assets/stylesheets/bootflat/_button.scss
91
91
  - vendor/assets/stylesheets/bootflat/_button_group.scss
92
+ - vendor/assets/stylesheets/bootflat/_calendar.scss
92
93
  - vendor/assets/stylesheets/bootflat/_checkbox_radio.scss
93
94
  - vendor/assets/stylesheets/bootflat/_dropdown.scss
94
95
  - vendor/assets/stylesheets/bootflat/_footer.scss
@@ -105,9 +106,14 @@ files:
105
106
  - vendor/assets/stylesheets/bootflat/_panel.scss
106
107
  - vendor/assets/stylesheets/bootflat/_pill.scss
107
108
  - vendor/assets/stylesheets/bootflat/_popover.scss
109
+ - vendor/assets/stylesheets/bootflat/_pricing.scss
108
110
  - vendor/assets/stylesheets/bootflat/_progress.scss
111
+ - vendor/assets/stylesheets/bootflat/_selecter.scss
112
+ - vendor/assets/stylesheets/bootflat/_stepper.scss
109
113
  - vendor/assets/stylesheets/bootflat/_tab.scss
110
114
  - vendor/assets/stylesheets/bootflat/_thumbnail.scss
115
+ - vendor/assets/stylesheets/bootflat/_timeline.scss
116
+ - vendor/assets/stylesheets/bootflat/_toggle.scss
111
117
  - vendor/assets/stylesheets/bootflat/_tooltip.scss
112
118
  - vendor/assets/stylesheets/bootflat/_typography.scss
113
119
  - vendor/assets/stylesheets/bootflat/_well.scss