How to change blockhead background color for Mobile Style?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • johnarce
    Member
    • Dec 2011
    • 65
    • 4.1.x

    [vB4] How to change blockhead background color for Mobile Style?

    How to change blockhead background color for Mobile Style?



    Thanks!
    Attached Files
  • demojames
    Member
    • Aug 2005
    • 59

    #2
    It will be in your jquery.mobile-1.0.min.css - but since the css code is all on one line it's kinda of a pain.

    I have already changed mine awhile back ago, so I can't remember what the original colors are.

    Look for
    Code:
    ui-bar-b{border:1px solid #color ;background #color
    and keeps going and you will need to change those too, the like the -webkit-linear-gradient, -ms-linear-gradient, -moz-linear-gradient it's all located in the same little group of code. This will also change the "blockhead" color through out the mobile version, ie forumhome, post, etc.

    The file is located in the /clientscript/jquery folder

    Make sure you back up your original css file, in case of any mistakes (and there will be some)!
    Demolition Forum - Forum Blog - Personal Blog

    Comment

    • Mermaid
      Senior Member
      • Mar 2008
      • 761
      • 3.6.x

      #3
      Originally posted by demojames
      It will be in your jquery.mobile-1.0.min.css - but since the css code is all on one line it's kinda of a pain.

      I have already changed mine awhile back ago, so I can't remember what the original colors are.
      #81a8ce #5e87b0

      Just search and replace those two,

      Comment

      • Mermaid
        Senior Member
        • Mar 2008
        • 761
        • 3.6.x

        #4
        You can paste this code (with the changed colours) into template: additional.css

        Code:
        .ui-bar-b {
            border: 1px solid #456f9a;
            background: #5e87b0;
            color: #fff;
            font-weight: bold;
            text-shadow: 0 -1px 1px #254f7a;
            background-image: -webkit-gradient(linear,left top,left bottom,from(#81a8ce),to(#5e87b0));
            background-image: -webkit-linear-gradient(#81a8ce,#5e87b0);
            background-image: -moz-linear-gradient(#81a8ce,#5e87b0);
            background-image: -ms-linear-gradient(#81a8ce,#5e87b0);
            background-image: -o-linear-gradient(#81a8ce,#5e87b0);
            background-image: linear-gradient(#81a8ce,#5e87b0)
        }
        To use additional CSS, paste this into the top of headinclude_bottom template

        Code:
        {vb:cssfile additional.css}

        Comment

        • johnarce
          Member
          • Dec 2011
          • 65
          • 4.1.x

          #5
          It's working, thanks

          Comment

          Related Topics

          Collapse

          Working...