0
Welcome Guest! Login
0 items Join Now

SOLVED Afterburner 2 - Roksprocket 100% width

    • Alen's Avatar
    • Alen
    • Newbie
    • Posts: 5
    • Thanks: 0

    SOLVED Afterburner 2 - Roksprocket 100% width

    Posted 9 years 8 months ago
    • Hi,

      I woud like to have 100% width for roksprocket module showcase. It should strech all the ay to the sides.

      VisitMostar
    • Alen
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: SOLVED Afterburner 2 - Roksprocket 100% width

    Posted 9 years 8 months ago
    • Use this code...
      #rt-header > .rt-container, #rt-header > .rt-container .rt-grid-12 {
          width: 100%;
      }


      Add module class suffix " nomarginall nopaddingall" to that module (note leading space but don't add speechmarks).

      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 as seen in template manager e.g. rt_iridescent would be rt_iridescent-custom.css). 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"


      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • DanG's Avatar
    • DanG
    • Preeminent Rocketeer
    • Posts: 36750
    • Thanks: 3229
    • Custom work done

    Re: SOLVED Afterburner 2 - Roksprocket 100% width

    Posted 9 years 8 months ago
    • Hi Alen
      and welcome to the forums
      This image is hidden for guests.
      Please log in or register to see it.

      Alen wrote:
      Hi,

      I woud like to have 100% width for roksprocket module showcase. It should strech all the ay to the sides.

      VisitMostar

      Add this:
      #rt-header .rt-container {
          width: 100%;
      }
      #rt-header .rt-container .rt-grid-12 {
          width: 100%;
      }
      #rt-header .rt-container .rt-block {
          padding: 0;
          margin: 0;
      }
    • The following users have thanked you: Alen

    • Alen's Avatar
    • Alen
    • Newbie
    • Posts: 5
    • Thanks: 0

    Re: SOLVED Afterburner 2 - Roksprocket 100% width

    Posted 9 years 8 months ago
    • It worked like a charm :) Thank you

      One more thing, the title om image 1 is strange. How can I get it in the lower left corner and looking better maybe a bit like Chimera template?
    • Alen
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: SOLVED Afterburner 2 - Roksprocket 100% width

    Posted 9 years 8 months ago
    • Please turn off the autoplay so we can see the code without it constantly changing every few seconds.

      And in what why do you want it to look more like "chimera"? font ? alignment?

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • Alen's Avatar
    • Alen
    • Newbie
    • Posts: 5
    • Thanks: 0

    Re: SOLVED Afterburner 2 - Roksprocket 100% width

    Posted 9 years 8 months ago
    • MrT wrote:
      Please turn off the autoplay so we can see the code without it constantly changing every few seconds.

      And in what why do you want it to look more like "chimera"? font ? alignment?

      Regards, Mark.

      It is OFF now. I would like it to have the same font. Alignment should be in the lower left corner.

      Thank you verry much
    • Last Edit: 9 years 8 months ago by Alen.
    • Alen
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: SOLVED Afterburner 2 - Roksprocket 100% width

    Posted 9 years 8 months ago
    • Use this code...
      div.layout-slideshow .sprocket-features-content .sprocket-features-title {
          background-color: transparent;
          color: white !important;
          font-size: 4em;
      }

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • Alen's Avatar
    • Alen
    • Newbie
    • Posts: 5
    • Thanks: 0

    Re: SOLVED Afterburner 2 - Roksprocket 100% width

    Posted 9 years 8 months ago
    • MrT wrote:
      Use this code...
      div.layout-slideshow .sprocket-features-content .sprocket-features-title {
          background-color: transparent;
          color: white !important;
          font-size: 4em;
      }

      Regards, Mark.


      I got rid of the background but the font is not the same and the placment should be in the lower left corner in stead of the top.
    • Alen
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: SOLVED Afterburner 2 - Roksprocket 100% width

    Posted 9 years 8 months ago
    • ugh - I did that - just didn't copy and paste it right... sorry about that...
      div.layout-slideshow .sprocket-features-content {
          top: auto;
          bottom: 5%;
          left: 5%;
          right: 5%;
      }
      

      Please see this page for a tutorial on adding fonts to one of our templates http://www.gantry-framework.org/documentation/joomla/tutorials/adding-a-custom-font .

      The font used in Chimera is "walkway" http://www.fontsquirrel.com/fonts/walkway

      The statement required to change the font is:
      div.layout-slideshow .sprocket-features-content .sprocket-features-title {
         font-family: Arial, sans-serif;
      }
      (obviously add in the "walkway" font after you have loaded it...).

      Regards, Mark.
    • The following users have thanked you: Alen

    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • Alen's Avatar
    • Alen
    • Newbie
    • Posts: 5
    • Thanks: 0

    Re: SOLVED Afterburner 2 - Roksprocket 100% width

    Posted 9 years 8 months ago
    • MrT wrote:
      ugh - I did that - just didn't copy and paste it right... sorry about that...
      div.layout-slideshow .sprocket-features-content {
          top: auto;
          bottom: 5%;
          left: 5%;
          right: 5%;
      }
      

      Please see this page for a tutorial on adding fonts to one of our templates http://www.gantry-framework.org/documentation/joomla/tutorials/adding-a-custom-font .

      The font used in Chimera is "walkway" http://www.fontsquirrel.com/fonts/walkway

      The statement required to change the font is:
      div.layout-slideshow .sprocket-features-content .sprocket-features-title {
         font-family: Arial, sans-serif;
      }
      (obviously add in the "walkway" font after you have loaded it...).

      Regards, Mark.

      Thank you verry much MrT and DanG. I'm amazed by your fast and accurate support, specilly for free template.
    • Alen

Time to create page: 0.082 seconds