mirror of
http://git.whoc.org.uk/git/password-manager.git
synced 2025-10-29 18:37:35 +01:00
Merged Import and Export branches, implemented Giulio's remarks on Import feature
This commit is contained in:
@@ -209,9 +209,8 @@ html {
|
||||
|
||||
& > div {
|
||||
@include flex(auto);
|
||||
|
||||
overflow: auto;
|
||||
|
||||
// overflow: auto;
|
||||
@include overflow-scroll();
|
||||
}
|
||||
|
||||
footer {
|
||||
@@ -226,6 +225,20 @@ html {
|
||||
height: 100%;
|
||||
// background-color: rgba( 0, 0, 0, 0.95);
|
||||
background-color: black;
|
||||
|
||||
.extraFeature {
|
||||
// @include flexbox();
|
||||
height: 100%;
|
||||
|
||||
h1 {
|
||||
// @include flex(none);
|
||||
}
|
||||
.content {
|
||||
// @include flex(auto);
|
||||
height: 100%;
|
||||
@include overflow-scroll();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -529,7 +542,7 @@ div.dialogBox {
|
||||
height: 100%;
|
||||
|
||||
.mask {
|
||||
z-index: 12;
|
||||
z-index: 25;
|
||||
}
|
||||
div.dialog {
|
||||
@include flex(none);
|
||||
|
||||
@@ -178,7 +178,7 @@ refer to http://www.clipperz.com.
|
||||
}
|
||||
|
||||
@mixin overflow-scroll () {
|
||||
overflow: scroll;
|
||||
overflow: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
|
||||
@@ -126,6 +126,23 @@ div.overlay {
|
||||
div.bar11 {@include transform(300deg, 0, -142%); @include animation-delay(-0.16670s);}
|
||||
div.bar12 {@include transform(330deg, 0, -142%); @include animation-delay(-0.08330s);}
|
||||
}
|
||||
|
||||
.progressBar {
|
||||
// display: block;
|
||||
width: 100%;
|
||||
background-color: #222;
|
||||
height: 4px;
|
||||
margin-top: 86px;
|
||||
@include border-radius(2px);
|
||||
|
||||
.progress {
|
||||
background-color: #999;
|
||||
// width: 70%;
|
||||
height: 4px;
|
||||
display: block;
|
||||
@include border-radius(2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//========================================================
|
||||
|
||||
@@ -25,13 +25,17 @@ div.dialog {
|
||||
@include box-shadow(0px, 2px, 5px, rgba(50, 50, 50, 0.75));
|
||||
@include border-radius(8px);
|
||||
|
||||
max-width: 70%;
|
||||
background-color: white;
|
||||
padding: 30px;
|
||||
box-shadow: 4px 4px 6px 5px rgba(0,0,0, 0.3);
|
||||
|
||||
h3.message {
|
||||
font-size: 18pt;
|
||||
font-weight: bold;
|
||||
padding-bottom: 20px;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
div.answers {
|
||||
|
||||
@@ -49,8 +49,14 @@ refer to http://www.clipperz.com.
|
||||
// padding-right: 0px;
|
||||
border-bottom: 1px solid white;
|
||||
|
||||
& > h1 {
|
||||
cursor: pointer;
|
||||
font-size: 16pt;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
& > ul {
|
||||
padding-left: 10px;
|
||||
// padding-left: 10px;
|
||||
}
|
||||
|
||||
// &:last-child {
|
||||
@@ -68,11 +74,22 @@ refer to http://www.clipperz.com.
|
||||
li {
|
||||
& > ul > li {
|
||||
padding: 10px;
|
||||
padding-left: 20px;
|
||||
padding-right: 0px;
|
||||
cursor: pointer;
|
||||
|
||||
&.selected {
|
||||
background-color: #333;
|
||||
// color: black;
|
||||
}
|
||||
|
||||
& > div {
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
&.offlineCopy {
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
|
||||
&.open {
|
||||
@@ -83,13 +100,14 @@ refer to http://www.clipperz.com.
|
||||
|
||||
}
|
||||
|
||||
h1 {
|
||||
cursor: pointer;
|
||||
font-size: 16pt;
|
||||
padding: 10px;
|
||||
}
|
||||
// h1 {
|
||||
// cursor: pointer;
|
||||
// font-size: 16pt;
|
||||
// padding: 10px;
|
||||
// }
|
||||
|
||||
h2 {
|
||||
// cursor: pointer;
|
||||
font-weight: 300;
|
||||
font-size: 14pt;
|
||||
}
|
||||
@@ -157,6 +175,204 @@ refer to http://www.clipperz.com.
|
||||
display: none;
|
||||
}
|
||||
|
||||
.extraFeature {
|
||||
padding: 20px;
|
||||
|
||||
h1 {
|
||||
font-size: 20pt;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
form {
|
||||
|
||||
label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
input {
|
||||
$border-size: 0px; // 2px;
|
||||
|
||||
display: block;
|
||||
font-size: 18pt;
|
||||
margin-bottom: 8px;
|
||||
padding: (6px - $border-size) (10px - $border-size);
|
||||
border: $border-size solid white;
|
||||
width: 350px;
|
||||
color: black;
|
||||
|
||||
&.invalid {
|
||||
border: $border-size solid $clipperz-orange;
|
||||
color: gray;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
@include flexbox;
|
||||
@include flex-direction(row);
|
||||
|
||||
input {
|
||||
width: 30px;
|
||||
@include flex(auto);
|
||||
}
|
||||
|
||||
span {
|
||||
@include flex(auto);
|
||||
font-size: 12pt;
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
font-family: "clipperz-font";
|
||||
|
||||
color: white;
|
||||
font-size: 14pt;
|
||||
border: 0px;
|
||||
|
||||
margin-top: 20px;
|
||||
padding: 6px 10px;
|
||||
|
||||
border: 1px solid white;
|
||||
background-color: $main-color;
|
||||
@include transition(background-color font-weight, 0.2s, linear);
|
||||
|
||||
&:hover {
|
||||
};
|
||||
|
||||
&:disabled {
|
||||
font-weight: 100;
|
||||
background-color: #c0c0c0;
|
||||
cursor: default;
|
||||
|
||||
&:hover {
|
||||
};
|
||||
}
|
||||
}
|
||||
// input.valid:focus {
|
||||
// border: 2px solid $clipperz-blue;
|
||||
// }
|
||||
}
|
||||
|
||||
ul {
|
||||
color: white;
|
||||
|
||||
li {
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 18pt;
|
||||
}
|
||||
|
||||
.description {
|
||||
max-width: 500px;
|
||||
padding: 10px 0px 20px 0px;
|
||||
|
||||
p {
|
||||
font-size: 10pt;
|
||||
margin-bottom: 7px;
|
||||
line-height: 1.4em;
|
||||
color:#bbb;
|
||||
|
||||
em {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.button {
|
||||
display: inline-block;
|
||||
|
||||
color: white;
|
||||
background-color: $main-color;
|
||||
|
||||
font-size: 14pt;
|
||||
|
||||
border: 1px solid white;
|
||||
padding: 6px 10px;
|
||||
|
||||
&:after {
|
||||
};
|
||||
|
||||
&.disabled {
|
||||
background-color: #c0c0c0;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dataImport {
|
||||
.stepNavbar {
|
||||
li {
|
||||
display: inline-block;
|
||||
margin-right:1em;
|
||||
|
||||
&.disabled {
|
||||
color: gray;
|
||||
}
|
||||
|
||||
&.active {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.error {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width:100%;
|
||||
min-height:400px;
|
||||
display: block;
|
||||
margin: 1em 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.csvTable {
|
||||
background: white;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.dropArea {
|
||||
margin: 1em 0;
|
||||
width: calc(100% - 6px);
|
||||
text-align: center;
|
||||
height: inherit;
|
||||
line-height: 3em;
|
||||
|
||||
border: 3px dashed white;
|
||||
background: black;
|
||||
}
|
||||
|
||||
.button {
|
||||
margin-right:1em;
|
||||
}
|
||||
|
||||
.jsonPreview {
|
||||
width: 100%;
|
||||
height:80%;
|
||||
overflow: auto;
|
||||
margin-top:1em;
|
||||
|
||||
h3 {
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
ul {
|
||||
margin-bottom:1em;
|
||||
padding-left:1em;
|
||||
|
||||
li {
|
||||
.label {
|
||||
font-weight:bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
.changePassphraseForm {
|
||||
label {
|
||||
display: block;
|
||||
@@ -184,68 +400,17 @@ refer to http://www.clipperz.com.
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
/* IMPORT */
|
||||
.importForm {
|
||||
textarea {
|
||||
display: block;
|
||||
width:100%;
|
||||
min-height:400px;
|
||||
}
|
||||
}
|
||||
|
||||
.jsonPreview {
|
||||
width: 100%;
|
||||
height:80%;
|
||||
overflow: auto;
|
||||
margin-top:1em;
|
||||
|
||||
h3 {
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
ul {
|
||||
margin-bottom:1em;
|
||||
padding-left:1em;
|
||||
|
||||
li {
|
||||
.label {
|
||||
font-weight:bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* /IMPORT */
|
||||
|
||||
*/
|
||||
|
||||
form {
|
||||
input.valid + .invalidMsg, input.empty + .invalidMsg, input:focus + .invalidMsg, input.invalid:focus + .invalidMsg {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
input:focus {
|
||||
border: 2px solid $clipperz-orange;
|
||||
}
|
||||
|
||||
input.valid:focus {
|
||||
border: 2px solid $clipperz-blue;
|
||||
}
|
||||
|
||||
input.invalid + .invalidMsg {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.invalidMsg::before {
|
||||
font-family: serif;
|
||||
content: "\26A0 \0000a0";
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.mainPage.narrow {
|
||||
#extraFeaturesPanel {
|
||||
.extraFeatureContent {
|
||||
|
||||
Reference in New Issue
Block a user