Forums

Hi,
First of all, thanks for a great component.

I’m no pro in Joomla, but I know my way around CSS and view overrides. If I have understood correctly you include Bootstrap v3.0.2 precompiled in \libraries\cegcore\assets\bootstrap\css? I think this is causing me some trouble since this is loaded after the global template and hence overrides all my global styling like colors etc. in your component. Just for clarity, when the user is not on the forum the correct styling is shown. So the issue is that the global styles do not affect the forum.

I don’t want to override declarations already done in my template once more just because this component is loading after the template (at least that what I think is the problem). Which css files have you added your Chrono Forum stuff in? Is for example \libraries\cegcore\assets\bootstrap\css\bootstrap.css the original file? My thinking is to remove those Bootstrap files you have not altered, and load that via my template instead. Or what is your idea?

Have you instead considered to only include those Less files needed by your component? It’s also a bit easier to customize with Less rather than the CSS. What would be the best way to change the basic brand colors for text, headings etc. without going through hundreds of overwrite declarations and massive use of !important?

Kind Regards
Pierre

Hi Pierre,

You wouldn't need to do a lot of changes, few lines can do the changes you need, here is an example:
http://www.chronoengine.com/forums/posts/t96888/p333133/change-blue-headings.html#p333133

I had to include BS because some templates CSS would not be enough for the forums or would make it look very messy!

Regards,
Max

Hi,
Well, I now how to changes some individual tags like p, a, h1-h6 in the way you describe. And I would recommend anyone just looking to change the colors of the headings and text for example to use this method. But I would like this forum to keep the same look as everything else on my site. That's why I'm looking for a way to apply all changes I have done to style Bootstrap on the rest of my site. This is for example different font sizes, line heights, radius and basically all things that the less tag @brand-primary affects.

What I successfully did now was to make another theme, and basically clone my global template as a theme in the forum. I used the steps decsribed by ScratchUA in http://www.chronoengine.com/forums/posts/f30/t95307/how-to-make-custom-theme-with-bootstrap-theme-overrides.html. This worked like a charm, but I do believe that I'm now loading bootstrap and my template twice, which feels really stupid. Any ideas how to avoid this?

Kind Regards
Pierre

Hi Pierre,

Chronoforums loads bootstrap 3 by default, if you add your own forum theme then you can use the default theme file as a layout, the top section has some bootstrap overrides, you can simply alter that and add extra rules, that would not duplicate any files.

Regards,
Max

Hi Max,
What I was trying to avoid is that my site already loads BS3 and a whole lot of different styling both to Bootstrap and other things. Since I'm not only showing your component,but other stuff as well on the page, they need that styling (trough the template). When I created a theme and applied it to Chrono Forums I basically duplicated everything in my template as a "Theme". What I rather do is to create a more lightweight theme with only what is required by the template, in that way all things not specified by the Forum theme would be styled by my default template. Is that the forums.css only?

However, since forums.css is quite small, everything else is taken care by default bootstrap. How do I get that to load after the theme?

A short example of the "a" tag color attribute, it is styled in four different places.
1 \libraries\cegcore\assets\bootstrap\css\bootstrap.css
2 \templates\my_template\css\template.css
3 \templates\my_template\bootstrap\bootstrap.css
4 \components\com_chronoforums\chronoforums\styles\my_style\theme\my_theme.css

So both my forum theme and default template is overwritten by \libraries\cegcore\assets\bootstrap\css\bootstrap.css. Any suggestions to avoid loading bootstrap and other declarations more than once, and to control the order they are rendered?

Sorry for the confusion.
Kind Regards
Pierre

Pierre think we could get a "swatch" to work? In my case I need to have darkly working. I've got it going in the site template, but not in chrono, think we could simply replace the default bootstrap.css in chronoforums with darkly's .css?

think we could simply replace the default bootstrap.css in chronoforums with darkly's .css

If you have bootstrap 3 file loaded with the site template then you can rename Chronoforums bootstrap file and that should make it use the styles of the loaded file.

Regards,
Max

great, perhaps this should be an option in chrono 😀