Skip to content

Commit 8157042

Browse files
author
minjk-bl
committed
ColumnSelector module added
1 parent 29ccae8 commit 8157042

2 files changed

Lines changed: 415 additions & 0 deletions

File tree

‎css/common/component/columnSelector.css‎

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
.vp-cs-select-container {
2+
width: 100%;
3+
height: 100%;
4+
display: grid;
5+
grid-template-columns: calc(47% - 15px) 50px calc(47% - 15px);
6+
grid-auto-rows: 100%;
7+
}
8+
.vp-cs-select-search {
9+
width: 100%;
10+
}
11+
.vp-cs-select-search::after {
12+
content: '';
13+
background-image: url(../../resource/close_big.svg);
14+
}
15+
.vp-cs-select-box {
16+
width: 100%;
17+
height: 100%;
18+
border: 0.25px solid #E4E4E4;
19+
overflow-y: auto;
20+
overflow-x: hidden;
21+
}
22+
.vp-cs-select-box.left {
23+
height: calc(100% - 30px);
24+
}
25+
.vp-cs-select-item {
26+
width: 100%;
27+
height: 25px;
28+
padding: 0px 10px;
29+
border-bottom: 0.25px solid #E4E4E4;
30+
line-height: 25px;
31+
background-color: white;
32+
text-overflow: ellipsis;
33+
overflow: hidden;
34+
white-space: nowrap;
35+
}
36+
.vp-cs-select-item:hover {
37+
cursor: pointer;
38+
background-color: #E4E4E4;
39+
}
40+
.vp-cs-select-item.selected {
41+
color: var(--font-hightlight);
42+
background-color: #F5F5F5;
43+
}
44+
/* Item Sorting FIXME: change span to class */
45+
.right .vp-cs-select-item span {
46+
padding: 0px 10px 0px 0px;
47+
}
48+
/* TODO: If sortable, apply this style */
49+
/* .right .vp-cs-select-item span:hover {
50+
cursor: n-resize;
51+
} */
52+
53+
/* Select Boxes */
54+
.vp-cs-select-btn-box {
55+
margin: auto;
56+
display: inherit;
57+
}
58+
.vp-cs-select-add-btn {
59+
height: 24px;
60+
background: #FFFFFF;
61+
border: 0.25px solid #E4E4E4;
62+
}
63+
.vp-cs-select-del-btn {
64+
height: 24px;
65+
background: #FFFFFF;
66+
border: 0.25px solid #E4E4E4;
67+
margin-top: 5px;
68+
}

0 commit comments

Comments
 (0)