diff options
author | marco <marcoambrosini@pm.me> | 2022-01-21 17:18:19 +0300 |
---|---|---|
committer | marco <marcoambrosini@pm.me> | 2022-01-24 18:15:19 +0300 |
commit | 090f26fec8c52cdb1d51c59d46e8fe89c8915754 (patch) | |
tree | 0fe71195495f033985b03f44afa73de105f52d02 | |
parent | f4ba7a49428fcba25c84bf1036afc630c7323f8d (diff) |
Upgrade buttons for setGuestUsernamefeature/buttonsupgrade/setguestusername
Signed-off-by: marco <marcoambrosini@pm.me>
-rw-r--r-- | src/components/SetGuestUsername.vue | 44 |
1 files changed, 27 insertions, 17 deletions
diff --git a/src/components/SetGuestUsername.vue b/src/components/SetGuestUsername.vue index ae41f3fbb..3dfb2dffd 100644 --- a/src/components/SetGuestUsername.vue +++ b/src/components/SetGuestUsername.vue @@ -26,12 +26,16 @@ @submit.prevent="handleChooseUserName"> <h3> {{ t('spreed', 'Display name: ') }} <strong>{{ actorDisplayName ? actorDisplayName : t('spreed', 'Guest') }}</strong> - <button - class="icon-rename" - @click.prevent="handleEditUsername"> - {{ t('spreed', 'Edit') }} - </button> </h3> + <Button @click.prevent="handleEditUsername"> + {{ t('spreed', 'Edit') }} + <template #icon> + <Pencil + :size="20" + title="" + decorative /> + </template> + </Button> <div v-if="isEditingUsername" class="username-form__wrapper"> @@ -43,21 +47,33 @@ type="text" @keydown.enter="handleChooseUserName" @keydown.esc="isEditingUsername = !isEditingUsername"> - <button + <Button class="username-form__button" - type="submit"> - <div class="icon-confirm" /> - </button> + type="tertiary"> + <ArrowRight + :size="20" + title="" + decorative /> + </Button> </div> </form> </template> <script> import { setGuestUserName } from '../services/participantsService' +import Button from '@nextcloud/vue/dist/Components/Button' +import Pencil from 'vue-material-design-icons/Pencil' +import ArrowRight from 'vue-material-design-icons/ArrowRight.vue' export default { name: 'SetGuestUsername', + components: { + Button, + Pencil, + ArrowRight, + }, + data() { return { guestUserName: '', @@ -151,22 +167,16 @@ export default { .username-form { padding: 0 12px; margin:auto; - & .icon-rename { - margin-left: 8px; - padding-left: 36px; - background-position: 12px; - } &__wrapper { display: flex; + margin-top: 16px; } &__input { padding-right: var(--clickable-area); width: 230px; } &__button { - margin-left: -44px; - background-color: transparent; - border: none; + margin-left: -52px; } } |