n20-common-lib 1.3.13 → 1.3.14

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.
@@ -1,726 +0,0 @@
1
- $--font-size-base: 14px !default;
2
- $--border-color-base: #dcdfe6 !default;
3
- $--border-radius-base: 4px !default;
4
- $--input-width: 224px !default;
5
-
6
- // 项目中可以直接使用
7
- // .input-w {width: $--input-width;}
8
- // .button-4em{min-width: 72px;}
9
- /* 格式化样式
10
- ---------------- */
11
- html {
12
- height: 100%;
13
- }
14
- body {
15
- height: 100%;
16
- font-size: $--font-size-base;
17
- }
18
- li {
19
- list-style: none;
20
- }
21
- a {
22
- color: inherit;
23
- text-decoration: none;
24
- }
25
- iframe {
26
- border: 0;
27
- outline: none;
28
- }
29
-
30
- /* 滚动条样式
31
- --------------- */
32
- ::-webkit-scrollbar {
33
- width: 6px;
34
- height: 6px;
35
- }
36
-
37
- ::-webkit-scrollbar-button {
38
- width: 0;
39
- height: 0;
40
- }
41
-
42
- ::-webkit-scrollbar-corner {
43
- background-color: transparent;
44
- }
45
-
46
- ::-webkit-scrollbar-thumb,
47
- ::-webkit-scrollbar-track {
48
- border-color: transparent;
49
- border-style: solid;
50
- border-radius: 3px;
51
- }
52
-
53
- ::-webkit-scrollbar-thumb {
54
- min-height: 28px;
55
- background-color: rgba(0, 0, 0, 0.07);
56
- border-width: 0;
57
- border-radius: 3px;
58
- }
59
-
60
- ::-webkit-scrollbar-thumb:hover {
61
- background-color: rgba(0, 0, 0, 0.2);
62
- }
63
-
64
- ::-webkit-scrollbar-thumb:active {
65
- background-color: rgba(0, 0, 0, 0.25);
66
- }
67
-
68
- // ::-webkit-scrollbar-track:hover {
69
- // background-color: rgba(0, 0, 0, 0.03);
70
- // }
71
-
72
- // ::-webkit-scrollbar-track:active {
73
- // background-color: rgba(0, 0, 0, 0.03);
74
- // }
75
-
76
- :root {
77
- --client-height: calc(100vh - 116px);
78
- }
79
-
80
- /* 内外边距
81
- --------------- */
82
- @mixin set-pm($m, $p) {
83
- .p-a#{$m} {
84
- padding: $p;
85
- }
86
-
87
- .p-t#{$m} {
88
- padding-top: $p;
89
- }
90
-
91
- .p-b#{$m} {
92
- padding-bottom: $p;
93
- }
94
-
95
- .p-l#{$m} {
96
- padding-left: $p;
97
- }
98
-
99
- .p-r#{$m} {
100
- padding-right: $p;
101
- }
102
-
103
- .m-a#{$m} {
104
- margin: $p;
105
- }
106
-
107
- .m-t#{$m} {
108
- margin-top: $p;
109
- }
110
-
111
- .m-b#{$m} {
112
- margin-bottom: $p;
113
- }
114
-
115
- .m-l#{$m} {
116
- margin-left: $p;
117
- }
118
-
119
- .m-r#{$m} {
120
- margin-right: $p;
121
- }
122
- }
123
-
124
- /* 内外边距 */
125
- .m-l-auto {
126
- margin-left: auto !important;
127
- }
128
- .m-r-auto {
129
- margin-right: auto !important;
130
- }
131
- .m-lr-auto {
132
- margin-left: auto !important;
133
- margin-right: auto !important;
134
- }
135
- @include set-pm('', 12px !important);
136
- @include set-pm('-xl', 32px !important);
137
- @include set-pm('-lg', 24px !important);
138
- @include set-pm('-m', 16px !important);
139
- @include set-pm('-s', 8px !important);
140
- @include set-pm('-b', 6px !important);
141
- @include set-pm('-ss', 4px !important);
142
- @include set-pm('-0', 0 !important);
143
-
144
- /* 内外边距
145
- --------------- */
146
- @mixin pm-fn($n) {
147
- .pa-#{$n} {
148
- padding: #{$n}px;
149
- }
150
- .pt-#{$n} {
151
- padding-top: #{$n}px;
152
- }
153
- .pl-#{$n} {
154
- padding-left: #{$n}px;
155
- }
156
- .pr-#{$n} {
157
- padding-right: #{$n}px;
158
- }
159
- .pb-#{$n} {
160
- padding-bottom: #{$n}px;
161
- }
162
- .px-#{$n} {
163
- padding-left: #{$n}px;
164
- padding-right: #{$n}px;
165
- }
166
- .py-#{$n} {
167
- padding-top: #{$n}px;
168
- padding-bottom: #{$n}px;
169
- }
170
- .ma-#{$n} {
171
- margin: #{$n}px;
172
- }
173
- .mt-#{$n} {
174
- margin-top: #{$n}px;
175
- }
176
- .ml-#{$n} {
177
- margin-left: #{$n}px;
178
- }
179
- .mr-#{$n} {
180
- margin-right: #{$n}px;
181
- }
182
- .mb-#{$n} {
183
- margin-bottom: #{$n}px;
184
- }
185
- .mx-#{$n} {
186
- margin-left: #{$n}px;
187
- margin-right: #{$n}px;
188
- }
189
- .py-#{$n} {
190
- margin-top: #{$n}px;
191
- margin-bottom: #{$n}px;
192
- }
193
- }
194
-
195
- @include pm-fn(0);
196
- @include pm-fn(2);
197
- @include pm-fn(4);
198
- @include pm-fn(6);
199
- @include pm-fn(8);
200
- @include pm-fn(10);
201
- @include pm-fn(12);
202
- @include pm-fn(14);
203
-
204
- /* 浮动布局
205
- --------------- */
206
- .left,
207
- .float-left {
208
- float: left;
209
- }
210
-
211
- .right,
212
- .float-right {
213
- float: right;
214
- }
215
-
216
- .overflow {
217
- height: auto;
218
- overflow: hidden;
219
- }
220
-
221
- .overflow-y {
222
- overflow-y: auto;
223
- }
224
- .overflow-x {
225
- overflow-x: auto;
226
- }
227
-
228
- // 清除浮动
229
- .overflow-clear {
230
- &:after {
231
- content: '';
232
- display: block;
233
- clear: both;
234
- }
235
- }
236
- /* 清除左侧浮动,将元素放置在任何先前的左浮动元素的下方 */
237
- .clear-left {
238
- clear: left;
239
- }
240
- /* 清除右侧浮动,将元素放置在任何先前的右浮动元素的下方 */
241
- .clear-right {
242
- clear: right;
243
- }
244
-
245
- /* 行内块元素水平垂直对齐方式
246
- --------------- */
247
- .b-center {
248
- text-align: center;
249
- & > * {
250
- display: inline-block;
251
- vertical-align: bottom;
252
- }
253
- }
254
-
255
- .b-vertical {
256
- font-size: 0;
257
- & > * {
258
- vertical-align: middle;
259
- display: inline-block;
260
- font-size: 14px;
261
- }
262
- &:before {
263
- content: '';
264
- vertical-align: middle;
265
- display: inline-block;
266
- width: 0;
267
- height: 100%;
268
- }
269
- }
270
-
271
- /* 文字居中
272
- --------------- */
273
- .text {
274
- &-c {
275
- text-align: center !important;
276
- }
277
- &-l {
278
- text-align: left !important;
279
- }
280
- &-r {
281
- text-align: right !important;
282
- }
283
- &-lr {
284
- text-align: justify;
285
- text-justify: inter-word;
286
- }
287
- &-ellipsis {
288
- white-space: nowrap;
289
- overflow: hidden;
290
- text-overflow: ellipsis;
291
- }
292
- }
293
-
294
- /* 弹性盒模型
295
- --------------- */
296
- .flex-box {
297
- display: flex;
298
- }
299
- .flex-column {
300
- display: flex;
301
- flex-direction: column;
302
- }
303
-
304
- .flex-box > *,
305
- .flex-column > * {
306
- flex: none;
307
- }
308
-
309
- .flex {
310
- &-v {
311
- align-items: center;
312
- }
313
- &-s {
314
- align-items: flex-start;
315
- }
316
- &-e {
317
- align-items: flex-end;
318
- }
319
- &-l {
320
- justify-content: flex-start;
321
- }
322
- &-r {
323
- justify-content: flex-end;
324
- }
325
- &-c {
326
- justify-content: center;
327
- }
328
- &-lr {
329
- justify-content: space-between;
330
- }
331
- &-sa {
332
- justify-content: space-around;
333
- }
334
- }
335
-
336
- .flex-item {
337
- flex: auto;
338
- }
339
-
340
- @for $n from 0 to 10 {
341
- .flex-#{$n} {
342
- flex: $n $n auto;
343
- }
344
- }
345
-
346
- /* 旋转图标90度
347
- -------------- */
348
- .rotate90 {
349
- display: inline-block;
350
- transform: rotate(90deg);
351
- cursor: pointer;
352
- }
353
-
354
- /* 清除背景色
355
- -------------- */
356
- .bg {
357
- &-none {
358
- background: none !important;
359
- }
360
- }
361
-
362
- /* 阴影 */
363
- .box-shadow {
364
- box-shadow: 0px 4px 16px 0px rgba($--color-black, 0.1);
365
- }
366
- .box-shadow-mini {
367
- box-shadow: 0px 2px 8px 0px rgba($--color-black, 0.08);
368
- }
369
- .page-footer-shadow {
370
- position: relative;
371
- height: 38px;
372
- margin-bottom: -12px;
373
- &::before {
374
- content: '';
375
- pointer-events: none;
376
- position: absolute;
377
- top: 0px;
378
- height: 100%;
379
- left: -12px;
380
- right: -12px;
381
- box-shadow: 0px -2px 6px 0px rgba($--color-black, 0.08);
382
- }
383
- }
384
-
385
- .page-button-shadow {
386
- position: relative;
387
- height: 44px;
388
- margin-bottom: -12px;
389
- &::before {
390
- content: '';
391
- pointer-events: none;
392
- position: absolute;
393
- top: 0px;
394
- height: 100%;
395
- left: -12px;
396
- right: -12px;
397
- box-shadow: 0px -2px 6px 0px rgba($--color-black, 0.08);
398
- }
399
- }
400
-
401
- /* 边框
402
- -------------- */
403
- .bd {
404
- &-none {
405
- border: none !important;
406
- }
407
- &-a {
408
- border: 1px solid $--border-color-base;
409
- }
410
- &-t {
411
- border-top: 1px solid $--border-color-base;
412
- }
413
- &-l {
414
- border-left: 1px solid $--border-color-base;
415
- }
416
- &-r {
417
- border-right: 1px solid $--border-color-base;
418
- }
419
- &-b {
420
- border-bottom: 1px solid $--border-color-base;
421
- }
422
- }
423
- .bd-rs {
424
- border-radius: $--border-radius-base;
425
- }
426
-
427
- /* 设置弹窗内容区内边距
428
- -------------- */
429
- .el-dialog__wrapper {
430
- &.p-a-0 {
431
- .el-dialog__body {
432
- padding: 0;
433
- }
434
- }
435
- &.p-t-0 {
436
- .el-dialog__body {
437
- padding-top: 0;
438
- }
439
- }
440
- &.p-b-0 {
441
- .el-dialog__body {
442
- padding-bottom: 0;
443
- }
444
- }
445
- }
446
-
447
- /* 通用字号
448
- -------------- */
449
- .font-size-base {
450
- font-size: var(--font-size-base);
451
- }
452
- .font-size-small {
453
- font-size: var(--font-size-small);
454
- }
455
-
456
- /* 通用颜色
457
- -------------- */
458
- .color-primary {
459
- color: var(--color-primary) !important;
460
- }
461
- .color-success {
462
- color: var(--color-success);
463
- }
464
- .color-warning {
465
- color: var(--color-warning);
466
- }
467
- .color-danger {
468
- color: var(--color-danger);
469
- }
470
- .color-placeholder {
471
- color: var(--color-text-placeholder);
472
- }
473
-
474
- .linear-grad {
475
- background: var(--background-linear-gradient);
476
- }
477
-
478
- .color-white {
479
- color: white;
480
- }
481
- .color-ccc {
482
- color: #ccc;
483
- }
484
- .color-999 {
485
- color: #999;
486
- }
487
- .color-666 {
488
- color: #666;
489
- }
490
- .color-333 {
491
- color: #333;
492
- }
493
-
494
- /* 鼠标默认样式
495
- --------------- */
496
- .cursor-d {
497
- cursor: default;
498
- }
499
- /* 鼠标小手
500
- --------------- */
501
- .pointer {
502
- cursor: pointer;
503
- }
504
-
505
- /* 鼠标禁止
506
- ---------------- */
507
- .cursor-not {
508
- cursor: not-allowed;
509
- }
510
-
511
- /* 字重
512
- --------------- */
513
- .font {
514
- &-w600 {
515
- font-weight: var(--font-weight-primary);
516
- }
517
- }
518
-
519
- /* 字号
520
- --------------- */
521
- .f-s {
522
- &-s {
523
- /* 12号字 */
524
- font-size: var(--font-size-small);
525
- }
526
- &-b {
527
- /* 14号字 */
528
- font-size: var(--font-size-base);
529
- }
530
- &-m {
531
- /* 16号字 */
532
- font-size: var(--font-size-medium);
533
- }
534
- &-l {
535
- /* 18号 */
536
- font-size: var(--font-size-large);
537
- }
538
- &-xl {
539
- font-size: var(--font-size-extra-large);
540
- }
541
- }
542
-
543
- /* 宽高范围是 60-1000
544
- ---------------- */
545
- $list: 45, 60, 80, 100, 110, 120, 130, 140, 150, 160, 170, 180, 190, 200, 210, 220, 230, 240, 250, 260, 270, 280, 290,
546
- 300, 400, 500, 600, 700, 800, 900, 1000;
547
- @each $n in $list {
548
- .w-#{$n} {
549
- width: #{$n}px !important;
550
- }
551
- .h-#{$n} {
552
- height: #{$n}px !important;
553
- }
554
- }
555
-
556
- /* 宽百分比 */
557
- @for $i from 1 through 10 {
558
- .w-#{$i}0p {
559
- width: #{$i + '0%'} !important;
560
- }
561
- }
562
-
563
- .n20-page-content {
564
- overflow-y: auto;
565
- overflow-x: hidden;
566
- }
567
-
568
- /* 边框圆角
569
- -------------- */
570
- .b {
571
- &-r {
572
- border-radius: 50%;
573
- }
574
- &-r-4 {
575
- border-radius: 4px;
576
- }
577
- &-r-5 {
578
- border-radius: 5px;
579
- }
580
- &-r-6 {
581
- border-radius: 6px;
582
- }
583
- &-r-7 {
584
- border-radius: 7px;
585
- }
586
- &-r-8 {
587
- border-radius: 8px;
588
- }
589
- &-r-9 {
590
- border-radius: 9px;
591
- }
592
- &-r-10 {
593
- border-radius: 10px;
594
- }
595
- }
596
-
597
- /* 垂直对齐
598
- --------------- */
599
- .align {
600
- &-baseline {
601
- vertical-align: baseline; // 将一个元素的基线与其父元素的基线对齐。
602
- }
603
- &-top {
604
- vertical-align: top; // 将一个元素的顶部和它的子代与整个行的顶部对齐。
605
- }
606
- &-middle {
607
- vertical-align: middle; // 将元素的中间与基线加父元素的一半高度对齐。
608
- }
609
- &-bottom {
610
- vertical-align: bottom; // 将一个元素的底部和它的子代与整个行的底部对齐。
611
- }
612
- &-text-top {
613
- vertical-align: text-top; // 使元素的顶部与父元素的字体顶部对齐。
614
- }
615
- &-text-bottom {
616
- vertical-align: text-bottom; // 使元素的底部与父元素的字体底部对齐。
617
- }
618
- }
619
-
620
- /* 本文选择 */
621
-
622
- .select {
623
- &-none {
624
- user-select: none; // 防止选择元素及其子元素中的文本。
625
- }
626
- &-text {
627
- user-select: text; // 允许选择元素及其子元素中的文本。
628
- }
629
- &-all {
630
- user-select: all; // 在用户点击时自动选择元素中的所有文本。
631
- }
632
- &-auto {
633
- user-select: auto; // 使用默认的浏览器行为来选择文本
634
- }
635
- }
636
-
637
- /* 文本溢出显示省略号 */
638
- .truncate {
639
- overflow: hidden;
640
- text-overflow: ellipsis;
641
- white-space: nowrap;
642
- }
643
-
644
- /* 本文转换 */
645
- /* 使用 uppercase 功能类对文本进行大写转换 */
646
- .uppercase {
647
- text-transform: uppercase;
648
- }
649
- /* 使用 lowercase 功能类对文本进行小写转换 */
650
- .lowercase {
651
- text-transform: lowercase;
652
- }
653
- /* 使用 capitalize 功能类对文本进行首字母大写转换 */
654
- .capitalize {
655
- text-transform: capitalize;
656
- }
657
-
658
- /* 下划线 */
659
- .underline {
660
- text-decoration: underline;
661
- }
662
- /* 删除线 */
663
- .line-through {
664
- text-decoration: line-through;
665
- }
666
- /* 移除文本装饰 */
667
- .no-underline {
668
- text-decoration: none;
669
- }
670
-
671
- /* 动画 */
672
- .animate {
673
- &-none {
674
- animation: none;
675
- }
676
- &-spin {
677
- animation: spin 1s linear infinite;
678
- }
679
- &-ping {
680
- animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
681
- }
682
- &-pulse {
683
- animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
684
- }
685
- &-bounce {
686
- animation: bounce 1s infinite;
687
- }
688
- }
689
-
690
- @keyframes spin {
691
- from {
692
- transform: rotate(0deg);
693
- }
694
- to {
695
- transform: rotate(360deg);
696
- }
697
- }
698
- @keyframes ping {
699
- 75%,
700
- 100% {
701
- transform: scale(2);
702
- opacity: 0;
703
- }
704
- }
705
-
706
- @keyframes pulse {
707
- 0%,
708
- 100% {
709
- opacity: 1;
710
- }
711
- 50% {
712
- opacity: 0.5;
713
- }
714
- }
715
-
716
- @keyframes bounce {
717
- 0%,
718
- 100% {
719
- transform: translateY(-25%);
720
- animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
721
- }
722
- 50% {
723
- transform: translateY(0);
724
- animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
725
- }
726
- }
@@ -1,2 +0,0 @@
1
- (function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t():"function"===typeof define&&define.amd?define([],t):"object"===typeof exports?exports["dev-corelib-index.umd.min"]=t():e["dev-corelib-index.umd.min"]=t()})("undefined"!==typeof self?self:this,(function(){return function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s="fae3")}({"1eb2":function(e,t,r){"use strict";if("undefined"!==typeof window){var n=window.document.currentScript,o=r("8875");n=o(),"currentScript"in document||Object.defineProperty(document,"currentScript",{get:o});var c=n&&n.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);c&&(r.p=c[1])}},8875:function(e,t,r){var n,o,c;(function(r,u){o=[],n=u,c="function"===typeof n?n.apply(t,o):n,void 0===c||(e.exports=c)})("undefined"!==typeof self&&self,(function(){function e(){var t=Object.getOwnPropertyDescriptor(document,"currentScript");if(!t&&"currentScript"in document&&document.currentScript)return document.currentScript;if(t&&t.get!==e&&document.currentScript)return document.currentScript;try{throw new Error}catch(s){var r,n,o,c=/.*at [^(]*\((.*):(.+):(.+)\)$/gi,u=/@([^@]*):(\d+):(\d+)\s*$/gi,i=c.exec(s.stack)||u.exec(s.stack),f=i&&i[1]||!1,d=i&&i[2]||!1,p=document.location.href.replace(document.location.hash,""),a=document.getElementsByTagName("script");f===p&&(r=document.documentElement.outerHTML,n=new RegExp("(?:[^\\n]+?\\n){0,"+(d-2)+"}[^<]*<script>([\\d\\D]*?)<\\/script>[\\d\\D]*","i"),o=r.replace(n,"$1").trim());for(var l=0;l<a.length;l++){if("interactive"===a[l].readyState)return a[l];if(a[l].src===f)return a[l];if(f===p&&a[l].innerHTML&&a[l].innerHTML.trim()===o)return a[l]}return null}}return e}))},9536:function(e,t,r){},fae3:function(e,t,r){"use strict";r.r(t);r("1eb2");var n=r("9536");for(var o in n)["default"].indexOf(o)<0&&function(e){r.d(t,e,(function(){return n[e]}))}(o)}})}));
2
- //# sourceMappingURL=index.umd.min.js.map