Add support for the Nord Theme (#980)

* Add support for the Nord Theme as in Desktop and mobile apps

* Improves
This commit is contained in:
Miguel Crespo 2019-07-22 16:47:45 +02:00 committed by Kyle Spearrin
parent 0b68b106d6
commit 20425e5d67
4 changed files with 112 additions and 21 deletions

79
package-lock.json generated
View File

@ -2327,7 +2327,8 @@
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"aproba": {
"version": "1.2.0",
@ -2348,12 +2349,14 @@
"balanced-match": {
"version": "1.0.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
@ -2368,17 +2371,20 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"core-util-is": {
"version": "1.0.2",
@ -2495,7 +2501,8 @@
"inherits": {
"version": "2.0.3",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"ini": {
"version": "1.3.5",
@ -2507,6 +2514,7 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
@ -2521,6 +2529,7 @@
"version": "3.0.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
@ -2528,12 +2537,14 @@
"minimist": {
"version": "0.0.8",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"minipass": {
"version": "2.3.5",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"safe-buffer": "^5.1.2",
"yallist": "^3.0.0"
@ -2552,6 +2563,7 @@
"version": "0.5.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"minimist": "0.0.8"
}
@ -2632,7 +2644,8 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"object-assign": {
"version": "4.1.1",
@ -2644,6 +2657,7 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"wrappy": "1"
}
@ -2729,7 +2743,8 @@
"safe-buffer": {
"version": "5.1.2",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"safer-buffer": {
"version": "2.1.2",
@ -2765,6 +2780,7 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@ -2784,6 +2800,7 @@
"version": "3.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
@ -2827,12 +2844,14 @@
"wrappy": {
"version": "1.0.2",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"yallist": {
"version": "3.0.3",
"bundled": true,
"dev": true
"dev": true,
"optional": true
}
}
},
@ -5088,7 +5107,8 @@
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"aproba": {
"version": "1.2.0",
@ -5131,7 +5151,8 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"concat-map": {
"version": "0.0.1",
@ -5142,7 +5163,8 @@
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"core-util-is": {
"version": "1.0.2",
@ -5259,7 +5281,8 @@
"inherits": {
"version": "2.0.3",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"ini": {
"version": "1.3.5",
@ -5271,6 +5294,7 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
@ -5293,12 +5317,14 @@
"minimist": {
"version": "0.0.8",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"minipass": {
"version": "2.2.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"safe-buffer": "^5.1.1",
"yallist": "^3.0.0"
@ -5317,6 +5343,7 @@
"version": "0.5.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"minimist": "0.0.8"
}
@ -5397,7 +5424,8 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"object-assign": {
"version": "4.1.1",
@ -5409,6 +5437,7 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"wrappy": "1"
}
@ -5494,7 +5523,8 @@
"safe-buffer": {
"version": "5.1.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"safer-buffer": {
"version": "2.1.2",
@ -5530,6 +5560,7 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@ -5549,6 +5580,7 @@
"version": "3.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
@ -5592,12 +5624,14 @@
"wrappy": {
"version": "1.0.2",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"yallist": {
"version": "3.0.2",
"bundled": true,
"dev": true
"dev": true,
"optional": true
}
}
},
@ -9475,6 +9509,11 @@
"abbrev": "1"
}
},
"nord": {
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/nord/-/nord-0.2.1.tgz",
"integrity": "sha1-BE7Y4AMxyEqW3ExnDwgKclcsPPk="
},
"normalize-package-data": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.4.0.tgz",

View File

@ -98,6 +98,7 @@
"mousetrap": "1.6.2",
"ngx-infinite-scroll": "7.0.1",
"node-forge": "0.7.6",
"nord": "^0.2.1",
"papaparse": "4.6.0",
"rxjs": "6.3.3",
"sweetalert": "2.1.2",

View File

@ -1,4 +1,6 @@
$font-family-sans-serif: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
@import '~nord/src/sass/nord.scss';
$font-family-sans-serif: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
$font-family-monospace: Menlo, Monaco, Consolas, 'Courier New', monospace;
$font-size-base: 14px;
$font-size-large: 18px;
@ -128,6 +130,54 @@ $themes: (
passwordNumberColor: #52bdfb,
passwordSpecialColor: #ff7c70,
),
nord: (
textColor: $nord5,
borderColor: $nord0,
backgroundColor: $nord2,
backgroundColorAlt: $nord1,
backgroundColorAlt2: $nord1,
scrollbarColor: $nord4,
scrollbarHoverColor: $nord6,
boxBackgroundColor: $nord2,
boxBackgroundHoverColor: $nord3,
boxBorderColor: $nord1,
headerBackgroundColor: $nord2,
headerBorderColor: $nord0,
headerInputBackgroundColor: $nord6,
headerInputBackgroundFocusColor: $nord5,
headerInputColor: $nord2,
headerInputPlaceholderColor: $nord3,
listItemBackgroundColor: $nord2,
listItemBackgroundHoverColor: $nord3,
listItemBorderColor: $nord1,
groupingsActiveColor: $nord3,
disabledIconColor: $nord5,
headingColor: $nord4,
headingButtonColor: $nord5,
headingButtonHoverColor: $nord6,
labelColor: $nord4,
mutedColor: $nord4,
totpStrokeColor: $nord4,
boxRowButtonColor: $nord4,
boxRowButtonHoverColor: $nord6,
inputBorderColor: $nord0,
inputBackgroundColor: $nord2,
inputPlaceholderColor: lighten($nord3, 20%),
buttonBackgroundColor: $nord3,
buttonBorderColor: $nord0,
buttonColor: $nord5,
buttonPrimaryColor: $nord8,
buttonDangerColor: $nord11,
primaryColor: $nord9,
primaryAccentColor: $nord8,
dangerColor: $nord11,
successColor: $nord14,
infoColor: $nord9,
warningColor: $nord12,
logoSuffix: 'white',
passwordNumberColor: $nord8,
passwordSpecialColor: $nord12,
),
);
@mixin themify($themes: $themes) {

View File

@ -46,6 +46,7 @@ export class OptionsComponent implements OnInit {
{ name: i18nService.t('default'), value: null },
{ name: i18nService.t('light'), value: 'light' },
{ name: i18nService.t('dark'), value: 'dark' },
{ name: 'Nord', value: 'nord' },
];
this.uriMatchOptions = [
{ name: i18nService.t('baseDomain'), value: UriMatchType.Domain },