132 lines
3.6 KiB
SCSS
132 lines
3.6 KiB
SCSS
// We don't want to allow user to remove Submit or Email + we hide core/column toolbar because it is empty
|
|
// There is no way to hide the delete button programmatically so we hide last toolbar that contains the delete option
|
|
// There is a feature request for adding that into Gutenberg https://github.com/WordPress/gutenberg/issues/16364
|
|
.mailpoet-form-submit-button,
|
|
.mailpoet-form-email-input {
|
|
.block-editor-block-toolbar > .components-toolbar-group {
|
|
display: none;
|
|
}
|
|
|
|
.block-editor-block-toolbar .components-toolbar-group {
|
|
border-right: none;
|
|
}
|
|
}
|
|
|
|
.edit-post-layout .interface-interface-skeleton__content {
|
|
background-color: $color-white;
|
|
}
|
|
|
|
// Fix for fixed bar forms
|
|
// This will prevent editor width to grow and push sidebar out of the screen
|
|
.interface-interface-skeleton__editor {
|
|
max-width: 100%;
|
|
}
|
|
|
|
// Fix for settings toolbar placement in header
|
|
.edit-post-header {
|
|
flex-direction: row-reverse;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
// Hide tabs (Blocks, Patterns, ...) in block inserter, because we don't have patterns
|
|
// They are always visible in case user adds a block in the top level
|
|
.block-editor-inserter__tabs .components-tab-panel__tabs {
|
|
display: none;
|
|
}
|
|
|
|
// Fix for default appender appearance
|
|
// We don't use any default block (WP Post editor has paragraph)
|
|
// and CSS distributed within packages is works only with the paragraph block
|
|
// We want to display it in center
|
|
.block-editor .block-editor-inserter .block-editor-button-block-appender.block-list-appender__toggle {
|
|
margin: 0 auto;
|
|
}
|
|
|
|
// Html blocks contains iframe which captures clicks and in some cases prevents selecting block.
|
|
// This adds an transparent overlay over the iframe.
|
|
.mailpoet-html-block-editor-content-wrapper {
|
|
position: relative;
|
|
|
|
&:after {
|
|
background: transparent;
|
|
content: ' ';
|
|
display: block;
|
|
height: 100%;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
// Wordpress displays h3 and h2 the same size by default. To make it less confusing we need to make h2 different size.
|
|
h2 {
|
|
font-size: 1.7em;
|
|
}
|
|
|
|
// Remove block margins for first block and also first block in columns
|
|
// This is done to improve WYSIWYG experience
|
|
.mailpoet-form-background .block-editor-block-list__block:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
// Remove min-height so that lower values of input padding have visible effect in form editor
|
|
.block-editor-block-list__layout .mailpoet_text,
|
|
.block-editor-block-list__layout .mailpoet_textarea {
|
|
min-height: 0;
|
|
// Remove box shadow on focus since we don't allow interactions with text fields in editor
|
|
&:focus {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
|
|
// Ensure same default font size for input and submit button
|
|
.block-editor-block-list__layout .mailpoet_paragraph {
|
|
.mailpoet_text,
|
|
.mailpoet_submit {
|
|
font-size: 1em;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.mailpoet_text_label {
|
|
font-size: 1em;
|
|
line-height: 1.2;
|
|
}
|
|
}
|
|
|
|
.mailpoet_toolbar_item {
|
|
align-items: center;
|
|
background-color: white;
|
|
display: flex;
|
|
|
|
.mailpoet-font-family-select {
|
|
width: $grid-column-small;
|
|
}
|
|
|
|
// Force rendering of select arrow on the right
|
|
.components-custom-select-control__button svg {
|
|
margin-right: initial;
|
|
}
|
|
}
|
|
|
|
// Adjustments for correct form width rendering
|
|
.wp-block {
|
|
max-width: initial;
|
|
}
|
|
|
|
.block-editor-block-list__layout.is-root-container {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
|
|
.edit-post-visual-editor {
|
|
background-color: $color-white;
|
|
// We use lager padding on top so that block tools toolbar doesn't hide under top bar
|
|
padding: $grid-gap-large 10px 10px;
|
|
}
|
|
|
|
// Unify padding o wp-block-columns with background with front end rendering
|
|
.wp-block-columns.has-background {
|
|
padding: 10px;
|
|
}
|