How to move search to middle of header controller?

1073
2
02-16-2017 08:23 AM
MattMcLees
New Contributor II

How does one go about moving the search to the middle of the header controller for the default Jewelry Box theme? Sorry if this is a noob question. I'm having some trouble figuring out how all the CSS elements fit together.

0 Kudos
2 Replies
RobertScheitlin__GISP
MVP Esteemed Contributor

Matt,

  What you are asking for is no simple css change. The search widget in that layout of the Jewlerybox theme is absolutely positioned to the right of the header controller and all the widget icons a margin-ed and set to the left to make room for the search dijit to be there. Your desired change would involve trying to figure some js code to get the center of the app and then half the Search widgets width (275 px) and setting the search widgets left property to that value and also setting the padding/margins of the other header components to account for the search dijits position. You would have to update this in code each time the browser is re-sized. This has my head hurting even as experienced JS developer.

0 Kudos
MattMcLees
New Contributor II

Hi Robert,

Thanks for the response. What you are saying makes sense. I was hoping to be able to grab a theme that was similar to what I needed and tweak it. It's now clear I'll have to develop my own theme with a header. I can then mess with resizing the search widget. Kind of like this example I just found:Interactive Map - County of Simcoe (GIS) 

0 Kudos