From 13cdd8514f07bb52b831ed3f4659af0f81ec8863 Mon Sep 17 00:00:00 2001 From: robertu <4065233+robertu7@users.noreply.github.com> Date: Wed, 2 Nov 2022 16:50:29 +0800 Subject: [PATCH 1/5] feat(donation): show tutorial link on wallet login --- src/common/enums/externalLinks.ts | 7 ++ .../PaymentForm/PayTo/SetAmount/index.tsx | 4 +- .../Forms/WalletAuthForm/Select.tsx | 64 ++++++++++++++++--- .../Forms/WalletAuthForm/styles.css | 9 ++- src/views/Guide/content.ts | 42 ++++++------ 5 files changed, 90 insertions(+), 36 deletions(-) diff --git a/src/common/enums/externalLinks.ts b/src/common/enums/externalLinks.ts index 4a82e7d790..5e42f1832b 100644 --- a/src/common/enums/externalLinks.ts +++ b/src/common/enums/externalLinks.ts @@ -75,4 +75,11 @@ export const GUIDE_LINKS = { 'https://matters.news/zh-Hans/@hi176/338013-%E5%8A%9F%E8%83%BD%E6%8C%87%E5%8D%97-%E5%A6%82%E4%BD%95%E4%BD%BF%E7%94%A8-%E5%85%A7%E5%AE%B9%E8%A8%82%E9%96%B1-%E4%BE%86%E8%BF%BD%E8%B9%A4%E4%BD%A0%E5%96%9C%E6%84%9B%E7%9A%84-matters-%E4%BD%9C%E8%80%85-bafyreidb42pruxqy75tybjarp6kebmf7quyn3etd6mtv7fopwve6a7mjaa', en: 'https://matters.news/en/@hi176/338013-%E5%8A%9F%E8%83%BD%E6%8C%87%E5%8D%97-%E5%A6%82%E4%BD%95%E4%BD%BF%E7%94%A8-%E5%85%A7%E5%AE%B9%E8%A8%82%E9%96%B1-%E4%BE%86%E8%BF%BD%E8%B9%A4%E4%BD%A0%E5%96%9C%E6%84%9B%E7%9A%84-matters-%E4%BD%9C%E8%80%85-bafyreidb42pruxqy75tybjarp6kebmf7quyn3etd6mtv7fopwve6a7mjaa', }, + mobilePayment: { + zh_hant: + 'https://matters.news/@hi176/343938-%E6%8C%87%E5%8D%97-%E5%A6%82%E4%BD%95%E5%9C%A8%E6%89%8B%E6%A9%9F%E4%B8%8A%E9%80%A3%E6%8E%A5%E9%8C%A2%E5%8C%85%E4%B8%A6%E4%BD%BF%E7%94%A8-usdt-%E6%94%AF%E6%8C%81%E5%8A%9F%E8%83%BD-bafyreifil6hcprdl5g4vtui5sy3gvimbkphib5xcziddixptmy4dckmtiu', + zh_hans: + 'https://matters.news/zh_Hans/@hi176/343938-%E6%8C%87%E5%8D%97-%E5%A6%82%E4%BD%95%E5%9C%A8%E6%89%8B%E6%A9%9F%E4%B8%8A%E9%80%A3%E6%8E%A5%E9%8C%A2%E5%8C%85%E4%B8%A6%E4%BD%BF%E7%94%A8-usdt-%E6%94%AF%E6%8C%81%E5%8A%9F%E8%83%BD-bafyreifil6hcprdl5g4vtui5sy3gvimbkphib5xcziddixptmy4dckmtiu', + en: 'https://matters.news/en/@hi176/343938-%E6%8C%87%E5%8D%97-%E5%A6%82%E4%BD%95%E5%9C%A8%E6%89%8B%E6%A9%9F%E4%B8%8A%E9%80%A3%E6%8E%A5%E9%8C%A2%E5%8C%85%E4%B8%A6%E4%BD%BF%E7%94%A8-usdt-%E6%94%AF%E6%8C%81%E5%8A%9F%E8%83%BD-bafyreifil6hcprdl5g4vtui5sy3gvimbkphib5xcziddixptmy4dckmtiu', + }, } diff --git a/src/components/Forms/PaymentForm/PayTo/SetAmount/index.tsx b/src/components/Forms/PaymentForm/PayTo/SetAmount/index.tsx index b44da53205..2b94c96b65 100644 --- a/src/components/Forms/PaymentForm/PayTo/SetAmount/index.tsx +++ b/src/components/Forms/PaymentForm/PayTo/SetAmount/index.tsx @@ -380,8 +380,8 @@ const SetAmount: React.FC = ({ }} > diff --git a/src/components/Forms/WalletAuthForm/Select.tsx b/src/components/Forms/WalletAuthForm/Select.tsx index 8c58f3ac02..79c566b3f5 100644 --- a/src/components/Forms/WalletAuthForm/Select.tsx +++ b/src/components/Forms/WalletAuthForm/Select.tsx @@ -7,13 +7,16 @@ import { IconMetaMask24, IconSpinner16, IconWalletConnect24, + LanguageContext, Layout, Spacer, TextIcon, Translate, + useResponsive, ViewerContext, } from '~/components' +import { GUIDE_LINKS } from '~/common/enums' import { analytics } from '~/common/utils' import styles from './styles.css' @@ -57,6 +60,49 @@ const Desc = { }, } +const Hint = () => { + const { lang } = useContext(LanguageContext) + const isSmallUp = useResponsive('sm-up') + + if (isSmallUp) { + return ( +

+ + + + + +

+ ) + } + + return ( +

+ + + + + +

+ ) +} + const Select: React.FC = ({ type, purpose, @@ -67,7 +113,6 @@ const Select: React.FC = ({ const viewer = useContext(ViewerContext) const formId = 'wallet-auth-select-form' - const fieldMsgId = 'wall-auth-select-msg' const isInPage = purpose === 'page' const isConnect = type === 'connect' @@ -191,15 +236,16 @@ const Select: React.FC = ({ /> - {errorMessage && ( + {!errorMessage && (
- - - + + +
+ )} + + {errorMessage && ( +
+

{errorMessage}

)} diff --git a/src/components/Forms/WalletAuthForm/styles.css b/src/components/Forms/WalletAuthForm/styles.css index c234ef96e3..5e0ec9cdc9 100644 --- a/src/components/Forms/WalletAuthForm/styles.css +++ b/src/components/Forms/WalletAuthForm/styles.css @@ -1,5 +1,12 @@ .msg { - margin: 0 var(--spacing-base) var(--spacing-loose); + margin: var(--spacing-x-tight) 0 var(--spacing-base) var(--spacing-base); + font-size: var(--font-size-xs); + line-height: 1rem; + color: var(--color-grey); + + &.error { + color: var(--color-red); + } } .emphasize { diff --git a/src/views/Guide/content.ts b/src/views/Guide/content.ts index 7820db26e1..68fb2fe362 100644 --- a/src/views/Guide/content.ts +++ b/src/views/Guide/content.ts @@ -16,18 +16,7 @@ export default { -

其中，標籤與圍爐是 Matters 的兩項特色功能，標籤可以幫助你的文章獲得更多曝光、並找到志同道合的寫作者；圍爐為你提供一個具有私密感的寫作與讀者互動空間。

- - - -

Matters 目前尚未推出 app，如果你想要在手機上使用 Matters.News，非常推薦你使用 PWA，功能跟 app 幾乎完全一樣。

+

Matters 目前尚未推出 App，如果你想要在手機上使用 Matters.News，非常推薦你使用 PWA，功能跟 App 幾乎完全一樣。

  • @@ -53,6 +42,14 @@ export default {
+

如果你想用手機進行登入、綁定錢包及進行 USDT 支付，請參考我們的手機版專屬指南，可以為你解決絕大部分的疑惑。

+ + +

好文章不遺漏，我們也支援 RSS 、JSON 閱讀器或 IPNS 兼容的 Planet 閱讀器來訂閱作者。

    @@ -76,18 +73,7 @@ export default {
-

其中，标签与围炉是 Matters 的两项特色功能，标签可以帮助你的文章获得更多曝光、并找到志同道合的写作者；围炉为你提供一个具有私密感的写作与读者互动空间。

- - - -

Matters 目前尚未推出 app，如果你想要在手机上使用 Matters.News，非常推荐你使用 PWA，功能跟 app 几乎完全一样。

+

Matters 目前尚未推出 App，如果你想要在手机上使用 Matters.News，非常推荐你使用 PWA，功能跟 App 几乎完全一样。

  • @@ -113,6 +99,14 @@ export default {
+

如果你想用手机进行登入、绑定钱包及进行 USDT 支付，请参考我们的手机版专属指南，可以为你解决绝大部分的疑惑。

+ + +

好文章不遗漏，我们也支援 RSS 、JSON 阅读器或 IPNS 兼容的 Planet 阅读器来订阅作者。