-.add-section {
+.new-section {
+ background-color: #f7f7f7;
width: 100%;
outline: 2px dashed #979797;
padding: 1.5em 0;
transition: visually-hidden 2s ease-out, height 2s ease-in;
}
+.new-section__link,
+.new-block__link {
+ color: #787878;
+ border-bottom: none;
+ padding-left: 24px;
+ background: url(../../../misc/icons/787878/plus.svg) transparent top left / 16px 16px no-repeat;
+}
+
+.new-section__link:hover,
+.new-section__link:active,
+.new-section__link:focus,
+.new-block__link:hover,
+.new-block__link:active,
+.new-block__link:focus {
+ border-bottom-style: none;
+ color: #000;
+}
+
.layout-section {
margin-bottom: 1.5em;
}
+.layout-section .ui-sortable-helper {
+ background-color: #fff;
+ outline: 2px solid #f7f7f7;
+}
+
+.layout-section .ui-state-drop {
+ background-color: #ffd;
+ outline: 2px dashed #fedb60;
+ margin: 20px;
+ padding: 30px;
+}
+
.layout-section .layout-builder--layout__region {
outline: 2px dashed #2f91da;
- padding: 1.5em 0;
}
-.layout-section .layout-builder--layout__region .add-block {
+.layout-section .layout-builder--layout__region .new-block {
+ background-color: #eff6fc;
+ padding: 1.5em 0;
text-align: center;
}
+.layout-section .layout-builder--layout__region .block {
+ padding: 1.5em;
+}
+
.layout-section .remove-section {
position: relative;
background: url(../../../misc/icons/bebebe/ex.svg) #fff center center / 16px 16px no-repeat;
display: block;
padding-top: 0.55em;
}
+
+#drupal-off-canvas .inline-block-create-button {
+ display: block;
+ padding: 24px;
+ padding-left: 44px;
+ font-size: 16px;
+ color: #eee;
+ background: url(../../../misc/icons/bebebe/plus.svg) transparent 16px no-repeat;
+}
+
+#drupal-off-canvas .inline-block-create-button,
+#drupal-off-canvas .inline-block-list__item {
+ margin: 0 -20px;
+ background-color: #444;
+}
+
+#drupal-off-canvas .inline-block-create-button:hover,
+#drupal-off-canvas .inline-block-list__item:hover {
+ background-color: #333;
+}
+
+#drupal-off-canvas .inline-block-list {
+ margin-bottom: 15px;
+}
+
+#drupal-off-canvas .inline-block-list__item {
+ display: block;
+ padding: 15px 0 15px 25px;
+}