1 | .bpp-properties-group {
|
2 | position: relative;
|
3 |
|
4 | .group-header {
|
5 | display: flex;
|
6 | flex-direction: row;
|
7 | align-items: center;
|
8 | justify-content: space-between;
|
9 | padding: 10px 15px;
|
10 |
|
11 | .group-label {
|
12 | .label();
|
13 |
|
14 | font-size: 16px;
|
15 | }
|
16 | }
|
17 |
|
18 | > .bpp-properties-entry {
|
19 | padding-left: 15px;
|
20 | padding-right: 15px;
|
21 |
|
22 | &:last-child {
|
23 | margin-bottom: 6px;
|
24 | }
|
25 | }
|
26 |
|
27 | &:empty {
|
28 | display: none;
|
29 | }
|
30 |
|
31 | > .group-toggle {
|
32 | position: absolute;
|
33 | top: 0;
|
34 | left: 0;
|
35 | bottom: 0;
|
36 | width: 4px;
|
37 | &:hover {
|
38 | background-color: @bpp-group-toggle-hover-color;
|
39 | }
|
40 | }
|
41 |
|
42 | &:hover > .group-toggle {
|
43 | background-color: @bpp-group-toggle-color;
|
44 | &:hover {
|
45 | background-color: @bpp-group-toggle-hover-color;
|
46 | }
|
47 | }
|
48 |
|
49 | &.group-closed {
|
50 | border-top: none;
|
51 |
|
52 | > .group-toggle {
|
53 | background-color: @bpp-group-toggle-color;
|
54 | }
|
55 |
|
56 | &:hover > .group-toggle {
|
57 | background-color: @bpp-group-toggle-hover-color;
|
58 | }
|
59 |
|
60 | > div:not(.group-header) {
|
61 | display: none;
|
62 | }
|
63 |
|
64 | .group-label {
|
65 | margin-bottom: 5px;
|
66 | }
|
67 | }
|
68 |
|
69 | + .bpp-properties-group {
|
70 | border-top: 1px solid @bpp-group-border-color;
|
71 | }
|
72 |
|
73 | &:last-child {
|
74 | padding-bottom: 9px;
|
75 | }
|
76 |
|
77 | .group__dropdown {
|
78 | position: relative;
|
79 | justify-self: flex-end;
|
80 | }
|
81 |
|
82 | .group__dropdown-button {
|
83 | width: 26px;
|
84 | height: 26px;
|
85 | text-align: center;
|
86 | border: none;
|
87 | background-color: transparent;
|
88 | color: @bpp-color-666666;
|
89 | outline: none;
|
90 |
|
91 | display: flex;
|
92 | justify-content: center;
|
93 | align-items: center;
|
94 | }
|
95 |
|
96 | .group__dropdown--open .group__dropdown-button,
|
97 | .group__dropdown-button:hover {
|
98 | background-color: @silver-darken-80;
|
99 | }
|
100 |
|
101 | .group__dropdown-menu {
|
102 | position: absolute;
|
103 | top: 30px;
|
104 | right: 0;
|
105 | z-index: 10000;
|
106 | }
|
107 |
|
108 | .group__dropdown:not(.group__dropdown--open) .group__dropdown-menu {
|
109 | display: none;
|
110 | }
|
111 |
|
112 | .group__dropdown-button {
|
113 | border-radius: 100%;
|
114 | }
|
115 |
|
116 | .group__dropdown-menu {
|
117 | background-color: @bpp-color-ffffff;
|
118 |
|
119 | border: solid 1px @silver-darken-80;
|
120 | border-radius: 3px;
|
121 |
|
122 | padding: 4px 0 4px 0;
|
123 |
|
124 | box-shadow: 0 1px 4px 0 @bpp-color-000000-opacity-10;
|
125 | }
|
126 |
|
127 | .group__dropdown-menu-item {
|
128 | padding: 8px 16px;
|
129 | }
|
130 |
|
131 | .group__dropdown-menu-item:hover {
|
132 | background-color: @silver-darken-80;
|
133 | }
|
134 | }
|