dan/api_docs
1
0
Fork 0
mirror of https://github.com/danbulant/api_docs synced 2026-05-24 12:27:29 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Updates search field markup and style

Browse source 
Signed-off-by: Christopher Rogers <chrissrogers@gmail.com>
This commit is contained in:
Christopher Rogers 2014-04-10 17:47:01 -07:00
parent f2d1387971
commit 59ee05c606
3 changed files with 31 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
source/javascripts/app/search.js
View file

@ -29,7 +29,7 @@
} }
function bind () { function bind () {
$('#search').on('keyup', function () { $('#input-search').on('keyup', function () {
if (this.value) { if (this.value) {
var items = index.search(this.value); var items = index.search(this.value);
$('section, #toc .tocify-item').hide(); $('section, #toc .tocify-item').hide();

4
source/layouts/layout.erb
View file

@ -38,7 +38,9 @@ under the License.
<body class="<%= page_classes %>"> <body class="<%= page_classes %>">
<div class="tocify-wrapper"> <div class="tocify-wrapper">
<%= image_tag "logo.png" %> <%= image_tag "logo.png" %>
<input type="text" id="search" placeholder="search"> <div class="search">
<input type="text" class="search" id="input-search">
</div>
<div id="toc"> <div id="toc">
</div> </div>
<% if current_page.data.toc_footers %> <% if current_page.data.toc_footers %>

30
source/stylesheets/screen.css.scss
View file

@ -54,13 +54,37 @@ html, body {
// This is the logo at the top of the ToC // This is the logo at the top of the ToC
&>img { &>img {
display: block; display: block;
margin-bottom: $logo-margin; }
&>.search {
position: relative;
input {
background: $nav-bg;
border-width: 0 0 1px 0;
border-color: $nav-footer-border-color;
padding: 6px 0 6px 20px;
box-sizing: border-box;
margin: 10px 15px;
width: $nav-width - 30;
outline: none;
color: $nav-text;
letter-spacing: 0.07em;
}
&:before {
@extend %icon-search;
position: absolute;
top: 16px;
left: 15px;
color: $nav-text;
}
} }
.tocify-item>a, .toc-footer li { .tocify-item>a, .toc-footer li {
padding: 0 $nav-padding 0 $nav-padding; padding: 0 $nav-padding 0 $nav-padding;
display:block; display: block;
overflow-x:hidden; overflow-x: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
} }