0
Welcome Guest! Login
0 items Join Now

ROCKETTHEME IS CLOSING ON JUNE 30, 2025. As a thank-you to our community, enjoy 50% off all themes with the promo code THANKYOU before we shut down. Read our Farewell Blog Post for more details.

CSS-LESS explained?

Last Post
Search Topic

  • CSS-LESS explained?

    Posted 12 years 6 months ago
    #899069
    • Who?'s Avatar
    • Who?
    • Preeminent Rocketeer
    • Posts: 25562
    • Thanks: 613
    • Joomla freelancer

    Re: CSS-LESS explained?

    Posted 12 years 6 months ago
    • Forget about the fact the LESS is the source of the styling - as you are aware the LESS get compiled into CSS and it is this that you actually see in Firebug. Don't worry about where it came from, instead simply create a CSS statement that will override what you want to change. You do this by copying the elements of the styling your need from firebug and then adding a little more CSS specifity (google CSS specifity to find out how) to make your statements a little "heavier" than those in the compiled CSS (this will force the override). Obviously your statements should be put in a custom CSS file.

      This is how to create a custom CSS compatible with Gantry 4...

      Simply create a file called "<TEMPLATENAME>-custom.css" and put this file in the CSS folder of the template (where <TEMPLATENAME> is the name of the template e.g. rt_fracture). GANTRY4 will automatically load this CSS file. If you wish, you can also have browser specific files by appending, for example, "-ie9" making the filename "<TEMPLATENAME>-custom-ie9.css"

      You don't have to worry about RokGzipper any more. As a matter of fact, we don't even install it with our latest templates any more 8)
    • Check my services at: Mihha-Vision
    #899257

  • Re: CSS-LESS explained?

    Posted 12 years 4 months ago
    • Hello Igor,

      You said...
      You don't have to worry about RokGzipper any more. As a matter of fact, we don't even install it with our latest templates any more

      If this is true, then I recommend that this post about caching and compression be updated to reflect the changes: rockettheme.com/forum/index.php?f=485&p=688381&rb_v=viewtopic

      Additionally, that post mentions that Gantry GZipper compressed HTML in addition to scripts and CSS. However, I do not see Gantry GZipper included in the new templates. Is Gantry GZipper also out? If so, then do we only rely on Joomla's GZip option for HTML compression, or is there something else we should be doing?

      Thank you!
      D
    #921723
    • Cliff Pfeifer's Avatar
    • Cliff Pfeifer
    • Preeminent Rocketeer
    • Posts: 8444
    • Thanks: 20
    • Website Developer

    Re: CSS-LESS explained?

    Posted 12 years 4 months ago
    • That post still applies to our older templates, so that specific information is still relevant to many of our members.

      Any template that came after RokBooster was released (around May 2012) will use that instead of the old system, which pretty much accomplishes the same thing, only it's better for a lot of reasons.

      In reality, neither of these have much to do with the way LESS works.
    • The difficult we do immediately, the impossible takes a little longer.
    #921727

  • Re: CSS-LESS explained?

    Posted 12 years 4 months ago
    • Hi Cliff,

      Thank you for the clarification. Perhaps that post about caching and compression should be updated to explain that it only applies to templates produced through a certain date, then.

      Best regards,
      Daniel
    #922061

  • Re: CSS-LESS explained?

    Posted 12 years 3 months ago
    • Hi Igor

      "Simply create a file called "<TEMPLATENAME>-custom.css" and put this file in the CSS folder of the template (where <TEMPLATENAME> is the name of the template e.g. rt_fracture). GANTRY4 will automatically load this CSS file. "

      I simply cant make it work. I place the file in the CSS folder of that template, with correct name but it doesn't load.

      Any suggestions?
      Regin
    #932576
    • Who?'s Avatar
    • Who?
    • Preeminent Rocketeer
    • Posts: 25562
    • Thanks: 613
    • Joomla freelancer

    Re: CSS-LESS explained?

    Posted 12 years 3 months ago
    • Yes, I have a suggestion. Post URL to your site so I can take a look 8) I really don't understand why members think that we have some kind of a magic ball that will tell us everything they have in their minds and on their sites so we can provide answers without proper informations :oops:
    • Check my services at: Mihha-Vision
    #932684

  • Re: CSS-LESS explained?

    Posted 12 years 3 months ago
    • No need to be rude. Who said I expected magic from you?

      I am just saying that I did what you wrote above and it did not work.

      I had this code: rt-bg2 {
      background-image: url("../images/backgrounds/blue/top-bg-texture6.png");}
      And I pasted it into the CSS folder as prescribed above. And I cant make it work.
      I even tried:
      div .rt-bg2 {
      background-image: url("../images/backgrounds/blue/top-bg-texture6.png");}
      and more than 10 other combinations.

      So if I follow your instructions correct above, maybe my specificity isnt correct? But how would that then look?
    #932762
    • Who?'s Avatar
    • Who?
    • Preeminent Rocketeer
    • Posts: 25562
    • Thanks: 613
    • Joomla freelancer

    Re: CSS-LESS explained?

    Posted 12 years 3 months ago
    • You have to add "!important" at the end of your css code in order to override already defined css definitions in the template 8)
      rt-bg2 {
background-image: url("../images/backgrounds/blue/top-bg-texture6.png") !important;
}
    • Check my services at: Mihha-Vision
    #932986

  • Re: CSS-LESS explained?

    Posted 12 years 3 months ago
    • it works. Thank you Igor.

      /Regin
    #938289

Time to create page: 0.063 seconds