zuora_connect_ui 0.1.7 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/assets/javascripts/zuora_connect_ui.js +2 -1
- data/app/assets/javascripts/zuora_connect_ui/app.js.erb +16 -0
- data/app/assets/stylesheets/zuora_connect_ui/base.scss +25 -9
- data/app/assets/stylesheets/zuora_connect_ui/datatables.scss +81 -75
- data/app/assets/stylesheets/zuora_connect_ui/datepicker.scss +41 -41
- data/app/assets/stylesheets/zuora_connect_ui/grid_view.scss +135 -130
- data/app/helpers/datatable_helper.rb +4 -4
- data/app/views/partials/_filters.html.erb +6 -2
- data/lib/zuora_connect_ui/version.rb +1 -1
- metadata +3 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: b15db5e5bc714c83a7a878100b3eafb1892e01b7
|
|
4
|
+
data.tar.gz: f51f07b1a557b601d6c74202efb7c79cf2baa762
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 9384312078e4d703880880a154f3253201dac76f9f2534784b92d4fd7fbf412e0e2741496f8ff062bd74646a82c9e6d96150d370eaca1ccf2068976e6e3d8a4c
|
|
7
|
+
data.tar.gz: 44264c4751c22a8f8af89684b2177757ebd0df46a23082902c252afc931a4b0a46780b7ba5dbd896c052e1d6d3605e17ea6663b85562b29006ca650ae820eca9
|
|
@@ -25,10 +25,11 @@
|
|
|
25
25
|
//= require dataTables/jquery.dataTables
|
|
26
26
|
//= require dataTables/bootstrap/3/jquery.dataTables.bootstrap
|
|
27
27
|
//= require dataTables/extras/dataTables.responsive
|
|
28
|
-
//= require dataTables/extras/dataTables.responsive
|
|
29
28
|
//= require dataTables/extras/dataTables.colReorder
|
|
30
29
|
//= require dataTables/extras/dataTables.select
|
|
31
30
|
//
|
|
32
31
|
//
|
|
32
|
+
//= require zuora_connect_ui/app
|
|
33
|
+
//= require zuora_connect_ui/datatable
|
|
33
34
|
//= require zuora_connect_ui/input
|
|
34
35
|
//
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
const APP_NAME = '<%= Rails.application.class.parent_name %>';
|
|
2
|
+
|
|
3
|
+
function debounce(func, wait, immediate) {
|
|
4
|
+
var timeout;
|
|
5
|
+
return function() {
|
|
6
|
+
var context = this, args = arguments;
|
|
7
|
+
var later = function() {
|
|
8
|
+
timeout = null;
|
|
9
|
+
if (!immediate) func.apply(context, args);
|
|
10
|
+
};
|
|
11
|
+
var callNow = immediate && !timeout;
|
|
12
|
+
clearTimeout(timeout);
|
|
13
|
+
timeout = setTimeout(later, wait);
|
|
14
|
+
if (callNow) func.apply(context, args);
|
|
15
|
+
};
|
|
16
|
+
};
|
|
@@ -18,7 +18,7 @@ h1 {
|
|
|
18
18
|
font-size: 1.625rem;
|
|
19
19
|
line-height: 2.25rem;
|
|
20
20
|
font-weight: 600;
|
|
21
|
-
letter-spacing: .0125rem;
|
|
21
|
+
letter-spacing: 0.0125rem;
|
|
22
22
|
}
|
|
23
23
|
h2 {
|
|
24
24
|
color: $primary;
|
|
@@ -33,7 +33,7 @@ h3 {
|
|
|
33
33
|
}
|
|
34
34
|
h4 {
|
|
35
35
|
color: $primary;
|
|
36
|
-
font-size: .75rem;
|
|
36
|
+
font-size: 0.75rem;
|
|
37
37
|
line-height: 1rem;
|
|
38
38
|
font-weight: 600;
|
|
39
39
|
letter-spacing: -0.0125rem;
|
|
@@ -48,6 +48,23 @@ select {
|
|
|
48
48
|
-moz-appearance: none;
|
|
49
49
|
}
|
|
50
50
|
|
|
51
|
+
.zc-spin {
|
|
52
|
+
display: inline-block;
|
|
53
|
+
-webkit-animation: zc-spin 2s infinite linear;
|
|
54
|
+
animation: zc-spin 2s infinite linear;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
@keyframes zc-spin {
|
|
58
|
+
0% {
|
|
59
|
+
-webkit-transform: rotate(0deg);
|
|
60
|
+
transform: rotate(0deg);
|
|
61
|
+
}
|
|
62
|
+
100% {
|
|
63
|
+
-webkit-transform: rotate(-359deg);
|
|
64
|
+
transform: rotate(-359deg);
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
|
|
51
68
|
// Potential to remove focus ring from select
|
|
52
69
|
// :-moz-focusring {
|
|
53
70
|
// color: transparent;
|
|
@@ -61,8 +78,8 @@ select {
|
|
|
61
78
|
text-align: center;
|
|
62
79
|
}
|
|
63
80
|
|
|
64
|
-
.center{
|
|
65
|
-
text-align: center
|
|
81
|
+
.center {
|
|
82
|
+
text-align: center;
|
|
66
83
|
}
|
|
67
84
|
|
|
68
85
|
#content {
|
|
@@ -81,8 +98,7 @@ select {
|
|
|
81
98
|
padding: 6px 0;
|
|
82
99
|
box-shadow: 0 1px 8px -1px $neutral-shadow;
|
|
83
100
|
border-radius: 0;
|
|
84
|
-
font-size: .875rem;
|
|
85
|
-
|
|
101
|
+
font-size: 0.875rem;
|
|
86
102
|
|
|
87
103
|
// working on the arrow for dropdowns
|
|
88
104
|
// &:before {
|
|
@@ -100,10 +116,10 @@ select {
|
|
|
100
116
|
|
|
101
117
|
> li {
|
|
102
118
|
&.divider {
|
|
103
|
-
margin: .5rem;
|
|
119
|
+
margin: 0.5rem;
|
|
104
120
|
}
|
|
105
121
|
> a {
|
|
106
|
-
padding: .25rem .75rem;
|
|
122
|
+
padding: 0.25rem 0.75rem;
|
|
107
123
|
// If we aren't using Font Awesome or Glyphicons, this next block can all go
|
|
108
124
|
span.fa {
|
|
109
125
|
margin-right: 10px;
|
|
@@ -117,7 +133,7 @@ select {
|
|
|
117
133
|
color: $dropdown-link-color;
|
|
118
134
|
}
|
|
119
135
|
}
|
|
120
|
-
&:hover{
|
|
136
|
+
&:hover {
|
|
121
137
|
span.glyphicons {
|
|
122
138
|
&:before {
|
|
123
139
|
color: $dropdown-link-hover-color;
|
|
@@ -12,31 +12,34 @@
|
|
|
12
12
|
|
|
13
13
|
label {
|
|
14
14
|
white-space: nowrap;
|
|
15
|
-
padding: 0rem .5rem;
|
|
15
|
+
padding: 0rem 0.5rem;
|
|
16
16
|
}
|
|
17
17
|
}
|
|
18
18
|
|
|
19
19
|
.icon {
|
|
20
20
|
position: relative;
|
|
21
|
-
top: .125rem;
|
|
21
|
+
top: 0.125rem;
|
|
22
22
|
font-size: 15px;
|
|
23
23
|
line-height: 1.25rem;
|
|
24
24
|
color: $neutral-2;
|
|
25
25
|
}
|
|
26
|
-
&:hover .icon,
|
|
26
|
+
&:hover .icon,
|
|
27
|
+
&:focus .icon {
|
|
27
28
|
color: $neutral-1;
|
|
28
29
|
}
|
|
29
30
|
}
|
|
30
31
|
}
|
|
31
32
|
|
|
32
|
-
td.actions.center,
|
|
33
|
+
td.actions.center,
|
|
34
|
+
th.actions.center {
|
|
35
|
+
vertical-align: middle;
|
|
33
36
|
width: 0px;
|
|
34
37
|
padding: 0rem 0rem 0rem 8px;
|
|
35
38
|
|
|
36
39
|
.table-btn {
|
|
37
40
|
font-size: 1.25rem;
|
|
38
|
-
padding: .375rem;
|
|
39
|
-
margin: .375rem;
|
|
41
|
+
padding: 0.375rem;
|
|
42
|
+
margin: 0.375rem;
|
|
40
43
|
}
|
|
41
44
|
}
|
|
42
45
|
|
|
@@ -44,47 +47,32 @@ td.actions.center, th.actions.center {
|
|
|
44
47
|
padding-left: 15px;
|
|
45
48
|
}
|
|
46
49
|
|
|
47
|
-
.tools_table.children.table-bordered>thead>tr {
|
|
50
|
+
.tools_table.children.table-bordered > thead > tr {
|
|
48
51
|
color: black !important;
|
|
49
52
|
background-color: inherit;
|
|
50
53
|
background-image: none;
|
|
51
54
|
}
|
|
52
55
|
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
// height: 34px;
|
|
56
|
-
// padding: 6px 12px;
|
|
57
|
-
// font-size: 12px;
|
|
58
|
-
// line-height: 1.42857143;
|
|
59
|
-
// color: #555;
|
|
60
|
-
// background-color: #fff;
|
|
61
|
-
// background-image: none;
|
|
62
|
-
// border: 1px solid #ccc;
|
|
63
|
-
// border-radius: 4px;
|
|
64
|
-
// -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
|
|
65
|
-
// box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
|
|
66
|
-
// -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
|
|
67
|
-
// transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
|
|
68
|
-
// }
|
|
69
|
-
|
|
70
|
-
select[multiple], select[size] {
|
|
56
|
+
select[multiple],
|
|
57
|
+
select[size] {
|
|
71
58
|
height: auto !important;
|
|
72
59
|
}
|
|
73
60
|
.select2-selection--multiple .select2-search {
|
|
74
61
|
width: initial;
|
|
75
|
-
position: initial
|
|
62
|
+
position: initial;
|
|
76
63
|
}
|
|
77
|
-
.has-feedback
|
|
64
|
+
.has-feedback .select2 + .glyphicon.form-control-feedback {
|
|
78
65
|
top: 19px;
|
|
79
66
|
right: 15px;
|
|
80
67
|
}
|
|
81
|
-
.has-error .select2-dropdown,
|
|
68
|
+
.has-error .select2-dropdown,
|
|
69
|
+
.has-error .select2-selection {
|
|
82
70
|
border-color: #a94442 !important;
|
|
83
71
|
}
|
|
84
72
|
|
|
85
|
-
div.dataTables_processing{
|
|
73
|
+
div.dataTables_processing {
|
|
86
74
|
background-color: white !important;
|
|
87
|
-
opacity: .8;
|
|
75
|
+
opacity: 0.8;
|
|
88
76
|
z-index: 20;
|
|
89
77
|
top: inherit;
|
|
90
78
|
left: inherit;
|
|
@@ -99,6 +87,7 @@ div.dataTables_processing{
|
|
|
99
87
|
}
|
|
100
88
|
|
|
101
89
|
table.dataTable {
|
|
90
|
+
width: 100%;
|
|
102
91
|
margin-top: 0px !important;
|
|
103
92
|
margin-bottom: 0px !important;
|
|
104
93
|
border-bottom: 1px solid $neutral-3;
|
|
@@ -106,23 +95,25 @@ table.dataTable {
|
|
|
106
95
|
> thead > tr > th {
|
|
107
96
|
background-color: $neutral-4;
|
|
108
97
|
text-transform: uppercase;
|
|
109
|
-
font-size: .75rem;
|
|
98
|
+
font-size: 0.75rem;
|
|
110
99
|
font-weight: 600;
|
|
111
|
-
padding: 1rem 4rem 1rem .5rem;
|
|
100
|
+
padding: 1rem 4rem 1rem 0.5rem;
|
|
112
101
|
border-top: 1px solid $neutral-3 !important;
|
|
113
102
|
border-bottom: 1px solid $neutral-3;
|
|
114
103
|
|
|
115
|
-
&.sorting:after,
|
|
104
|
+
&.sorting:after,
|
|
105
|
+
&.sorting_asc:after,
|
|
106
|
+
&.sorting_desc:after {
|
|
116
107
|
position: absolute;
|
|
117
108
|
top: unset;
|
|
118
109
|
bottom: 1rem;
|
|
119
|
-
right: .5rem;
|
|
110
|
+
right: 0.5rem;
|
|
120
111
|
font-family: webicons;
|
|
121
112
|
opacity: 1;
|
|
122
113
|
color: $primary;
|
|
123
114
|
}
|
|
124
115
|
|
|
125
|
-
&.sorting{
|
|
116
|
+
&.sorting {
|
|
126
117
|
&:after {
|
|
127
118
|
content: "";
|
|
128
119
|
}
|
|
@@ -139,10 +130,16 @@ table.dataTable {
|
|
|
139
130
|
}
|
|
140
131
|
}
|
|
141
132
|
}
|
|
142
|
-
> tbody > tr
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
133
|
+
> tbody > tr {
|
|
134
|
+
&.selected {
|
|
135
|
+
background: $neutral-3;
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
> td {
|
|
139
|
+
padding: 1rem 0.5rem;
|
|
140
|
+
border-top: none;
|
|
141
|
+
vertical-align: middle;
|
|
142
|
+
}
|
|
146
143
|
}
|
|
147
144
|
}
|
|
148
145
|
|
|
@@ -158,7 +155,7 @@ div.dataTables_scrollBody table.dataTable thead th.sorting_desc:after {
|
|
|
158
155
|
justify-content: space-between;
|
|
159
156
|
|
|
160
157
|
.btn-group .btn + .btn {
|
|
161
|
-
margin-left: .5rem;
|
|
158
|
+
margin-left: 0.5rem;
|
|
162
159
|
}
|
|
163
160
|
|
|
164
161
|
.dropdown {
|
|
@@ -170,13 +167,18 @@ div.dataTables_scrollBody table.dataTable thead th.sorting_desc:after {
|
|
|
170
167
|
}
|
|
171
168
|
|
|
172
169
|
.table-btn {
|
|
173
|
-
|
|
170
|
+
float: left;
|
|
171
|
+
|
|
172
|
+
&:hover,
|
|
173
|
+
&.active {
|
|
174
|
+
color: $primary;
|
|
175
|
+
}
|
|
174
176
|
}
|
|
175
177
|
|
|
176
178
|
.search-wrapper {
|
|
177
179
|
border-left: 1px solid $neutral-3;
|
|
178
180
|
display: flex;
|
|
179
|
-
margin: .5rem 0;
|
|
181
|
+
margin: 0.5rem 0;
|
|
180
182
|
width: 2.5rem;
|
|
181
183
|
overflow: hidden;
|
|
182
184
|
|
|
@@ -185,13 +187,13 @@ div.dataTables_scrollBody table.dataTable thead th.sorting_desc:after {
|
|
|
185
187
|
transition: width 0.3s ease-in-out;
|
|
186
188
|
|
|
187
189
|
.table-btn {
|
|
188
|
-
margin: 0 .5rem;
|
|
190
|
+
margin: 0 0.5rem;
|
|
189
191
|
}
|
|
190
192
|
|
|
191
193
|
.form-control[name="table[search]"] {
|
|
192
194
|
line-height: 1rem;
|
|
193
|
-
padding: .5rem 0;
|
|
194
|
-
font-size: .875rem;
|
|
195
|
+
padding: 0.5rem 0;
|
|
196
|
+
font-size: 0.875rem;
|
|
195
197
|
height: 100%;
|
|
196
198
|
border: none;
|
|
197
199
|
box-shadow: none;
|
|
@@ -210,39 +212,41 @@ div.dataTables_scrollBody table.dataTable thead th.sorting_desc:after {
|
|
|
210
212
|
}
|
|
211
213
|
}
|
|
212
214
|
|
|
213
|
-
// Workflow Context Menu
|
|
214
|
-
ul.context-menu-list {
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
}
|
|
215
|
+
// // Workflow Context Menu
|
|
216
|
+
// ul.context-menu-list {
|
|
217
|
+
// border-radius: 2px;
|
|
218
|
+
// box-shadow: 0 1px 8px -1px $neutral-shadow; // TODO: replace with variable name
|
|
219
|
+
// font-size: 0.875rem;
|
|
220
|
+
// min-width: 8rem;
|
|
221
|
+
|
|
222
|
+
// .context-menu-item {
|
|
223
|
+
// color: $support-1;
|
|
224
|
+
// padding: 0.25rem 0.75rem;
|
|
225
|
+
|
|
226
|
+
// &.context-menu-hover {
|
|
227
|
+
// background-color: $neutral-3;
|
|
228
|
+
// }
|
|
229
|
+
// }
|
|
230
|
+
// }
|
|
229
231
|
|
|
230
|
-
.context-menu-action {
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
}
|
|
232
|
+
// .context-menu-action {
|
|
233
|
+
// padding: 2px;
|
|
234
|
+
// font-size: 1.25rem;
|
|
235
|
+
// line-height: 1rem;
|
|
236
|
+
// border: none;
|
|
237
|
+
// color: $support-1;
|
|
238
|
+
// }
|
|
237
239
|
|
|
238
|
-
.
|
|
239
|
-
|
|
240
|
+
.table-footer {
|
|
241
|
+
width: 100%;
|
|
242
|
+
padding: 0.75rem 0.5rem;
|
|
240
243
|
display: flex;
|
|
241
244
|
flex-direction: row;
|
|
242
245
|
justify-content: space-between;
|
|
243
246
|
align-items: center;
|
|
244
247
|
|
|
245
|
-
> .dataTables_info,
|
|
248
|
+
> .dataTables_info,
|
|
249
|
+
.dataTables_paginate {
|
|
246
250
|
flex: 1;
|
|
247
251
|
}
|
|
248
252
|
|
|
@@ -266,20 +270,22 @@ ul.context-menu-list {
|
|
|
266
270
|
color: $neutral-4;
|
|
267
271
|
}
|
|
268
272
|
&.disabled {
|
|
269
|
-
a,
|
|
273
|
+
a,
|
|
274
|
+
a:hover,
|
|
275
|
+
a:focus {
|
|
270
276
|
color: $neutral-2;
|
|
271
277
|
background-color: none;
|
|
272
278
|
cursor: not-allowed;
|
|
273
279
|
}
|
|
274
280
|
}
|
|
275
|
-
&.first,
|
|
281
|
+
&.first,
|
|
282
|
+
&.last {
|
|
276
283
|
display: none;
|
|
277
284
|
}
|
|
278
285
|
}
|
|
279
|
-
|
|
280
286
|
}
|
|
281
287
|
|
|
282
|
-
.table-bordered .small>tbody>tr>td {
|
|
288
|
+
.table-bordered .small > tbody > tr > td {
|
|
283
289
|
padding-top: 1px;
|
|
284
290
|
padding-bottom: 1px;
|
|
285
291
|
padding-left: 1px;
|
|
@@ -1,75 +1,75 @@
|
|
|
1
1
|
.datepicker {
|
|
2
|
-
|
|
2
|
+
padding: 0 1rem 0.5rem 1rem;
|
|
3
3
|
}
|
|
4
4
|
|
|
5
5
|
.datepicker-switch,
|
|
6
6
|
.datepicker .prev,
|
|
7
7
|
.datepicker .next {
|
|
8
|
-
|
|
8
|
+
padding: 1rem 0;
|
|
9
9
|
}
|
|
10
10
|
|
|
11
11
|
.datepicker-switch {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
12
|
+
font-size: 0.9rem;
|
|
13
|
+
font-weight: 400;
|
|
14
|
+
min-width: 10rem;
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
.datepicker .prev,
|
|
18
|
-
.datepicker .next
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
18
|
+
.datepicker .next {
|
|
19
|
+
color: $support-1;
|
|
20
|
+
font-size: 0.7rem;
|
|
21
|
+
font-weight: 700;
|
|
22
22
|
}
|
|
23
23
|
|
|
24
24
|
.datepicker .prev:hover,
|
|
25
25
|
.datepicker .next:hover,
|
|
26
26
|
.datepicker .datepicker-switch:hover {
|
|
27
|
-
|
|
27
|
+
background: $neutral-4;
|
|
28
28
|
}
|
|
29
29
|
|
|
30
30
|
.datepicker .dow {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
31
|
+
font-size: 0.75rem;
|
|
32
|
+
font-weight: 400;
|
|
33
|
+
color: rgb(110, 124, 137);
|
|
34
|
+
padding-top: 0;
|
|
35
|
+
padding-bottom: 0.75rem;
|
|
36
36
|
}
|
|
37
37
|
|
|
38
38
|
.datepicker table tr td.day {
|
|
39
|
-
|
|
40
|
-
|
|
39
|
+
font-size: 0.75rem;
|
|
40
|
+
border-radius: 0;
|
|
41
41
|
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
42
|
+
&:hover {
|
|
43
|
+
background-color: $neutral-3;
|
|
44
|
+
}
|
|
45
45
|
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
46
|
+
&.active,
|
|
47
|
+
&.active:hover {
|
|
48
|
+
background-color: $support-1;
|
|
49
|
+
background-image: none;
|
|
50
|
+
}
|
|
51
51
|
}
|
|
52
52
|
|
|
53
53
|
.datepicker table tr td.disabled,
|
|
54
54
|
.datepicker table tr td.disabled:hover {
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
55
|
+
background: $neutral-2;
|
|
56
|
+
color: #a5a3b6;
|
|
57
|
+
cursor: not-allowed;
|
|
58
58
|
}
|
|
59
59
|
|
|
60
60
|
.zuo-datepicker.date {
|
|
61
|
-
|
|
61
|
+
display: block;
|
|
62
62
|
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
63
|
+
.input-group-addon {
|
|
64
|
+
font-size: 1.1rem;
|
|
65
|
+
color: $support-1;
|
|
66
|
+
background-color: transparent;
|
|
67
|
+
border: none;
|
|
68
|
+
padding: 1rem 0;
|
|
69
|
+
position: absolute;
|
|
70
|
+
top: 0;
|
|
71
|
+
right: 0;
|
|
72
|
+
width: unset;
|
|
73
|
+
cursor: pointer;
|
|
74
|
+
}
|
|
75
75
|
}
|
|
@@ -1,164 +1,170 @@
|
|
|
1
|
-
.grid_view{
|
|
2
|
-
|
|
1
|
+
.grid_view {
|
|
2
|
+
width: 100%;
|
|
3
|
+
|
|
4
|
+
.chic-let {
|
|
3
5
|
a:visited {
|
|
4
|
-
|
|
6
|
+
color: #74818e;
|
|
5
7
|
}
|
|
6
8
|
a:link {
|
|
7
|
-
|
|
9
|
+
color: #6c96a1;
|
|
8
10
|
}
|
|
9
11
|
a {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
+
color: #384b5d;
|
|
13
|
+
text-decoration: none;
|
|
12
14
|
}
|
|
13
15
|
a {
|
|
14
|
-
|
|
16
|
+
background-color: transparent;
|
|
15
17
|
}
|
|
16
18
|
}
|
|
17
19
|
@-webkit-keyframes iconHover {
|
|
18
20
|
0% {
|
|
19
|
-
opacity: 1;
|
|
21
|
+
opacity: 1;
|
|
22
|
+
}
|
|
20
23
|
100% {
|
|
21
|
-
opacity: 0;
|
|
24
|
+
opacity: 0;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
22
27
|
|
|
23
|
-
|
|
28
|
+
@-webkit-keyframes contentHover {
|
|
24
29
|
0% {
|
|
25
|
-
opacity: 0;
|
|
30
|
+
opacity: 0;
|
|
31
|
+
}
|
|
26
32
|
100% {
|
|
27
|
-
opacity: 1;
|
|
33
|
+
opacity: 1;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
28
36
|
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
37
|
+
.chic-let:hover .app-icon {
|
|
38
|
+
-webkit-animation: iconHover 0.1s linear forwards;
|
|
39
|
+
animation: iconHover 0.1s linear forwards;
|
|
32
40
|
}
|
|
33
41
|
|
|
34
42
|
.chic-let:hover .description {
|
|
35
|
-
|
|
43
|
+
display: inline-block;
|
|
36
44
|
}
|
|
37
45
|
|
|
38
46
|
.chic-let:hover {
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
.zuora-certified {
|
|
68
|
-
background: #4d4d4d;
|
|
69
|
-
padding: 5px 10px;
|
|
70
|
-
border-radius: 5px 0 5px 0;
|
|
71
|
-
color: #fff;
|
|
72
|
-
position: absolute;
|
|
73
|
-
top: 0;
|
|
74
|
-
left: 0;
|
|
75
|
-
box-shadow: 0 0 50px 10px rgba(0, 0, 0, 0.1);
|
|
76
|
-
font-size: 8px;
|
|
77
|
-
letter-spacing: .1em;
|
|
78
|
-
display: block;
|
|
79
|
-
width: 90px;
|
|
80
|
-
float: left;
|
|
81
|
-
z-index: 8;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
.card a:link {
|
|
85
|
-
color: #4d4d4d;
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
.chic-let .partner-logo {
|
|
90
|
-
position: absolute;
|
|
91
|
-
max-width: 60px;
|
|
92
|
-
max-height: 40px;
|
|
93
|
-
top: 10px;
|
|
94
|
-
right: 10px;
|
|
95
|
-
}
|
|
47
|
+
box-shadow: 0 0 90px 10px rgba(0, 0, 0, 0.1);
|
|
48
|
+
cursor: pointer;
|
|
49
|
+
z-index: 25;
|
|
50
|
+
}
|
|
51
|
+
.chic-let:hover .card-content {
|
|
52
|
+
width: 100%;
|
|
53
|
+
margin-left: 0px;
|
|
54
|
+
padding-right: 20px;
|
|
55
|
+
-webkit-animation: contentHover 0.4s linear forwards;
|
|
56
|
+
animation: contentHover 0.4s linear forwards;
|
|
57
|
+
}
|
|
58
|
+
.chic-let {
|
|
59
|
+
font-family: "brandon-grotesque", "Helvetica Neue", Helvetica, Arial,
|
|
60
|
+
sans-serif !important;
|
|
61
|
+
border: 1px solid #ebebeb;
|
|
62
|
+
border-radius: 5px;
|
|
63
|
+
padding: 7px 10px 10px 10px;
|
|
64
|
+
position: relative;
|
|
65
|
+
width: 32.333333%;
|
|
66
|
+
height: 115px;
|
|
67
|
+
margin: 5px;
|
|
68
|
+
z-index: 1;
|
|
69
|
+
background: #ffffff;
|
|
70
|
+
}
|
|
71
|
+
.card {
|
|
72
|
+
max-height: 325px;
|
|
73
|
+
margin-top: 15px;
|
|
74
|
+
}
|
|
96
75
|
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
76
|
+
.zuora-certified {
|
|
77
|
+
background: #4d4d4d;
|
|
78
|
+
padding: 5px 10px;
|
|
79
|
+
border-radius: 5px 0 5px 0;
|
|
80
|
+
color: #fff;
|
|
81
|
+
position: absolute;
|
|
82
|
+
top: 0;
|
|
83
|
+
left: 0;
|
|
84
|
+
box-shadow: 0 0 50px 10px rgba(0, 0, 0, 0.1);
|
|
85
|
+
font-size: 8px;
|
|
86
|
+
letter-spacing: 0.1em;
|
|
87
|
+
display: block;
|
|
88
|
+
width: 90px;
|
|
89
|
+
float: left;
|
|
90
|
+
z-index: 8;
|
|
91
|
+
}
|
|
106
92
|
|
|
93
|
+
.card a:link {
|
|
94
|
+
color: #4d4d4d;
|
|
95
|
+
}
|
|
107
96
|
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
97
|
+
.chic-let .partner-logo {
|
|
98
|
+
position: absolute;
|
|
99
|
+
max-width: 60px;
|
|
100
|
+
max-height: 40px;
|
|
101
|
+
top: 10px;
|
|
102
|
+
right: 10px;
|
|
103
|
+
}
|
|
114
104
|
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
105
|
+
.chic-let .app-icon {
|
|
106
|
+
height: 99px;
|
|
107
|
+
width: 99px;
|
|
108
|
+
border-radius: 5px;
|
|
109
|
+
margin-right: 10px;
|
|
110
|
+
position: relative;
|
|
111
|
+
-webkit-animation: icon 0.5s linear forwards;
|
|
112
|
+
animation: icon 0.5s linear forwards;
|
|
113
|
+
}
|
|
118
114
|
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
width: 33.33%;
|
|
126
|
-
float: right;
|
|
127
|
-
}
|
|
115
|
+
.chic-let .card-content {
|
|
116
|
+
position: absolute;
|
|
117
|
+
width: 244px;
|
|
118
|
+
top: 40px;
|
|
119
|
+
margin-left: 100px;
|
|
120
|
+
}
|
|
128
121
|
|
|
122
|
+
.chic-let .card-top {
|
|
123
|
+
margin-bottom: -53px;
|
|
124
|
+
}
|
|
129
125
|
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
126
|
+
.buttons {
|
|
127
|
+
display: none;
|
|
128
|
+
}
|
|
129
|
+
.chic-let:hover .buttons {
|
|
130
|
+
display: block;
|
|
131
|
+
padding: 5px;
|
|
132
|
+
width: 33.33%;
|
|
133
|
+
float: right;
|
|
134
|
+
}
|
|
134
135
|
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
margin: 0 0 4px 0;
|
|
140
|
-
color: #9EB1C0;
|
|
141
|
-
letter-spacing: .06em;
|
|
142
|
-
}
|
|
136
|
+
.chic-let:hover .card-top {
|
|
137
|
+
-webkit-animation: iconHover 0.1s linear forwards;
|
|
138
|
+
animation: iconHover 0.1s linear forwards;
|
|
139
|
+
}
|
|
143
140
|
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
}
|
|
141
|
+
.chic-let .category {
|
|
142
|
+
font-size: 9px;
|
|
143
|
+
font-weight: 900;
|
|
144
|
+
line-height: 7px;
|
|
145
|
+
margin: 0 0 4px 0;
|
|
146
|
+
color: #9eb1c0;
|
|
147
|
+
letter-spacing: 0.06em;
|
|
148
|
+
}
|
|
153
149
|
|
|
150
|
+
.chic-let .app-title {
|
|
151
|
+
font-size: 17px;
|
|
152
|
+
line-height: 18px;
|
|
153
|
+
margin: -1px 0 0 0;
|
|
154
|
+
font-weight: 300;
|
|
155
|
+
}
|
|
156
|
+
.text-uppercase,
|
|
157
|
+
.initialism {
|
|
158
|
+
text-transform: uppercase;
|
|
159
|
+
}
|
|
154
160
|
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
161
|
+
.chic-let .description {
|
|
162
|
+
font-size: 11px;
|
|
163
|
+
line-height: 16px;
|
|
164
|
+
display: none;
|
|
165
|
+
color: #9eb1c0;
|
|
166
|
+
font-weight: 300;
|
|
167
|
+
}
|
|
162
168
|
|
|
163
169
|
#watermark {
|
|
164
170
|
position: absolute;
|
|
@@ -168,7 +174,6 @@
|
|
|
168
174
|
margin-left: -10px;
|
|
169
175
|
width: 100%;
|
|
170
176
|
font-weight: 100;
|
|
171
|
-
color: #
|
|
177
|
+
color: #6ec5ab;
|
|
172
178
|
}
|
|
173
179
|
}
|
|
174
|
-
|
|
@@ -35,15 +35,15 @@ module DatatableHelper
|
|
|
35
35
|
end
|
|
36
36
|
|
|
37
37
|
def return_cookie_filters(cookie_key, filter_key, values: nil, defaults: nil, type: nil)
|
|
38
|
-
raise "Error" if
|
|
38
|
+
raise "Error" if values.nil? && type != "boolean"
|
|
39
39
|
values = ["false"] if type == "boolean"
|
|
40
40
|
values = values.map {|v| v[1].to_s} if type == "select" || values[0].class == Array
|
|
41
41
|
defaults ||= [] if type == "select"
|
|
42
|
-
if
|
|
42
|
+
if cookies[cookie_key].present?
|
|
43
43
|
json = JSON.parse(cookies[cookie_key])
|
|
44
|
-
if
|
|
44
|
+
if json[filter_key].present?
|
|
45
45
|
checked_envs ||= json[filter_key] if type == "boolean" || type == "select"
|
|
46
|
-
checked_envs ||=
|
|
46
|
+
checked_envs ||= values.map {|v| json[filter_key].include?(v) ? v : nil }.compact
|
|
47
47
|
end
|
|
48
48
|
end
|
|
49
49
|
checked_envs ||= defaults.nil? ? (type == "checkbox" ? values : nil) : defaults
|
|
@@ -21,9 +21,13 @@
|
|
|
21
21
|
</li>
|
|
22
22
|
</ul>
|
|
23
23
|
</div>
|
|
24
|
-
<% elsif
|
|
24
|
+
<% elsif ["select", "group-select"].include?(table_filter["type"]) %>
|
|
25
25
|
<div class="btn-group <%= index > 0 ? 'select2-bootstrap-prepend' : '' %> <%= (index + 1 != filter_count && filter_count > 1) ? 'select2-bootstrap-append' : '' %>">
|
|
26
|
-
|
|
26
|
+
<% if table_filter["type"] == "select" %>
|
|
27
|
+
<%= select_tag(table_filter["name"].parameterize('_'), options_for_select(table_filter["values"], table_filter["selection"]), options = {:prompt => prompt, :data =>{:placeholder => placeholder, "allow-clear" => allow_clear }}) %>
|
|
28
|
+
<% elsif table_filter["type"] == "group-select" %>
|
|
29
|
+
<%= select_tag(table_filter["name"].parameterize('_'), grouped_options_for_select(table_filter["values"], table_filter["selection"]), options = {:prompt => prompt, :data =>{:placeholder => placeholder, "allow-clear" => allow_clear }}) %>
|
|
30
|
+
<% end %>
|
|
27
31
|
</div>
|
|
28
32
|
<% content_for :scripts do %>
|
|
29
33
|
$('#<%= "#{table_name}_content" %>').find('select[name="<%= table_filter["name"].parameterize('_') %>"]').select2({theme: "bootstrap", minimumResultsForSearch: <%= searchable %>, width: '<%= width %>', allowClear: <%= allow_clear %>})
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: zuora_connect_ui
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.
|
|
4
|
+
version: 0.2.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Connect Team
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2018-
|
|
11
|
+
date: 2018-11-19 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: bootstrap-sass
|
|
@@ -146,6 +146,7 @@ files:
|
|
|
146
146
|
- LICENSE.txt
|
|
147
147
|
- README.md
|
|
148
148
|
- app/assets/javascripts/zuora_connect_ui.js
|
|
149
|
+
- app/assets/javascripts/zuora_connect_ui/app.js.erb
|
|
149
150
|
- app/assets/javascripts/zuora_connect_ui/datatable.js
|
|
150
151
|
- app/assets/javascripts/zuora_connect_ui/input.js
|
|
151
152
|
- app/assets/stylesheets/_zuora_connect_ui.scss
|