Plugin Directory

Changeset 2517259


Ignore:
Timestamp:
04/18/2021 11:49:01 PM (5 years ago)
Author:
willdelphia
Message:

Version 1.3

Location:
magic-block/trunk
Files:
5 edited

Legend:

Unmodified
Added
Removed
  • magic-block/trunk/css/magicblock.css

    r2230023 r2517259  
    11
    2 .magicblock-editor > .editor-inner-blocks {
    3     border-top-left-radius: 0px;
    4     padding: 0 1em;
    5     border: 1px solid rgb(215, 215, 215);
     2.magicblock-editor {
     3    padding: .2em .25em;
    64}
    75
    8 .magicblock-editor .editor-block-list__block-edit {
    9     margin-top: 5px;
    10     margin-bottom: 5px;
     6.wp-block[data-type="magicblock/magicblock"] {
     7    border: 1px solid rgb(215, 215, 215);
     8    background: white;
     9}
     10
     11.wp-block[data-type="magicblock/magicblock"] .block-editor-inner-blocks {
     12    padding-left: .5em;
     13    padding-right: .5em;
    1114}
    1215
     
    1619    font-family: 'Courier New', Courier, monospace;
    1720    background: white;
    18     display: inline-block;
    19     border: 1px solid rgb(215, 215, 215);
    20     border-bottom: none;
     21    border-bottom: 1px solid rgb(215, 215, 215);
    2122    transform: translateY(1px);
    2223    max-width: 100%;
     
    2425}
    2526
    26 .editor-plain-text.magicblock-plaintext {
    27     font-family: Menlo,Consolas,monaco,monospace;
    28     font-size: 14px;
    29     color: #23282d;
    30     padding: .8em 1em;
    31     border: 1px solid rgb(135, 135, 135);
    32     border-radius: 4px;
    33 }
    3427
    3528.magicblock-class-span, .magicblock-id-span {
     
    5346}
    5447
    55 .edit-post-settings-sidebar__panel-block .components-panel__body .magicblock-newtab .components-base-control {
    56     margin-bottom: .3em;
    57 }
    5848
    5949.magicblock-custom-attr-pair {
    6050    margin-bottom: 10px;
    6151    padding: 1em;
    62     border-radius: 5px;
     52    border-radius: 2px;
    6353    border: solid 1px grey;
    6454}
    6555
    66 .magicblock-custom-attr-pair > div {
    67     margin-bottom: 1em;
    68 }
    69 
    70 .magicblock-custom-attr-key-field {
    71     display: flex;
    72     align-items: center;
    73 }
    74 
    75 .magicblock-custom-attr-key-field-prefix {
    76     margin-right: .5em;
    77 }
    78 
    79 .magicblock-custom-attr-label {
    80     font-weight: 600;
    81     margin-bottom: .5em;
    82 }
    8356
    8457.magic-block-right-align {
  • magic-block/trunk/js/magicblock-jsx.js

    r2230023 r2517259  
    22
    33const { registerBlockType } = wp.blocks;
    4 const { InspectorControls, InnerBlocks, PlainText} = wp.editor;
     4const {InnerBlocks, InspectorControls } =  wp.blockEditor;
    55const { Fragment } = wp.element;
    6 const { PanelBody, SelectControl, CheckboxControl, Button} = wp.components;
     6const { PanelBody, SelectControl, CheckboxControl, Button, TextControl} = wp.components;
     7
    78
    89const icon = () => {
     
    2829            selector: '.wp-block-magicblock-magicblock',
    2930            attribute: 'style',
    30         },
     31            default: ''
     32        },
    3133        href: {
    3234            type: 'string',
     
    3436            selector: '.wp-block-magicblock-magicblock',
    3537            attribute: 'href',
     38            default: ''
    3639        },
    3740        customAttrs: {
     
    5861
    5962        const {
    60             inlineSytle,
     63            inlineStyle,
    6164            elemTag,
    6265            elemId,
     
    136139
    137140        const linkPanels = (
    138             <PanelBody title="Href">
    139                 <PlainText onChange={onChangeHref} value={href} className="magicblock-plaintext"/>
     141            <PanelBody title="Link Attributes">
     142                <TextControl label="Href" onChange={onChangeHref} value={href}/>
    140143                <div className="magicblock-flex magicblock-newtab">
    141144                    <CheckboxControl
     
    173176                     </PanelBody>
    174177                     {  elemTag === "a" ? linkPanels : null }
    175                      <PanelBody title="ID">
    176                         <PlainText onChange={onChangeID} value={elemId} className="magicblock-plaintext"/>
    177                      </PanelBody>
    178                      <PanelBody title="Class(es)">
    179                         <PlainText onChange={onChangeClass} value={elemClass} className="magicblock-plaintext"/>
    180                      </PanelBody>
    181                      <PanelBody title="Inline CSS">
    182                         <PlainText onChange={onChangeInlineStyle} value={inlineSytle} className="magicblock-plaintext"/>
     178                     <PanelBody title="Standard Attributes">
     179                        <TextControl label="ID" value={ elemId } onChange={onChangeID} />
     180                        <TextControl label="Classname (space-seperated)"onChange={onChangeClass} value={elemClass}/>
     181                        <TextControl label="Inline Style" onChange={onChangeInlineStyle} value={inlineStyle}/>
    183182                     </PanelBody>
    184183                     <PanelBody title="Custom Attributes">
    185184                         {customAttrs && customAttrs.map((attr, index) => (
    186185                             <div className="magicblock-custom-attr-pair">
    187                                 <div>
    188                                      <div className="magicblock-custom-attr-label">Name</div>
    189                                      <div className="magicblock-custom-attr-key-field">
    190                                          <PlainText onChange={newKey => setKeyForCustomAttrs(index, newKey)} value={attr.key} className="magicblock-plaintext"/>
    191                                      </div>
    192                                 </div>
    193                                 <div>
    194                                     <div className="magicblock-custom-attr-label">Value</div>
    195                                     <PlainText onChange={newValue => setValueForCustomAttrs(index, newValue)} value={attr.value} className="magicblock-plaintext"/>
    196                                 </div>
    197                                 <Button isSmall={true} onClick={() => deleteCustomAttr(index)}>Delete</Button>
     186                                <TextControl label="Name" onChange={newKey => setKeyForCustomAttrs(index, newKey)} value={attr.key} />
     187                                <TextControl label="Value" onChange={newValue => setValueForCustomAttrs(index, newValue)} value={attr.value} />
     188                                <Button isDestructive={true} onClick={() => deleteCustomAttr(index)}>Delete</Button>
    198189                             </div>
    199190                         ))}
    200                         <div class="magic-block-right-align"><Button isSmall={true} onClick={addNewCustomAttr}>New Attribute</Button></div>
     191                        <div class="magic-block-right-align"><Button isSecondary={true} onClick={addNewCustomAttr}>New Attribute</Button></div>
    201192                     </PanelBody>
    202193                </InspectorControls>
  • magic-block/trunk/js/magicblock.build.js

    r2230023 r2517259  
    7575
    7676var registerBlockType = wp.blocks.registerBlockType;
    77 var _wp$editor = wp.editor,
    78     InspectorControls = _wp$editor.InspectorControls,
    79     InnerBlocks = _wp$editor.InnerBlocks,
    80     PlainText = _wp$editor.PlainText;
     77var _wp$blockEditor = wp.blockEditor,
     78    InnerBlocks = _wp$blockEditor.InnerBlocks,
     79    InspectorControls = _wp$blockEditor.InspectorControls;
    8180var Fragment = wp.element.Fragment;
    8281var _wp$components = wp.components,
     
    8483    SelectControl = _wp$components.SelectControl,
    8584    CheckboxControl = _wp$components.CheckboxControl,
    86     Button = _wp$components.Button;
     85    Button = _wp$components.Button,
     86    TextControl = _wp$components.TextControl;
    8787
    8888
     
    110110            source: 'attribute',
    111111            selector: '.wp-block-magicblock-magicblock',
    112             attribute: 'style'
     112            attribute: 'style',
     113            default: ''
    113114        },
    114115        href: {
     
    116117            source: 'attribute',
    117118            selector: '.wp-block-magicblock-magicblock',
    118             attribute: 'href'
     119            attribute: 'href',
     120            default: ''
    119121        },
    120122        customAttrs: {
     
    140142    edit: function edit(props) {
    141143        var _props$attributes = props.attributes,
    142             inlineSytle = _props$attributes.inlineSytle,
     144            inlineStyle = _props$attributes.inlineStyle,
    143145            elemTag = _props$attributes.elemTag,
    144146            elemId = _props$attributes.elemId,
     
    213215        var linkPanels = wp.element.createElement(
    214216            PanelBody,
    215             { title: "Href" },
    216             wp.element.createElement(PlainText, { onChange: onChangeHref, value: href, className: "magicblock-plaintext" }),
     217            { title: "Link Attributes" },
     218            wp.element.createElement(TextControl, { label: "Href", onChange: onChangeHref, value: href }),
    217219            wp.element.createElement(
    218220                "div",
     
    257259                wp.element.createElement(
    258260                    PanelBody,
    259                     { title: "ID" },
    260                     wp.element.createElement(PlainText, { onChange: onChangeID, value: elemId, className: "magicblock-plaintext" })
    261                 ),
    262                 wp.element.createElement(
    263                     PanelBody,
    264                     { title: "Class(es)" },
    265                     wp.element.createElement(PlainText, { onChange: onChangeClass, value: elemClass, className: "magicblock-plaintext" })
    266                 ),
    267                 wp.element.createElement(
    268                     PanelBody,
    269                     { title: "Inline CSS" },
    270                     wp.element.createElement(PlainText, { onChange: onChangeInlineStyle, value: inlineSytle, className: "magicblock-plaintext" })
     261                    { title: "Standard Attributes" },
     262                    wp.element.createElement(TextControl, { label: "ID", value: elemId, onChange: onChangeID }),
     263                    wp.element.createElement(TextControl, { label: "Classname (space-seperated)", onChange: onChangeClass, value: elemClass }),
     264                    wp.element.createElement(TextControl, { label: "Inline Style", onChange: onChangeInlineStyle, value: inlineStyle })
    271265                ),
    272266                wp.element.createElement(
     
    277271                            "div",
    278272                            { className: "magicblock-custom-attr-pair" },
    279                             wp.element.createElement(
    280                                 "div",
    281                                 null,
    282                                 wp.element.createElement(
    283                                     "div",
    284                                     { className: "magicblock-custom-attr-label" },
    285                                     "Name"
    286                                 ),
    287                                 wp.element.createElement(
    288                                     "div",
    289                                     { className: "magicblock-custom-attr-key-field" },
    290                                     wp.element.createElement(PlainText, { onChange: function onChange(newKey) {
    291                                             return setKeyForCustomAttrs(index, newKey);
    292                                         }, value: attr.key, className: "magicblock-plaintext" })
    293                                 )
    294                             ),
    295                             wp.element.createElement(
    296                                 "div",
    297                                 null,
    298                                 wp.element.createElement(
    299                                     "div",
    300                                     { className: "magicblock-custom-attr-label" },
    301                                     "Value"
    302                                 ),
    303                                 wp.element.createElement(PlainText, { onChange: function onChange(newValue) {
    304                                         return setValueForCustomAttrs(index, newValue);
    305                                     }, value: attr.value, className: "magicblock-plaintext" })
    306                             ),
     273                            wp.element.createElement(TextControl, { label: "Name", onChange: function onChange(newKey) {
     274                                    return setKeyForCustomAttrs(index, newKey);
     275                                }, value: attr.key }),
     276                            wp.element.createElement(TextControl, { label: "Value", onChange: function onChange(newValue) {
     277                                    return setValueForCustomAttrs(index, newValue);
     278                                }, value: attr.value }),
    307279                            wp.element.createElement(
    308280                                Button,
    309                                 { isSmall: true, onClick: function onClick() {
     281                                { isDestructive: true, onClick: function onClick() {
    310282                                        return deleteCustomAttr(index);
    311283                                    } },
     
    319291                        wp.element.createElement(
    320292                            Button,
    321                             { isSmall: true, onClick: addNewCustomAttr },
     293                            { isSecondary: true, onClick: addNewCustomAttr },
    322294                            "New Attribute"
    323295                        )
  • magic-block/trunk/magicblock.php

    r2230023 r2517259  
    33Plugin Name:  Magic Block
    44Description: Registers a container block. It has settings for element, ID, classname, style, and any other attribute.
    5 Version:      1.2.2
     5Version:      1.3.0
    66Author:       Will Delphia
    77License:      GPL2
  • magic-block/trunk/readme.txt

    r2230023 r2517259  
    33Tags:  block, container block, html element, data attributes, div, section, flexbox, css grid, tag, nesting, child blocks, parent blocks
    44Requires at least: 5.0
    5 Tested up to: 5.3.2
     5Tested up to: 5.7.1
    66Requires PHP: 5.2.4
    77License: GPL2
Note: See TracChangeset for help on using the changeset viewer.