Define common styles for search boxes

Thomas Bruederli

2014-05-20 79babb69ab39a6b511d8a776aed6f7642a9eedbd

Define common styles for search boxes

 skins/classic/common.css

@@ -748,18 +748,25 @@

/***** mac-style quicksearch field *****/

div.searchbox,
#quicksearchbar
{
  position: absolute;
  top: 55px;
  right: 10px;
  position: relative;
  width: 190px;
  height: 20px;
  text-align: right;
  background: url(images/searchfield.gif) top left no-repeat;
}

#searchreset
#quicksearchbar
{
  position: absolute;
  top: 55px;
  right: 10px;
}

#searchreset,
div.searchbox a.searchreset
{
  position: absolute;
  top: 3px;
@@ -767,11 +774,33 @@
  text-decoration: none;
}

#searchmenulink
#searchmenulink,
div.searchbox a.searchmenu,
div.searchbox a.searchicon
{
 position: absolute;
 top: 3px;
 right: 168px;
}

div.searchbox a.searchreset
{
  display: block;
  width: 14px;
  height: 14px;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 50000px;
  background: url(images/icons/reset.gif) top left no-repeat;
}

div.searchbox a.searchicon
{
  display: inline-block;
  width: 16px;
  height: 16px;
  overflow: hidden;
  background: url(images/icons/glass.png) top left no-repeat;
}

#quicksearchbar img
@@ -779,7 +808,8 @@
  vertical-align: middle;
}

#quicksearchbox
#quicksearchbox,
div.searchbox > input
{
  position: absolute;
  top: 2px;

 skins/classic/mail.css

@@ -1860,7 +1860,7 @@
  color: #999;
}

#compose-contacts #quicksearchbar
#compose-contacts .searchbox
{
  top: 2px;
  left: 7px;

 skins/classic/templates/compose.html

@@ -50,7 +50,7 @@
<div id="compose-contacts">
<div class="boxtitle"><roundcube:label name="contacts" /></div>
<div class="boxlistcontent">
    <div id="quicksearchbar">
    <div class="searchbox">
        <img id="searchmenulink" src="/images/icons/glass.png" width="16" height="16" />
        <roundcube:object name="searchform" id="quicksearchbox" form="true" tabindex="13" />
        <roundcube:button command="reset-search" id="searchreset" image="/images/icons/reset.gif" title="resetsearch" width="13" height="13" />