react_hsbc_teller 0.3.5 → 0.3.9

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.
@@ -20,49 +20,29 @@
20
20
  color: red;
21
21
  }
22
22
  .wrapper {
23
- overflow: hidden;
23
+ overflow: auto;
24
24
  height: 100%;
25
- width: 100%;
25
+ width: 20%;
26
26
  background: #f3f3f3;
27
27
  text-align: center;
28
- display: grid;
29
- grid-template-columns: 16.6% 16.6% 16.6% 16.6% 16.6% 16.6%;
30
- grid-template-rows: 16.6% 16.6% 16.6% 16.6% 16.6% 16.6%;
28
+ // display: grid;
29
+ // grid-template-columns: 16.6% 16.6% 16.6% 16.6% 16.6% 16.6%;
30
+ // grid-template-rows: 16.6% 16.6% 16.6% 16.6% 16.6% 16.6%;
31
31
  }
32
32
  .itemed {
33
33
  text-align: center;
34
34
  // border: 1px solid #fff;
35
35
  color: #fff;
36
36
  font-weight: bold;
37
- line-height: 150px;
37
+ height: 170px;
38
38
  position: relative;
39
39
  }
40
- .item1 {
41
- grid-column-start: 1;
42
- grid-column-end: 6;
43
- grid-row-start: 1;
44
- grid-row-end: 7;
45
- }
46
- .item2 {
47
- grid-column-start: 1;
48
- grid-column-end: 3;
49
- grid-row-start: 4;
50
- grid-row-end: 1;
51
- position: absolute;
52
- z-index: 2000;
53
- }
54
40
  .videoFit{
55
- object-fit: cover;
56
- }
57
- .itemPublic {
58
- grid-column-start: 1;
59
- grid-column-end: 7;
60
- grid-row-start: 1;
61
- grid-row-end: 7;
41
+ object-fit: contain !important;
62
42
  }
63
43
  .isBack {
64
44
  transform: rotateY(180deg);
65
- background: #333;
45
+ // background: #333;
66
46
  }
67
47
  .video1{
68
48
  width: 100%;
@@ -79,8 +59,10 @@
79
59
  height: 100%;
80
60
  }
81
61
  .health{
82
- margin: 20px 20px 0 20px;
83
- height: ~"calc(100vh - 130px)";
62
+ width: ~"calc(100% - 40px)";
63
+ margin: 0px 20px 0 20px;
64
+ height: ~"calc(100vh - 150px)";
65
+ display: inline-flex;
84
66
  }
85
67
  .all{
86
68
  height: 100%;
@@ -144,33 +126,13 @@
144
126
  }
145
127
  .projection{
146
128
  width: 80%;
147
- height: ~"calc(100vh - 130px)";
148
- position: absolute;
149
- z-index: 1;
129
+ position: relative;
130
+ background: rgba(0,0,0,0.65);
131
+ color: #fff;
132
+ // height: ~"calc(100vh - 130px)";
133
+ // position: absolute;
134
+ // z-index: 1;
150
135
  // background: #fff;
151
- .button{
152
- display: inline-flex;
153
- width: 100%;
154
- position: absolute;
155
- z-index: 1;
156
- top: 0;
157
- left: 80px;
158
- .selectSee{
159
- background: #00847F;
160
- border-radius: 0px 0px 2px 2px;
161
- border: 1px solid #00847F;
162
- }
163
- .noSelest{
164
- background: rgba(51, 51, 51, 0.25);
165
- border-radius: 0px 0px 2px 2px;
166
- }
167
- div{
168
- font-size: 16px;
169
- margin: 0 15px;
170
- color: #FFFFFF;
171
- padding: 6px 13px;
172
- }
173
- }
174
136
  .videoDiv{
175
137
  width: 100%;
176
138
  height: 100%;
@@ -183,26 +145,86 @@ border-radius: 0px 0px 2px 2px;
183
145
  }
184
146
  .customerTitle{
185
147
  position: absolute;
186
- top: 0;
148
+ // top: 0;
149
+ bottom: 0;
187
150
  left: 0px;
188
- width: 80px;
151
+ // width: 30%;
189
152
  line-height: 30px;
190
153
  height: 30px;
191
154
  // background: rgba(219, 0, 17, 0.1);
192
155
  border-radius: 4px 0px 2px 0px;
193
156
  // color: #DB0011;
194
- font-size: 14px;
157
+ // font-size: 14px;
195
158
  }
196
159
  .tellerTitle{
197
160
  position: absolute;
198
- top: 0;
161
+ // top: 0;
199
162
  right: 0px;
200
- width: 80px;
163
+ // width: 80px;
201
164
  line-height: 30px;
165
+
166
+ bottom: 0;
202
167
  height: 30px;
203
168
  // background: rgba(219, 0, 17, 0.1);
204
169
  border-radius: 4px 0px 2px 0px;
205
170
  transform: rotateY(180deg);
206
171
  // color: #DB0011;
207
172
  font-size: 14px;
173
+ }
174
+ .titleBig{
175
+ max-width: 30%;
176
+ }
177
+ .titleSamlle{
178
+ max-width: 70%;
179
+ }
180
+ .titleName{
181
+ white-space: nowrap;
182
+ text-overflow: ellipsis;
183
+ overflow: hidden;
184
+ padding: 0 10px;
185
+ }
186
+ .themeClass{
187
+ position: absolute;
188
+ top: 50%;
189
+ left: 40%;
190
+ ul{
191
+ li{
192
+ list-style: none;
193
+ span{
194
+ font-size: 20px;
195
+ }
196
+ label{
197
+ font-size: 16px;
198
+ }
199
+ }
200
+ }
201
+ }
202
+ .button{
203
+ display: inline-flex;
204
+ margin-left: 7px;
205
+ // width: 100%;
206
+ // position: absolute;
207
+ // z-index: 1;
208
+ // top: 0;
209
+ // left: 0;
210
+ .selectSee{
211
+ background: #00847F;
212
+ border-radius: 0px 0px 2px 2px;
213
+ border: 1px solid #00847F;
214
+ }
215
+ .noSelest{
216
+ background: rgba(51, 51, 51, 0.25);
217
+ border-radius: 0px 0px 2px 2px;
218
+ }
219
+ div{
220
+ font-size: 16px;
221
+ margin: 0 15px;
222
+ color: #FFFFFF;
223
+ padding: 6px 13px;
224
+ }
225
+ }
226
+ .voiceClass{
227
+ position: absolute;
228
+ bottom: 0;
229
+ left: 0;
208
230
  }