React-samples/src/treeview/drag-and-drop.css at master · SyncfusionExamples/React-samples · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
    #list {
        min-height: 288px;
    }
	.e-bigger #list, .e-bigger #tree1, .e-bigger #tree2 {
		height: 354px;
        overflow: auto;
	}
    .tree1-data, .tree2-data, .tree3-data {
        padding: 15px;
        margin-bottom: 25px;
    }
    #tree1, #tree2, #list {
        height: 300px;
        overflow: auto;
    }
    .content {
        margin: 0 auto;
        border: 1px solid #dddddd;
        border-radius: 3px;
        min-height: 288px;
    }
    .custom-delete::before {
        content: "";
        cursor: pointer;
        color: rgba(0, 0, 0, 0.54);
        font-size: 15px;
    }
    .custom-delete {
        float: right;
        font-family: 'e-icons';
    }
    .fabric.e-bigger #list.e-listview .e-list-item,
    .highcontrast.e-bigger #list.e-listview .e-list-item {
        line-height: 43px;
    }
    .material.e-bigger #list.e-listview .e-list-item {
        line-height: 48px;
    }
    .bootstrap.e-bigger #list.e-listview .e-list-item {
        line-height: 47px;
    }
    .highcontrast .custom-delete::before {
        color: #fff;
    }
    .highcontrast .e-active.e-list-item .custom-delete::before {
	    color: #000;
	}
    #overlay {
        position: absolute;
        display: block;
        width: 100%;
        height: 100%;
        z-index: 2;
        cursor: pointer;
        background-image: url('src/images/useCase/drag-and-drop.png');
        background-repeat: no-repeat;
        background-position: center;
        background-size: 70%;
    }
    #imageContent {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
    }
    .custom-tree {
        overflow: auto;
    }
    .custom-tree .control-wrapper {
        position: relative;
        min-width: 700px;
        min-height: 400px;
        overflow: auto;
    }
    @media (max-width: 1200px) {
        .tree1-data, .tree2-data, .tree3-data {
            width: 33.33333333%;
            float: left;
        }
    }