Skip to content
This repository has been archived by the owner on Mar 18, 2020. It is now read-only.

Commit

Permalink
Added inspector component for feature list - working to add alignment…
Browse files Browse the repository at this point in the history
… toolbar
  • Loading branch information
APPLE authored and APPLE committed Mar 7, 2018
1 parent 0d94c16 commit cd466b1
Show file tree
Hide file tree
Showing 3 changed files with 60 additions and 26 deletions.
35 changes: 10 additions & 25 deletions src/blocks/features-list/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
* A simple block to show a feature
*/
import icons from "../icons";
import Inspector from './inspector';
/**
* Internal block libraries
*/
Expand All @@ -15,16 +16,12 @@ const {
MediaUpload,
BlockControls,
InnerBlocks,
InspectorControls
} = wp.blocks; // Import registerBlockType() from wp.blocks as well as Editable so we can use TinyMCE
const {
Button,
Toolbar,
Tooltip,
Dashicon,
PanelBody,
PanelRow,
TextControl
Dashicon
} = wp.components;
/**
* Register: aa Gutenberg Block.
Expand Down Expand Up @@ -133,24 +130,12 @@ registerBlockType("cgb/block-feature", {

return [
!!props.focus && (
<InspectorControls key="inspector">
<PanelBody title={__("Link Options")}>
<PanelRow>
<TextControl
label={__("Link URL")}
value={props.attributes.link}
onChange={onChangeLink}
/>
</PanelRow>
<PanelRow>
<TextControl
label={__("Link Text")}
value={props.attributes.buttonText}
onChange={onChangeButtonText}
/>
</PanelRow>
</PanelBody>
</InspectorControls>
<Inspector
{ ...{
onChangeLink,
onChangeButtonText,
...props } }
/>
),
<div className={props.className}>
<div className="feature__img mb1">
Expand Down Expand Up @@ -183,7 +168,7 @@ registerBlockType("cgb/block-feature", {
</div>
)}
</div>
<div className="feature__content text-center">
<div className="feature__content">
<Editable
tagName="h3"
placeholder={__("Feature title")}
Expand Down Expand Up @@ -223,7 +208,7 @@ registerBlockType("cgb/block-feature", {
alt={props.attributes.imgAlt}
/>

<div className="feature__content center-xs">
<div className="feature__content">
<h3 className="feature__title">{props.attributes.title}</h3>
<div className="feature__description">
{props.attributes.description}
Expand Down
50 changes: 50 additions & 0 deletions src/blocks/features-list/inspector.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
/**
* Internal block libraries
*/
const { __ } = wp.i18n;
const { Component } = wp.element;
const {
InspectorControls,
BlockDescription,
} = wp.blocks;
const {
Toolbar,
Button,
PanelBody,
PanelRow,
TextControl
} = wp.components;

/**
* Create an Inspector Controls wrapper Component
*/
export default class Inspector extends Component {

constructor( props ) {
super( ...arguments );
}

render() {
return (
<InspectorControls key="inspector">
<PanelBody title={__("Link Options")}>
<PanelRow>
<TextControl
label={__("Link URL")}
value={this.props.attributes.link}
onChange={this.props.onChangeLink}
/>
</PanelRow>
<PanelRow>
<TextControl
label={__("Link Text")}
value={this.props.attributes.buttonText}
onChange={this.onChangeButtonText}
/>
</PanelRow>
</PanelBody>
</InspectorControls>
);
}

}
1 change: 0 additions & 1 deletion src/blocks/section/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -138,7 +138,6 @@ registerBlockType("cgb/block-section", {

getEditWrapperProps(attributes) {
const { alignment } = attributes;
console.log(validAlignments);

if (-1 !== validAlignments.indexOf(alignment)) {
return { "data-align": alignment };
Expand Down

0 comments on commit cd466b1

Please sign in to comment.