mirror of
https://github.com/phpbb/phpbb.git
synced 2025-04-21 16:22:22 +02:00
Merge remote-tracking branch 'hanakin/ticket/12598' into develop-ascraeus
* hanakin/ticket/12598: [ticket/12598] Fix sir typo [ticket/12598] Fix rtl positon in header [ticket/12598] Remove right border [ticket/12598] Remove border from .search-header [ticket/12598] Replace #search-box with class [ticket/12598] Remove hover border-color and use hover icon [ticket/12598] Add some responsive margin to give breathing room [ticket/12598] Clean up unused link colors [ticket/12598] Remove unused link colors [ticket/12598] Add lt IE9 fixes [ticket/12598] Improve search box styling
This commit is contained in:
commit
ae14b0f272
@ -69,17 +69,18 @@
|
||||
<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
|
||||
</div>
|
||||
|
||||
<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
|
||||
<div id="search-box">
|
||||
<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
|
||||
<div id="search-box" class="search-box search-header">
|
||||
<form action="{U_SEARCH}" method="get" id="search">
|
||||
<fieldset>
|
||||
<input name="keywords" id="keywords" type="search" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search" value="{SEARCH_WORDS}" placeholder="{L_SEARCH_MINI}" />
|
||||
<input class="button2" value="{L_SEARCH}" type="submit" /><br />
|
||||
<a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a> {S_SEARCH_HIDDEN_FIELDS}
|
||||
<input name="keywords" id="keywords" type="search" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search tiny" size="20" value="{SEARCH_WORDS}" placeholder="{L_SEARCH_MINI}" />
|
||||
<button class="button icon-button search-icon" type="submit" title="{L_SEARCH}">{L_SEARCH}</button>
|
||||
<a href="{U_SEARCH}" class="button icon-button search-adv-icon" title="{L_SEARCH_ADV}">{L_SEARCH_ADV}</a>
|
||||
{S_SEARCH_HIDDEN_FIELDS}
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
<!-- ENDIF -->
|
||||
<!-- ENDIF -->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
@ -12,16 +12,17 @@
|
||||
<!-- ENDIF -->
|
||||
|
||||
<!-- IF .pagination or SEARCH_MATCHES or PAGE_NUMBER -->
|
||||
<form method="post" action="{S_SEARCH_ACTION}">
|
||||
|
||||
<div class="action-bar top">
|
||||
|
||||
<!-- IF SEARCH_MATCHES -->
|
||||
<div class="search-box">
|
||||
<!-- IF SEARCH_IN_RESULTS -->
|
||||
<label for="add_keywords">{L_SEARCH_IN_RESULTS}{L_COLON} <input type="search" name="add_keywords" id="add_keywords" value="" class="inputbox narrow" /></label>
|
||||
<input class="button2" type="submit" name="submit" value="{L_SEARCH}" />
|
||||
<!-- ENDIF -->
|
||||
<form method="post" action="{S_SEARCH_ACTION}">
|
||||
<fieldset>
|
||||
<input class="inputbox search tiny" type="search" name="add_keywords" id="add_keywords" value="" placeholder="{L_SEARCH_IN_RESULTS}" />
|
||||
<button class="button icon-button search-icon" type="submit" title="{L_SEARCH}">{L_SEARCH}</button>
|
||||
<a href="{U_SEARCH}" class="button icon-button search-adv-icon" title="{L_SEARCH_ADV}">{L_SEARCH_ADV}</a>
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
<!-- ENDIF -->
|
||||
|
||||
@ -34,8 +35,6 @@
|
||||
<!-- ENDIF -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
<!-- ENDIF -->
|
||||
|
||||
<!-- IF S_SHOW_TOPICS -->
|
||||
|
@ -50,7 +50,8 @@
|
||||
<form method="get" id="forum-search" action="{S_SEARCHBOX_ACTION}">
|
||||
<fieldset>
|
||||
<input class="inputbox search tiny" type="search" name="keywords" id="search_keywords" size="20" placeholder="{L_SEARCH_FORUM}" />
|
||||
<input class="button2" type="submit" value="{L_SEARCH}" />
|
||||
<button class="button icon-button search-icon" type="submit" title="{L_SEARCH}">{L_SEARCH}</button>
|
||||
<a href="{U_SEARCH}" class="button icon-button search-adv-icon" title="{L_SEARCH_ADV}">{L_SEARCH_ADV}</a>
|
||||
{S_SEARCH_LOCAL_HIDDEN_FIELDS}
|
||||
</fieldset>
|
||||
</form>
|
||||
|
@ -42,7 +42,8 @@
|
||||
<form method="get" id="topic-search" action="{S_SEARCHBOX_ACTION}">
|
||||
<fieldset>
|
||||
<input class="inputbox search tiny" type="search" name="keywords" id="search_keywords" size="20" placeholder="{L_SEARCH_TOPIC}" />
|
||||
<input class="button2" type="submit" value="{L_SEARCH}" />
|
||||
<button class="button icon-button search-icon" type="submit" title="{L_SEARCH}">{L_SEARCH}</button>
|
||||
<a href="{U_SEARCH}" class="button icon-button search-adv-icon" title="{L_SEARCH_ADV}">{L_SEARCH_ADV}</a>
|
||||
{S_SEARCH_LOCAL_HIDDEN_FIELDS}
|
||||
</fieldset>
|
||||
</form>
|
||||
|
@ -25,24 +25,8 @@
|
||||
padding: 10px 10px 0 13px;
|
||||
}
|
||||
|
||||
/* Search box
|
||||
/* Site Description
|
||||
--------------------------------------------- */
|
||||
.rtl #search-box {
|
||||
float: left;
|
||||
text-align: left;
|
||||
margin-right: 0;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.rtl #search-box li {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.rtl #search-box img {
|
||||
margin-right: 0;
|
||||
margin-left: 3px;
|
||||
}
|
||||
|
||||
.rtl #site-description {
|
||||
float: right;
|
||||
}
|
||||
@ -643,6 +627,11 @@ li.breadcrumbs span:first-child > a {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.rtl .buttons .button, .rtl .dropdown-select {
|
||||
margin-left: 5px;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
/* Icon images
|
||||
---------------------------------------- */
|
||||
.rtl .small-icon {
|
||||
@ -947,16 +936,40 @@ li.breadcrumbs span:first-child > a {
|
||||
float: left;
|
||||
}
|
||||
|
||||
/* Form button styles
|
||||
/* Search box
|
||||
---------------------------------------- */
|
||||
|
||||
/* Topic and forum Search */
|
||||
.rtl .search-box {
|
||||
margin-right: 5px;
|
||||
margin-left: 0;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.rtl .search-box .inputbox {
|
||||
border-left-width: 0;
|
||||
border-right-width: 1px;
|
||||
border-radius: 0 4px 4px 0;
|
||||
float: right;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.rtl .search-box .button {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.rtl .search-box a.button {
|
||||
border-left-width: 1px;
|
||||
border-right-width: 0;
|
||||
border-radius: 4px 0 0 4px;
|
||||
padding-left: 5px;
|
||||
padding-right: 3px;
|
||||
}
|
||||
|
||||
.rtl .search-header {
|
||||
float: left;
|
||||
margin-right: 0;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.rtl input.search {
|
||||
background-position: right 1px;
|
||||
padding-right: 17px;
|
||||
@ -967,6 +980,10 @@ li.breadcrumbs span:first-child > a {
|
||||
* tweaks.css
|
||||
*/
|
||||
|
||||
|
||||
/* Form button styles
|
||||
---------------------------------------- */
|
||||
|
||||
/** Reference: Bug #27155 */
|
||||
.rtl #wrap, .rtl .headerbar, .rtl #site-description, .rtl .navbar {
|
||||
position: relative;
|
||||
|
@ -85,7 +85,7 @@
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.tools-icon:before, .modtools-icon:before {
|
||||
.tools-icon:before, .modtools-icon:before, .search-icon:before, .search-adv-icon:before {
|
||||
background-position: -80px 0;
|
||||
height: 16px;
|
||||
margin-top: 2px;
|
||||
@ -95,6 +95,12 @@
|
||||
.dropdown-visible .tools-icon:before,
|
||||
.nojs .dropdown-container:hover .tools-icon:before { background-position: -80px -20px; }
|
||||
|
||||
.search-icon:before { background-position: -245px 0; }
|
||||
.search-icon:hover:before { background-position: -245px -20px; }
|
||||
|
||||
.search-adv-icon:before { background-position: -265px 0; }
|
||||
.search-adv-icon:hover:before { background-position: -265px -20px; }
|
||||
|
||||
.modtools-icon:before { background-position: -225px 0; }
|
||||
.dropdown-visible .modtools-icon:before,
|
||||
.nojs .dropdown-container:hover .modtools-icon:before { background-position: -225px -20px; }
|
||||
@ -239,3 +245,9 @@ ul.linklist.bulletin > li.small-icon:before {
|
||||
.hasjs .postbody .post-buttons {
|
||||
max-width: 40%;
|
||||
}
|
||||
|
||||
/* Browser-specific tweaks */
|
||||
button::-moz-focus-inner {
|
||||
padding: 0;
|
||||
border: 0
|
||||
}
|
||||
|
@ -29,16 +29,15 @@ hr {
|
||||
/* Search box
|
||||
--------------------------------------------- */
|
||||
|
||||
#search-box {
|
||||
color: #FFFFFF;
|
||||
.search-box .inputbox,
|
||||
.search-box .inputbox:hover,
|
||||
.search-box .inputbox:focus,
|
||||
.search-box .button:hover {
|
||||
border-color: #C7C3BF;
|
||||
}
|
||||
|
||||
#search-box #keywords {
|
||||
background-color: #FFF;
|
||||
}
|
||||
|
||||
#search-box input {
|
||||
border-color: #0075B0;
|
||||
.search-header {
|
||||
box-shadow: 0 0 10px #0075B0;
|
||||
}
|
||||
|
||||
/* Round cornered boxes and backgrounds
|
||||
@ -249,11 +248,11 @@ a { color: #105289; }
|
||||
a:hover { color: #D31141; }
|
||||
|
||||
/* Links on gradient backgrounds */
|
||||
#search-box a, .navbg a, .forumbg .header a, .forabg .header a, th a {
|
||||
.forumbg .header a, .forabg .header a, th a {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
#search-box a:hover, .navbg a:hover, .forumbg .header a:hover, .forabg .header a:hover, th a:hover {
|
||||
.forumbg .header a:hover, .forabg .header a:hover, th a:hover {
|
||||
color: #A8D8FF;
|
||||
}
|
||||
|
||||
|
@ -212,45 +212,10 @@ ol ol ul, ol ul ul, ul ol ul, ul ul ul {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Search box
|
||||
--------------------------------------------- */
|
||||
#search-box {
|
||||
position: relative;
|
||||
margin-top: 30px;
|
||||
margin-right: 5px;
|
||||
display: block;
|
||||
float: right;
|
||||
text-align: right;
|
||||
white-space: nowrap; /* For Opera */
|
||||
}
|
||||
|
||||
#search-box #keywords {
|
||||
width: 95px;
|
||||
}
|
||||
|
||||
#search-box input {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
/* .button1 style defined later, just a few tweaks for the search button version */
|
||||
#search-box input.button1 {
|
||||
padding: 1px 5px;
|
||||
}
|
||||
|
||||
#search-box li {
|
||||
text-align: right;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
#search-box img {
|
||||
vertical-align: middle;
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
/* Site description and logo */
|
||||
#site-description {
|
||||
float: left;
|
||||
width: 70%;
|
||||
width: 65%;
|
||||
}
|
||||
|
||||
#site-description h1 {
|
||||
@ -1117,7 +1082,7 @@ ul.linklist:after,
|
||||
.action-bar:after,
|
||||
.notification_text:after,
|
||||
.tabs-container:after,
|
||||
#tabs > ul:after,
|
||||
#tabs > ul:after,
|
||||
#minitabs > ul:after,
|
||||
.postprofile .avatar-container:after {
|
||||
clear: both;
|
||||
|
@ -289,6 +289,10 @@ input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-s
|
||||
display: none;
|
||||
}
|
||||
|
||||
input[type="search"]::-webkit-search-cancel-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Form button styles
|
||||
---------------------------------------- */
|
||||
input.button1, input.button2 {
|
||||
@ -352,12 +356,62 @@ input.button1:focus, input.button2:focus, input.button3:focus {
|
||||
|
||||
/* Topic and forum Search */
|
||||
.search-box {
|
||||
margin-top: 3px;
|
||||
margin-left: 5px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.search-box input {
|
||||
.search-box .inputbox {
|
||||
background-image: none;
|
||||
border-right-width: 0;
|
||||
border-radius: 4px 0 0 4px;
|
||||
float: left;
|
||||
height: 24px;
|
||||
padding: 3px;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.search-box button {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.search-box button.search-icon {
|
||||
border-radius: 0;
|
||||
font-size: 0;
|
||||
height: 24px;
|
||||
margin: 0;
|
||||
padding: 3px 5px;
|
||||
}
|
||||
|
||||
.search-box a.button {
|
||||
border-left-width: 0;
|
||||
border-radius: 0 4px 4px 0;
|
||||
font-size: 0;
|
||||
margin: 0;
|
||||
padding: 2px 5px 2px 3px;
|
||||
}
|
||||
|
||||
/* Search box (header)
|
||||
--------------------------------------------- */
|
||||
.search-header {
|
||||
border-radius: 4px;
|
||||
display: block;
|
||||
float: right;
|
||||
margin-right: 5px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.search-header .inputbox { border: 0; }
|
||||
|
||||
.search-header button {
|
||||
border-top: 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.search-header a.button {
|
||||
border: 0;
|
||||
border-left: 1;
|
||||
padding: 3px 5px 3px 4px;
|
||||
}
|
||||
|
||||
input.search {
|
||||
@ -371,4 +425,3 @@ input.search {
|
||||
.medium { width: 50%;}
|
||||
.narrow { width: 25%;}
|
||||
.tiny { width: 10%;}
|
||||
|
||||
|
Binary file not shown.
Before Width: | Height: | Size: 6.3 KiB After Width: | Height: | Size: 7.8 KiB |
@ -18,11 +18,11 @@ a:hover { text-decoration: underline; }
|
||||
}
|
||||
|
||||
/* Links on gradient backgrounds */
|
||||
#search-box a, .navbg a, .forumbg .header a, .forabg .header a, th a {
|
||||
.forumbg .header a, .forabg .header a, th a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#search-box a:hover, .navbg a:hover, .forumbg .header a:hover, .forabg .header a:hover, th a:hover {
|
||||
.forumbg .header a:hover, .forabg .header a:hover, th a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
|
@ -60,7 +60,7 @@ body {
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
#site-description p, #search-box {
|
||||
#site-description p, .search-header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -351,6 +351,13 @@ fieldset.quick-login label[for="autologin"] {
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 430px), only screen and (max-device-width: 430px)
|
||||
{
|
||||
.section-viewtopic .search-box .inputbox {
|
||||
width: 110px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 320px), only screen and (max-device-width: 320px)
|
||||
{
|
||||
select, .inputbox {
|
||||
@ -511,9 +518,13 @@ fieldset.display-actions {
|
||||
p.responsive-center {
|
||||
float: none;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.action-bar > div {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.action-bar > .pagination {
|
||||
float: none;
|
||||
clear: both;
|
||||
@ -525,7 +536,7 @@ fieldset.display-actions {
|
||||
margin: 0 2px;
|
||||
}
|
||||
|
||||
.action-bar > div.search-box, p.jumpbox-return {
|
||||
p.jumpbox-return {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
@ -20,8 +20,10 @@ dd label input { vertical-align: text-bottom\9; }
|
||||
.postprofile .avatar img { max-width: 150px\9; }
|
||||
|
||||
|
||||
|
||||
/* IE 9 Tweaks
|
||||
------------------------------------------------------------------------------*/
|
||||
|
||||
|
||||
/* Border-radius bleed fix in IE9 */
|
||||
.search-header, .search-header .inputbox, .search-header a.button {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user