Mercurial > hg > dml-open-vis
diff 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 |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/DML/MainVisBundle/Resources/assets/bem-blocks/cgpma.less Tue Feb 09 20:54:02 2016 +0100 @@ -0,0 +1,256 @@ +// cgpma stands for config grid panel main area + +@import "../config.less"; + +.cgpma { + + @input-padding_h: @config-grid-panel--input-padding_left; + @input-padding_v: 3px; + @input-height: 26px; + + .cursor_std(); + + .config-grid_type_collection .config-grid-panel_dimension_entity & { + padding: @config-grid_collection--panel_entity--main-area-margin-top 0 0 @config-grid_collection--panel_entity--main-area-margin-left; + } + .config-grid_type_recording .config-grid-panel_dimension_entity & { + padding: @config-grid_recording--panel_entity--main-area-margin-top 0 0 @config-grid_recording--panel_entity--main-area-margin-left; + } + + .config-grid-panel_dimension_view & { + padding: 10px @config-grid-panel_view--main-area-margin-right 10px @config-grid-panel_view--main-area-margin-left; + } + + + // ================================== + &__explanation { + padding-left: @config-grid-panel--input-padding_left; + padding-right: @config-grid-panel--input-padding_left; + padding-bottom: 8px; + } + .config-grid_type_collection &__explanation { + color: @config-grid_collection--color_panel-label; + } + .config-grid_type_recording &__explanation { + color: @config-grid_recording--color_panel-label; + } + .config-grid-panel_dimension_entity &__explanation { + display: inline-block; + } + .config-grid_type_recording .config-grid-panel_dimension_entity &__explanation { + padding-top: 3px; + } + + // ---------------------------------- + &__explanation_for-previous-input { + .font_small(); + margin-top: -6px; + } + &__explanation_for-previous-tickbox { + .font_small(); + } + + // ---------------------------------- + &__explanation_sticked-to-left { + padding-left: 0px; + } + + // ---------------------------------- + &__explanation_second-row { + padding-top: 25px; + } + + + // ================================== + &__pseudo-link { + color: @config-grid--color_panel-label; + .cursor_action; + border-bottom: 1px dotted; + display: inline; + } + &__pseudo-link:hover { + color: @config-grid--color_panel-label-hovered; + } + + + // ================================== + &__input-block { + } + + .config-grid-panel_dimension_entity &__input-block { + display: inline-block; + padding: 0 15px 0 0; + min-width: 150px; + vertical-align: top; + } + + .config-grid-panel_dimension_view &__input-block { + margin-bottom: 10px; + } + + &__input-block_location_first-in-group { + margin-top: 20px; + } + + + // ================================== + &__label { + padding: 0 @input-padding_h 1px; + color: @config-grid--color_panel-label; + } + .config-grid_type_collection &__label { + color: @config-grid_collection--color_panel-label; + } + .config-grid_type_recording &__label { + color: @config-grid_recording--color_panel-label; + } + &__label a { + color: @config-grid--color_panel-label; + text-decoration: none; + border-bottom: 1px solid rgba(0, 0, 0, 0.1); + } + + .config-grid_type_collection &__label a { + color: @config-grid_collection--color_panel-label; + } + .config-grid_type_recording &__label a { + color: @config-grid_recording--color_panel-label; + } + + + &__label a:hover { + color: @config-grid--color_panel-label-hovered !important; + border-bottom: 1px solid rgba(0, 0, 0, 0.4); + } + + // ---------------------------------- + &__label_without-left-padding { + padding-left: 0; + } + + // ================================== + &__textfield { + border-radius: 5px; + height: @input-height - 2 * @input-padding_v; + position: relative; + border-top: @input-padding_v solid; + border-right: @input-padding_h solid; + border-bottom: @input-padding_v solid; + border-left: @input-padding_h solid; + } + .config-grid-panel_dimension_entity &__textfield { + width: 150px; + } + + &__textfield-input { + outline: none !important; + .font_standard(); + background: none; + position: relative; + width: 100%; + height: 100%; + margin: 0; + border: 0; + padding: @input-padding_v @input-padding_h; + top: -@input-padding_v; + left: -@input-padding_h; + .border-radius(@--border-radius); + } + + .cgpma__textfield_autocomplete-is-open { + .border-bottom-left-radius(0px); + .border-bottom-right-radius(0px); + } + + // ================================== + &__textfield .ui-autocomplete { + .font_standard(); + } + + // ================================== + &__tickbox { + margin-right: 15px; + padding-left: 20px; + display: inline-block; + min-height: @input-height - 4px; + padding-top: 3px; + position: relative; + } + &__tickbox_one-per-line { + display: block; + } + &__tickbox_state_enabled { + .cursor_action(); + } + + .config-grid-panel_dimension_view &__tickbox_location_first-in-group { + margin-top: 5px; + } + + &__tickbox_location_last-in-group { + margin-right: 0px; + } + + &__tickbox-tick { + position: absolute; + border-radius: 5px; + height: 15px; + width: 15px; + left: 0px; + top: 5px; + } + + &__tickbox_ticked &__tickbox-tick { + background-repeat: no-repeat; + background-position: 2px 4px; + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAHCAYAAAAxrNxjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAGlJREFUeNpi/P//PwMuwMjIKA2k1gHxFwaQQmwYCECK7gExiHMMJDABiJcCMQ+SIjkkRVeBWIIBSeAwSDEWRaIw56kD8XMkxQ+h7PMwRWCFUNUgxU+gCjAUwRVCFatArdoLxELongMIMAANx1tBwGkjIgAAAABJRU5ErkJggg=='); + } + &__tickbox_type_radio &__tickbox-tick { + border-radius: 10px; + } + &__tickbox_type_radio&__tickbox_ticked &__tickbox-tick { + // 2.5 + background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgaGVpZ2h0PSI1IiB3aWR0aD0iNSI+ICA8Y2lyY2xlIGN4PSIyLjUiIGN5PSIyLjUiIHI9IjIuNSIgZmlsbD0iYmxhY2siIC8+PC9zdmc+'); + // 3.5 + //background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgaGVpZ2h0PSI3IiB3aWR0aD0iNyI+ICA8Y2lyY2xlIGN4PSIzLjUiIGN5PSIzLjUiIHI9IjMuNSIgZmlsbD0iYmxhY2siIC8+PC9zdmc+'); + // 3 + //background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgaGVpZ2h0PSI2IiB3aWR0aD0iNiI+ICA8Y2lyY2xlIGN4PSIzIiBjeT0iMyIgcj0iMyIgZmlsbD0iYmxhY2siIC8+PC9zdmc+'); + background-position: center center; + } + + // ================================== + // background colors of all input types + .config-grid_type_collection &__textfield, + .config-grid_type_collection &__tickbox-tick { + background-color: @config-grid_collection--color_panel-input; + border-color: @config-grid_collection--color_panel-input; + } + + .config-grid_type_recording &__textfield, + .config-grid_type_recording &__tickbox-tick { + background-color: @config-grid_recording--color_panel-input; + border-color: @config-grid_recording--color_panel-input; + } + + .config-grid_type_collection &__textfield_status_modified, + .config-grid_type_collection &__tickbox_status_modified &__tickbox-tick { + background-color: @config-grid_collection--color_panel-input_modified; + border-color: @config-grid_collection--color_panel-input_modified; + } + + .config-grid_type_recording &__textfield_status_modified, + .config-grid_type_recording &__tickbox_status_modified &__tickbox-tick { + background-color: @config-grid_recording--color_panel-input_modified; + border-color: @config-grid_recording--color_panel-input_modified; + } + + .config-grid_type_collection &__textfield_status_error { + background-color: @config-grid_collection--color_panel-input_error; + border-color: @config-grid_collection--color_panel-input_error; + } + + .config-grid_type_recording &__textfield_status_error { + background-color: @config-grid_recording--color_panel-input_error; + border-color: @config-grid_recording--color_panel-input_error; + } +} \ No newline at end of file