"srch"
Bootstrap 3.3.0 Snippet by keldunningham

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <nav class="navbar navbar-default navbar-inverse navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand red animated pulse" href="https://cfsres.com"><b>CFSRES</b><sup><i>3.0</i></sup></a> </div> <div id="navbar" class="navbar-collapse navbar-ex1-collapse collapse"> <ul class="nav navbar-nav"> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><b>Feeds</b> <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="/feed"><b>Live Feed</b></a></li> <li><a href="/advanced"><b>Advanced Feed</b></a></li> <li><a href="/mobile"><b>Mobile Feed</b></a></li> <li><a href="/clean">Clean Feed</a></li> <li role="separator" class="divider"></li> <li class="dropdown-header">Filter by Agency</li> <li><a href="{{{script}}}?agency=FIRE">Fire (MFS, CFS)</a></li> <li><a href="{{{script}}}?agency=RESCUE">Fire & Rescue (MFS, CFS, SES)</a></li> <li><a href="{{{script}}}?agency=SES">SES</a></li> <li><a href="{{{script}}}?agency=CFS">CFS</a></li> <li><a href="{{{script}}}?agency=MFS">MFS</a></li> <li><a href="{{{script}}}?agency=SAAS">SAAS</a></li> <li><a href="{{{script}}}?agency=MARINE">MARINE</a></li> <li><a href="{{{script}}}?agency=WES">Woomera Emergency Services</a></li> <li role="separator" class="divider"></li> <li class="dropdown-header">CFS Region Filters</li> <li><a href="{{{script}}}?region=1">Region 1</a></li> <li><a href="{{{script}}}?region=2">Region 2</a></li> <li><a href="{{{script}}}?region=3">Region 3</a></li> <li><a href="{{{script}}}?region=4">Region 4</a></li> <li><a href="{{{script}}}?region=5">Region 5</a></li> <li><a href="{{{script}}}?region=6">Region 6</a></li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><span id="cogSelect"></span> <i class="fa fa-cog" aria-hidden="true"></i> <span class="caret"></span></a> <ul class="dropdown-menu"> <li class="dropdown-header">Sounds</li> <li><a><label class="checkbox-inline"><input id="playSoundFeed" type="checkbox" onchange="playSound=this.checked;">Response Chime</label></a></li> <li role="separator" class="divider"></li> <li class="dropdown-header">Themes</li> <li><a onclick="setActiveStyleSheet('normal');return false;" name="theme" id="normal">Normal</a></li> <li><a onclick="setActiveStyleSheet('dos');return false;" name="theme" id="dos">DOS</a></li> <li><a onclick="setActiveStyleSheet('big');return false;" name="theme" id="big">Big</a></li> <li><a onclick="setActiveStyleSheet('bandw');return false;" name="theme" id="bandw">Black & White</a></li> <li><a onclick="setActiveStyleSheet('wandb');return false;" name="theme" id="wandb">White & Black</a></li> <li><a onclick="setActiveStyleSheet('doze');return false;" name="theme" id="doze">Blue</a></li> <li><a onclick="setActiveStyleSheet('inverted');return false;" name="theme" id="inverted">Agency Colour Backgrounds</a></li> <li><a onclick="setActiveStyleSheet('bigsub');return false;" name="theme" id="bigsub">Mobile Size Swap</a></li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><b class="donate">Store</b> <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="https://store.cfsres.com/"><b>Push Messaging</b></a></li> <li><a href="https://store.cfsres.com/custom-api/">Custom API Solutions</a></li> <li><a href="https://store.cfsres.com/paging/">Paging Gateway</a></li> <li><a href="https://store.cfsres.com/turnout-response-display/"><b>Turnout Response Display</b></a></li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Extras <span class="caret"></span></a> <ul class="dropdown-menu"> <li class="dropdown-header">Member Access <span class="label label-danger">New</span></li> <li><a href="https://live.cfsres.com/water/">Water Hydrant Finder</a></li> <li><a href="https://live.cfsres.com/fdi_map/">Fire Danger Index (FDI) Map</a></li> <li role="separator" class="divider"></li> <li class="dropdown-header">State Incident Map</li> <li><a href="https://live.cfsres.com/state/CFS">CFS</a></li> <li><a href="https://live.cfsres.com/state/MFS">MFS</a></li> <li><a href="https://live.cfsres.com/state/SES">SES</a></li> <li><a href="https://live.cfsres.com/state/SAAS">SAAS</a></li> <li role="separator" class="divider"></li> <li class="dropdown-header">Misc.</li> <li><a href="https://cfsres.com/feedback/">Feedback</a></li> <li><a href="https://cfsres.com/fdi/">Grass FDI Calculator</a></li> <li><a href="https://cfsres.com/ffdi/">Forest FDI Calculator</a></li> <li><a href="https://cfsres.com/myemergencycrew/">MyEmergencyCrew Alerts</a></li> <li><a href="https://cfsres.com/ffrs/">FFRS Alerts</a></li> <li><a href="https://cfsres.com/search.php">Search Tips</a></li> <li><a href="https://cfsres.com/sagrn/">SAGRN Tower Locations</a></li> <li><a href="https://cfsres.com/locations/">SA Emergency Services Station Locations</a></li> <li><a href="https://cfsres.com/scanner/">SAGRN Radio Scanner</a></li> <li role="separator" class="divider"></li> <li class="dropdown-header">External Links</li> <li><a href="https://twitter.com/CFSRES_alerts" target="_blank">@CFSRES_Alerts (Twitter)</a></li> <li><a href="https://www.facebook.com/cfsres" target="_blank">CFSRES (Facebook)</a></li> <li><a href="https://www.facebook.com/groups/sagrnpaging/" target="_blank">SAGRN Paging Group (Facebook)</a></li> </ul> </li> <li><a href="https://cfsres.com/donate/"><b>Donate</b></a></li> <li> <input type="text" class="form-control" placeholder="Search for snippets" /> <div class="input-group-btn"> <div class="btn-group" role="group"> <div class="dropdown dropdown-lg"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><span class="caret"></span></button> <div class="dropdown-menu dropdown-menu-right" role="menu"> <form class="form-horizontal" role="form"> <div class="form-group"> <label for="filter">Filter by</label> <select class="form-control"> <option value="0" selected>All Snippets</option> <option value="1">Featured</option> <option value="2">Most popular</option> <option value="3">Top rated</option> <option value="4">Most commented</option> </select> </div> <div class="form-group"> <label for="contain">Author</label> <input class="form-control" type="text" /> </div> <div class="form-group"> <label for="contain">Contains the words</label> <input class="form-control" type="text" /> </div> <button type="submit" class="btn btn-primary"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></button> </form> </div> </div> <button type="button" class="btn btn-primary"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></button> </div> </div> </li> <li><div id="new_buffered"></div></li> </div> </ul> </div> </div>
body { padding-top: 50px; } .dropdown.dropdown-lg .dropdown-menu { margin-top: -1px; padding: 6px 20px; } .input-group-btn .btn-group { display: flex !important; } .btn-group .btn { border-radius: 0; margin-left: -1px; } .btn-group .btn:last-child { border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .btn-group .form-horizontal .btn[type="submit"] { border-top-left-radius: 4px; border-bottom-left-radius: 4px; } .form-horizontal .form-group { margin-left: 0; margin-right: 0; } .form-group .form-control:last-child { border-top-left-radius: 4px; border-bottom-left-radius: 4px; } @media screen and (min-width: 768px) { #adv-search { width: 240px; margin: 0 auto; } .dropdown.dropdown-lg { position: static !important; } .dropdown.dropdown-lg .dropdown-menu { min-width: 500px; } }

Related: See More


Questions / Comments: