Search result "close" link.

Permalink
Hello,
I like the in page search results and have it styled to be positioned absolutely and floating above everything else. So my question is there some sort of link I can use to close the search box when the person is done or didn't find what they wanted?

You can see an example here:http://subcm.org/index.php

braincramp
 
mattl replied on at Permalink Reply
i really like your implementation of the search, however i am curious as to what code you used to style the results like that. I would like something similar to use on my site.
braincramp replied on at Permalink Reply
braincramp
It is all CSS (and a little javascript to close the box). I just made some modifications to the search block:
<?php  defined('C5_EXECUTE') or die(_("Access Denied.")); ?> 
<div id="search">
<style>
#searchResults .pageLink{ color:#999; margin:2px 0px 8px 0px; padding:0px; display:block }
#searchResults .searchResult{ margin-bottom:0px; margin-top:0px }
#searchResults .searchResult h3{ margin-bottom:0px; padding-bottom:0px }
#searchResults .searchResult p{margin-top:4px}
</style>
<?php  if (isset($error)) { ?>
   <?php echo $error?><br/><br/>
<?php  } ?>
<form action="<?php echo $this->url( $resultTargetURL )?>" method="get">
   <fieldset>
   <?php  if( strlen($title)>0){ ?><h3><?php echo $title?></h3><?php  } ?>
   <?php  if(strlen($query)==0){ ?>

and then used this styling:
#search form fieldset {
   padding: 0px;
   border: none;
}
#searchResults {
   position: absolute;
   background: #fff;
   padding: .5em 1em;
   width: 40em;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   -webkit-box-shadow: #000 0px 4px 10px;
   margin-top: 1em;
   border: solid #909090 2px;
   white-space: normal;