first commit
This commit is contained in:
+86
@@ -0,0 +1,86 @@
|
||||
/**
|
||||
* WordPress dependencies
|
||||
*/
|
||||
|
||||
const {
|
||||
__,
|
||||
} = wp.i18n;
|
||||
|
||||
const {
|
||||
Component,
|
||||
} = wp.element;
|
||||
|
||||
const {
|
||||
Icon,
|
||||
Toolbar,
|
||||
DropdownMenu,
|
||||
} = wp.components;
|
||||
|
||||
|
||||
/**
|
||||
* Component
|
||||
*/
|
||||
export default class ExtendAlignmentToolbar extends Component {
|
||||
constructor() {
|
||||
super( ...arguments );
|
||||
}
|
||||
|
||||
render() {
|
||||
const DEFAULT_ALIGNMENT_CONTROLS = [
|
||||
{
|
||||
icon: <Icon icon="editor-textcolor" />,
|
||||
title: __( 'Default Align Text' ),
|
||||
align: 'default',
|
||||
},
|
||||
{
|
||||
icon: <Icon icon="editor-alignleft" />,
|
||||
title: __( 'Align Text Left' ),
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
icon: <Icon icon="editor-aligncenter" />,
|
||||
title: __( 'Align Text Center' ),
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
icon: <Icon icon="editor-alignright" />,
|
||||
title: __( 'Align Text Right' ),
|
||||
align: 'right',
|
||||
},
|
||||
];
|
||||
|
||||
const {
|
||||
value,
|
||||
onChange,
|
||||
alignmentControls = DEFAULT_ALIGNMENT_CONTROLS,
|
||||
} = this.props;
|
||||
|
||||
function applyOrUnset( align ) {
|
||||
return () => onChange( value === align ? undefined : align );
|
||||
}
|
||||
|
||||
const activeAlignment = alignmentControls.find( function( control ) {
|
||||
return ( value === control.align || ( 'default' === control.align && ( 'none' === value || 'default' === value || ! value ) ) );
|
||||
} );
|
||||
|
||||
return (
|
||||
<Toolbar>
|
||||
<DropdownMenu
|
||||
icon={ activeAlignment ? activeAlignment.icon : <Icon icon="editor-textcolor" /> }
|
||||
label={ activeAlignment ? activeAlignment.title : __( 'Change text alignment' ) }
|
||||
controls={ alignmentControls.map( ( control ) => {
|
||||
const { align } = control;
|
||||
|
||||
const isActive = ( value === align || ( 'default' === align && ( 'none' === value || 'default' === value || ! value ) ) );
|
||||
|
||||
return {
|
||||
...control,
|
||||
isActive,
|
||||
onClick: applyOrUnset( align ),
|
||||
};
|
||||
} ) }
|
||||
/>
|
||||
</Toolbar>
|
||||
);
|
||||
}
|
||||
}
|
||||
+17
@@ -0,0 +1,17 @@
|
||||
/**
|
||||
* All of the CSS for your block editor functionality should be
|
||||
* included in this file.
|
||||
*/
|
||||
/*--------------------------------------------------------------*/
|
||||
.cnvs-block-section-heading .cnvs-section-title:before {
|
||||
z-index: initial !important;
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading .cnvs-section-title > .cnvs-section-plain {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading .cnvs-section-plain {
|
||||
display: inline-block;
|
||||
min-width: 5px;
|
||||
}
|
||||
+17
@@ -0,0 +1,17 @@
|
||||
/**
|
||||
* All of the CSS for your block editor functionality should be
|
||||
* included in this file.
|
||||
*/
|
||||
/*--------------------------------------------------------------*/
|
||||
.cnvs-block-section-heading .cnvs-section-title:before {
|
||||
z-index: initial !important;
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading .cnvs-section-title > .cnvs-section-plain {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading .cnvs-section-plain {
|
||||
display: inline-block;
|
||||
min-width: 5px;
|
||||
}
|
||||
+778
@@ -0,0 +1,778 @@
|
||||
/**
|
||||
* All of the CSS for your block editor functionality should be
|
||||
* included in this file.
|
||||
*/
|
||||
/**
|
||||
* Environment for all styles (variables, additions, etc).
|
||||
*/
|
||||
/*--------------------------------------------------------------*/
|
||||
/*--------------------------------------------------------------*/
|
||||
.cnvs-block-section-heading {
|
||||
--cnvs-section-heading-color: #000000;
|
||||
--cnvs-section-heading-border-color: #e9ecef;
|
||||
--cnvs-section-heading-icon-color: #000000;
|
||||
--cnvs-section-heading-accent-block-backround: #000000;
|
||||
--cnvs-section-heading-accent-block-color: #FFFFFF;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------*/
|
||||
.cnvs-block-section-heading {
|
||||
width: 100%;
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading .cnvs-section-title {
|
||||
display: -webkit-inline-box;
|
||||
display: -ms-inline-flexbox;
|
||||
display: inline-flex;
|
||||
color: var(--cnvs-section-heading-color);
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading .cnvs-section-title > span {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading.haligncenter {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading.halignright {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-2,
|
||||
.section-heading-default-style-2 .is-style-cnvs-block-section-heading-default {
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-3,
|
||||
.section-heading-default-style-3 .is-style-cnvs-block-section-heading-default {
|
||||
border-bottom: 4px solid var(--cnvs-section-heading-border-color);
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4 .cnvs-section-title,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4:after,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 0 0 1em;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4:after,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default:after {
|
||||
margin: 0 1em 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.haligncenter,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.haligncenter:before, .is-style-cnvs-block-section-heading-4.haligncenter:after,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.haligncenter:before,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 0 0 1em;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.haligncenter:after,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
margin: 0 1em 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.halignright,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.halignright:before,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 0 0 1em;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.halignright:before,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.halignright:after,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.halignright:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5 .cnvs-section-title,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5:after,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default:after {
|
||||
content: '';
|
||||
border-top: 4px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 0 0 1em;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5:after,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default:after {
|
||||
margin: 0 1em 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.haligncenter,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.haligncenter:before, .is-style-cnvs-block-section-heading-5.haligncenter:after,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.haligncenter:before,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
content: '';
|
||||
border-top: 4px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 0 0 1em;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.haligncenter:after,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
margin: 0 1em 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.halignright,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.halignright:before,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
content: '';
|
||||
border-top: 4px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 0 0 1em;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.halignright:before,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.halignright:after,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.halignright:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-6,
|
||||
.section-heading-default-style-6 .is-style-cnvs-block-section-heading-default {
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding-top: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-7,
|
||||
.section-heading-default-style-7 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-7 .cnvs-section-title,
|
||||
.section-heading-default-style-7 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-7.haligncenter,
|
||||
.section-heading-default-style-7 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-7.halignright,
|
||||
.section-heading-default-style-7 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8 .cnvs-section-title,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
border-left: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding: 0.125rem 0 0.125rem 1em;
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8:after,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.haligncenter,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.haligncenter:before, .is-style-cnvs-block-section-heading-8.haligncenter:after,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.haligncenter:before,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.haligncenter .cnvs-section-title,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.haligncenter .cnvs-section-title {
|
||||
border-right: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-left: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding-right: 1em;
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.halignright,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.halignright:before,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.halignright .cnvs-section-title,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.halignright .cnvs-section-title {
|
||||
border-right: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-left: none;
|
||||
padding-right: 1em;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.halignright:after,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.halignright:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9 .cnvs-section-title,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
position: relative;
|
||||
padding-right: 1.75em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9 .cnvs-section-title:before,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default .cnvs-section-title:before {
|
||||
content: '';
|
||||
margin-left: 0.5em;
|
||||
height: calc(0.875em + 2px);
|
||||
width: 2px;
|
||||
background: var(--cnvs-section-heading-icon-color);
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0.4375em;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9 .cnvs-section-title:after,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default .cnvs-section-title:after {
|
||||
content: '';
|
||||
height: 2px;
|
||||
width: calc(0.875em + 2px);
|
||||
right: 0;
|
||||
position: absolute;
|
||||
background: var(--cnvs-section-heading-icon-color);
|
||||
top: 50%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9.haligncenter,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9.halignright,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-10,
|
||||
.section-heading-default-style-10 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-10 .cnvs-section-title,
|
||||
.section-heading-default-style-10 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
position: relative;
|
||||
padding: 0.5em 1em;
|
||||
color: var(--cnvs-section-heading-accent-block-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-10 .cnvs-section-title:before,
|
||||
.section-heading-default-style-10 .is-style-cnvs-block-section-heading-default .cnvs-section-title:before {
|
||||
position: absolute;
|
||||
background-color: var(--cnvs-section-heading-accent-block-backround);
|
||||
-webkit-transform: skew(-15deg);
|
||||
transform: skew(-15deg);
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-10.haligncenter,
|
||||
.section-heading-default-style-10 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-10.halignright,
|
||||
.section-heading-default-style-10 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11 .cnvs-section-title,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
position: relative;
|
||||
color: var(--cnvs-section-heading-accent-block-color);
|
||||
padding: 0.5em 1em;
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11 .cnvs-section-title:before,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default .cnvs-section-title:before {
|
||||
position: absolute;
|
||||
background-color: var(--cnvs-section-heading-accent-block-backround);
|
||||
-webkit-transform: skew(-15deg);
|
||||
transform: skew(-15deg);
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11:after,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 0 0 1em;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11:after,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default:after {
|
||||
margin: 0 1em 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.haligncenter,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.haligncenter:before, .is-style-cnvs-block-section-heading-11.haligncenter:after,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.haligncenter:before,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 0 0 1em;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.haligncenter:after,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
margin: 0 1em 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.halignright,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.halignright:before,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 0 0 1em;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.halignright:before,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.halignright:after,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.halignright:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-12,
|
||||
.section-heading-default-style-12 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-12 .cnvs-section-title,
|
||||
.section-heading-default-style-12 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
background-color: var(--cnvs-section-heading-accent-block-backround);
|
||||
padding: 0.75rem 1rem;
|
||||
color: var(--cnvs-section-heading-accent-block-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-12.haligncenter,
|
||||
.section-heading-default-style-12 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-12.halignright,
|
||||
.section-heading-default-style-12 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-13,
|
||||
.section-heading-default-style-13 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-13 .cnvs-section-title,
|
||||
.section-heading-default-style-13 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
border: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding: 0.75rem 1rem;
|
||||
color: var(--cnvs-section-heading-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-13.haligncenter,
|
||||
.section-heading-default-style-13 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-13.halignright,
|
||||
.section-heading-default-style-13 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-14,
|
||||
.section-heading-default-style-14 .is-style-cnvs-block-section-heading-default {
|
||||
background-color: var(--cnvs-section-heading-accent-block-backround);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-14 .cnvs-section-title,
|
||||
.section-heading-default-style-14 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
display: inline-block;
|
||||
padding: 0.75rem 1rem;
|
||||
color: var(--cnvs-section-heading-accent-block-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-15,
|
||||
.section-heading-default-style-15 .is-style-cnvs-block-section-heading-default {
|
||||
border: 1px solid var(--cnvs-section-heading-border-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-15 .cnvs-section-title,
|
||||
.section-heading-default-style-15 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
display: inline-block;
|
||||
padding: 0.75rem 1rem;
|
||||
color: var(--cnvs-section-heading-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16 .cnvs-section-title,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
border-left: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding: 0.125rem 0 0.125rem 1em;
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16:after,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
height: 0.25rem;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.haligncenter,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.haligncenter:before, .is-style-cnvs-block-section-heading-16.haligncenter:after,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.haligncenter:before,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
height: 0.25rem;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.haligncenter .cnvs-section-title,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.haligncenter .cnvs-section-title {
|
||||
border-right: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-left: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding-right: 1em;
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.halignright,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.halignright:before,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
height: 0.25rem;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.halignright .cnvs-section-title,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.halignright .cnvs-section-title {
|
||||
border-right: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-left: none;
|
||||
padding-right: 1em;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.halignright:after,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.halignright:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17 .cnvs-section-title,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17 .cnvs-section-title:not([contenteditable="true"]),
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default .cnvs-section-title:not([contenteditable="true"]) {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17 .cnvs-section-title:after,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default .cnvs-section-title:after {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 0;
|
||||
display: block;
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
width: 100%;
|
||||
max-width: 30%;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17.haligncenter .cnvs-section-title:after,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default.haligncenter .cnvs-section-title:after {
|
||||
right: 50%;
|
||||
-webkit-transform: translate(50%, 0);
|
||||
transform: translate(50%, 0);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17.halignright .cnvs-section-title:after,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default.halignright .cnvs-section-title:after {
|
||||
right: auto;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17.haligncenter,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17.halignright,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
@@ -0,0 +1,778 @@
|
||||
/**
|
||||
* All of the CSS for your block editor functionality should be
|
||||
* included in this file.
|
||||
*/
|
||||
/**
|
||||
* Environment for all styles (variables, additions, etc).
|
||||
*/
|
||||
/*--------------------------------------------------------------*/
|
||||
/*--------------------------------------------------------------*/
|
||||
.cnvs-block-section-heading {
|
||||
--cnvs-section-heading-color: #000000;
|
||||
--cnvs-section-heading-border-color: #e9ecef;
|
||||
--cnvs-section-heading-icon-color: #000000;
|
||||
--cnvs-section-heading-accent-block-backround: #000000;
|
||||
--cnvs-section-heading-accent-block-color: #FFFFFF;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------*/
|
||||
.cnvs-block-section-heading {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading .cnvs-section-title {
|
||||
display: -webkit-inline-box;
|
||||
display: -ms-inline-flexbox;
|
||||
display: inline-flex;
|
||||
color: var(--cnvs-section-heading-color);
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading .cnvs-section-title > span {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading.haligncenter {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.cnvs-block-section-heading.halignright {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-2,
|
||||
.section-heading-default-style-2 .is-style-cnvs-block-section-heading-default {
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-3,
|
||||
.section-heading-default-style-3 .is-style-cnvs-block-section-heading-default {
|
||||
border-bottom: 4px solid var(--cnvs-section-heading-border-color);
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4 .cnvs-section-title,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4:after,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 1em 0 0;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4:after,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default:after {
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.haligncenter,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.haligncenter:before, .is-style-cnvs-block-section-heading-4.haligncenter:after,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.haligncenter:before,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 1em 0 0;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.haligncenter:after,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.halignright,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.halignright:before,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 1em 0 0;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.halignright:before,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
margin: 0 1em 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-4.halignright:after,
|
||||
.section-heading-default-style-4 .is-style-cnvs-block-section-heading-default.halignright:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5 .cnvs-section-title,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5:after,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default:after {
|
||||
content: '';
|
||||
border-top: 4px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 1em 0 0;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5:after,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default:after {
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.haligncenter,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.haligncenter:before, .is-style-cnvs-block-section-heading-5.haligncenter:after,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.haligncenter:before,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
content: '';
|
||||
border-top: 4px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 1em 0 0;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.haligncenter:after,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.halignright,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.halignright:before,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
content: '';
|
||||
border-top: 4px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 1em 0 0;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.halignright:before,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
margin: 0 1em 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-5.halignright:after,
|
||||
.section-heading-default-style-5 .is-style-cnvs-block-section-heading-default.halignright:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-6,
|
||||
.section-heading-default-style-6 .is-style-cnvs-block-section-heading-default {
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding-top: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-7,
|
||||
.section-heading-default-style-7 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-7 .cnvs-section-title,
|
||||
.section-heading-default-style-7 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-7.haligncenter,
|
||||
.section-heading-default-style-7 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-7.halignright,
|
||||
.section-heading-default-style-7 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8 .cnvs-section-title,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
border-right: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding: 0.125rem 1em 0.125rem 0;
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8:after,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.haligncenter,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.haligncenter:before, .is-style-cnvs-block-section-heading-8.haligncenter:after,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.haligncenter:before,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.haligncenter .cnvs-section-title,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.haligncenter .cnvs-section-title {
|
||||
border-left: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-right: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.halignright,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.halignright:before,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.halignright .cnvs-section-title,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.halignright .cnvs-section-title {
|
||||
border-left: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-right: none;
|
||||
padding-left: 1em;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-8.halignright:after,
|
||||
.section-heading-default-style-8 .is-style-cnvs-block-section-heading-default.halignright:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9 .cnvs-section-title,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
position: relative;
|
||||
padding-left: 1.75em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9 .cnvs-section-title:before,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default .cnvs-section-title:before {
|
||||
content: '';
|
||||
margin-right: 0.5em;
|
||||
height: calc(0.875em + 2px);
|
||||
width: 2px;
|
||||
background: var(--cnvs-section-heading-icon-color);
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0.4375em;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9 .cnvs-section-title:after,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default .cnvs-section-title:after {
|
||||
content: '';
|
||||
height: 2px;
|
||||
width: calc(0.875em + 2px);
|
||||
left: 0;
|
||||
position: absolute;
|
||||
background: var(--cnvs-section-heading-icon-color);
|
||||
top: 50%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9.haligncenter,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-9.halignright,
|
||||
.section-heading-default-style-9 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-10,
|
||||
.section-heading-default-style-10 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-10 .cnvs-section-title,
|
||||
.section-heading-default-style-10 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
position: relative;
|
||||
padding: 0.5em 1em;
|
||||
color: var(--cnvs-section-heading-accent-block-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-10 .cnvs-section-title:before,
|
||||
.section-heading-default-style-10 .is-style-cnvs-block-section-heading-default .cnvs-section-title:before {
|
||||
position: absolute;
|
||||
background-color: var(--cnvs-section-heading-accent-block-backround);
|
||||
-webkit-transform: skew(-15deg);
|
||||
transform: skew(-15deg);
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-10.haligncenter,
|
||||
.section-heading-default-style-10 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-10.halignright,
|
||||
.section-heading-default-style-10 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11 .cnvs-section-title,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
position: relative;
|
||||
color: var(--cnvs-section-heading-accent-block-color);
|
||||
padding: 0.5em 1em;
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11 .cnvs-section-title:before,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default .cnvs-section-title:before {
|
||||
position: absolute;
|
||||
background-color: var(--cnvs-section-heading-accent-block-backround);
|
||||
-webkit-transform: skew(-15deg);
|
||||
transform: skew(-15deg);
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11:after,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 1em 0 0;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11:after,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default:after {
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.haligncenter,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.haligncenter:before, .is-style-cnvs-block-section-heading-11.haligncenter:after,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.haligncenter:before,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 1em 0 0;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.haligncenter:after,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.halignright,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.halignright:before,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
margin: 0 1em 0 0;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 1em;
|
||||
flex: 1 0 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.halignright:before,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
margin: 0 1em 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-11.halignright:after,
|
||||
.section-heading-default-style-11 .is-style-cnvs-block-section-heading-default.halignright:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-12,
|
||||
.section-heading-default-style-12 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-12 .cnvs-section-title,
|
||||
.section-heading-default-style-12 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
background-color: var(--cnvs-section-heading-accent-block-backround);
|
||||
padding: 0.75rem 1rem;
|
||||
color: var(--cnvs-section-heading-accent-block-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-12.haligncenter,
|
||||
.section-heading-default-style-12 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-12.halignright,
|
||||
.section-heading-default-style-12 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-13,
|
||||
.section-heading-default-style-13 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-13 .cnvs-section-title,
|
||||
.section-heading-default-style-13 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
border: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding: 0.75rem 1rem;
|
||||
color: var(--cnvs-section-heading-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-13.haligncenter,
|
||||
.section-heading-default-style-13 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-13.halignright,
|
||||
.section-heading-default-style-13 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-14,
|
||||
.section-heading-default-style-14 .is-style-cnvs-block-section-heading-default {
|
||||
background-color: var(--cnvs-section-heading-accent-block-backround);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-14 .cnvs-section-title,
|
||||
.section-heading-default-style-14 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
display: inline-block;
|
||||
padding: 0.75rem 1rem;
|
||||
color: var(--cnvs-section-heading-accent-block-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-15,
|
||||
.section-heading-default-style-15 .is-style-cnvs-block-section-heading-default {
|
||||
border: 1px solid var(--cnvs-section-heading-border-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-15 .cnvs-section-title,
|
||||
.section-heading-default-style-15 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
display: inline-block;
|
||||
padding: 0.75rem 1rem;
|
||||
color: var(--cnvs-section-heading-color);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16 .cnvs-section-title,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
border-right: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding: 0.125rem 1em 0.125rem 0;
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16:after,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
height: 0.25rem;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.haligncenter,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.haligncenter:before, .is-style-cnvs-block-section-heading-16.haligncenter:after,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.haligncenter:before,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.haligncenter:after {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
height: 0.25rem;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.haligncenter .cnvs-section-title,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.haligncenter .cnvs-section-title {
|
||||
border-left: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-right: 1px solid var(--cnvs-section-heading-border-color);
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.halignright,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.halignright:before,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.halignright:before {
|
||||
content: '';
|
||||
border-top: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
height: 0.25rem;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 0 0px;
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.halignright .cnvs-section-title,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.halignright .cnvs-section-title {
|
||||
border-left: 1px solid var(--cnvs-section-heading-border-color);
|
||||
border-right: none;
|
||||
padding-left: 1em;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-16.halignright:after,
|
||||
.section-heading-default-style-16 .is-style-cnvs-block-section-heading-default.halignright:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17 .cnvs-section-title,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default .cnvs-section-title {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17 .cnvs-section-title:not([contenteditable="true"]),
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default .cnvs-section-title:not([contenteditable="true"]) {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17 .cnvs-section-title:after,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default .cnvs-section-title:after {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
height: 0;
|
||||
display: block;
|
||||
border-bottom: 1px solid var(--cnvs-section-heading-border-color);
|
||||
width: 100%;
|
||||
max-width: 30%;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17.haligncenter .cnvs-section-title:after,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default.haligncenter .cnvs-section-title:after {
|
||||
left: 50%;
|
||||
-webkit-transform: translate(-50%, 0);
|
||||
transform: translate(-50%, 0);
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17.halignright .cnvs-section-title:after,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default.halignright .cnvs-section-title:after {
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17.haligncenter,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default.haligncenter {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.is-style-cnvs-block-section-heading-17.halignright,
|
||||
.section-heading-default-style-17 .is-style-cnvs-block-section-heading-default.halignright {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,31 @@
|
||||
/**
|
||||
* WordPress dependencies
|
||||
*/
|
||||
const {
|
||||
addFilter,
|
||||
} = wp.hooks;
|
||||
|
||||
/**
|
||||
* Internal dependencies
|
||||
*/
|
||||
import SectionHeadingBlockEdit from './edit.jsx';
|
||||
|
||||
/**
|
||||
* Custom block Edit output for Styled Block.
|
||||
*
|
||||
* @param {JSX} edit Original block edit.
|
||||
* @param {Object} blockProps Block data.
|
||||
*
|
||||
* @return {JSX} Block edit.
|
||||
*/
|
||||
function editRender(edit, blockProps) {
|
||||
if ('canvas/section-heading' === blockProps.name) {
|
||||
return (
|
||||
<SectionHeadingBlockEdit {...blockProps} />
|
||||
);
|
||||
}
|
||||
|
||||
return edit;
|
||||
}
|
||||
|
||||
addFilter('canvas.customBlock.editRender', 'canvas/section-heading/editRender', editRender);
|
||||
@@ -0,0 +1,144 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import classnames from 'classnames';
|
||||
import ExtendAlignmentToolbar from './aligntoolbar';
|
||||
import ExtendTagToolbar from './tagtoolbar';
|
||||
|
||||
/**
|
||||
* WordPress dependencies
|
||||
*/
|
||||
|
||||
const {
|
||||
createBlock
|
||||
} = wp.blocks;
|
||||
|
||||
const {
|
||||
__,
|
||||
} = wp.i18n;
|
||||
|
||||
const {
|
||||
Component,
|
||||
} = wp.element;
|
||||
|
||||
const {
|
||||
BlockControls,
|
||||
} = wp.blockEditor;
|
||||
|
||||
const { RichText } = wp.blockEditor;
|
||||
|
||||
/**
|
||||
* Component
|
||||
*/
|
||||
class SectionHeadingBlockEdit extends Component {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
|
||||
this.state = {
|
||||
tagName: canvasBSHLocalize.sectionHeadingTag
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
const {
|
||||
setAttributes
|
||||
} = this.props;
|
||||
|
||||
let {
|
||||
className,
|
||||
attributes,
|
||||
} = this.props;
|
||||
|
||||
const {
|
||||
halign,
|
||||
tag,
|
||||
content,
|
||||
canvasClassName,
|
||||
} = attributes;
|
||||
|
||||
this.state.tagName = tag ? tag : '';
|
||||
|
||||
// If tag default.
|
||||
if ( 'default' === tag || 'none' === tag || ! tag ) {
|
||||
this.state.tagName = canvasBSHLocalize.sectionHeadingTag;
|
||||
}
|
||||
|
||||
let classAlign = halign ? `halign${halign}` : '';
|
||||
|
||||
// If align default.
|
||||
if ( 'default' === halign || 'none' === halign || ! halign ) {
|
||||
classAlign = canvasBSHLocalize.sectionHeadingAlign;
|
||||
}
|
||||
|
||||
className = classnames(
|
||||
'cnvs-block-section-heading',
|
||||
classAlign,
|
||||
canvasClassName,
|
||||
className
|
||||
);
|
||||
return (
|
||||
<div>
|
||||
<BlockControls>
|
||||
<ExtendAlignmentToolbar
|
||||
value={halign}
|
||||
onChange={(val) => {
|
||||
let align= (val === undefined) ? 'default' : val;
|
||||
|
||||
setAttributes({ halign: align })
|
||||
}}
|
||||
/>
|
||||
<ExtendTagToolbar
|
||||
value={tag}
|
||||
onChange={(val) => {
|
||||
let type= (val === undefined) ? 'default' : val;
|
||||
|
||||
setAttributes({ tag: type })
|
||||
}}
|
||||
/>
|
||||
</BlockControls>
|
||||
|
||||
<this.state.tagName className={className}>
|
||||
<div className="cnvs-section-title">
|
||||
<RichText
|
||||
tagName="span"
|
||||
className="cnvs-section-plain"
|
||||
onChange={(newContent) => {
|
||||
setAttributes({ content: newContent });
|
||||
}}
|
||||
value={content}
|
||||
placeholder={__('Write heading…')}
|
||||
/>
|
||||
</div>
|
||||
</this.state.tagName>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
jQuery(() => {
|
||||
function sectionHeadingTransforms(settings) {
|
||||
if (settings.name !== 'canvas/section-heading') {
|
||||
return settings;
|
||||
}
|
||||
|
||||
settings.transforms = {
|
||||
from: [
|
||||
{
|
||||
type: 'block',
|
||||
blocks: ['core/heading', 'core/paragraph'],
|
||||
transform: function (attributes) {
|
||||
return createBlock('canvas/section-heading', {
|
||||
content: attributes.content,
|
||||
});
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
return settings;
|
||||
}
|
||||
|
||||
wp.hooks.addFilter('canvas.customBlock.registerData', 'canvas/section-heading/transforms', sectionHeadingTransforms);
|
||||
});
|
||||
|
||||
export default SectionHeadingBlockEdit;
|
||||
@@ -0,0 +1,36 @@
|
||||
<?php
|
||||
/**
|
||||
* Section Heading template
|
||||
*
|
||||
* @var $attributes - block attributes
|
||||
* @var $content - inner blocks
|
||||
* @var $options - layout options
|
||||
*
|
||||
* @package Canvas
|
||||
*/
|
||||
|
||||
$halign = isset( $attributes['halign'] ) ? 'halign' . $attributes['halign'] : '';
|
||||
$block_tag = isset( $attributes['tag'] ) ? $attributes['tag'] : '';
|
||||
$content = isset( $attributes['content'] ) ? $attributes['content'] : '';
|
||||
|
||||
$class_name = $attributes['className'];
|
||||
|
||||
// If align default.
|
||||
if ( 'haligndefault' === $halign || 'halignnone' === $halign || ! $halign ) {
|
||||
$halign = apply_filters( 'canvas_section_heading_align', 'halignleft' );
|
||||
}
|
||||
|
||||
// If tag default.
|
||||
if ( 'default' === $block_tag || 'none' === $block_tag || ! $block_tag ) {
|
||||
$block_tag = apply_filters( 'canvas_section_heading_tag', 'h2' );
|
||||
}
|
||||
|
||||
// Set align class.
|
||||
$class_name .= ' ' . $halign;
|
||||
?>
|
||||
|
||||
<<?php echo esc_attr( $block_tag ); ?> class="<?php echo esc_attr( $class_name ); ?>" <?php echo ( isset( $attributes['anchor'] ) ? ' id="' . esc_attr( $attributes['anchor'] ) . '"' : '' ); ?>>
|
||||
<span class="cnvs-section-title">
|
||||
<span><?php echo (string) $content; // XSS. ?></span>
|
||||
</span>
|
||||
</<?php echo esc_attr( $block_tag ); ?>>
|
||||
+132
@@ -0,0 +1,132 @@
|
||||
/**
|
||||
* WordPress dependencies
|
||||
*/
|
||||
|
||||
const {
|
||||
__,
|
||||
} = wp.i18n;
|
||||
|
||||
const {
|
||||
Component
|
||||
} = wp.element;
|
||||
|
||||
const {
|
||||
Icon,
|
||||
Toolbar,
|
||||
DropdownMenu,
|
||||
Path, SVG
|
||||
} = wp.components;
|
||||
|
||||
function HeadingLevelIcon( level ) {
|
||||
const levelToPath = {
|
||||
1: 'M9 5h2v10H9v-4H5v4H3V5h2v4h4V5zm6.6 0c-.6.9-1.5 1.7-2.6 2v1h2v7h2V5h-1.4z',
|
||||
2: 'M7 5h2v10H7v-4H3v4H1V5h2v4h4V5zm8 8c.5-.4.6-.6 1.1-1.1.4-.4.8-.8 1.2-1.3.3-.4.6-.8.9-1.3.2-.4.3-.8.3-1.3 0-.4-.1-.9-.3-1.3-.2-.4-.4-.7-.8-1-.3-.3-.7-.5-1.2-.6-.5-.2-1-.2-1.5-.2-.4 0-.7 0-1.1.1-.3.1-.7.2-1 .3-.3.1-.6.3-.9.5-.3.2-.6.4-.8.7l1.2 1.2c.3-.3.6-.5 1-.7.4-.2.7-.3 1.2-.3s.9.1 1.3.4c.3.3.5.7.5 1.1 0 .4-.1.8-.4 1.1-.3.5-.6.9-1 1.2-.4.4-1 .9-1.6 1.4-.6.5-1.4 1.1-2.2 1.6V15h8v-2H15z',
|
||||
3: 'M12.1 12.2c.4.3.8.5 1.2.7.4.2.9.3 1.4.3.5 0 1-.1 1.4-.3.3-.1.5-.5.5-.8 0-.2 0-.4-.1-.6-.1-.2-.3-.3-.5-.4-.3-.1-.7-.2-1-.3-.5-.1-1-.1-1.5-.1V9.1c.7.1 1.5-.1 2.2-.4.4-.2.6-.5.6-.9 0-.3-.1-.6-.4-.8-.3-.2-.7-.3-1.1-.3-.4 0-.8.1-1.1.3-.4.2-.7.4-1.1.6l-1.2-1.4c.5-.4 1.1-.7 1.6-.9.5-.2 1.2-.3 1.8-.3.5 0 1 .1 1.6.2.4.1.8.3 1.2.5.3.2.6.5.8.8.2.3.3.7.3 1.1 0 .5-.2.9-.5 1.3-.4.4-.9.7-1.5.9v.1c.6.1 1.2.4 1.6.8.4.4.7.9.7 1.5 0 .4-.1.8-.3 1.2-.2.4-.5.7-.9.9-.4.3-.9.4-1.3.5-.5.1-1 .2-1.6.2-.8 0-1.6-.1-2.3-.4-.6-.2-1.1-.6-1.6-1l1.1-1.4zM7 9H3V5H1v10h2v-4h4v4h2V5H7v4z',
|
||||
4: 'M9 15H7v-4H3v4H1V5h2v4h4V5h2v10zm10-2h-1v2h-2v-2h-5v-2l4-6h3v6h1v2zm-3-2V7l-2.8 4H16z',
|
||||
5: 'M12.1 12.2c.4.3.7.5 1.1.7.4.2.9.3 1.3.3.5 0 1-.1 1.4-.4.4-.3.6-.7.6-1.1 0-.4-.2-.9-.6-1.1-.4-.3-.9-.4-1.4-.4H14c-.1 0-.3 0-.4.1l-.4.1-.5.2-1-.6.3-5h6.4v1.9h-4.3L14 8.8c.2-.1.5-.1.7-.2.2 0 .5-.1.7-.1.5 0 .9.1 1.4.2.4.1.8.3 1.1.6.3.2.6.6.8.9.2.4.3.9.3 1.4 0 .5-.1 1-.3 1.4-.2.4-.5.8-.9 1.1-.4.3-.8.5-1.3.7-.5.2-1 .3-1.5.3-.8 0-1.6-.1-2.3-.4-.6-.2-1.1-.6-1.6-1-.1-.1 1-1.5 1-1.5zM9 15H7v-4H3v4H1V5h2v4h4V5h2v10z',
|
||||
6: 'M9 15H7v-4H3v4H1V5h2v4h4V5h2v10zm8.6-7.5c-.2-.2-.5-.4-.8-.5-.6-.2-1.3-.2-1.9 0-.3.1-.6.3-.8.5l-.6.9c-.2.5-.2.9-.2 1.4.4-.3.8-.6 1.2-.8.4-.2.8-.3 1.3-.3.4 0 .8 0 1.2.2.4.1.7.3 1 .6.3.3.5.6.7.9.2.4.3.8.3 1.3s-.1.9-.3 1.4c-.2.4-.5.7-.8 1-.4.3-.8.5-1.2.6-1 .3-2 .3-3 0-.5-.2-1-.5-1.4-.9-.4-.4-.8-.9-1-1.5-.2-.6-.3-1.3-.3-2.1s.1-1.6.4-2.3c.2-.6.6-1.2 1-1.6.4-.4.9-.7 1.4-.9.6-.3 1.1-.4 1.7-.4.7 0 1.4.1 2 .3.5.2 1 .5 1.4.8 0 .1-1.3 1.4-1.3 1.4zm-2.4 5.8c.2 0 .4 0 .6-.1.2 0 .4-.1.5-.2.1-.1.3-.3.4-.5.1-.2.1-.5.1-.7 0-.4-.1-.8-.4-1.1-.3-.2-.7-.3-1.1-.3-.3 0-.7.1-1 .2-.4.2-.7.4-1 .7 0 .3.1.7.3 1 .1.2.3.4.4.6.2.1.3.3.5.3.2.1.5.2.7.1z',
|
||||
};
|
||||
|
||||
if ( ! levelToPath.hasOwnProperty( level ) ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<SVG width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" >
|
||||
<Path d={ levelToPath[ level ] } />
|
||||
</SVG>
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Component
|
||||
*/
|
||||
export default class ExtendTagToolbar extends Component {
|
||||
constructor() {
|
||||
super( ...arguments );
|
||||
}
|
||||
|
||||
render() {
|
||||
const DEFAULT_TAG_CONTROLS = [
|
||||
{
|
||||
icon: <Icon icon="editor-code" />,
|
||||
title: __( 'Default' ),
|
||||
type: 'default',
|
||||
},
|
||||
{
|
||||
icon: HeadingLevelIcon( 1 ),
|
||||
title: __( 'H1' ),
|
||||
type: 'h1',
|
||||
},
|
||||
{
|
||||
icon: HeadingLevelIcon( 2 ),
|
||||
title: __( 'H2' ),
|
||||
type: 'h2',
|
||||
},
|
||||
{
|
||||
icon: HeadingLevelIcon( 3 ),
|
||||
title: __( 'H3' ),
|
||||
type: 'h3',
|
||||
},
|
||||
{
|
||||
icon: HeadingLevelIcon( 4 ),
|
||||
title: __( 'H4' ),
|
||||
type: 'h4',
|
||||
},
|
||||
{
|
||||
icon: HeadingLevelIcon( 5 ),
|
||||
title: __( 'H5' ),
|
||||
type: 'h5',
|
||||
},
|
||||
{
|
||||
icon: HeadingLevelIcon( 6 ),
|
||||
title: __( 'H6' ),
|
||||
type: 'h6',
|
||||
},
|
||||
{
|
||||
icon: <Icon icon="minus" />,
|
||||
title: __( 'DIV' ),
|
||||
type: 'div',
|
||||
},
|
||||
{
|
||||
icon: <SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><Path d="M11 5v7H9.5C7.6 12 6 10.4 6 8.5S7.6 5 9.5 5H11m8-2H9.5C6.5 3 4 5.5 4 8.5S6.5 14 9.5 14H11v7h2V5h2v16h2V5h2V3z" /></SVG>,
|
||||
title: __( 'P' ),
|
||||
type: 'p',
|
||||
},
|
||||
];
|
||||
|
||||
const {
|
||||
value,
|
||||
onChange,
|
||||
tagControls = DEFAULT_TAG_CONTROLS,
|
||||
} = this.props;
|
||||
|
||||
function applyOrUnset( type ) {
|
||||
return () => onChange( value === type ? undefined : type );
|
||||
}
|
||||
|
||||
const activeTag = tagControls.find( function( control ) {
|
||||
return ( value === control.type || ( 'default' === control.type && ( 'none' === value || 'default' === value || ! value ) ) );
|
||||
} );
|
||||
|
||||
return (
|
||||
<Toolbar>
|
||||
<DropdownMenu
|
||||
icon={ activeTag ? activeTag.icon : <Icon icon="editor-code" /> }
|
||||
label={ activeTag ? activeTag.title : __( 'Change type tag' ) }
|
||||
controls={ tagControls.map( ( control ) => {
|
||||
const { type } = control;
|
||||
|
||||
const isActive = ( value === type || ( 'default' === type && ( 'none' === value || 'default' === value || ! value ) ) );
|
||||
|
||||
return {
|
||||
...control,
|
||||
isActive,
|
||||
onClick: applyOrUnset( type ),
|
||||
};
|
||||
} ) }
|
||||
/>
|
||||
</Toolbar>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user