clipperz/password-manager
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Added the mask to avoid switching card, when in editing mode.

Browse Source
This commit is contained in:
Giulio Cesare Solaroli 2014-08-27 18:03:37 +02:00
parent 44c51770d9
commit fc0805916e
2 changed files with 40 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
frontend/delta/js/Clipperz/PM/UI/Components/Cards/Edit.js
View File

@ -144,19 +144,22 @@ Clipperz.PM.UI.Components.Cards.Edit = React.createClass({
render: function () {
var classes = {
'edit': true
'edit': true
}
//console.log("RENDER CARD EDIT");
return React.DOM.div({'className':React.addons.classSet(classes)},[
Clipperz.PM.UI.Components.Cards.EditToolbar(this.props),
React.DOM.div({'className':'content'}, [
this.renderLabel(this.props['label']),
this.renderTags(this.props['tags']),
this.renderNotes(this.props['notes']),
this.renderFields(this.props['fields']),
this.renderAddNewField(),
this.renderDirectLogins(this.props['directLogins'])
return React.DOM.div({'className':'editWrapper'}, [
React.DOM.div({'className':'mask'}),
React.DOM.div({'className':React.addons.classSet(classes)},[
Clipperz.PM.UI.Components.Cards.EditToolbar(this.props),
React.DOM.div({'className':'content'}, [
this.renderLabel(this.props['label']),
this.renderTags(this.props['tags']),
this.renderNotes(this.props['notes']),
this.renderFields(this.props['fields']),
this.renderAddNewField(),
this.renderDirectLogins(this.props['directLogins'])
])
])
]);
},

33
frontend/delta/scss/core/layout.scss
View File

@ -265,29 +265,50 @@ div.cardContent {
@include flexbox();
& > div.view, & > div.edit {
div.editWrapper {
@include flex(auto);
@include mask();
@include flexbox;
& > div.edit {
@include flex(auto);
@include flexbox;
@include flex-direction(column);
position: relative;
z-index: 10+1;
.content {
background-color: yellow;
}
}
}
& > div.view /*, & > div.editWrapper > div.edit */ {
@include flex(auto);
@include flexbox;
@include flex-direction(column);
// .cardDetailToolbar {
// @include flex(none);
// height: $mainCardToolbarHeight;
// line-height: $mainCardToolbarHeight;
// }
.content {
@include flex(auto);
overflow-y: scroll;
}
}
.content {
@include flex(auto);
overflow-y: scroll;
}
}
}
#cardDetailPage {
& > .view, & > .edit {
& > .view, & > .editWrapper > .edit {
@include flexbox();
@include flex-direction(column);
height: 100%;