Commit f6d2e8fc authored by Sascha Eggenberger's avatar Sascha Eggenberger
Browse files

Issue #3306112: Style enhancements to support Layout Paragraphs 2.x

parent 190113a7

dist/css/components/layout_paragraphs_2.0.css

0 → 100644
+38 −0
Original line number Diff line number Diff line 
.lpb-controls.is-layout {

  background-color: var(--gin-color-contextual);

}



.lp-builder:not(.is-navigating) .js-lpb-component:hover,

.lp-builder:not(.is-navigating) .js-lpb-component:focus-within {

  outline: 2px solid var(--gin-color-primary);

}



.lp-builder:not(.is-navigating) .lpb-layout.js-lpb-component:hover,

.lp-builder:not(.is-navigating) .lpb-layout.js-lpb-component:focus-within {

  outline: 1px solid var(--gin-color-primary);

}



.lp-builder:not(.is-navigating) .js-lpb-component:hover .js-lpb-region:hover,

.lp-builder:not(.is-navigating) .js-lpb-component:focus-within .js-lpb-region:focus-within {

  outline: 1px dashed var(--gin-color-primary);

}



.js-lpb-component:hover .js-lpb-region,

.js-lpb-component:focus-within .js-lpb-region {

  outline: 1px dashed var(--gin-color-primary);

}



.lpb-component-list {

  padding-top: var(--gin-spacing-l);

  padding-bottom: var(--gin-spacing-l);

}



.layout-paragraphs-delete-component-form {

  padding-top: var(--gin-spacing-l);

  padding-bottom: var(--gin-spacing-s);

}



.layout-select__item input.form-boolean:checked + label.option {

  outline: 2px solid var(--gin-color-primary);

}

gin.info.yml

+2 −0
Original line number Diff line number Diff line
@@ -122,6 +122,8 @@ libraries-extend: 
    - gin/layout_paragraphs

  layout_paragraphs/layout_paragraphs_widget:

    - gin/layout_paragraphs

  layout_paragraphs/builder:

    - gin/layout_paragraphs2

  responsive_preview/drupal.responsive-preview:

    - gin/responsive_preview

gin.libraries.yml

+5 −0
Original line number Diff line number Diff line
@@ -260,6 +260,11 @@ layout_paragraphs: 
    component:

      dist/css/components/layout_paragraphs.css: { minified: false }



layout_paragraphs2:

  css:

    component:

      dist/css/components/layout_paragraphs_2.0.css: { minified: false }



entity_reference_layout:

  css:

    component:

styles/components/layout_paragraphs_2.0.scss

0 → 100644
+38 −0
Original line number Diff line number Diff line 
// Version 2.0

.lpb-controls.is-layout {

  background-color: var(--gin-color-contextual);

}



.lp-builder:not(.is-navigating) .js-lpb-component:hover,

.lp-builder:not(.is-navigating) .js-lpb-component:focus-within {

  outline: 2px solid var(--gin-color-primary);

}



.lp-builder:not(.is-navigating) .lpb-layout.js-lpb-component:hover,

.lp-builder:not(.is-navigating) .lpb-layout.js-lpb-component:focus-within {

  outline: 1px solid var(--gin-color-primary);

}



.lp-builder:not(.is-navigating) .js-lpb-component:hover .js-lpb-region:hover,

.lp-builder:not(.is-navigating) .js-lpb-component:focus-within .js-lpb-region:focus-within {

  outline: 1px dashed var(--gin-color-primary);

}



.js-lpb-component:hover .js-lpb-region,

.js-lpb-component:focus-within .js-lpb-region {

  outline: 1px dashed var(--gin-color-primary);

}



.lpb-component-list {

  padding-top: var(--gin-spacing-l);

  padding-bottom: var(--gin-spacing-l);

}



.layout-paragraphs-delete-component-form {

  padding-top: var(--gin-spacing-l);

  padding-bottom: var(--gin-spacing-s);

}



.layout-select__item input.form-boolean:checked + label.option {

  outline: 2px solid var(--gin-color-primary);

}

webpack.config.js

+1 −0
Original line number Diff line number Diff line
@@ -45,6 +45,7 @@ module.exports = { 
    'components/entity_reference_layout': ['./styles/components/entity_reference_layout.scss'],

    'components/inline_entity_form': ['./styles/components/inline_entity_form.scss'],

    'components/layout_paragraphs': ['./styles/components/layout_paragraphs.scss'],

    'components/layout_paragraphs_2.0': ['./styles/components/layout_paragraphs_2.0.scss'],

    'components/linkit': ['./styles/components/linkit.scss'],

    'components/media_library': ['./styles/components/media_library.scss'],

    'components/module_filter': ['./styles/components/module_filter.scss'],