godaddy-wordpress / coblocks Goto Github PK

If a background color (or background-image) is added to an Image Block, it's paddingSize should be set to "medium"

Here's a screenshot for reference:

Here is a text about why this is useful: https://github.com/joyeusenoelle/GuideToMastodon/#okay-how-do-i-let-people-know-that-i-am-who-i-say-i-am

I think it's because the theme targets the p within the blockquote, whereas the inline font-family style is targeting the block wrapper.

Blocks where this is happening:

• Click to Tweet
• Quote
• Pricing Table (the .wp-block-coblocks-pricing-table-item__title and .wp-block-coblocks-pricing-table-item__amount)

Currently the frontend responsiveness does not function within the editor. We need to fix that.

As long as stackedOnMobile is set to true, the last .wp-block-coblocks-column should have its margin removed — when the columns stack up on mobile.

Here's a gif:

When adding a custom font family selection to the pricing table block, the font is applied to the button as well. We should let the button be controlled by it's own typography controls, instead of overriding it.

I haven't checked the other blocks, but updating Coblocks 1.1.1 to 1.1.3 breaks existing Alerts.

1.1.1

1.1.3

This is because the block was originally saved with a custom style (for the custom colors) and now uses the class names.

index.js?ver=1534256213:2 Block validation: Block validation failed for `coblocks/alert` (Object).

Expected:

<div class="wp-block-coblocks-alert is-default-alert aligncenter has-background has-2571-d-4-background-color has-2571-d-4-border-color"><p class="wp-block-coblocks-alert__title has-text-color has-ffffff-color">[object Object]</p></div>

Actual:

<div class="wp-block-coblocks-alert aligncenter" style="background-color:#2571d4;border-color:#2571d4;text-align:center"><div class="wp-block-coblocks-alert__title"><p style="color:#ffffff"><strong>This is an alert title</strong></p></div><p class="wp-block-coblocks-alert__text" style="color:#ffffff">This is an alert description.</p></div>

You can see how the core Button block migrates old hex style attributes to new classes here: https://github.com/WordPress/gutenberg/blob/master/packages/block-library/src/button/index.js#L127

We need to figure out how to utilize transforms properly so that when you copy an alert block from one site, it'll paste into the other fine.

There's essentially not a proper UI for the Gif Block. Let's add a grid of images that appear, which you can then select from.

Let's figure out a clever way to style these previews so that it's more apparent what the left and right style represent.

It seems clicking on the "Follow" button is causing an issue which prevents the block from being previewed.

Also, I have noticed the inspector controls are commented out within the source code of the block.

The following controls need appropriate help text:

1. Card Shadow
2. Image Shadow

Columns within the editor are not properly showing the true responsive nature if the "Stack on mobile" control is toggled on

I should have a simple notice added, notifying users to install Gutenberg, if it's not installed yet.

The details and summary tags are not supported by Microsoft browsers.
https://caniuse.com/#feat=details

Color classes work fine, but applying a custom background color causes unexpected overflow:

On the frontend the blocks with this turned on works fine, but within the editor they still have margin. applied.

From the editor:

First off: awesome plugin! Neat way to handle embedding gists (what I installed it for).

I encountered a small issue: if you paste in a gist URL that has a hash on the end of it, the block just spins and spins, never loading the gist. And once you've pasted in the URL, there's no way to edit it to remove the hash.

For instance, this URL fails: https://gist.github.com/tnorthcutt/d0a310530e9eba955622e6f9d473f473#file-mainnav-vue

I noticed this because I went to an existing post I that I wanted to switch from using Github's <script> tag embeds on to instead use Coblocks. I simply copied the URL of the existing gist embed, which gave me the URL above, with the trailing #file-mainnav-vue.

Happy to help test/reproduce/whatever as needed.

I started, but I couldn't get this working 100%. I'm using the image core block as an example. When it works, you can "Copy All Content" and paste it into a new page - with the gist fully loaded.

This may be intentional to ensure user settings aren't lost, but it's not obvious from the implementation.

Use CoBlocksTypography

Would like to apply a custom link using the Click to Tweet block.

My idea is that if the URL field is empty then it will link the current page as it does already now. If a URL is entered then the tweet will use that link instead.

Is this something you can do for the next release?

The social block icons are not aligned within the Gutenberg editor.

I opened a new branch (remove-alert-border) to start it.

So that they do not resize outside of the block itself.

Editing 3 tables with no alignment does not match the front-end. It's squashed. In fact the width of each table are not even but that may be because each table has different content.

On the front-end, you have the first 2 tables even and the third table on a second row in full width which I do not mind but the editing experience for this particular setting needs a adjusting.

Would be useful to have left/right/centered alignment options.

Makes it a bit cleaner/easier to understand.

It doesn't seem to affect normal size screens. Here's a gif comparing the frontend and backend:

The Accordion Item block seems to be missing it's outline when you're interacting with it.

Let's add the top/bottom spacing setting to the advanced controls for the map block.

Adding a row block with one column does not show up 100% fullwidth within the accordion:

Let's look into adding a "No top spacing" and "No bottom spacing" in the advanced area of the block sidebar. Would be useful for blocks that can have backgrounds, as themes typically add spacing between each block by default.

We could use something similar to how we added support for stacked on mobile controls in the Advanced controls panel.

The bottom left and right border radius should be 0 when the accordion is opened. It works properly on the frontend, but not within the editor.

The card element should be on top of the image dropZone (just like in the actual design). The left/right overflow issues will be resolved with #30.

Screenshot:

Currently you have to duplicate an existing accordion item block, just to add more. This needs to be easier to do.

Possibly include some sort of "Click to Add Another Accordion" button, which when clicked, automatically adds another accordion item (instead of using the default block inserter).

I think it'd be wise to add it to blocks that have support for background colors (excerpt for paragraph blocks), and blocks that have fullwidth alignments.

Here's a list:

• Image
• Gallery
• Spacer
• Cover