0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-17 09:52:29 +01:00

clean up search form in navbar, add new variable for placeholder text color

This commit is contained in:
Mark Otto 2012-03-10 16:15:54 -08:00
parent f4ac080f9e
commit a3e9fc547c
6 changed files with 21 additions and 25 deletions

Binary file not shown.

View File

@ -2881,10 +2881,8 @@ input[type="submit"].btn.btn-small {
font-weight: normal;
line-height: 1;
color: #ffffff;
color: rgba(255, 255, 255, 0.75);
background: #666;
background: rgba(255, 255, 255, 0.3);
border: 1px solid #111;
background-color: #626262;
border: 1px solid #000000;
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 0px rgba(255, 255, 255, 0.15);
-moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 0px rgba(255, 255, 255, 0.15);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 0px rgba(255, 255, 255, 0.15);
@ -2894,16 +2892,11 @@ input[type="submit"].btn.btn-small {
-o-transition: none;
transition: none;
}
.navbar-search .search-query :-moz-placeholder {
color: #eeeeee;
.navbar-search .search-query:-moz-placeholder {
color: #cccccc;
}
.navbar-search .search-query ::-webkit-input-placeholder {
color: #eeeeee;
}
.navbar-search .search-query:hover {
color: #ffffff;
background-color: #999999;
background-color: rgba(255, 255, 255, 0.5);
.navbar-search .search-query::-webkit-input-placeholder {
color: #cccccc;
}
.navbar-search .search-query:focus,
.navbar-search .search-query.focused {

View File

@ -327,6 +327,8 @@
<input type="text" class="span3" placeholder="transparent">
<label>@navbarLinkBackgroundActive</label>
<input type="text" class="span3" placeholder="@navbarBackground">
<label>@navbarSearchPlaceholderColor</label>
<input type="text" class="span3" placeholder="#ccc">
<h3>Dropdowns</h3>
<label>@dropdownBackground</label>

View File

@ -251,6 +251,8 @@
<input type="text" class="span3" placeholder="transparent">
<label>@navbarLinkBackgroundActive</label>
<input type="text" class="span3" placeholder="@navbarBackground">
<label>@navbarSearchPlaceholderColor</label>
<input type="text" class="span3" placeholder="#ccc">
<h3>{{_i}}Dropdowns{{/i}}</h3>
<label>@dropdownBackground</label>

View File

@ -127,23 +127,20 @@
padding: 4px 9px;
#font > .sans-serif(13px, normal, 1);
color: @white;
color: rgba(255,255,255,.75);
background: #666;
background: rgba(255,255,255,.3);
border: 1px solid #111;
background-color: lighten(@navbarBackground, 25%);
border: 1px solid darken(@navbarBackground, 15%);
@shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0px rgba(255,255,255,.15);
.box-shadow(@shadow);
.transition(none);
// Placeholder text gets special styles; can't be bundled together though for some reason
.placeholder(@grayLighter);
// Hover states
&:hover {
color: @white;
background-color: @grayLight;
background-color: rgba(255,255,255,.5);
// Placeholder text gets special styles; can't be a grouped selector
&:-moz-placeholder {
color: @navbarSearchPlaceholderColor;
}
&::-webkit-input-placeholder {
color: @navbarSearchPlaceholderColor;
}
// Focus states (we use .focused since IE7-8 and down doesn't support :focus)
&:focus,
&.focused {

View File

@ -149,6 +149,8 @@
@navbarLinkBackgroundHover: transparent;
@navbarLinkBackgroundActive: @navbarBackground;
@navbarSearchPlaceholderColor: #ccc;
// Hero unit
// -------------------------