styles for header-search on vault view folder page

This commit is contained in:
Kyle Spearrin 2016-12-08 21:22:17 -05:00
parent 61f205b4b8
commit 98abc4ec8e
2 changed files with 22 additions and 8 deletions

View File

@ -1,14 +1,14 @@
<div class="header"> <div class="header header-search">
<div class="left"> <div class="left">
<a ui-sref="tabs.vault({animation: 'out-slide-right'})"><i class="fa fa-chevron-left"></i> {{i18n.myVault}}</a> <a ui-sref="tabs.vault({animation: 'out-slide-right'})"><i class="fa fa-chevron-left"></i> {{i18n.myVault}}</a>
</div> </div>
<div class="right">
<a href="" ng-click="addSite()"><i class="fa fa-plus fa-lg"></i></a>
</div>
<div class="search"> <div class="search">
<input type="search" placeholder="{{i18n.searchFolder}}" ng-model="searchText" ng-change="searchSites()" id="search" /> <input type="search" placeholder="{{i18n.searchFolder}}" ng-model="searchText" ng-change="searchSites()" id="search" />
<i class="fa fa-search"></i> <i class="fa fa-search"></i>
</div> </div>
<div class="right">
<a href="" ng-click="addSite()"><i class="fa fa-plus fa-lg"></i></a>
</div>
</div> </div>
<div class="content"> <div class="content">
<div ng-if="vaultSites.length" infinite-scroll="loadMore()" infinite-scroll-distance="1" infinite-scroll-parent="true" <div ng-if="vaultSites.length" infinite-scroll="loadMore()" infinite-scroll-distance="1" infinite-scroll-parent="true"

View File

@ -12,7 +12,6 @@
left: 0; left: 0;
right: 0; right: 0;
overflow: hidden; overflow: hidden;
position: relative;
a, button { a, button {
color: white !important; color: white !important;
@ -42,6 +41,7 @@
display: block; display: block;
position: absolute; position: absolute;
left: 0; left: 0;
text-align: left;
a, button { a, button {
padding: 12px 10px; padding: 12px 10px;
@ -104,11 +104,25 @@
} }
} }
.left ~ .right ~ .search { &.header-search {
margin-left: 92px; .left, .right, .search {
display: table-cell;
position: relative;
}
input { input {
width: 77%; width: 100%;
margin: 0;
float: none;
}
.search {
padding: 0 7px;
}
a {
white-space: nowrap;
float: none;
} }
} }
} }