I have observed that whenever I align a component left or right (float left or float right), that component comes out of the parent container, however If I make it to 'None' it comes back inside the container in it's last position. I found this on live demo too. Refer the attached screenshots Could you please let me k...
Ju99ernaut
The float property collapses the parent div. You can use this for reference.
artf
Yeah, unfortunately, that is how weird the float works, so if you're creating a builder for non-tech people avoid that property 😬
Note: This is in the context of the Style Manager. Is there a way to use different variations of the same style property? For example when I use the text-align property on a non-text node component I'd like the label to read "Align Content" with the options of "left", "right" and "center". However, when the "text-alig...
Ju99ernaut
I don't think that's possible using the API, also does text-align work for non-text components? You'll probably want to use the align-content property from flexbox
artf
You should try to use Component's stylable-require property to show the particular style property (marked with toRequire) and unstylable for the one you don't need.
Joshmamroud
@artf Thank you for your response. In this case, I would still have an issue using the align-content property with flex columns and rows. For columns, I'd like the options to read: Top, Center, and Bottom and for rows I'd like the options...
https://github.com/artf/grapesjs/issues/1627 I think the question is related to this line specifically, I have the same issue. I look thru the demo but this class only appears in css and this line, so this selector returns undefined does it not? What element has this so that it can then be appended? traitsProps.append...
gunslingor
Okay, I think I understand. I need many different versions of grapejs canvases... each should be it's own plugin, maybe sharing common code in some cases. I was thinking differently, that presets were only settings that could be overridden...
Nikesh-hub
Hello @gunslingor before calling trait sector you need to make active both section settingButton && settingButton.set('active', 1); styleManagerButton && styleManagerButton.set('active', 1); and then you can call -- // Add Settings Sector...
gunslingor
Yeah, I figured that out eventually. I don't get why I have to configure this section AFTER initialization instead of during like many other panels/sections. I think it's because I am using the presets plugin. I think init needs to be simp...
I coded a Plugin, works Ok, I read the docs, but is there a way to have the Category collapsed by default?, so user clicks the Plugin to display the plugin Blocks.
Ju99ernaut
is there a way to style the "View Code" button the one with the </> icon?. Target the button with a css selector like .gjs-pn-btn.fa.fa-codein the "View Code" pop-up, is there a way to hide the CSS text editor only leaving the HTML editor?...
Ju99ernaut
You can close all categories with Or you can use a filter
juancarlospaco
Thanks, you can see results here. I ask here to not open more Bugs:is there a way to style the "View Code" button the one with the </> icon?.in the "View Code" pop-up, is there a way to hide the CSS text editor only leaving the HTML editor...
Hi all, I would like to get some guidance about the code I should add/edit in order to change the way panels look. In general, I will need to change all the UI styles, but I want to start with blocks, layers, and style managers. I want to be able to change the layout, colors, etc in order to make it fit my brand image...
Joshmamroud
> @sircoko Can you provide some code examples of what you have and explain in more detail what you're confused about?Well, not code but I can explain my needs quite better with an image...In a few words, I want to go from here: https://img...
Joshmamroud
@sircoko Can you provide some code examples of what you have and explain in more detail what you're confused about?
sircoko
@sircoko Can you provide some code examples of what you have and explain in more detail what you're confused about? Well, not code but I can explain my needs quite better with an image... In a few words, I want to go from here: https://img...
Hello! I Have an issue, when adding an image in cell, the neighbors cell content is 'jumping' to the bottom. Actually this issue not only with image, but also with video, links etc. Here is how it looks without image: And now with image: Any idea what it might be and how to fix it?
Ju99ernaut
I'm able to reproduce that behavior with default grid But when I turn on flex-grid it functions as expected Probably have to replace all previous instances of the component that use display: table, but I don't think that is necessary since...
Ju99ernaut
Probably related to display: table, the grid system uses by default, add this to your grapesjs.init
mmotov
@Ju99ernaut thanks for reply, but unfortunately it didn't help. I managed to solve this issue by overriding default Cell component. I have added But probably I'm doing something wrong
Hii, I wanted to change the category of the bootstrap4. I wanted to rename the typography to Text and Change the icon for the blocks. Could you please help me understand how can I achieve this?
Hi! I want to achieve such a feature: when the mouse moves over a block, the floating window displays its next level blocks. As shown below: I made a floating window div, but I don’t know how to display the blocks in the floating window. I read about BlockManager.render() in the documentation, but it can only control...
artf
By using the BlockManager API you have to build your own UI for such a case
Hey, we are currently using grapejs to create liquid templates (shopify syntax). The way its currently implemented will leave the template, for example `{{ name }}, unrendered within the editor. This is due to the fact, that even if the gjs-html gets interpolated by the server after a store/load cycle, the editor stil...
artf
Well, if you load back the HTML you'll lose all the component information (kind of explained here). As an analogy, try to think about Photoshop files and JPG as an output. If you load back the JPG you won't see the layers used in your Phot...
Hello, I'm trying to get TinyMCE to work as an editor in a modal instead of inline. I am able to get the selected components html with target.getEl().innerHTML but this doesn't include any styling. When setting the content back with replaceWith(html) all styling is lost on the component. Is there a way to update/repla...
Ju99ernaut
You can use this to get a component and it's style;