From e72323ba14e228f2abef2e31d0e0684d4a0bb856 Mon Sep 17 00:00:00 2001 From: Tom Kirkpatrick Date: Fri, 29 Jun 2018 21:37:45 +0200 Subject: [PATCH 1/8] style: ensure component stylesheets lint Update glob pattern in stylesheet lint scripts to ensure all stylesheets are linted. Fix #513 --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 94b20519..0ea97b6d 100644 --- a/package.json +++ b/package.json @@ -16,9 +16,9 @@ "lint-fix-base": "npm run lint-base -- --fix", "lint-fix": "npm run lint-fix-base -- \"./**/*.{js,json,md}\"", "lint-styles-base": "stylelint --syntax scss", - "lint-styles": "npm run lint-styles-base -- app/*.scss app/components/*.scss", + "lint-styles": "npm run lint-styles-base -- app/*.scss app/components/**/*.scss", "lint-styles-fix-base": "npm run lint-styles-base -- --fix", - "lint-styles-fix": "npm run lint-styles-fix-base -- app/*.scss app/components/*.scss", + "lint-styles-fix": "npm run lint-styles-fix-base -- app/*.scss app/components/**/*.scss", "lint-check": "eslint --print-config .eslintrc.js | eslint-config-prettier-check", "lint-ci": "npm run lint && npm run lint-styles && npm run flow", "package": "npm run build && build --publish never", From efdc26b72f4e119851402339cc2eddaf715aac23 Mon Sep 17 00:00:00 2001 From: Tom Kirkpatrick Date: Sun, 1 Jul 2018 16:06:51 +0200 Subject: [PATCH 2/8] style: install stylelint-formatter-pretty --- package.json | 3 ++- yarn.lock | 10 ++++++++++ 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 0ea97b6d..adf2321e 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,7 @@ "lint": "npm run lint-base -- .", "lint-fix-base": "npm run lint-base -- --fix", "lint-fix": "npm run lint-fix-base -- \"./**/*.{js,json,md}\"", - "lint-styles-base": "stylelint --syntax scss", + "lint-styles-base": "stylelint --custom-formatter=node_modules/stylelint-formatter-pretty", "lint-styles": "npm run lint-styles-base -- app/*.scss app/components/**/*.scss", "lint-styles-fix-base": "npm run lint-styles-base -- --fix", "lint-styles-fix": "npm run lint-styles-fix-base -- app/*.scss app/components/**/*.scss", @@ -211,6 +211,7 @@ "style-loader": "^0.21.0", "stylelint": "9.3.0", "stylelint-config-standard": "^18.2.0", + "stylelint-formatter-pretty": "^1.0.3", "url-loader": "^1.0.1", "webpack": "^4.12.0", "webpack-bundle-analyzer": "^2.13.1", diff --git a/yarn.lock b/yarn.lock index c69da6b0..3e52021b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -10905,6 +10905,16 @@ stylelint-config-standard@^18.2.0: dependencies: stylelint-config-recommended "^2.1.0" +stylelint-formatter-pretty@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/stylelint-formatter-pretty/-/stylelint-formatter-pretty-1.0.3.tgz#a6b43c3f3a13206bdfb777d0da8cefc6c76c36c3" + dependencies: + ansi-escapes "^2.0.0" + chalk "^1.1.3" + log-symbols "^1.0.2" + plur "^2.1.2" + string-width "^2.0.0" + stylelint@9.3.0: version "9.3.0" resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-9.3.0.tgz#fe176e4e421ac10eac1a6b6d9f28e908eb58c5db" From 2d6dec5afb0aa6464ea4934653d2d2b77aee0044 Mon Sep 17 00:00:00 2001 From: Tom Kirkpatrick Date: Sat, 30 Jun 2018 23:34:02 +0200 Subject: [PATCH 3/8] style: run all stylesheets through stylelint --- app/components/Activity/ActivityModal.scss | 4 ++-- app/components/Activity/Countdown.scss | 2 +- app/components/Activity/InvoiceModal.scss | 2 +- app/components/Activity/PaymentModal.scss | 3 +-- app/components/Activity/TransactionModal.scss | 2 +- app/components/Contacts/AddChannel.scss | 11 +++++----- app/components/Contacts/ChannelForm.scss | 8 ++++---- app/components/Contacts/ConnectManually.scss | 8 ++++---- app/components/Contacts/ContactModal.scss | 1 - app/components/Contacts/ContactsForm.scss | 3 +-- app/components/Contacts/Network.scss | 20 +++++++++---------- app/components/Form/Form.scss | 4 ++-- app/components/Form/Pay.scss | 4 ++-- app/components/Form/Request.scss | 2 +- app/components/Onboarding/Alias.scss | 2 +- app/components/Onboarding/FormContainer.scss | 2 +- app/components/Onboarding/InitWallet.scss | 4 ++-- app/components/Onboarding/Login.scss | 2 +- app/components/Onboarding/NewWalletSeed.scss | 2 +- app/components/Onboarding/Signup.scss | 2 +- app/components/Wallet/ReceiveModal.scss | 7 +++---- app/components/Wallet/Wallet.scss | 4 ++-- 22 files changed, 47 insertions(+), 52 deletions(-) diff --git a/app/components/Activity/ActivityModal.scss b/app/components/Activity/ActivityModal.scss index eeafdf6c..752daf8b 100644 --- a/app/components/Activity/ActivityModal.scss +++ b/app/components/Activity/ActivityModal.scss @@ -8,11 +8,11 @@ .closeContainer { text-align: right; - padding: 20px 40px 0px; + padding: 20px 40px 0; span { cursor: pointer; - opacity: 1.0; + opacity: 1; transition: 0.25s all; &:hover { diff --git a/app/components/Activity/Countdown.scss b/app/components/Activity/Countdown.scss index 9f71c674..724ff663 100644 --- a/app/components/Activity/Countdown.scss +++ b/app/components/Activity/Countdown.scss @@ -13,4 +13,4 @@ .caption { margin-right: 4px; -} \ No newline at end of file +} diff --git a/app/components/Activity/InvoiceModal.scss b/app/components/Activity/InvoiceModal.scss index b805b647..3e9bef70 100644 --- a/app/components/Activity/InvoiceModal.scss +++ b/app/components/Activity/InvoiceModal.scss @@ -97,7 +97,7 @@ text-align: right; .notPaid { - color: #FF8A65; + color: #ff8a65; margin-top: 5px; } } diff --git a/app/components/Activity/PaymentModal.scss b/app/components/Activity/PaymentModal.scss index d7a648af..27982c82 100644 --- a/app/components/Activity/PaymentModal.scss +++ b/app/components/Activity/PaymentModal.scss @@ -1,5 +1,4 @@ @import '../../variables.scss'; - @import '../../variables.scss'; .container { @@ -123,4 +122,4 @@ p { cursor: pointer; } -} \ No newline at end of file +} diff --git a/app/components/Activity/TransactionModal.scss b/app/components/Activity/TransactionModal.scss index 15c875c8..ef32a751 100644 --- a/app/components/Activity/TransactionModal.scss +++ b/app/components/Activity/TransactionModal.scss @@ -132,4 +132,4 @@ opacity: 0.5; } } -} \ No newline at end of file +} diff --git a/app/components/Contacts/AddChannel.scss b/app/components/Contacts/AddChannel.scss index eda5f64a..0b94138b 100644 --- a/app/components/Contacts/AddChannel.scss +++ b/app/components/Contacts/AddChannel.scss @@ -13,7 +13,7 @@ display: flex; flex-direction: row; justify-content: space-between; - background: linear-gradient(270deg, #868B9F 0%, #333C5E 100%); + background: linear-gradient(270deg, #868b9f 0%, #333c5e 100%); padding: 15px 10px; color: $white; @@ -42,7 +42,7 @@ } .nodes { - background: #31343F; + background: #31343f; .networkResults { overflow-y: auto; @@ -93,7 +93,6 @@ .inactive { font-size: 10px; - display: inline-block; vertical-align: top; @@ -128,14 +127,14 @@ } div { - background: #383B47; + background: #383b47; font-size: 16px; padding: 10px; cursor: pointer; transition: all 0.25s; &:hover { - background: lighten(#383B47, 10%); + background: lighten(#383b47, 10%); } } -} \ No newline at end of file +} diff --git a/app/components/Contacts/ChannelForm.scss b/app/components/Contacts/ChannelForm.scss index 7f3d3a21..727aed95 100644 --- a/app/components/Contacts/ChannelForm.scss +++ b/app/components/Contacts/ChannelForm.scss @@ -6,16 +6,16 @@ z-index: 10; height: 100vh; width: 100%; - background: #31343F; + background: #31343f; } .closeContainer { text-align: right; - padding: 20px 40px 0px; + padding: 20px 40px 0; span { cursor: pointer; - opacity: 1.0; + opacity: 1; transition: 0.25s all; &:hover { @@ -26,4 +26,4 @@ svg { color: $white; } -} \ No newline at end of file +} diff --git a/app/components/Contacts/ConnectManually.scss b/app/components/Contacts/ConnectManually.scss index 5dac74ab..a43094e0 100644 --- a/app/components/Contacts/ConnectManually.scss +++ b/app/components/Contacts/ConnectManually.scss @@ -6,16 +6,16 @@ z-index: 10; height: 100vh; width: 100%; - background: #31343F; + background: #31343f; } .closeContainer { text-align: right; - padding: 20px 40px 0px; + padding: 20px 40px 0; span { cursor: pointer; - opacity: 1.0; + opacity: 1; transition: 0.25s all; &:hover { @@ -128,7 +128,7 @@ &.active { background: $gold; - opacity: 1.0; + opacity: 1; &:hover { background: darken($gold, 5%); diff --git a/app/components/Contacts/ContactModal.scss b/app/components/Contacts/ContactModal.scss index 6745ece0..fbdd225b 100644 --- a/app/components/Contacts/ContactModal.scss +++ b/app/components/Contacts/ContactModal.scss @@ -63,7 +63,6 @@ } .stats { - h4 { color: $secondary; font-weight: bold; diff --git a/app/components/Contacts/ContactsForm.scss b/app/components/Contacts/ContactsForm.scss index b74265fc..acc88f1f 100644 --- a/app/components/Contacts/ContactsForm.scss +++ b/app/components/Contacts/ContactsForm.scss @@ -95,7 +95,6 @@ .inactive { font-size: 12px; - display: inline-block; vertical-align: top; @@ -255,4 +254,4 @@ -moz-animation: animation-rotate 1000ms linear infinite; -o-animation: animation-rotate 1000ms linear infinite; animation: animation-rotate 1000ms linear infinite; -} \ No newline at end of file +} diff --git a/app/components/Contacts/Network.scss b/app/components/Contacts/Network.scss index 0fc91a6b..d88de693 100644 --- a/app/components/Contacts/Network.scss +++ b/app/components/Contacts/Network.scss @@ -13,7 +13,7 @@ display: flex; flex-direction: row; justify-content: space-between; - background: #2D303B; + background: #2d303b; padding: 10px 20px; color: $white; @@ -48,7 +48,7 @@ } .channels { - padding: 20px 0px 20px 0px; + padding: 20px 0 20px 0; overflow-y: auto; .listHeader { @@ -120,16 +120,16 @@ .channel { color: $white; - padding: 10px 0px 10px 0px; + padding: 10px 0 10px 0; margin: 10px 0; cursor: pointer; &:hover { - background: #272B37; + background: #272b37; } &.selectedChannel { - background: #272B37; + background: #272b37; padding-bottom: 0; .channelDetails { @@ -197,7 +197,7 @@ width: calc(100% - 40px); padding: 10px 20px; border-top: 1px solid $darkestgrey; - background: #2D303B; + background: #2d303b; .input { display: inline-block; @@ -296,7 +296,7 @@ display: flex; flex-direction: row; justify-content: space-around; - border-top: 0.5px solid #1A1C23; + border-top: 0.5px solid #1a1c23; margin-top: 10px; padding: 20px; @@ -318,11 +318,11 @@ .actions { text-align: center; font-size: 12px; - color: #FF7686; + color: #ff7686; section { padding: 20px 0; - border-top: 0.5px solid #1A1C23; + border-top: 0.5px solid #1a1c23; div { transition: all 0.25s; @@ -345,4 +345,4 @@ } } } -} \ No newline at end of file +} diff --git a/app/components/Form/Form.scss b/app/components/Form/Form.scss index d4d00675..ce2d3a95 100644 --- a/app/components/Form/Form.scss +++ b/app/components/Form/Form.scss @@ -11,11 +11,11 @@ .closeContainer { text-align: right; - padding: 20px 40px 0px; + padding: 20px 40px 0; span { cursor: pointer; - opacity: 1.0; + opacity: 1; transition: 0.25s all; &:hover { diff --git a/app/components/Form/Pay.scss b/app/components/Form/Pay.scss index 277a31e2..c116be06 100644 --- a/app/components/Form/Pay.scss +++ b/app/components/Form/Pay.scss @@ -31,7 +31,7 @@ .description { font-size: 12px; line-height: 14px; - padding: 0px 15px; + padding: 0 15px; min-height: 14px; &.active { @@ -163,7 +163,7 @@ &.active { background: $gold; - opacity: 1.0; + opacity: 1; &:hover { background: darken($gold, 5%); diff --git a/app/components/Form/Request.scss b/app/components/Form/Request.scss index 02dd72a8..e6917ae7 100644 --- a/app/components/Form/Request.scss +++ b/app/components/Form/Request.scss @@ -144,7 +144,7 @@ &.active { background: $gold; - opacity: 1.0; + opacity: 1; &:hover { background: darken($gold, 5%); diff --git a/app/components/Onboarding/Alias.scss b/app/components/Onboarding/Alias.scss index d4df42d5..883aba25 100644 --- a/app/components/Onboarding/Alias.scss +++ b/app/components/Onboarding/Alias.scss @@ -14,4 +14,4 @@ .alias::-webkit-input-placeholder { text-shadow: none; -webkit-text-fill-color: initial; -} \ No newline at end of file +} diff --git a/app/components/Onboarding/FormContainer.scss b/app/components/Onboarding/FormContainer.scss index 97f1e52b..bcb81192 100644 --- a/app/components/Onboarding/FormContainer.scss +++ b/app/components/Onboarding/FormContainer.scss @@ -72,7 +72,7 @@ .backButton { cursor: pointer; transition: all 0.25s; - padding: 10px 20px 10px 0px; + padding: 10px 20px 10px 0; text-align: center; &:hover { diff --git a/app/components/Onboarding/InitWallet.scss b/app/components/Onboarding/InitWallet.scss index de6b5e25..4522da3b 100644 --- a/app/components/Onboarding/InitWallet.scss +++ b/app/components/Onboarding/InitWallet.scss @@ -39,7 +39,7 @@ transition: all 0.25s; &.active { - opacity: 1.0; + opacity: 1; cursor: pointer; &:hover { @@ -59,4 +59,4 @@ } } } -} \ No newline at end of file +} diff --git a/app/components/Onboarding/Login.scss b/app/components/Onboarding/Login.scss index 8a59cc32..d24349d3 100644 --- a/app/components/Onboarding/Login.scss +++ b/app/components/Onboarding/Login.scss @@ -61,7 +61,7 @@ } &.active { - opacity: 1.0; + opacity: 1; cursor: pointer; &:hover { diff --git a/app/components/Onboarding/NewWalletSeed.scss b/app/components/Onboarding/NewWalletSeed.scss index cc5b95b8..ea26ebc9 100644 --- a/app/components/Onboarding/NewWalletSeed.scss +++ b/app/components/Onboarding/NewWalletSeed.scss @@ -46,4 +46,4 @@ color: $red; } } -} \ No newline at end of file +} diff --git a/app/components/Onboarding/Signup.scss b/app/components/Onboarding/Signup.scss index 877540c3..950ad184 100644 --- a/app/components/Onboarding/Signup.scss +++ b/app/components/Onboarding/Signup.scss @@ -49,4 +49,4 @@ margin-left: 15px; } } -} \ No newline at end of file +} diff --git a/app/components/Wallet/ReceiveModal.scss b/app/components/Wallet/ReceiveModal.scss index c74acad5..07cd6852 100644 --- a/app/components/Wallet/ReceiveModal.scss +++ b/app/components/Wallet/ReceiveModal.scss @@ -8,11 +8,11 @@ .closeContainer { text-align: right; - padding: 20px 40px 0px; + padding: 20px 40px 0; span { cursor: pointer; - opacity: 1.0; + opacity: 1; transition: 0.25s all; &:hover { @@ -39,7 +39,6 @@ padding: 30px 40px; .header { - h2 { text-align: center; } @@ -61,7 +60,7 @@ } &.active { - opacity: 1.0; + opacity: 1; } } } diff --git a/app/components/Wallet/Wallet.scss b/app/components/Wallet/Wallet.scss index 86a84bfd..20f6a6b8 100644 --- a/app/components/Wallet/Wallet.scss +++ b/app/components/Wallet/Wallet.scss @@ -109,7 +109,7 @@ li { font-size: 12px; - padding: 0px 15px; + padding: 0 15px; background: #191919; cursor: pointer; transition: 0.25s hover; @@ -163,7 +163,7 @@ font-size: 16px; font-weight: bold; color: $white; - background: #31343F; + background: #31343f; padding: 10px; width: 100px; text-align: center; From 849f2bf9ea46d048b8b84737a37244d68432abe3 Mon Sep 17 00:00:00 2001 From: Tom Kirkpatrick Date: Sat, 30 Jun 2018 23:35:54 +0200 Subject: [PATCH 4/8] style: run all stylesheets through prettier --- app/components/Activity/ActivityModal.scss | 1 - app/components/Activity/InvoiceModal.scss | 6 +++--- app/components/Activity/PaymentModal.scss | 6 +++--- app/components/Activity/TransactionModal.scss | 8 ++++---- app/components/Contacts/ConnectManually.scss | 5 ++--- app/components/Contacts/ContactModal.scss | 11 +++++++---- app/components/Contacts/ContactsForm.scss | 8 ++++---- app/components/Contacts/Network.scss | 10 ++++++---- app/components/Form/Pay.scss | 11 ++++++----- app/components/Form/Request.scss | 8 +++----- app/components/Onboarding/Alias.scss | 2 +- app/components/Onboarding/FormContainer.scss | 4 +--- app/components/Onboarding/InitWallet.scss | 5 +++-- app/components/Onboarding/Login.scss | 5 +++-- app/components/Onboarding/NewAezeedPassword.scss | 2 +- app/components/Onboarding/RecoverForm.scss | 2 -- app/components/Onboarding/Signup.scss | 2 +- app/components/Wallet/ReceiveModal.scss | 12 +++++++----- app/components/Wallet/Wallet.scss | 14 ++++++++------ 19 files changed, 63 insertions(+), 59 deletions(-) diff --git a/app/components/Activity/ActivityModal.scss b/app/components/Activity/ActivityModal.scss index 752daf8b..3c153fa5 100644 --- a/app/components/Activity/ActivityModal.scss +++ b/app/components/Activity/ActivityModal.scss @@ -24,4 +24,3 @@ color: $white; } } - diff --git a/app/components/Activity/InvoiceModal.scss b/app/components/Activity/InvoiceModal.scss index 3e9bef70..ecda25d6 100644 --- a/app/components/Activity/InvoiceModal.scss +++ b/app/components/Activity/InvoiceModal.scss @@ -60,12 +60,11 @@ span { font-size: 14px; - + &:nth-child(1) { font-weight: bold; } } - } ul { @@ -103,7 +102,8 @@ } } - .memo, .request { + .memo, + .request { h4 { font-size: 10px; margin-bottom: 10px; diff --git a/app/components/Activity/PaymentModal.scss b/app/components/Activity/PaymentModal.scss index 27982c82..b389c284 100644 --- a/app/components/Activity/PaymentModal.scss +++ b/app/components/Activity/PaymentModal.scss @@ -37,7 +37,7 @@ div:nth-child(1) { margin-bottom: 5px; - } + } svg { width: 12px; @@ -75,13 +75,13 @@ &:hover { span { opacity: 0.5; - } + } } span { transition: all 0.25s; } - + ul { visibility: hidden; position: absolute; diff --git a/app/components/Activity/TransactionModal.scss b/app/components/Activity/TransactionModal.scss index ef32a751..8785a998 100644 --- a/app/components/Activity/TransactionModal.scss +++ b/app/components/Activity/TransactionModal.scss @@ -36,7 +36,7 @@ div:nth-child(1) { margin-bottom: 5px; - } + } svg { width: 12px; @@ -79,13 +79,13 @@ &:hover { span { opacity: 0.5; - } + } } span { transition: all 0.25s; } - + ul { visibility: hidden; position: absolute; @@ -128,7 +128,7 @@ cursor: pointer; transition: all 0.25s; - &:hover { + &:hover { opacity: 0.5; } } diff --git a/app/components/Contacts/ConnectManually.scss b/app/components/Contacts/ConnectManually.scss index a43094e0..e53f3093 100644 --- a/app/components/Contacts/ConnectManually.scss +++ b/app/components/Contacts/ConnectManually.scss @@ -28,7 +28,6 @@ } } - .content { padding: 0 40px; font-family: Roboto; @@ -96,7 +95,8 @@ font-weight: 200; } -.input input::-webkit-input-placeholder, ::-webkit-input-placeholder { +.input input::-webkit-input-placeholder, +::-webkit-input-placeholder { text-shadow: none; -webkit-text-fill-color: initial; } @@ -136,4 +136,3 @@ } } } - diff --git a/app/components/Contacts/ContactModal.scss b/app/components/Contacts/ContactModal.scss index fbdd225b..24c85bdc 100644 --- a/app/components/Contacts/ContactModal.scss +++ b/app/components/Contacts/ContactModal.scss @@ -20,7 +20,7 @@ margin-left: 5px; } } - + .closeContainer { background: $lightgrey; line-height: 12px; @@ -36,7 +36,10 @@ margin-bottom: 30px; padding: 0 20px; - .pay, .receive, .sent, .received { + .pay, + .receive, + .sent, + .received { margin: 40px 0; } } @@ -59,7 +62,6 @@ color: $darkestgrey; font-weight: 100; } - } .stats { @@ -78,7 +80,8 @@ color: $darkestgrey; } - .meter, .amount { + .meter, + .amount { height: 10px; border-radius: 10px; } diff --git a/app/components/Contacts/ContactsForm.scss b/app/components/Contacts/ContactsForm.scss index acc88f1f..169311d1 100644 --- a/app/components/Contacts/ContactsForm.scss +++ b/app/components/Contacts/ContactsForm.scss @@ -13,7 +13,7 @@ outline: none; z-index: -2; border: 1px solid $darkgrey; - + header { display: flex; flex-direction: row; @@ -21,7 +21,8 @@ padding: 15px; border-bottom: 1px solid $darkgrey; - h1, svg { + h1, + svg { font-size: 22px; } @@ -205,9 +206,8 @@ &:nth-child(2) { margin-left: 2px; } - } - + .caption svg { font-size: 10px; color: $darkestgrey; diff --git a/app/components/Contacts/Network.scss b/app/components/Contacts/Network.scss index d88de693..24325223 100644 --- a/app/components/Contacts/Network.scss +++ b/app/components/Contacts/Network.scss @@ -59,7 +59,8 @@ align-items: baseline; padding: 0 20px; - h2, h2 span { + h2, + h2 span { color: $white; cursor: pointer; transition: color 0.25s; @@ -69,13 +70,14 @@ } } - h2, .filters li { + h2, + .filters li { font-size: 12px; } .filters { display: none; - + &.active { display: block; position: absolute; @@ -216,7 +218,7 @@ svg { width: 14px; - height:14px; + height: 14px; } } diff --git a/app/components/Form/Pay.scss b/app/components/Form/Pay.scss index c116be06..9a041288 100644 --- a/app/components/Form/Pay.scss +++ b/app/components/Form/Pay.scss @@ -57,7 +57,7 @@ input { font-size: 20px; max-width: 150px; - border:1px solid #404040; + border: 1px solid #404040; border-radius: 4px; padding: 15px; } @@ -76,7 +76,8 @@ } .bottom { - input, textarea { + input, + textarea { background: transparent; outline: none; border: 1px solid #404040; @@ -88,7 +89,8 @@ padding: 10px; } - input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { + input::-webkit-input-placeholder, + textarea::-webkit-input-placeholder { text-shadow: none; -webkit-text-fill-color: initial; } @@ -111,12 +113,11 @@ span { font-size: 14px; - + &:nth-child(1) { font-weight: bold; } } - } ul { diff --git a/app/components/Form/Request.scss b/app/components/Form/Request.scss index e6917ae7..a5534c5c 100644 --- a/app/components/Form/Request.scss +++ b/app/components/Form/Request.scss @@ -37,7 +37,7 @@ input { font-size: 20px; max-width: 150px; - border:1px solid #404040; + border: 1px solid #404040; border-radius: 4px; padding: 15px; } @@ -59,7 +59,7 @@ input { background: transparent; outline: none; - border:1px solid #404040; + border: 1px solid #404040; border-radius: 4px; color: $gold; -webkit-text-fill-color: $white; @@ -92,12 +92,11 @@ span { font-size: 14px; - + &:nth-child(1) { font-weight: bold; } } - } ul { @@ -153,4 +152,3 @@ } } } - diff --git a/app/components/Onboarding/Alias.scss b/app/components/Onboarding/Alias.scss index 883aba25..fa15093c 100644 --- a/app/components/Onboarding/Alias.scss +++ b/app/components/Onboarding/Alias.scss @@ -3,7 +3,7 @@ .alias { background: transparent; outline: none; - border:1px solid #404040; + border: 1px solid #404040; border-radius: 4px; padding: 15px; color: $gold; diff --git a/app/components/Onboarding/FormContainer.scss b/app/components/Onboarding/FormContainer.scss index bcb81192..58d137dd 100644 --- a/app/components/Onboarding/FormContainer.scss +++ b/app/components/Onboarding/FormContainer.scss @@ -74,12 +74,10 @@ transition: all 0.25s; padding: 10px 20px 10px 0; text-align: center; - + &:hover { opacity: 0.5; } } - } } - diff --git a/app/components/Onboarding/InitWallet.scss b/app/components/Onboarding/InitWallet.scss index 4522da3b..483428ee 100644 --- a/app/components/Onboarding/InitWallet.scss +++ b/app/components/Onboarding/InitWallet.scss @@ -7,7 +7,7 @@ .password { background: transparent; outline: none; - border:1px solid #404040; + border: 1px solid #404040; border-radius: 4px; padding: 15px; color: $gold; @@ -49,7 +49,8 @@ } } - &:nth-child(2), &:nth-child(3) { + &:nth-child(2), + &:nth-child(3) { font-size: 12px; cursor: pointer; margin: 10px 0; diff --git a/app/components/Onboarding/Login.scss b/app/components/Onboarding/Login.scss index d24349d3..dc5c3ad3 100644 --- a/app/components/Onboarding/Login.scss +++ b/app/components/Onboarding/Login.scss @@ -7,7 +7,7 @@ .password { background: transparent; outline: none; - border:1px solid #404040; + border: 1px solid #404040; border-radius: 4px; padding: 15px; color: $gold; @@ -71,7 +71,8 @@ } } - &:nth-child(2), &:nth-child(3) { + &:nth-child(2), + &:nth-child(3) { font-size: 12px; cursor: pointer; margin: 10px 0; diff --git a/app/components/Onboarding/NewAezeedPassword.scss b/app/components/Onboarding/NewAezeedPassword.scss index 16e22191..fea52187 100644 --- a/app/components/Onboarding/NewAezeedPassword.scss +++ b/app/components/Onboarding/NewAezeedPassword.scss @@ -7,7 +7,7 @@ .password { background: transparent; outline: none; - border:1px solid #404040; + border: 1px solid #404040; border-radius: 4px; padding: 15px; color: $gold; diff --git a/app/components/Onboarding/RecoverForm.scss b/app/components/Onboarding/RecoverForm.scss index 4c794ac5..d16b2cb7 100644 --- a/app/components/Onboarding/RecoverForm.scss +++ b/app/components/Onboarding/RecoverForm.scss @@ -29,8 +29,6 @@ } } - - .word { margin: 0 3px; background-color: #1c1e26; diff --git a/app/components/Onboarding/Signup.scss b/app/components/Onboarding/Signup.scss index 950ad184..72e97426 100644 --- a/app/components/Onboarding/Signup.scss +++ b/app/components/Onboarding/Signup.scss @@ -5,7 +5,7 @@ section { margin-bottom: 20px; - + &.enable { &.active { div { diff --git a/app/components/Wallet/ReceiveModal.scss b/app/components/Wallet/ReceiveModal.scss index 07cd6852..cff58f1b 100644 --- a/app/components/Wallet/ReceiveModal.scss +++ b/app/components/Wallet/ReceiveModal.scss @@ -65,7 +65,7 @@ } } } - + .qrCodeContainer { text-align: center; } @@ -77,7 +77,8 @@ border-left: 1px solid $spaceborder; padding: 30px 40px; - .pubkey, .address { + .pubkey, + .address { padding: 25px; h4 { @@ -89,7 +90,7 @@ } } } - + p { display: flex; flex-direction: row; @@ -99,7 +100,8 @@ font-weight: 200; background: $bluegrey; - .data, .copy { + .data, + .copy { padding: 15px; } @@ -123,6 +125,6 @@ width: 12px; } } - } + } } } diff --git a/app/components/Wallet/Wallet.scss b/app/components/Wallet/Wallet.scss index 20f6a6b8..f6eb9700 100644 --- a/app/components/Wallet/Wallet.scss +++ b/app/components/Wallet/Wallet.scss @@ -28,15 +28,17 @@ } } -.left, .right { +.left, +.right { display: inline-block; vertical-align: top; width: 50%; height: 150px; - .leftContent, .rightContent { + .leftContent, + .rightContent { padding: 25px 0; - } + } } .leftContent { @@ -159,7 +161,8 @@ justify-content: flex-end; align-items: right; - .pay, .request { + .pay, + .request { font-size: 16px; font-weight: bold; color: $white; @@ -180,7 +183,6 @@ margin-right: 20px; } } - } .notificationBox { @@ -192,7 +194,7 @@ vertical-align: middle; transition: all 0.25s; } - + .spinner { height: 20px; width: 20px; From f85aa10cff253e8e6a498e1eefa607b06e99c6aa Mon Sep 17 00:00:00 2001 From: Tom Kirkpatrick Date: Sat, 30 Jun 2018 23:46:40 +0200 Subject: [PATCH 5/8] style: remove redundant font declarations --- app/components/Contacts/ConnectManually.scss | 1 - .../Contacts/SubmitChannelForm.scss | 1 - app/components/Form/Pay.scss | 1 - app/components/Form/Request.scss | 1 - app/components/Onboarding/NewWalletSeed.scss | 3 +-- app/components/Onboarding/RecoverForm.scss | 3 +-- app/components/Onboarding/Syncing.scss | 1 - app/components/Wallet/ReceiveModal.scss | 1 - .../components/components/Activity.scss | 25 +++++++++++-------- 9 files changed, 16 insertions(+), 21 deletions(-) diff --git a/app/components/Contacts/ConnectManually.scss b/app/components/Contacts/ConnectManually.scss index e53f3093..0d9f7d1f 100644 --- a/app/components/Contacts/ConnectManually.scss +++ b/app/components/Contacts/ConnectManually.scss @@ -30,7 +30,6 @@ .content { padding: 0 40px; - font-family: Roboto; color: $white; .header { diff --git a/app/components/Contacts/SubmitChannelForm.scss b/app/components/Contacts/SubmitChannelForm.scss index bc879beb..57f69f8d 100644 --- a/app/components/Contacts/SubmitChannelForm.scss +++ b/app/components/Contacts/SubmitChannelForm.scss @@ -2,7 +2,6 @@ .content { padding: 0 40px; - font-family: Roboto, sans-serif; color: $white; margin: 0 auto; width: 500px; diff --git a/app/components/Form/Pay.scss b/app/components/Form/Pay.scss index 9a041288..44123667 100644 --- a/app/components/Form/Pay.scss +++ b/app/components/Form/Pay.scss @@ -2,7 +2,6 @@ .container { padding: 0 40px; - font-family: Roboto; margin: 0 auto; width: 500px; } diff --git a/app/components/Form/Request.scss b/app/components/Form/Request.scss index a5534c5c..c19a1b5e 100644 --- a/app/components/Form/Request.scss +++ b/app/components/Form/Request.scss @@ -2,7 +2,6 @@ .container { padding: 0 40px; - font-family: Roboto; margin: 0 auto; width: 500px; } diff --git a/app/components/Onboarding/NewWalletSeed.scss b/app/components/Onboarding/NewWalletSeed.scss index ea26ebc9..bf56895d 100644 --- a/app/components/Onboarding/NewWalletSeed.scss +++ b/app/components/Onboarding/NewWalletSeed.scss @@ -3,14 +3,13 @@ .container { font-size: 14px; color: $white; - font-family: 'Roboto'; letter-spacing: 1.5px; li { display: inline-block; margin: 5px 0; width: 25%; - font-family: 'Courier'; + font-family: 'Courier', courier, sans-serif; section { display: inline-block; diff --git a/app/components/Onboarding/RecoverForm.scss b/app/components/Onboarding/RecoverForm.scss index d16b2cb7..07553bfa 100644 --- a/app/components/Onboarding/RecoverForm.scss +++ b/app/components/Onboarding/RecoverForm.scss @@ -36,8 +36,7 @@ border: none; padding: 5px 10px; color: $white; - font-family: courier; - font-family: 'Courier'; + font-family: 'Courier', courier, sans-serif; &.valid { color: $green; diff --git a/app/components/Onboarding/Syncing.scss b/app/components/Onboarding/Syncing.scss index 27c8b824..23f12d80 100644 --- a/app/components/Onboarding/Syncing.scss +++ b/app/components/Onboarding/Syncing.scss @@ -4,7 +4,6 @@ position: relative; height: 100vh; background: #2a2d38; - font-family: 'Roboto', sans-serif; } .titleBar { diff --git a/app/components/Wallet/ReceiveModal.scss b/app/components/Wallet/ReceiveModal.scss index cff58f1b..55c1a933 100644 --- a/app/components/Wallet/ReceiveModal.scss +++ b/app/components/Wallet/ReceiveModal.scss @@ -95,7 +95,6 @@ display: flex; flex-direction: row; align-items: center; - font-family: 'Roboto'; font-size: 10px; font-weight: 200; background: $bluegrey; diff --git a/app/routes/activity/components/components/Activity.scss b/app/routes/activity/components/components/Activity.scss index 47a4e0f7..f87b9a0b 100644 --- a/app/routes/activity/components/components/Activity.scss +++ b/app/routes/activity/components/components/Activity.scss @@ -7,8 +7,8 @@ height: 76px; align-items: center; font-size: 14px; - transition: background-color .1s linear; - transition-delay: .1s; + transition: background-color 0.1s linear; + transition-delay: 0.1s; color: $white; position: relative; @@ -73,12 +73,11 @@ &:nth-child(2) { font-size: 10px; - } + } .title { margin-bottom: 10px; font-size: 14px; - font-family: Roboto; } .subtitle { @@ -86,16 +85,19 @@ font-size: 10px; } - .icon, h3, span { + .icon, + h3, + span { vertical-align: middle; } - h3, span { + h3, + span { font-size: 14px; font-weight: bold; letter-spacing: 1.2px; } - + .icon { display: inline-block; flex: none; @@ -121,8 +123,8 @@ h3 { display: inline-block; - &:after { - content: " "; + &::after { + content: ' '; display: inline-block; width: 3px; } @@ -144,13 +146,14 @@ &:nth-child(1) { margin-bottom: 10px; } - + &:nth-child(2) { font-size: 10px; opacity: 0.5; } - .plus, .minus { + .plus, + .minus { margin-right: 2px; } From 5367e3bf211b3fb971d3f3526fd2e779fe5d51bf Mon Sep 17 00:00:00 2001 From: Tom Kirkpatrick Date: Sat, 30 Jun 2018 23:51:50 +0200 Subject: [PATCH 6/8] style: fix scss no-duplicate-selectors rule --- app/components/Activity/PaymentModal.scss | 1 - app/components/Contacts/ConnectManually.scss | 17 +++++++---------- app/components/Contacts/ContactModal.scss | 3 --- app/components/Contacts/ContactsForm.scss | 6 +----- 4 files changed, 8 insertions(+), 19 deletions(-) diff --git a/app/components/Activity/PaymentModal.scss b/app/components/Activity/PaymentModal.scss index b389c284..1e173806 100644 --- a/app/components/Activity/PaymentModal.scss +++ b/app/components/Activity/PaymentModal.scss @@ -1,5 +1,4 @@ @import '../../variables.scss'; -@import '../../variables.scss'; .container { color: $white; diff --git a/app/components/Contacts/ConnectManually.scss b/app/components/Contacts/ConnectManually.scss index 0d9f7d1f..fb3dda30 100644 --- a/app/components/Contacts/ConnectManually.scss +++ b/app/components/Contacts/ConnectManually.scss @@ -81,19 +81,16 @@ input { font-size: 20px; + background: transparent; + outline: none; + border: 0; + color: $gold; + -webkit-text-fill-color: $white; + width: 100%; + font-weight: 200; } } -.input input { - background: transparent; - outline: none; - border: 0; - color: $gold; - -webkit-text-fill-color: $white; - width: 100%; - font-weight: 200; -} - .input input::-webkit-input-placeholder, ::-webkit-input-placeholder { text-shadow: none; diff --git a/app/components/Contacts/ContactModal.scss b/app/components/Contacts/ContactModal.scss index 24c85bdc..2e26dc3b 100644 --- a/app/components/Contacts/ContactModal.scss +++ b/app/components/Contacts/ContactModal.scss @@ -141,9 +141,6 @@ -webkit-border-radius: 999px; -moz-border-radius: 999px; border-radius: 999px; -} - -.spinner { margin: 0 auto; height: 20px; width: 20px; diff --git a/app/components/Contacts/ContactsForm.scss b/app/components/Contacts/ContactsForm.scss index 169311d1..3eedb95a 100644 --- a/app/components/Contacts/ContactsForm.scss +++ b/app/components/Contacts/ContactsForm.scss @@ -1,10 +1,9 @@ @import '../../variables.scss'; .modal { - position: relative; + position: absolute; width: 50%; margin: 50px auto; - position: absolute; top: auto; left: 0; right: 0; @@ -244,9 +243,6 @@ -webkit-border-radius: 999px; -moz-border-radius: 999px; border-radius: 999px; -} - -.spinner { margin: 0 auto; height: 20px; width: 20px; From 74562213c9ed1a7c5f7877d44a9cd057ed817f4a Mon Sep 17 00:00:00 2001 From: Tom Kirkpatrick Date: Sun, 1 Jul 2018 16:01:24 +0200 Subject: [PATCH 7/8] style: disable no-descending-specificity stylelint rule --- .stylelintrc | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/.stylelintrc b/.stylelintrc index 40db42c6..13d3c020 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -1,3 +1,6 @@ { - "extends": "stylelint-config-standard" + "extends": "stylelint-config-standard", + "rules": { + "no-descending-specificity": null + } } From f3bf89974b9913d610d99a40991f985d3286dbb7 Mon Sep 17 00:00:00 2001 From: Tom Kirkpatrick Date: Sun, 1 Jul 2018 16:25:20 +0200 Subject: [PATCH 8/8] style: disable no-empty-source stylelint rune --- .stylelintrc | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.stylelintrc b/.stylelintrc index 13d3c020..0240c091 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -1,6 +1,7 @@ { "extends": "stylelint-config-standard", "rules": { - "no-descending-specificity": null + "no-descending-specificity": null, + "no-empty-source": null } }