1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Moving quick search to moderator bar?

Discussion in 'Styling and Customization Questions' started by Dynamic, Apr 8, 2013.

  1. Dynamic

    Dynamic Well-Known Member

    Hey guys,

    I am just wondering how one would go about moving the search field into the moderator bar and off the main page. I have modified the bar to include the visitor panel, and now I would like the search bar in there too. If possible, to sit in the middle of the modbar (like facebook) and on its own line, so when users on a mobile device view it, it automatically sits at the top. ( I have Arty's responsive addon installed).

    Thanks.
     
  2. Tracy Perry

    Tracy Perry Well-Known Member

    Play with the code to get it to where you want it. This should put it beside the username that allows profile access.

    Code:
    /* SIZE/POSITION/COLOR QUICK SEARCH BAR */
    #QuickSearch {
    position: absolute;
    right: 274px !important;
    top: -53px !important;
    }
     
  3. Dynamic

    Dynamic Well-Known Member

    Thanks for the info. I have it at a decent level so far. Is there a way to prevent it overlapping the visitor tabs? So when the screen is small, the visitor menu drops below the search bar?

    Thanks.
     
  4. Tracy Perry

    Tracy Perry Well-Known Member

    Not sure... I use Responsive Designs for the small screen stuff, so once it reaches a certain point it goes into a mobil format. I know when I resize my browser on my Mac (Chrome) to shrink the screen all the search bar does is disappear from view. You may want to see if you can get with Shelley as she is one of the local CSS styling guru's. :D
    The other option would be to make a new tab menu for search and just not display the box at all.
     
  5. Dynamic

    Dynamic Well-Known Member

    Yeah I looked into that. I am trying to make a wbb4 theme so I need it to sit in the mod bar. Hopefully someone else has some ideas... frustrating :/
     
  6. xenTheory

    xenTheory Active Member

    z-index should help with the overlap.
     
  7. Dynamic

    Dynamic Well-Known Member

    Tried it, it does not shift all the text above / below. Maybe I should just make it vanish when a small enough resolution is reached?
     
  8. xenTheory

    xenTheory Active Member

    Is z-index applied to the div with the text you want below?
     
  9. Dynamic

    Dynamic Well-Known Member

    Yes...

    I am stuck here, no idea how to move forward from this point. Hmmm...
     

Share This Page