Isarra has submitted this change and it was merged.
Change subject: Style search some more, add an icon
......................................................................
Style search some more, add an icon
Change-Id: Id2ce1f3761f3948b647e638b5f130d5b5f9cc60a
---
M TimelessTemplate.php
A resources/images/search-ltr.png
A resources/images/search-ltr.svg
M resources/screen-desktop.less
4 files changed, 138 insertions(+), 29 deletions(-)
Approvals:
Isarra: Verified; Looks good to me, approved
diff --git a/TimelessTemplate.php b/TimelessTemplate.php
index cabe983..5ecae6c 100644
--- a/TimelessTemplate.php
+++ b/TimelessTemplate.php
@@ -197,26 +197,33 @@
}
/**
- * Outputs the logo and site title
+ * Outputs the search
*/
private function outputSearch() {
?>
- <form
- action="<?php $this->text( 'wgScript' ) ?>"
- role="search"
- class="mw-portlet"
- id="p-search"
- >
- <input type="hidden" name="title" value="<?php
$this->text( 'searchtitle' ) ?>" />
- <h3>
- <label for="searchInput"><?php echo
$this->getMsg( 'search' )->escaped() ?></label>
+ <div class="mw-portlet" id="p-search">
+ <h3<?php $this->html( 'userlangattributes' ) ?>>
+ <label for="searchInput"><?php $this->msg(
'search' ) ?></label>
</h3>
- <?php echo $this->makeSearchButton( 'go', array( 'id'
=> 'searchGoButton', 'class' => 'searchButton' ) ) ?>
- <div id="searchInput-container">
- <?php echo $this->makeSearchInput( array( "id"
=> "searchInput" ) ) ?>
- </div>
- <input type='hidden' name="title" value="<?php
$this->text( 'searchtitle' ) ?>"/>
- </form>
+ <form action="<?php $this->text( 'wgScript' ) ?>"
id="searchform">
+ <div id="simpleSearch">
+ <div id="searchInput-container">
+ <?php echo $this->makeSearchInput(
array( 'id' => 'searchInput' ) ); ?>
+ </div>
+ <?php
+ echo Html::hidden( 'title', $this->get(
'searchtitle' ) );
+ echo $this->makeSearchButton(
+ 'fulltext',
+ array( 'id' => 'mw-searchButton',
'class' => 'searchButton mw-fallbackSearchButton' )
+ );
+ echo $this->makeSearchButton(
+ 'go',
+ array( 'id' => 'searchButton', 'class'
=> 'searchButton' )
+ );
+ ?>
+ </div>
+ </form>
+ </div>
<?php
}
diff --git a/resources/images/search-ltr.png b/resources/images/search-ltr.png
new file mode 100644
index 0000000..1ab7f2d
--- /dev/null
+++ b/resources/images/search-ltr.png
Binary files differ
diff --git a/resources/images/search-ltr.svg b/resources/images/search-ltr.svg
new file mode 100644
index 0000000..1a4e6bb
--- /dev/null
+++ b/resources/images/search-ltr.svg
@@ -0,0 +1,93 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/";
+ xmlns:cc="http://creativecommons.org/ns#";
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
+ xmlns:svg="http://www.w3.org/2000/svg";
+ xmlns="http://www.w3.org/2000/svg";
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd";
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape";
+ width="5.6444445mm"
+ height="5.6444445mm"
+ viewBox="0 0 20 20"
+ id="svg2"
+ version="1.1"
+ inkscape:version="0.91 r13725"
+ sodipodi:docname="search-ltr.svg"
+
inkscape:export-filename="/media/shintaiden/home/rahah/mediawiki/skins/Timeless/resources/images/search-ltr.png"
+ inkscape:export-xdpi="90"
+ inkscape:export-ydpi="90">
+ <defs
+ id="defs4" />
+ <sodipodi:namedview
+ id="base"
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1.0"
+ inkscape:pageopacity="0.0"
+ inkscape:pageshadow="2"
+ inkscape:zoom="31.678384"
+ inkscape:cx="2.1751537"
+ inkscape:cy="17.916436"
+ inkscape:document-units="px"
+ inkscape:current-layer="layer1"
+ showgrid="true"
+ inkscape:snap-midpoints="true"
+ inkscape:snap-smooth-nodes="true"
+ inkscape:object-nodes="true"
+ inkscape:snap-intersection-paths="true"
+ inkscape:object-paths="true"
+ inkscape:snap-object-midpoints="true"
+ inkscape:snap-center="true"
+ inkscape:snap-bbox="true"
+ inkscape:window-width="3840"
+ inkscape:window-height="2124"
+ inkscape:window-x="1920"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ showguides="false"
+ fit-margin-top="0"
+ fit-margin-left="0"
+ fit-margin-right="0"
+ fit-margin-bottom="0">
+ <inkscape:grid
+ type="xygrid"
+ id="grid4136"
+ originx="-240"
+ originy="-2025" />
+ </sodipodi:namedview>
+ <metadata
+ id="metadata7">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage"; />
+ <dc:title></dc:title>
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <g
+ inkscape:label="Layer 1"
+ inkscape:groupmode="layer"
+ id="layer1"
+ transform="translate(-121,-16.362221)">
+ <path
+
style="opacity:1;fill:#888888;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+ d="m 129.49943,17.362699 c -1.91942,0 -3.83826,0.730845
-5.30273,2.195312 -2.92893,2.928936 -2.92893,7.678491 0,10.607422
2.92893,2.928931 7.67653,2.928934 10.60547,0 2.92894,-2.928936 2.92893,-7.67849
0,-10.607422 -1.46447,-1.464465 -3.38332,-2.195312 -5.30274,-2.195312 z m
0.0664,3 a 4.5,4.5 0 0 1 3.11523,1.316406 4.5,4.5 0 0 1 0,6.365234 4.5,4.5 0 0
1 -6.36328,0 4.5,4.5 0 0 1 0,-6.365234 4.5,4.5 0 0 1 3.24805,-1.316406 z"
+ id="path4140"
+ inkscape:connector-curvature="0" />
+ <rect
+
style="opacity:1;fill:#888888;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+ id="rect4171"
+ width="3"
+ height="9.000001"
+ x="72.490379"
+ y="114.15007"
+ ry="1.5"
+ transform="matrix(0.70710856,-0.707105,0.707105,0.70710856,0,0)" />
+ </g>
+</svg>
diff --git a/resources/screen-desktop.less b/resources/screen-desktop.less
index 9dc2492..7e64b0c 100644
--- a/resources/screen-desktop.less
+++ b/resources/screen-desktop.less
@@ -1,7 +1,8 @@
@import "variables.less";
.ts-inner {
- max-width: 1250px;
+ max-width: 1300px;
+ padding: 0 3em;
margin: auto;
}
#p-logo-text,
@@ -22,11 +23,12 @@
#mw-header-container {
position: fixed;
+ top: 0;
width: 100%;
background: @foreground;
color: @text-inverse;
height: 3em;
- border-bottom: solid @border @foreground2;
+ border-bottom: solid 1px @foreground2;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
}
@@ -50,28 +52,35 @@
/* SEARCH */
-#p-search {
+#simpleSearch {
box-shadow: inset 0 2px 2px 1px rgba(0, 0, 0, 0.1);
background: @background;
-}
-#searchInput-container {
- margin: .5em 8em 0 0;
+ margin: .5em 0 0 0;
+ position: relative;
+ border-top: solid 1px @foreground2;
}
#searchInput {
border: none;
margin: 0;
- width: 100%;
- height: 2.25em;
- padding-left: 1em;
+ height: 2.1em;
+ padding: .65em 4.5em .45em 2em;
box-shadow: none;
background: transparent;
+ width: 100%;
}
-#searchGoButton {
- float: right;
- width: 7.5em;
- height: 2.25em;
+#searchButton,
+#mw-searchButton {
+ position: absolute;
+ top: 0;
+ right: 1.5em;
+ width: 2.5em;
+ height: 2.5em;
border: none;
background: transparent;
+ text-indent: -99999px;
+ .background-image-svg('images/search-ltr.svg', 'images/search-ltr.png');
+ background-position: 50% 40%;
+ background-repeat: no-repeat;
}
--
To view, visit https://gerrit.wikimedia.org/r/250204
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Id2ce1f3761f3948b647e638b5f130d5b5f9cc60a
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/skins/Timeless
Gerrit-Branch: master
Gerrit-Owner: Isarra <[email protected]>
Gerrit-Reviewer: Isarra <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
