Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[New Block] Custom Background Container / Superimposed Image #6

Open
coditive-tomek-l opened this issue May 30, 2022 · 0 comments
Open
Labels
enhancement New feature or request

Comments

@coditive-tomek-l
Copy link
Member

With this block you should be able to set custom background with image for a group of blocks.

  • the block itself should be a container (similar to Group block) that allows you to put different blocks inside
  • this block should be just a container for other blocks that does not impact anything inside and outside of it, so no default padding, no margins, no layout options etc
  • the one and only feature of this block would be a custom background or custom image that could be positioned and scaled
  • you should be able to choose background image from standard Media Library
  • you should be able to choose position and size of the image
  • you should be able to set different properties like background-repeat etc

Why not Cover block?

  • Cover block is currently the only block supporting image background, but it's very limited in terms of precise settings, for example you can not set any specific numbers of percentage for background size or position
  • Cover block also has a lot of issues with opacity when you try to mix an image and background color settings from the block

Group block but better?

  • one thing that could potentially and partially solve this problem would be a new feature of image background for Group block
  • some discussions on image background are happening on Github here, here , here, and here, but currently there are no signs of anything like that becoming the reality.

Use cases:

  • Setting background with custom image
  • Setting size in similar fashion like it's done in CSS code: by pixels, em, rem, %
  • Setting position in similar fashion like it's done in CSS code: by pixels, em, rem, %, calc, etc
  • Choosing if the image will be displayed as a backogrund or a top layer hovering over the content
  • Another scenario of using this block would be when you need to place an image or icon outside of standard wrapper box, for promotional badge or other graphic detail
  • This block should be useful for images and pictures with strict size or position required according to a design

Screenshot 2022-05-30 at 13 54 43

@coditive-tomek-l coditive-tomek-l added the enhancement New feature or request label May 30, 2022
@coditive-pawel-m coditive-pawel-m changed the title Create new Block: Custom Background Container / Superimposed Image [New Block]: Custom Background Container / Superimposed Image Jun 8, 2022
@coditive-pawel-m coditive-pawel-m changed the title [New Block]: Custom Background Container / Superimposed Image [New Block] Custom Background Container / Superimposed Image Jun 8, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant