sachatrauwaen / OpenContent

Structured Content editing for DNN (Dotnetnuke)
46 stars 25 forks source link

Edit content missing glyphs, weird buttons #79

Closed aldeng11 closed 4 years ago

aldeng11 commented 5 years ago

This may have something to do with issue #74

There are weird buttons at the top of Edit Content that don't seem to do anything. Also, glyphs missing and content overflows on right. image

sachatrauwaen commented 5 years ago

Maybe because you using bootstrap 4 in edit skin. OpenContent Bootstrap layout in edit forms is made for bootstrap 3. You can try dnn layout in global settings

aldeng11 commented 5 years ago

DNN layout loses glyphicons and has so many layout issues that it makes all features unusable.

sachatrauwaen commented 5 years ago

Actually, opencontent edit form are made for bootstrap 3. Because your popup skin inject bootstrap 4, there are some layout issues.

The only way i see to solve is to change the popupskin included in your skin. Just remove base-1.min.css (this include bootstrap 4) in the popupskin.

Then change oc global settings to include bootstrap (v3).

This will normally solve the layout issues.

b-creative commented 5 years ago

or do not use popups :)

aldeng11 commented 5 years ago

If I remove that file, it will break all pop-ups on my site. Bootstrap 4 is mainstream.

sachatrauwaen commented 5 years ago

That sound strange, dnn do not require bootstrap.

When you say "all popups", witch popups are really not work anymore ?

Module settings, login ? or specific module popups ?

Timo-Breumelhof commented 5 years ago

I'm using OC 4.2 with a BS 4 skins and see no issues with the right settings (and DNN pop-ups off)

Timo-Breumelhof commented 5 years ago

Oke, just to be sure, I just tested with my BS4 skin. Both without popups and with pop-ups I cannot reproduce the issue. I loaded BS4 (CSS) in my popUpSkin.ascx (while IMO that skin should be "Empty") Might be the skin used adds more? I have the attached settings in OC Global settings.

image

IMO this is an issue of the skin. It probably loads CSS in the popUp it shouldn't. Can you post the contents of your "popUpSkin.ascx"

Also could you try if the issue is gone if you rename that file?

perezandres commented 5 years ago

I have that issue (my skin is based on BS 4) only with popups DISABLED; if I enable popups, everything is OK.

sachatrauwaen commented 5 years ago

I have that issue (my skin is based on BS 4) only with popups DISABLED; if I enable popups, everything is OK.

What are your global settings (2 settings for bootstrap) ? Do you have errors in the browser console ?

perezandres commented 5 years ago

I have that issue (my skin is based on BS 4) only with popups DISABLED; if I enable popups, everything is OK.

What are your global settings (2 settings for bootstrap) ? Do you have errors in the browser console ?

Console OK. I've tried all possible variations of "Load Bootstrap on Edit Form" and "Load Glyphicons on Edit Form (for bootstrap 4)" but with none of them (4) I get a nice UI. I lose the icons and/or get a small typography.

Timo-Breumelhof commented 5 years ago

@perezandres I have "Load Bootstrap" off and "Load Glyphicons" on. (see screen print above) with pop-ups switched off. But I did have the issue of the font getting small. This was caused by the fact that the skin set the size of the body font to a smaller pixel value (this Skin was BS 3 before).

body {
    font-size: 12px;
}

You should not do that with BS 4, it will lead to this and other styling issues I noticed. Set the font size on the html element and the rest will inherit using rem.

For the pop-up skin make sure it does not load bootstrap (which as @sachatrauwaen stated should not be needed by DNN)

perezandres commented 5 years ago

@Timo-Breumelhof

OK, with popups disabled and OC global settings as you I get icons back, but with a weird green colour. This is my fault, as I'm also using Material Design for Bootstrap. I guess I'll have to lighten a bit this web... ;-)

Thank you!