Moving quick search to moderator bar?

[Dynamic]

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.

 

[TPerry]

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.

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

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

 

[Dynamic]

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.

 

[TPerry]

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.
The other option would be to make a new tab menu for search and just not display the box at all.

 

[Dynamic]

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 :/

 

[xenTheory]

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.

z-index should help with the overlap.

 

[Dynamic]

z-index should help with the overlap.

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?

 

[xenTheory]

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?

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

 

[Dynamic]

Yes...

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