system-phone 1.2.132 → 1.2.134

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.
Files changed (3) hide show
  1. package/package.json +1 -1
  2. package/src/components/LoginApp.vue +2 -2
  3. package/src/components/idea/feedbackAdd.vue +373 -366
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "system-phone",
3
- "version": "1.2.132",
3
+ "version": "1.2.134",
4
4
  "description": "手机模块 前端组件",
5
5
  "author": "何宁社 <524395609@qq.com>",
6
6
  "license": "ISC",
package/src/components/LoginApp.vue CHANGED
@@ -18,8 +18,8 @@
18
18
  <img src="../assets/未选.png" style="width: 20px;margin-bottom: 5px" alt="" v-if="showauto == '2'" @click="showon1()">
19
19
  <span class="text-left font">自动登录</span>
20
20
  <p></p>
21
- <span class="devicetext">版本号：{{deviceIemi}}</span>
22
- <span class="devicetext">设备码：{{versionNumber}}</span>
21
+ <span class="devicetext1">版本号：{{versionNumber}}</span> <br>
22
+ <span class="devicetext">设备码：{{deviceIemi}}</span>
23
23
  </div>
24
24
  </div>
25
25
  </div>
package/src/components/idea/feedbackAdd.vue CHANGED
@@ -1,366 +1,373 @@
1
- <template>
2
- <div class="auto select-overspread ">
3
- <div class="row auto">
4
- <div class="row app-row">
5
- <div class="col-xs-4">
6
- <label class="font text-left">反馈类型：</label>
7
- </div>
8
- <div class="col-xs-8" >
9
- <v-select class="input-font"
10
- placeholder="请选择反馈"
11
- :value.sync="from.fk_Type"
12
- :options='option'
13
- close-on-select clear-button></v-select>
14
- </div>
15
- </div>
16
- <div class="row app-row">
17
- <div class="col-xs-4">
18
- <!-- <img src="../../assets/用户ID.png" style="width: 20px;margin-bottom: 5px" alt="">-->
19
- <label class="font text-left">反馈内容：</label>
20
- </div>
21
- <div class="col-xs-8" >
22
- <textarea class="form-control" placeholder="请输入反馈内容"cols="30" rows="3" style="resize: vertical;" v-model="from.fk_Content"></textarea>
23
- </div>
24
- </div>
25
- </div>
26
- <div class="row app-row text-center">
27
- <button type="button" class="btn btn-lg btn-font btn-color" style="width: 45%;" @click="save()">提交</button>
28
- </div>
29
- </div>
30
- </template>
31
-
32
- <script>
33
- import {HttpResetClass} from "vue-client";
34
- import Vue from "vue"
35
-
36
- export default {
37
- title: "意见反馈",
38
- props: {},
39
- data() {
40
- return {
41
- // option: this.$appdata.getParam('意见反馈类型'),
42
- option:[{label:'意见反馈类型一',value:'意见反馈类型一'},{label:'意见反馈类型二',value:'意见反馈类型二'}],
43
- from: {
44
- // fk_Name: Vue.user.name,
45
- // fk_Id: Vue.user.id,
46
- fk_Id:'1',
47
- fk_Name:'奥德',
48
- fk_Type: '',
49
- fk_Content: '',
50
- fk_Firm:'测试'
51
- // fkFirm:Vue.user.orgid,
52
- },
53
- margintop: document.documentElement.clientHeight * 0.1,
54
- show: false
55
- }
56
- },
57
- methods: {
58
- save() {
59
- /*console.log(this.from.fkType=option.value)*/
60
- if(this.from.fk_Type && this.from.fk_Content){
61
- this.$resetpost(`/rs/logic/add_feedback`, this.from).then((res) => {
62
- alert("添加成功");
63
- console.log(this.from);
64
- })
65
- }else{
66
- alert("反馈类型和内容不能为空")
67
- }
68
-
69
- },
70
- }
71
- }
72
- </script>
73
- <style scoped="">
74
- .app-row {
75
- background-color: white;
76
- padding: 10px 10px 0 10px;
77
- border-bottom: 1px solid rgba(235, 235, 235, 0.5);
78
- }
79
- .devicetext {
80
- font: 13px PingFang-SC-Medium;
81
- position:fixed;
82
- width:100%;
83
- bottom:13px;
84
- transform: translate(-50%, -50%);
85
- }
86
- /*输入框样式*/
87
- /*@import url(http://fonts.useso.com/css?family=Source+Sans+Pro:200,300);*/
88
- * {
89
- box-sizing: border-box;
90
- margin: 0;
91
- padding: 0;
92
- font-weight: 300;
93
- }
94
- .loginbg {
95
- font-family: 'Source Sans Pro', sans-serif;
96
- color: white;
97
- font-weight: 300;
98
- }
99
- .loginbg ::-webkit-input-placeholder {
100
- /* WebKit browsers */
101
- font-family: 'Source Sans Pro', sans-serif;
102
- color: white;
103
- font-weight: 300;
104
- }
105
- .loginbg :-moz-placeholder {
106
- /* Mozilla Firefox 4 to 18 */
107
- font-family: 'Source Sans Pro', sans-serif;
108
- color: white;
109
- opacity: 1;
110
- font-weight: 300;
111
- }
112
- .loginbg ::-moz-placeholder {
113
- /* Mozilla Firefox 19+ */
114
- font-family: 'Source Sans Pro', sans-serif;
115
- color: white;
116
- opacity: 1;
117
- font-weight: 300;
118
- }
119
- .loginbg :-ms-input-placeholder {
120
- /* Internet Explorer 10+ */
121
- font-family: 'Source Sans Pro', sans-serif;
122
- color: white;
123
- font-weight: 300;
124
- }
125
- .wrapper {
126
- /*background: #2D83BA;
127
- background: -webkit-linear-gradient(top left, #2D83BA 0%, #2D83BA 100%);
128
- background: linear-gradient(to bottom right, #2D83BA 0%, #2D83BA 100%);
129
- opacity: 0.8;*/
130
- /*position: absolute;*/
131
- /*top: 50%;
132
- right: 10%;
133
- width: 40%;
134
- height: 350px;
135
- margin-top: -150px;*/
136
- overflow: hidden;
137
- }
138
-
139
- .wrapper.form-success .container h3{
140
- -webkit-transform: translateY(85px);
141
- -ms-transform: translateY(85px);
142
- transform: translateY(85px);
143
- }
144
- .container {
145
- /*max-width: 350px;*/
146
- margin: 0 auto;
147
- /*padding: 30px 100px 50px 100px;
148
- height: 350px;*/
149
- text-align: center;
150
- /*以下增加*/
151
- /*background: #2D83BA;
152
- background: -webkit-linear-gradient(top left, #2D83BA 0%, #2D83BA 100%);
153
- background: linear-gradient(to bottom right, #2D83BA 0%, #2D83BA 100%);*/
154
- opacity: 0.8;
155
- }
156
- .container h3{
157
- font-size: 40px;
158
- -webkit-transition-duration: 1s;
159
- transition-duration: 1s;
160
- -webkit-transition-timing-function: ease-in-put;
161
- transition-timing-function: ease-in-put;
162
- font-weight: 200;
163
- }
164
- .form {
165
- padding: 20px 0;
166
- /*margin-top: 15%;*/
167
- position: relative;
168
- z-index: 2;
169
- }
170
- .form input {
171
- -webkit-appearance: none;
172
- -moz-appearance: none;
173
- appearance: none;
174
- outline: 0;
175
- border: 1px solid #50ABE6;
176
- background-color: #50ABE6;
177
- width: 250px;
178
- border-radius: 3px;
179
- padding: 10px 15px;
180
- margin: 0 auto 10px auto;
181
- display: block;
182
- text-align: center;
183
- font-size: 18px;
184
- color: white;
185
- -webkit-transition-duration: 0.25s;
186
- transition-duration: 0.25s;
187
- font-weight: 300;
188
- }
189
- .form input:hover {
190
- background-color: rgba(255, 255, 255, 0.4);
191
- }
192
- .form input:focus {
193
- background-color: white;
194
- width: 300px;
195
- color: #53e3a6;
196
- }
197
-
198
-
199
- .form button {
200
- -webkit-appearance: none;
201
- -moz-appearance: none;
202
- appearance: none;
203
- outline: 0;
204
- background-color: white;
205
- border: 0;
206
- padding: 10px 15px;
207
- color: #253830;
208
- border-radius: 3px;
209
- width: 250px;
210
- cursor: pointer;
211
- font-size: 18px;
212
- -webkit-transition-duration: 0.25s;
213
- transition-duration: 0.25s;
214
- }
215
- .form button:hover {
216
- background-color: #f5f7f9;
217
- }
218
-
219
- /*注册字体样式*/
220
- .form span {
221
- color: #fff;
222
- display: table-footer-group;
223
- position: absolute;
224
- right: 10px;
225
- margin-top: 10px;
226
- cursor: pointer;
227
- }
228
- .logotitle {
229
- color: #fff;
230
- position: absolute;
231
- top: 50px;
232
- left: 50px;
233
- font-size: 50px;
234
- }
235
- /*注册模态框界面样式*/
236
- .modifystyle {
237
- background: #FCFEEE;
238
- }
239
- .modifystyle div{
240
- height: auto;
241
- margin-bottom: 15px;
242
- /*text-align: center;*/
243
- /*margin-left: 20%;*/
244
- }
245
- /*bootstrap字体图标要手动调整，所以使用字体图标的span必须紧跟在input后面，负责会错位*/
246
- .modifystyle div input + span{
247
- top: 0!important;
248
- right: 32%;
249
- }
250
- .modifystyle span{
251
- color: red;
252
- }
253
-
254
- /* 通告区内容 */
255
- .notice-board {
256
- height: auto;
257
- position: absolute;
258
- top: 50%;
259
- margin-top: -150px;
260
- margin-left: 100px;
261
- color: #fff;
262
- }
263
- /*修改密码底部按钮部分样式*/
264
- .footerbtn {
265
- text-align: center;
266
- padding: 15px;
267
- }
268
- .footerbtn button {
269
- width: 100px;
270
- margin-left: 20px;
271
- }
272
- .bg-bubbles {
273
- position: absolute;
274
- top: 0;
275
- left: 0;
276
- width: 100%;
277
- height: 100%;
278
- z-index: 1;
279
- }
280
- .bg-bubbles li {
281
- position: absolute;
282
- list-style: none;
283
- display: block;
284
- width: 40px;
285
- height: 40px;
286
- background-color: rgba(255, 255, 255, 0.15);
287
- bottom: -160px;
288
- -webkit-animation: square 25s infinite;
289
- animation: square 25s infinite;
290
- -webkit-transition-timing-function: linear;
291
- transition-timing-function: linear;
292
- }
293
- .bg-bubbles li:nth-child(1) {
294
- left: 10%;
295
- }
296
- .bg-bubbles li:nth-child(2) {
297
- left: 20%;
298
- width: 80px;
299
- height: 80px;
300
- -webkit-animation-delay: 2s;
301
- animation-delay: 2s;
302
- -webkit-animation-duration: 17s;
303
- animation-duration: 17s;
304
- }
305
- .bg-bubbles li:nth-child(3) {
306
- left: 25%;
307
- -webkit-animation-delay: 4s;
308
- animation-delay: 4s;
309
- }
310
- .bg-bubbles li:nth-child(4) {
311
- left: 40%;
312
- width: 60px;
313
- height: 60px;
314
- -webkit-animation-duration: 22s;
315
- animation-duration: 22s;
316
- background-color: rgba(255, 255, 255, 0.25);
317
- }
318
- .bg-bubbles li:nth-child(5) {
319
- left: 70%;
320
- }
321
- .bg-bubbles li:nth-child(6) {
322
- left: 80%;
323
- width: 120px;
324
- height: 120px;
325
- -webkit-animation-delay: 3s;
326
- animation-delay: 3s;
327
- background-color: rgba(255, 255, 255, 0.2);
328
- }
329
- .bg-bubbles li:nth-child(7) {
330
- left: 32%;
331
- width: 160px;
332
- height: 160px;
333
- -webkit-animation-delay: 7s;
334
- animation-delay: 7s;
335
- }
336
- .bg-bubbles li:nth-child(8) {
337
- left: 55%;
338
- width: 20px;
339
- height: 20px;
340
- -webkit-animation-delay: 15s;
341
- animation-delay: 15s;
342
- -webkit-animation-duration: 40s;
343
- animation-duration: 40s;
344
- }
345
- .bg-bubbles li:nth-child(9) {
346
- left: 25%;
347
- width: 10px;
348
- height: 10px;
349
- -webkit-animation-delay: 2s;
350
- animation-delay: 2s;
351
- -webkit-animation-duration: 40s;
352
- animation-duration: 40s;
353
- background-color: rgba(255, 255, 255, 0.3);
354
- }
355
- .bg-bubbles li:nth-child(10) {
356
- left: 90%;
357
- width: 160px;
358
- height: 160px;
359
- -webkit-animation-delay: 11s;
360
- animation-delay: 11s;
361
- }
362
-
363
-
364
- </style>
365
-
366
-
1
+ <template>
2
+ <div class="auto select-overspread ">
3
+ <div class="row auto">
4
+ <div class="row app-row">
5
+ <div class="col-xs-4">
6
+ <label class="font text-left">反馈类型：</label>
7
+ </div>
8
+ <div class="col-xs-8" >
9
+ <v-select class="input-font"
10
+ placeholder="请选择反馈"
11
+ :value.sync="from.fk_Type"
12
+ :options='option'
13
+ close-on-select clear-button></v-select>
14
+ </div>
15
+ </div>
16
+ <div class="row app-row">
17
+ <div class="col-xs-4">
18
+ <!-- <img src="../../assets/用户ID.png" style="width: 20px;margin-bottom: 5px" alt="">-->
19
+ <label class="font text-left">反馈内容：</label>
20
+ </div>
21
+ <div class="col-xs-8" >
22
+ <textarea class="form-control" placeholder="请输入反馈内容"cols="30" rows="3" style="resize: vertical;" v-model="from.fk_Content"></textarea>
23
+ </div>
24
+ </div>
25
+ </div>
26
+ <div class="row app-row text-center">
27
+ <button type="button" class="btn btn-lg btn-font btn-color" style="width: 45%;" @click="save()">提交</button>
28
+ </div>
29
+ </div>
30
+ </template>
31
+
32
+ <script>
33
+ import {HttpResetClass} from "vue-client";
34
+ import Vue from "vue"
35
+
36
+ export default {
37
+ title: "意见反馈",
38
+ props: {},
39
+ data() {
40
+ return {
41
+ // option: this.$appdata.getParam('意见反馈类型'),
42
+ option:[{label:'意见反馈类型一',value:'意见反馈类型一'},{label:'意见反馈类型二',value:'意见反馈类型二'}],
43
+ from: {
44
+ // fk_Name: Vue.user.name,
45
+ // fk_Id: Vue.user.id,
46
+ fk_Id:'1',
47
+ fk_Name:'奥德',
48
+ fk_Type: '',
49
+ fk_Content: '',
50
+ fk_Firm:'测试'
51
+ // fkFirm:Vue.user.orgid,
52
+ },
53
+ margintop: document.documentElement.clientHeight * 0.1,
54
+ show: false
55
+ }
56
+ },
57
+ methods: {
58
+ save() {
59
+ /*console.log(this.from.fkType=option.value)*/
60
+ if(this.from.fk_Type && this.from.fk_Content){
61
+ this.$resetpost(`/rs/logic/add_feedback`, this.from).then((res) => {
62
+ alert("添加成功");
63
+ console.log(this.from);
64
+ })
65
+ }else{
66
+ alert("反馈类型和内容不能为空")
67
+ }
68
+
69
+ },
70
+ }
71
+ }
72
+ </script>
73
+ <style scoped="">
74
+ .app-row {
75
+ background-color: white;
76
+ padding: 10px 10px 0 10px;
77
+ border-bottom: 1px solid rgba(235, 235, 235, 0.5);
78
+ }
79
+ .devicetext {
80
+ font: 13px PingFang-SC-Medium;
81
+ position:fixed;
82
+ width:100%;
83
+ bottom:13px;
84
+ transform: translate(-50%, -50%);
85
+ }
86
+ .devicetext1 {
87
+ font: 13px PingFang-SC-Medium;
88
+ position:fixed;
89
+ width:100%;
90
+ bottom:18px;
91
+ transform: translate(-50%, -50%);
92
+ }
93
+ /*输入框样式*/
94
+ /*@import url(http://fonts.useso.com/css?family=Source+Sans+Pro:200,300);*/
95
+ * {
96
+ box-sizing: border-box;
97
+ margin: 0;
98
+ padding: 0;
99
+ font-weight: 300;
100
+ }
101
+ .loginbg {
102
+ font-family: 'Source Sans Pro', sans-serif;
103
+ color: white;
104
+ font-weight: 300;
105
+ }
106
+ .loginbg ::-webkit-input-placeholder {
107
+ /* WebKit browsers */
108
+ font-family: 'Source Sans Pro', sans-serif;
109
+ color: white;
110
+ font-weight: 300;
111
+ }
112
+ .loginbg :-moz-placeholder {
113
+ /* Mozilla Firefox 4 to 18 */
114
+ font-family: 'Source Sans Pro', sans-serif;
115
+ color: white;
116
+ opacity: 1;
117
+ font-weight: 300;
118
+ }
119
+ .loginbg ::-moz-placeholder {
120
+ /* Mozilla Firefox 19+ */
121
+ font-family: 'Source Sans Pro', sans-serif;
122
+ color: white;
123
+ opacity: 1;
124
+ font-weight: 300;
125
+ }
126
+ .loginbg :-ms-input-placeholder {
127
+ /* Internet Explorer 10+ */
128
+ font-family: 'Source Sans Pro', sans-serif;
129
+ color: white;
130
+ font-weight: 300;
131
+ }
132
+ .wrapper {
133
+ /*background: #2D83BA;
134
+ background: -webkit-linear-gradient(top left, #2D83BA 0%, #2D83BA 100%);
135
+ background: linear-gradient(to bottom right, #2D83BA 0%, #2D83BA 100%);
136
+ opacity: 0.8;*/
137
+ /*position: absolute;*/
138
+ /*top: 50%;
139
+ right: 10%;
140
+ width: 40%;
141
+ height: 350px;
142
+ margin-top: -150px;*/
143
+ overflow: hidden;
144
+ }
145
+
146
+ .wrapper.form-success .container h3{
147
+ -webkit-transform: translateY(85px);
148
+ -ms-transform: translateY(85px);
149
+ transform: translateY(85px);
150
+ }
151
+ .container {
152
+ /*max-width: 350px;*/
153
+ margin: 0 auto;
154
+ /*padding: 30px 100px 50px 100px;
155
+ height: 350px;*/
156
+ text-align: center;
157
+ /*以下增加*/
158
+ /*background: #2D83BA;
159
+ background: -webkit-linear-gradient(top left, #2D83BA 0%, #2D83BA 100%);
160
+ background: linear-gradient(to bottom right, #2D83BA 0%, #2D83BA 100%);*/
161
+ opacity: 0.8;
162
+ }
163
+ .container h3{
164
+ font-size: 40px;
165
+ -webkit-transition-duration: 1s;
166
+ transition-duration: 1s;
167
+ -webkit-transition-timing-function: ease-in-put;
168
+ transition-timing-function: ease-in-put;
169
+ font-weight: 200;
170
+ }
171
+ .form {
172
+ padding: 20px 0;
173
+ /*margin-top: 15%;*/
174
+ position: relative;
175
+ z-index: 2;
176
+ }
177
+ .form input {
178
+ -webkit-appearance: none;
179
+ -moz-appearance: none;
180
+ appearance: none;
181
+ outline: 0;
182
+ border: 1px solid #50ABE6;
183
+ background-color: #50ABE6;
184
+ width: 250px;
185
+ border-radius: 3px;
186
+ padding: 10px 15px;
187
+ margin: 0 auto 10px auto;
188
+ display: block;
189
+ text-align: center;
190
+ font-size: 18px;
191
+ color: white;
192
+ -webkit-transition-duration: 0.25s;
193
+ transition-duration: 0.25s;
194
+ font-weight: 300;
195
+ }
196
+ .form input:hover {
197
+ background-color: rgba(255, 255, 255, 0.4);
198
+ }
199
+ .form input:focus {
200
+ background-color: white;
201
+ width: 300px;
202
+ color: #53e3a6;
203
+ }
204
+
205
+
206
+ .form button {
207
+ -webkit-appearance: none;
208
+ -moz-appearance: none;
209
+ appearance: none;
210
+ outline: 0;
211
+ background-color: white;
212
+ border: 0;
213
+ padding: 10px 15px;
214
+ color: #253830;
215
+ border-radius: 3px;
216
+ width: 250px;
217
+ cursor: pointer;
218
+ font-size: 18px;
219
+ -webkit-transition-duration: 0.25s;
220
+ transition-duration: 0.25s;
221
+ }
222
+ .form button:hover {
223
+ background-color: #f5f7f9;
224
+ }
225
+
226
+ /*注册字体样式*/
227
+ .form span {
228
+ color: #fff;
229
+ display: table-footer-group;
230
+ position: absolute;
231
+ right: 10px;
232
+ margin-top: 10px;
233
+ cursor: pointer;
234
+ }
235
+ .logotitle {
236
+ color: #fff;
237
+ position: absolute;
238
+ top: 50px;
239
+ left: 50px;
240
+ font-size: 50px;
241
+ }
242
+ /*注册模态框界面样式*/
243
+ .modifystyle {
244
+ background: #FCFEEE;
245
+ }
246
+ .modifystyle div{
247
+ height: auto;
248
+ margin-bottom: 15px;
249
+ /*text-align: center;*/
250
+ /*margin-left: 20%;*/
251
+ }
252
+ /*bootstrap字体图标要手动调整，所以使用字体图标的span必须紧跟在input后面，负责会错位*/
253
+ .modifystyle div input + span{
254
+ top: 0!important;
255
+ right: 32%;
256
+ }
257
+ .modifystyle span{
258
+ color: red;
259
+ }
260
+
261
+ /* 通告区内容 */
262
+ .notice-board {
263
+ height: auto;
264
+ position: absolute;
265
+ top: 50%;
266
+ margin-top: -150px;
267
+ margin-left: 100px;
268
+ color: #fff;
269
+ }
270
+ /*修改密码底部按钮部分样式*/
271
+ .footerbtn {
272
+ text-align: center;
273
+ padding: 15px;
274
+ }
275
+ .footerbtn button {
276
+ width: 100px;
277
+ margin-left: 20px;
278
+ }
279
+ .bg-bubbles {
280
+ position: absolute;
281
+ top: 0;
282
+ left: 0;
283
+ width: 100%;
284
+ height: 100%;
285
+ z-index: 1;
286
+ }
287
+ .bg-bubbles li {
288
+ position: absolute;
289
+ list-style: none;
290
+ display: block;
291
+ width: 40px;
292
+ height: 40px;
293
+ background-color: rgba(255, 255, 255, 0.15);
294
+ bottom: -160px;
295
+ -webkit-animation: square 25s infinite;
296
+ animation: square 25s infinite;
297
+ -webkit-transition-timing-function: linear;
298
+ transition-timing-function: linear;
299
+ }
300
+ .bg-bubbles li:nth-child(1) {
301
+ left: 10%;
302
+ }
303
+ .bg-bubbles li:nth-child(2) {
304
+ left: 20%;
305
+ width: 80px;
306
+ height: 80px;
307
+ -webkit-animation-delay: 2s;
308
+ animation-delay: 2s;
309
+ -webkit-animation-duration: 17s;
310
+ animation-duration: 17s;
311
+ }
312
+ .bg-bubbles li:nth-child(3) {
313
+ left: 25%;
314
+ -webkit-animation-delay: 4s;
315
+ animation-delay: 4s;
316
+ }
317
+ .bg-bubbles li:nth-child(4) {
318
+ left: 40%;
319
+ width: 60px;
320
+ height: 60px;
321
+ -webkit-animation-duration: 22s;
322
+ animation-duration: 22s;
323
+ background-color: rgba(255, 255, 255, 0.25);
324
+ }
325
+ .bg-bubbles li:nth-child(5) {
326
+ left: 70%;
327
+ }
328
+ .bg-bubbles li:nth-child(6) {
329
+ left: 80%;
330
+ width: 120px;
331
+ height: 120px;
332
+ -webkit-animation-delay: 3s;
333
+ animation-delay: 3s;
334
+ background-color: rgba(255, 255, 255, 0.2);
335
+ }
336
+ .bg-bubbles li:nth-child(7) {
337
+ left: 32%;
338
+ width: 160px;
339
+ height: 160px;
340
+ -webkit-animation-delay: 7s;
341
+ animation-delay: 7s;
342
+ }
343
+ .bg-bubbles li:nth-child(8) {
344
+ left: 55%;
345
+ width: 20px;
346
+ height: 20px;
347
+ -webkit-animation-delay: 15s;
348
+ animation-delay: 15s;
349
+ -webkit-animation-duration: 40s;
350
+ animation-duration: 40s;
351
+ }
352
+ .bg-bubbles li:nth-child(9) {
353
+ left: 25%;
354
+ width: 10px;
355
+ height: 10px;
356
+ -webkit-animation-delay: 2s;
357
+ animation-delay: 2s;
358
+ -webkit-animation-duration: 40s;
359
+ animation-duration: 40s;
360
+ background-color: rgba(255, 255, 255, 0.3);
361
+ }
362
+ .bg-bubbles li:nth-child(10) {
363
+ left: 90%;
364
+ width: 160px;
365
+ height: 160px;
366
+ -webkit-animation-delay: 11s;
367
+ animation-delay: 11s;
368
+ }
369
+
370
+
371
+ </style>
372
+
373
+