comparison src/DML/MainVisBundle/Resources/assets/bem-blocks/cgpma.less @ 0:493bcb69166c

added public content
author Daniel Wolff
date Tue, 09 Feb 2016 20:54:02 +0100
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:493bcb69166c
1 // cgpma stands for config grid panel main area
2
3 @import "../config.less";
4
5 .cgpma {
6
7 @input-padding_h: @config-grid-panel--input-padding_left;
8 @input-padding_v: 3px;
9 @input-height: 26px;
10
11 .cursor_std();
12
13 .config-grid_type_collection .config-grid-panel_dimension_entity & {
14 padding: @config-grid_collection--panel_entity--main-area-margin-top 0 0 @config-grid_collection--panel_entity--main-area-margin-left;
15 }
16 .config-grid_type_recording .config-grid-panel_dimension_entity & {
17 padding: @config-grid_recording--panel_entity--main-area-margin-top 0 0 @config-grid_recording--panel_entity--main-area-margin-left;
18 }
19
20 .config-grid-panel_dimension_view & {
21 padding: 10px @config-grid-panel_view--main-area-margin-right 10px @config-grid-panel_view--main-area-margin-left;
22 }
23
24
25 // ==================================
26 &__explanation {
27 padding-left: @config-grid-panel--input-padding_left;
28 padding-right: @config-grid-panel--input-padding_left;
29 padding-bottom: 8px;
30 }
31 .config-grid_type_collection &__explanation {
32 color: @config-grid_collection--color_panel-label;
33 }
34 .config-grid_type_recording &__explanation {
35 color: @config-grid_recording--color_panel-label;
36 }
37 .config-grid-panel_dimension_entity &__explanation {
38 display: inline-block;
39 }
40 .config-grid_type_recording .config-grid-panel_dimension_entity &__explanation {
41 padding-top: 3px;
42 }
43
44 // ----------------------------------
45 &__explanation_for-previous-input {
46 .font_small();
47 margin-top: -6px;
48 }
49 &__explanation_for-previous-tickbox {
50 .font_small();
51 }
52
53 // ----------------------------------
54 &__explanation_sticked-to-left {
55 padding-left: 0px;
56 }
57
58 // ----------------------------------
59 &__explanation_second-row {
60 padding-top: 25px;
61 }
62
63
64 // ==================================
65 &__pseudo-link {
66 color: @config-grid--color_panel-label;
67 .cursor_action;
68 border-bottom: 1px dotted;
69 display: inline;
70 }
71 &__pseudo-link:hover {
72 color: @config-grid--color_panel-label-hovered;
73 }
74
75
76 // ==================================
77 &__input-block {
78 }
79
80 .config-grid-panel_dimension_entity &__input-block {
81 display: inline-block;
82 padding: 0 15px 0 0;
83 min-width: 150px;
84 vertical-align: top;
85 }
86
87 .config-grid-panel_dimension_view &__input-block {
88 margin-bottom: 10px;
89 }
90
91 &__input-block_location_first-in-group {
92 margin-top: 20px;
93 }
94
95
96 // ==================================
97 &__label {
98 padding: 0 @input-padding_h 1px;
99 color: @config-grid--color_panel-label;
100 }
101 .config-grid_type_collection &__label {
102 color: @config-grid_collection--color_panel-label;
103 }
104 .config-grid_type_recording &__label {
105 color: @config-grid_recording--color_panel-label;
106 }
107 &__label a {
108 color: @config-grid--color_panel-label;
109 text-decoration: none;
110 border-bottom: 1px solid rgba(0, 0, 0, 0.1);
111 }
112
113 .config-grid_type_collection &__label a {
114 color: @config-grid_collection--color_panel-label;
115 }
116 .config-grid_type_recording &__label a {
117 color: @config-grid_recording--color_panel-label;
118 }
119
120
121 &__label a:hover {
122 color: @config-grid--color_panel-label-hovered !important;
123 border-bottom: 1px solid rgba(0, 0, 0, 0.4);
124 }
125
126 // ----------------------------------
127 &__label_without-left-padding {
128 padding-left: 0;
129 }
130
131 // ==================================
132 &__textfield {
133 border-radius: 5px;
134 height: @input-height - 2 * @input-padding_v;
135 position: relative;
136 border-top: @input-padding_v solid;
137 border-right: @input-padding_h solid;
138 border-bottom: @input-padding_v solid;
139 border-left: @input-padding_h solid;
140 }
141 .config-grid-panel_dimension_entity &__textfield {
142 width: 150px;
143 }
144
145 &__textfield-input {
146 outline: none !important;
147 .font_standard();
148 background: none;
149 position: relative;
150 width: 100%;
151 height: 100%;
152 margin: 0;
153 border: 0;
154 padding: @input-padding_v @input-padding_h;
155 top: -@input-padding_v;
156 left: -@input-padding_h;
157 .border-radius(@--border-radius);
158 }
159
160 .cgpma__textfield_autocomplete-is-open {
161 .border-bottom-left-radius(0px);
162 .border-bottom-right-radius(0px);
163 }
164
165 // ==================================
166 &__textfield .ui-autocomplete {
167 .font_standard();
168 }
169
170 // ==================================
171 &__tickbox {
172 margin-right: 15px;
173 padding-left: 20px;
174 display: inline-block;
175 min-height: @input-height - 4px;
176 padding-top: 3px;
177 position: relative;
178 }
179 &__tickbox_one-per-line {
180 display: block;
181 }
182 &__tickbox_state_enabled {
183 .cursor_action();
184 }
185
186 .config-grid-panel_dimension_view &__tickbox_location_first-in-group {
187 margin-top: 5px;
188 }
189
190 &__tickbox_location_last-in-group {
191 margin-right: 0px;
192 }
193
194 &__tickbox-tick {
195 position: absolute;
196 border-radius: 5px;
197 height: 15px;
198 width: 15px;
199 left: 0px;
200 top: 5px;
201 }
202
203 &__tickbox_ticked &__tickbox-tick {
204 background-repeat: no-repeat;
205 background-position: 2px 4px;
206 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAHCAYAAAAxrNxjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAGlJREFUeNpi/P//PwMuwMjIKA2k1gHxFwaQQmwYCECK7gExiHMMJDABiJcCMQ+SIjkkRVeBWIIBSeAwSDEWRaIw56kD8XMkxQ+h7PMwRWCFUNUgxU+gCjAUwRVCFatArdoLxELongMIMAANx1tBwGkjIgAAAABJRU5ErkJggg==');
207 }
208 &__tickbox_type_radio &__tickbox-tick {
209 border-radius: 10px;
210 }
211 &__tickbox_type_radio&__tickbox_ticked &__tickbox-tick {
212 // 2.5
213 background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgaGVpZ2h0PSI1IiB3aWR0aD0iNSI+ICA8Y2lyY2xlIGN4PSIyLjUiIGN5PSIyLjUiIHI9IjIuNSIgZmlsbD0iYmxhY2siIC8+PC9zdmc+');
214 // 3.5
215 //background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgaGVpZ2h0PSI3IiB3aWR0aD0iNyI+ICA8Y2lyY2xlIGN4PSIzLjUiIGN5PSIzLjUiIHI9IjMuNSIgZmlsbD0iYmxhY2siIC8+PC9zdmc+');
216 // 3
217 //background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgaGVpZ2h0PSI2IiB3aWR0aD0iNiI+ICA8Y2lyY2xlIGN4PSIzIiBjeT0iMyIgcj0iMyIgZmlsbD0iYmxhY2siIC8+PC9zdmc+');
218 background-position: center center;
219 }
220
221 // ==================================
222 // background colors of all input types
223 .config-grid_type_collection &__textfield,
224 .config-grid_type_collection &__tickbox-tick {
225 background-color: @config-grid_collection--color_panel-input;
226 border-color: @config-grid_collection--color_panel-input;
227 }
228
229 .config-grid_type_recording &__textfield,
230 .config-grid_type_recording &__tickbox-tick {
231 background-color: @config-grid_recording--color_panel-input;
232 border-color: @config-grid_recording--color_panel-input;
233 }
234
235 .config-grid_type_collection &__textfield_status_modified,
236 .config-grid_type_collection &__tickbox_status_modified &__tickbox-tick {
237 background-color: @config-grid_collection--color_panel-input_modified;
238 border-color: @config-grid_collection--color_panel-input_modified;
239 }
240
241 .config-grid_type_recording &__textfield_status_modified,
242 .config-grid_type_recording &__tickbox_status_modified &__tickbox-tick {
243 background-color: @config-grid_recording--color_panel-input_modified;
244 border-color: @config-grid_recording--color_panel-input_modified;
245 }
246
247 .config-grid_type_collection &__textfield_status_error {
248 background-color: @config-grid_collection--color_panel-input_error;
249 border-color: @config-grid_collection--color_panel-input_error;
250 }
251
252 .config-grid_type_recording &__textfield_status_error {
253 background-color: @config-grid_recording--color_panel-input_error;
254 border-color: @config-grid_recording--color_panel-input_error;
255 }
256 }