Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-11-27 12:36:14 +01:00
Code Issues Projects Releases Wiki Activity

expand vault to new window

Browse Source
This commit is contained in:
Kyle Spearrin 2017-06-09 15:10:22 -04:00
parent c6356504bb
commit d6f1a55d30
3 changed files with 45 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/popup/app/vault/vaultController.js
View File

@ -153,6 +153,11 @@
$timeout(loadVault, 500); $timeout(loadVault, 500);
}); });
$scope.expandVault = function (e) {
$analytics.eventTrack('Expand Vault');
chrome.tabs.create({ url: '/popup/index.html#!/tab/vault' });
};
function storeState() { function storeState() {
stateService.saveState(stateKey, { stateService.saveState(stateKey, {
scrollY: getScrollY(), scrollY: getScrollY(),

9
src/popup/app/vault/views/vault.html
View File

@ -1,11 +1,14 @@
<div class="header"> <div class="header header-search">
<div class="right"> <div class="left">
<a href="" ng-click="addLogin()"><i class="fa fa-plus fa-lg"></i></a> <a href="" ng-click="expandVault()"><i class="fa fa-external-link fa-rotate-270 fa-lg"></i></a>
</div> </div>
<div class="search"> <div class="search">
<input type="search" placeholder="{{i18n.searchVault}}" ng-model="searchText" id="search" /> <input type="search" placeholder="{{i18n.searchVault}}" ng-model="searchText" id="search" />
<i class="fa fa-search"></i> <i class="fa fa-search"></i>
</div> </div>
<div class="right">
<a href="" ng-click="addLogin()"><i class="fa fa-plus fa-lg"></i></a>
</div>
</div> </div>
<div class="content content-tabs"> <div class="content content-tabs">
<div ng-if="vaultLogins.length && vaultLogins.length >= 100 && vaultFolders.length && (!searchText || searchText.length < 2)"> <div ng-if="vaultLogins.length && vaultLogins.length >= 100 && vaultFolders.length && (!searchText || searchText.length < 2)">

50
src/popup/less/components.less
View File

@ -75,18 +75,34 @@
} }
} }
&.header-search {
.left, .right, .search {
display: table-cell;
position: relative;
}
.search { .search {
padding: 0 7px;
width: 100%;
text-align: left; text-align: left;
position: relative; position: relative;
.fa-search {
position: absolute;
top: 15px;
left: 15px;
color: lighten(@brand-primary, 30%);
}
input { input {
width: 100%;
margin: 0;
float: none;
background: darken(@brand-primary, 8%); background: darken(@brand-primary, 8%);
border: none; border: none;
color: white; color: white;
padding: 5px 10px 5px 30px; padding: 5px 10px 5px 30px;
border-radius: 5px; border-radius: 5px;
width: 85%;
margin: 7px 0 0 7px;
.placeholder-color(lighten(@brand-primary, 35%)); .placeholder-color(lighten(@brand-primary, 35%));
&:focus { &:focus {
@ -95,35 +111,17 @@
background: darken(@brand-primary, 10%); background: darken(@brand-primary, 10%);
} }
} }
.fa-search {
position: absolute;
top: 15px;
left: 15px;
color: lighten(@brand-primary, 30%);
}
}
&.header-search {
.left, .right, .search {
display: table-cell;
position: relative;
}
input {
width: 100%;
margin: 0;
float: none;
}
.search {
padding: 0 7px;
} }
a { a {
white-space: nowrap; white-space: nowrap;
float: none; float: none;
} }
.fa-external-link {
vertical-align: 0;
margin: 0 -5px 0 5px;
}
} }
} }
@ -264,7 +262,7 @@
right: 0; right: 0;
bottom: 0; bottom: 0;
height: 1px; height: 1px;
width: 97%; width: ~"calc(100% - 10px)";
border-bottom: 1px solid @border-color; border-bottom: 1px solid @border-color;
} }