From 7c202c2d2edad6347e386c4844efb126fe57b2c8 Mon Sep 17 00:00:00 2001 From: N-Pex Date: Tue, 17 Oct 2023 11:01:49 +0200 Subject: [PATCH] GetLink redesign Also, try with entered username first (issue #524) --- src/assets/css/getlink.scss | 26 +++++- src/assets/icons/getlink.vue | 32 +++++++ src/assets/translations/en.json | 6 +- src/components/GetLink.vue | 144 ++++++++++++++------------------ src/components/Login.vue | 22 ++++- src/plugins/utils.js | 4 + 6 files changed, 145 insertions(+), 89 deletions(-) create mode 100644 src/assets/icons/getlink.vue diff --git a/src/assets/css/getlink.scss b/src/assets/css/getlink.scss index 81394ae..6c020e6 100644 --- a/src/assets/css/getlink.scss +++ b/src/assets/css/getlink.scss @@ -6,7 +6,18 @@ .getlink-loggedin { text-align: center; button { - min-width: 200px !important; + min-width: 200px !important; + } + } + + .getlink-image { + text-align: center; + max-width: 325px; + max-height: 257px; + width: 100%; + .v-icon__component { + width: unset; + height: unset; } } @@ -23,6 +34,19 @@ margin-top: 50px; } + .getlink-info { + color: #000; + text-align: center; + font-feature-settings: "clig" off, "liga" off; + font-family: "Inter"; + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 117%; /* 18.72px */ + letter-spacing: 0.4px; + margin: 15px 9px 40px 9px; + } + .getlink-subtitle { color: #000; text-align: center; diff --git a/src/assets/icons/getlink.vue b/src/assets/icons/getlink.vue new file mode 100644 index 0000000..a2f45df --- /dev/null +++ b/src/assets/icons/getlink.vue @@ -0,0 +1,32 @@ + \ No newline at end of file diff --git a/src/assets/translations/en.json b/src/assets/translations/en.json index 927833a..d86a727 100644 --- a/src/assets/translations/en.json +++ b/src/assets/translations/en.json @@ -189,9 +189,9 @@ }, "getlink": { "title": "Get a Direct Link", - "password": "Set your password", - "password_repeat": "Confirm your password", - "create": "Create", + "info": "Direct links give people a secure line of communication with you. To start, choose a screen name to show when people enter a chat with you.", + "username": "Enter a screen name (ex: waku)", + "next": "Next", "hello": "Hello {user},\nHere’s your Direct Link", "ready_to_share": "It’s ready to share! A new direct room will open each time someone opens the link.", "scan_title": "Scan this code to start a direct chat", diff --git a/src/components/GetLink.vue b/src/components/GetLink.vue index f19765d..aebf792 100644 --- a/src/components/GetLink.vue +++ b/src/components/GetLink.vue @@ -1,50 +1,26 @@