mirror of
http://git.whoc.org.uk/git/password-manager.git
synced 2024-11-14 07:59:02 +01:00
Misc SCSS fixes
- added edit mask shadow - updated icon font - updated card edit field action buttons layout - selection panel scroll
This commit is contained in:
Giulio Cesare Solaroli
parent
8ffe1505f7
commit
c21e074e14
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,6 +1,60 @@
|
||||
{
|
||||
"IcoMoonType": "selection",
|
||||
"icons": [
|
||||
{
|
||||
"icon": {
|
||||
"paths": [
|
||||
"M640.9 63.9c-141.4 0-256 114.6-256 256 0 19.6 2.2 38.6 6.4 56.9l-391.3 391.2v64l64 64h128l64-64v-64h64v-64h64v-64h128l70.8-70.8c18.7 4.3 38.1 6.6 58.1 6.6 141.4 0 256-114.6 256-256s-114.7-255.9-256-255.9zM384 512l-320 320v-64l320-320v64zM704 320c-35.3 0-64-28.7-64-64s28.7-64 64-64 64 28.7 64 64c0 35.3-28.7 64-64 64z"
|
||||
],
|
||||
"width": 896,
|
||||
"attrs": [],
|
||||
"isMulticolor": false,
|
||||
"tags": [
|
||||
"key"
|
||||
],
|
||||
"defaultCode": 61513,
|
||||
"grid": 16
|
||||
},
|
||||
"attrs": [],
|
||||
"properties": {
|
||||
"id": 91,
|
||||
"order": 23,
|
||||
"prevSize": 32,
|
||||
"code": 61513,
|
||||
"name": "key",
|
||||
"ligatures": "generate password"
|
||||
},
|
||||
"setIdx": 0,
|
||||
"iconIdx": 91
|
||||
},
|
||||
{
|
||||
"icon": {
|
||||
"paths": [
|
||||
"M512 192c-223.318 0-416.882 130.042-512 320 95.118 189.958 288.682 320 512 320 223.312 0 416.876-130.042 512-320-95.116-189.958-288.688-320-512-320zM764.45 361.704c60.162 38.374 111.142 89.774 149.434 150.296-38.292 60.522-89.274 111.922-149.436 150.296-75.594 48.218-162.89 73.704-252.448 73.704-89.56 0-176.858-25.486-252.452-73.704-60.158-38.372-111.138-89.772-149.432-150.296 38.292-60.524 89.274-111.924 149.434-150.296 3.918-2.5 7.876-4.922 11.86-7.3-9.96 27.328-15.41 56.822-15.41 87.596 0 141.382 114.616 256 256 256 141.382 0 256-114.618 256-256 0-30.774-5.452-60.268-15.408-87.598 3.978 2.378 7.938 4.802 11.858 7.302v0zM512 416c0 53.020-42.98 96-96 96s-96-42.98-96-96 42.98-96 96-96 96 42.982 96 96z"
|
||||
],
|
||||
"attrs": [],
|
||||
"isMulticolor": false,
|
||||
"tags": [
|
||||
"eye",
|
||||
"views",
|
||||
"vision",
|
||||
"visit"
|
||||
],
|
||||
"defaultCode": 58073,
|
||||
"grid": 16
|
||||
},
|
||||
"attrs": [],
|
||||
"properties": {
|
||||
"id": 823,
|
||||
"order": 21,
|
||||
"prevSize": 32,
|
||||
"code": 59854,
|
||||
"ligatures": "view password",
|
||||
"name": "eye"
|
||||
},
|
||||
"setIdx": 1,
|
||||
"iconIdx": 206
|
||||
},
|
||||
{
|
||||
"icon": {
|
||||
"paths": [
|
||||
@ -133,33 +187,6 @@
|
||||
"setIdx": 2,
|
||||
"iconIdx": 4
|
||||
},
|
||||
{
|
||||
"icon": {
|
||||
"paths": [
|
||||
"M832 448h-64v-192c0-141.384-114.616-256-256-256s-256 114.616-256 256v192h-64c-35.2 0-64 28.8-64 64v448c0 35.2 28.8 64 64 64h640c35.2 0 64-28.8 64-64v-448c0-35.2-28.8-64-64-64zM512 832c-35.346 0-64-28.654-64-64s28.654-64 64-64 64 28.654 64 64-28.654 64-64 64zM640 448h-256v-192c0-70.58 57.42-128 128-128s128 57.42 128 128v192z"
|
||||
],
|
||||
"attrs": [],
|
||||
"isMulticolor": false,
|
||||
"tags": [
|
||||
"lock",
|
||||
"secure",
|
||||
"private",
|
||||
"encrypted"
|
||||
],
|
||||
"grid": 16
|
||||
},
|
||||
"attrs": [],
|
||||
"properties": {
|
||||
"id": 136,
|
||||
"order": 8,
|
||||
"prevSize": 32,
|
||||
"code": 58889,
|
||||
"name": "lock",
|
||||
"ligatures": "password"
|
||||
},
|
||||
"setIdx": 2,
|
||||
"iconIdx": 5
|
||||
},
|
||||
{
|
||||
"icon": {
|
||||
"paths": [
|
||||
@ -181,7 +208,7 @@
|
||||
"order": 15,
|
||||
"prevSize": 32,
|
||||
"code": 58896,
|
||||
"name": "lock2",
|
||||
"name": "locked",
|
||||
"ligatures": "locked"
|
||||
},
|
||||
"setIdx": 2,
|
||||
@ -234,7 +261,7 @@
|
||||
"order": 13,
|
||||
"prevSize": 32,
|
||||
"code": 58881,
|
||||
"name": "menu2",
|
||||
"name": "menu",
|
||||
"ligatures": "menu"
|
||||
},
|
||||
"setIdx": 2,
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -71,7 +71,7 @@
|
||||
&.selection {
|
||||
@include flex($selectionPanelFlexWidth, 0);
|
||||
// height: 100%;
|
||||
// overflow-y: scroll;
|
||||
@include overflow-scroll;
|
||||
}
|
||||
|
||||
&.cardContent {
|
||||
@ -319,6 +319,8 @@ div.cardContent {
|
||||
@include flexbox;
|
||||
@include flex-direction(column);
|
||||
|
||||
box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.75);
|
||||
|
||||
position: relative;
|
||||
z-index: 10+1;
|
||||
|
||||
@ -340,14 +342,6 @@ div.cardContent {
|
||||
|
||||
@include flexbox;
|
||||
@include flex-direction(column);
|
||||
|
||||
|
||||
// .cardDetailToolbar {
|
||||
// @include flex(none);
|
||||
// height: $mainCardToolbarHeight;
|
||||
// line-height: $mainCardToolbarHeight;
|
||||
// }
|
||||
|
||||
}
|
||||
|
||||
.content {
|
||||
@ -364,41 +358,7 @@ div.cardContent {
|
||||
@include flexbox();
|
||||
@include flex-direction(column);
|
||||
height: 100%;
|
||||
/*
|
||||
.cardDetailToolbar {
|
||||
@include flex(none);
|
||||
height: $mainCardToolbarHeight;
|
||||
line-height: $mainCardToolbarHeight;
|
||||
|
||||
&.commands > div {
|
||||
@include flexbox();
|
||||
@include flex-direction(row);
|
||||
// font-size: 24pt;
|
||||
|
||||
.back {
|
||||
@include flex(auto);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.cardMenuOptions {
|
||||
@include flex(auto);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
&.edit {
|
||||
ul {
|
||||
@include flexbox();
|
||||
@include flex-direction(row);
|
||||
|
||||
li {
|
||||
@include flex(auto);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
*/
|
||||
.content {
|
||||
@include flex(auto);
|
||||
overflow-y: scroll;
|
||||
|
||||
@ -165,3 +165,26 @@
|
||||
&::-moz-placeholder {@content}
|
||||
&:-ms-input-placeholder {@content}
|
||||
}
|
||||
|
||||
@mixin cursor-grab () {
|
||||
cursor: grab;
|
||||
cursor: -moz-grab;
|
||||
cursor: -webkit-grab;
|
||||
}
|
||||
|
||||
@mixin cursor-grabbing () {
|
||||
cursor: grabbing;
|
||||
cursor: -moz-grabbing;
|
||||
cursor: -webkit-grabbing;
|
||||
}
|
||||
|
||||
@mixin dotted-background () {
|
||||
// http://codepen.io/aleprieto/pen/nAmIy
|
||||
background-image: -webkit-repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
|
||||
background-image: -moz-repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
|
||||
background-image: -ms-repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
|
||||
background-image: repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
|
||||
-webkit-background-size: 3px 3px;
|
||||
-moz-background-size: 3px 3px;
|
||||
background-size: 3px 3px;
|
||||
}
|
||||
|
||||
@ -1,5 +1,8 @@
|
||||
.accountStatus {
|
||||
background-color: green;
|
||||
padding: 3px;
|
||||
font-size: 10pt;
|
||||
border-bottom: 1px solid white;
|
||||
|
||||
&.FULL {
|
||||
display: none;
|
||||
@ -24,4 +27,18 @@
|
||||
&.EXPIRED {
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
&.OFFLINE_COPY {
|
||||
background-color: $clipperz-blue;
|
||||
color: white;
|
||||
|
||||
.expirationDate {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.referenceDate {
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -204,6 +204,9 @@ $cardViewBasePadding: 10px;
|
||||
padding: 5px 10px;
|
||||
border-bottom: 1px solid black;
|
||||
|
||||
&.disabled {
|
||||
color: #ddd;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -278,6 +281,11 @@ $cardViewBasePadding: 10px;
|
||||
ul {
|
||||
li {
|
||||
text-align: center;
|
||||
|
||||
&.disabled {
|
||||
color: #333;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -360,8 +368,10 @@ $cardViewBasePadding: 10px;
|
||||
|
||||
display: block;
|
||||
margin: $iconMargin;
|
||||
margin-top: 12px;
|
||||
cursor: pointer;
|
||||
color: #ccc;
|
||||
width: 40px;
|
||||
font-size: 20pt;
|
||||
|
||||
&:hover {
|
||||
@ -369,21 +379,35 @@ $cardViewBasePadding: 10px;
|
||||
};
|
||||
}
|
||||
|
||||
.toggleLock {
|
||||
@include align-self(flex-end);
|
||||
@include icon-font();
|
||||
.dragHandler {
|
||||
// @include dotted-background();
|
||||
@include cursor-grab();
|
||||
|
||||
background: repeating-linear-gradient(
|
||||
0deg,
|
||||
white,
|
||||
white 2px,
|
||||
#ddd 2px,
|
||||
#ddd 3px
|
||||
);
|
||||
|
||||
width: 28px;
|
||||
height: 20px;
|
||||
margin-left: 6px;
|
||||
display: block;
|
||||
margin: $iconMargin;
|
||||
margin-left: $iconMargin * 2;
|
||||
cursor: pointer;
|
||||
color: #ccc;
|
||||
font-size: 20pt;
|
||||
/*
|
||||
@include icon-font();
|
||||
color: #aaa;
|
||||
|
||||
&:hover {
|
||||
color: #888;
|
||||
font-size: 15pt;
|
||||
margin: $iconMargin;
|
||||
margin-left: 10px;
|
||||
*/
|
||||
&:active {
|
||||
@include cursor-grabbing();
|
||||
};
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.fieldValues {
|
||||
@ -427,21 +451,41 @@ $cardViewBasePadding: 10px;
|
||||
@include flex(none);
|
||||
// @include align-self(center);
|
||||
@include align-self(flex-start);
|
||||
}
|
||||
|
||||
.action {
|
||||
span {
|
||||
display: block;
|
||||
|
||||
&.action {
|
||||
@include icon-font();
|
||||
color: #aaa;
|
||||
|
||||
// width: 32px;
|
||||
width: 20px;
|
||||
// height: 32px;
|
||||
height: 20px;
|
||||
// font-size: 20pt;
|
||||
font-size: 15pt;
|
||||
margin: $iconMargin;
|
||||
}
|
||||
|
||||
&.toggleLock {
|
||||
@include align-self(flex-end);
|
||||
@include icon-font();
|
||||
|
||||
display: block;
|
||||
margin: $iconMargin;
|
||||
margin-left: 9px;
|
||||
padding-top: 10px;
|
||||
cursor: pointer;
|
||||
color: #ccc;
|
||||
font-size: 18pt;
|
||||
|
||||
&:hover {
|
||||
color: #888;
|
||||
};
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.newCardField {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
background-color: $main-alternate-color;
|
||||
color: $main-alternate-text-color;
|
||||
font-size: 18pt;
|
||||
@include overflow-scroll;
|
||||
|
||||
// height: 100%;
|
||||
|
||||
$iconColumnWidth: 40px;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user