Update app btns & QR code #3681
Conversation
amiraabouhadid
requested review from
AhmedHanafy725,
zaelgohary,
maayarosama,
MohamedElmdary,
Mahmoud-Emad,
AlaaElattar,
0oM4R and
samaradel
as code owners
There was a problem hiding this comment.
i don't think this image is the best option, to avoid that can we have both in dark ?
as in the prfile manager
| @@ -94,6 +94,8 @@ const props = defineProps({ | |||
| openDepositDialog: Boolean, | |||
| twinId: Number, | |||
| }); | |||
| const qrHeader = `<b> OR </b> | |||
| <p class="mb-3">Use ThreeFold Connect to scan this QRcode:</p>`; | |||
There was a problem hiding this comment.
i think the best practice is to use slot,
| </template> | ||
| <script setup lang="ts"> | ||
| const props = defineProps({ | ||
| qr: String, |
There was a problem hiding this comment.
Great! we can use this component to have the login QR code as well!
| Scan the QR code using | ||
| <a class="app-link" :href="manual.tf_connect_app" target="_blank"> ThreeFold Connect </a> | ||
| to fund your account | ||
| </p> | ||
| <QrcodeGenerator | ||
| :data="'TFT:' + bridge + '?message=twin_' + profileManager.profile.twinId + '&sender=me&amount=100'" | ||
| /> | ||
| <div class="d-flex justify-center my-4"> | ||
| <a | ||
| v-for="app in apps" | ||
| :key="app.alt" | ||
| :style="{ cursor: 'pointer', width: '9rem' }" | ||
| class="app-btn mr-2" | ||
| :title="app.alt" | ||
| v-html="app.src" | ||
| :href="app.url" | ||
| target="_blank" | ||
| /> | ||
| </div> | ||
| <a class="app-link" :href="manual.tf_connect_app" target="_blank">Threefold Connect</a> to fund your | ||
| account. |
There was a problem hiding this comment.
please wrap those lines with a p tag
| Scan the QR code using | ||
| <a class="app-link" :href="manual.tf_connect_app" target="_blank">Threefold Connect</a> to fund your | ||
| account.</QRPlayStore |
There was a problem hiding this comment.
please wrap this text with p tag as well
| @@ -1,6 +1,6 @@ | |||
| <template> | |||
| <div class="d-flex flex-column text-center align-center"> | |||
| <slot></slot> | |||
| <p><slot></slot></p> | |||
There was a problem hiding this comment.
Why are we wrapping the slot itself? we should put the tag element on the slot content right ?
There was a problem hiding this comment.
it's the same
There was a problem hiding this comment.
my idea was if we need to reuse this component with another content inside the slot whatever the content is will be inside a p tag, anyways thank you and great work
Changes
Related Issues
#3648
Tested Scenarios
- clicked on playstore and app store btns, see that they redirect to correct threefold connect play store and app store pages respectively
- open up threefold connect app, go to wallet, send page, scan qr code see that it adds correct twin id
Checklist