1 | @import "../node_modules/tinper-bee-core/scss/minxin-variables";
|
2 | @import "../node_modules/tinper-bee-core/scss/minxin-mixins";
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 |
|
14 |
|
15 |
|
16 |
|
17 |
|
18 |
|
19 |
|
20 |
|
21 |
|
22 |
|
23 | .u-drop{
|
24 | background:rgba(247,249,251,1);
|
25 | border:1px solid rgba(235,236,240,1);
|
26 | padding: 12px;
|
27 | color: #212121;
|
28 | }
|
29 |
|
30 |
|
31 |
|
32 |
|
33 |
|
34 |
|
35 | .u-drop.u-drop-horizontal{
|
36 | display: flex;
|
37 | width: 100%;
|
38 | }
|
39 |
|
40 | .u-droping-horizontal{
|
41 |
|
42 |
|
43 |
|
44 | }
|
45 |
|
46 |
|
47 | .u-drag{
|
48 | user-select: none;
|
49 | margin: $dnd-item-margin;
|
50 | min-width: 100px;
|
51 | background:rgba(255,255,255,1);
|
52 | border-radius:3px;
|
53 | border:1px solid rgba(165,173,186,1);
|
54 | padding: 6px 0;
|
55 | font-size: 12px;
|
56 | &:hover{
|
57 | background:rgba(235,236,240,1);
|
58 | border:1px solid rgba(165,173,186,1);
|
59 | }
|
60 | &:focus{
|
61 | outline: none;
|
62 | }
|
63 | }
|
64 |
|
65 | .u-droping{
|
66 | .u-draging{
|
67 | background:rgba(235,236,240,1);
|
68 | box-shadow:0px 2px 4px 0px rgba(31,37,52,0.3);
|
69 | opacity:0.8;
|
70 | }
|
71 | }
|
72 | .u-draging{
|
73 | background:rgba(235,236,240,1);
|
74 | box-shadow:0px 2px 4px 0px rgba(31,37,52,0.3);
|
75 | opacity:0.8;
|
76 | }
|
77 |
|
78 |
|
79 | .u-drag.u-drag-horizontal{
|
80 | display: inline-block;
|
81 | width: 72px;
|
82 | height: 72px;
|
83 | line-height: 72px;
|
84 | padding: 0;
|
85 | }
|
86 |
|
87 |
|
88 | .u-draging-horizontal{
|
89 |
|
90 | }
|
91 |
|
92 |
|
93 | .u-drag-between{
|
94 | display: flex;
|
95 | }
|
96 | .u-drag-between-horizontal{
|
97 | flex-wrap: wrap;
|
98 | } |
\ | No newline at end of file |