diff options
author | julia.kirschenheuter <julia.kirschenheuter@nextcloud.com> | 2023-09-21 12:22:25 +0200 |
---|---|---|
committer | julia.kirschenheuter <julia.kirschenheuter@nextcloud.com> | 2023-09-22 10:46:46 +0200 |
commit | ea881fee2f5e320a80bbe421427479451b56f3b8 (patch) | |
tree | 620a51c384211aab974bf0857b3ed56654971e37 /apps/oauth2 | |
parent | 26ad0a1b9c4b617e50cfd27b9696b052522953be (diff) | |
download | nextcloud-server-ea881fee2f5e320a80bbe421427479451b56f3b8.tar.gz nextcloud-server-ea881fee2f5e320a80bbe421427479451b56f3b8.zip |
Add labels for input fields
Signed-off-by: julia.kirschenheuter <julia.kirschenheuter@nextcloud.com>
Diffstat (limited to 'apps/oauth2')
-rw-r--r-- | apps/oauth2/src/App.vue | 28 |
1 files changed, 21 insertions, 7 deletions
diff --git a/apps/oauth2/src/App.vue b/apps/oauth2/src/App.vue index c37548e3968..5fb60df0120 100644 --- a/apps/oauth2/src/App.vue +++ b/apps/oauth2/src/App.vue @@ -43,17 +43,21 @@ <br> <h3>{{ t('oauth2', 'Add client') }}</h3> <span v-if="newClient.error" class="msg error">{{ newClient.errorMsg }}</span> - <form @submit.prevent="addClient"> - <input id="name" - v-model="newClient.name" + <form class="oauth2-form" @submit.prevent="addClient"> + <NcTextField id="name" + :value.sync="newClient.name" type="text" + class="oauth2-form--input" name="name" - :placeholder="t('oauth2', 'Name')"> - <input id="redirectUri" - v-model="newClient.redirectUri" + :label="t('oauth2', 'Name')" + :placeholder="t('oauth2', 'Name')" /> + <NcTextField id="redirectUri" + :value.sync="newClient.redirectUri" type="url" + class="oauth2-form--input" name="redirectUri" - :placeholder="t('oauth2', 'Redirection URI')"> + :label="t('oauth2', 'Redirection URI')" + :placeholder="t('oauth2', 'Redirection URI')" /> <NcButton native-type="submit" class="inline-button"> {{ t('oauth2', 'Add') }} </NcButton> @@ -69,6 +73,7 @@ import { getCapabilities } from '@nextcloud/capabilities' import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection.js' import NcButton from '@nextcloud/vue/dist/Components/NcButton.js' import { loadState } from '@nextcloud/initial-state' +import NcTextField from '@nextcloud/vue/dist/Components/NcTextField.js' export default { name: 'App', @@ -76,6 +81,7 @@ export default { OAuthItem, NcSettingsSection, NcButton, + NcTextField, }, props: { clients: { @@ -140,4 +146,12 @@ export default { min-height: 34px !important; display: inline-flex !important; } + .oauth2-form { + display: flex; + flex-direction: row; + } + .oauth2-form--input { + max-width: 200px; + margin-right: 10px; + } </style> |