1. Plugins
  2. Bootstrap 4 Page Builder
  3. Support

← Back to Bootstrap 4 Page Builder Support

Slevin K.
Slevin K.

Hello,

I know i'm asking a lot of improvments, but i really believe that you're plugin is a great thing that deserves to be improved to be the best of Octobercms plugins :)

What i'm searching right now, is a possibility to generate css responsive code for background image. It would be good that when you add a background image, it generates directly another css with the background with the css option image-set. And of course, it generates also the other image sizes in the media library.

FYI, image-set source: https://developer.mozilla.org/en-US/docs/Web/CSS/image-set

What do you think of this ?

Best, L

Vladimir
Vladimir

It looks like grapesjs doesn't fully support this option.

A request to add such a feature should probably be written here https://github.com/artf/grapesjs/issues

I just integrate grapesjs into October CMS and not develop it.

In addition, this option is currently not supported by all browsers. Firefox for example.

Example:

    <style>
    #photo{

    width:344px;height:300px;

    background-image:-webkit-image-set(url("http://placekitten.com/344/300") 1x, url("http://upload.wikimedia.org/wikipedia/commons/thumb/8/8a/Banana-Single.jpg/688px-Banana-Single.jpg") 2x);}

    </style>

    <h1>CSS image-set (test for 2dppx)</h1>
    <p>Do you see a cat or banana?</p>
    <div id="photo"></div>

http://b4dev.pkurg.ru/image-set-test

Works in latest versions of Chrome, Edge and does not work in Firefox

See: https://developer.mozilla.org/en-US/docs/Web/CSS/image-set

Browser compatibility chapter

Last updated

1-2 of 2

Please login to reply to the discussion.