0
Welcome Guest! Login
0 items Join Now

Changing the width of rokie6warn

    • prim's Avatar
    • prim
    • Preeminent Rocketeer
    • Posts: 17290
    • Thanks: 217

    Changing the width of rokie6warn

    Posted 16 years 7 months ago
    • How do i adjust the width of rokie6warn?

      As it is right now it uses 100% screen width which makes it hard to read if you have a big screen. I want to have it just as wide as the template itself which is 963 px i think.
      [me=prim]pokes James S![/me]
    • Please reply with a direct link to the issue & create a new thread for each new issue.

      A template is only as good as the content that goes into it ;) - DanG
  • Re: Changing the width of rokie6warn

    Posted 16 years 7 months ago
    • In rokie6warn.js, change
      this.box = new Element('div', {'id': 'iewarn'}).inject(document.body, 'top');

      To
      this.box = new Element('div', {'id': 'iewarn', 'class': 'wrapper'}).inject(document.body, 'top');

      That wil add the class of wrapper to the DIV so it will inherit the width of the template.
    • James Spencer / Developer & Support / Hull, UK
    • prim's Avatar
    • prim
    • Preeminent Rocketeer
    • Posts: 17290
    • Thanks: 217

    Re: Changing the width of rokie6warn

    Posted 16 years 7 months ago
    • Thank you James :)

      Now i just need to figure out how to remove that ugly grey background. See the screenshot :P
    • Please reply with a direct link to the issue & create a new thread for each new issue.

      A template is only as good as the content that goes into it ;) - DanG
  • Re: Changing the width of rokie6warn

    Posted 16 years 7 months ago
    • Right, change line18 and line19 to
      this.box = new Element('div', {'id': 'iewarn'}).inject(document.body, 'top');
      var wrapper = new Element('div', {'class': 'wrapper iewarn-sub'}).inject(this.box);
      var div = new Element('div').inject(wrapper).setHTML(warning);

      What this will do is create <div id="iewarn"> that will span the will width of the site. This is what you will apply your outer background to such as
      #iewarn { background: #fff; }

      Then you can add a different background to <div class="iewarn-sub"> such as
      .iewarn-sub { background: #eee; border-top: 3px solid #ccc; border-bottom: 3px solid #ccc; }

      So, change in template_Ie6.php
      /* ie6 warning */
      #iewarn {background: #C6D3DA url(../images/error.png) 10px 20px no-repeat;position: relative;z-index: 1;opacity: 0;margin: -150px auto 0;font-size: 110%;color: #001D29;z-index: 8000;}
      #iewarn div {position: relative;border-top: 5px solid #95B8C9;border-bottom: 5px solid #95B8C9;padding: 10px 80px 10px 220px;    }
      #iewarn h4 {color: #900;font-weight: bold;line-height: 120%;}
      #iewarn a {color: #296AC6;font-weight: bold;}
      #iewarn_close {background: url(../images/close.png) 50% 50% no-repeat;display: block;cursor: pointer;position: absolute;width: 61px;height: 21px;top: 25px;right: 12px;}
      #iewarn_close.cHover {background: url(../images/close_hover.png) 50% 50% no-repeat;}
      /* end ie6 warning */

      To
      //* ie6 warning */
      #iewarn { background: #cdcdcd; }
      .iewarn-sub {background: #C6D3DA url(../images/error.png) 10px 20px no-repeat;position: relative;z-index: 1;opacity: 1;margin: -150px auto 0;font-size: 110%;color: #001D29;z-index: 8000;}
      .iewarn-sub div {position: relative;border-top: 5px solid #95B8C9;border-bottom: 5px solid #95B8C9;padding: 10px 80px 10px 220px;}
      #iewarn h4 {color: #900;font-weight: bold;line-height: 120%;}
      #iewarn a {color: #296AC6;font-weight: bold;}
      #iewarn_close {background: url(../images/close.png) 50% 50% no-repeat;display: block;cursor: pointer;position: absolute;width: 61px;height: 21px;top: 25px;right: 12px;}
      #iewarn_close.cHover {background: url(../images/close_hover.png) 50% 50% no-repeat;}
      /* end ie6 warning */
    • Last Edit: 16 years 7 months ago by James Spencer.
    • James Spencer / Developer & Support / Hull, UK
  • Re: Changing the width of rokie6warn

    Posted 16 years 7 months ago
    • Updated the code above.
    • James Spencer / Developer & Support / Hull, UK

Time to create page: 0.300 seconds