diff options
Diffstat (limited to 'packages/client')
4 files changed, 54 insertions, 70 deletions
diff --git a/packages/client/src/pages/admin/integrations-discord.vue b/packages/client/src/pages/admin/integrations-discord.vue index 383031f3d1..9367ef04f1 100644 --- a/packages/client/src/pages/admin/integrations-discord.vue +++ b/packages/client/src/pages/admin/integrations-discord.vue @@ -1,37 +1,36 @@ <template> -<FormBase> +<MkSpacer :content-max="700" :margin-min="16" :margin-max="32"> <FormSuspense :p="init"> - <FormSwitch v-model="enableDiscordIntegration"> - {{ $ts.enable }} + <FormSwitch v-model="enableDiscordIntegration" class="_formBlock"> + <template #label>{{ $ts.enable }}</template> </FormSwitch> <template v-if="enableDiscordIntegration"> - <FormInfo>Callback URL: {{ `${uri}/api/dc/cb` }}</FormInfo> + <FormInfo class="_formBlock">Callback URL: {{ `${uri}/api/dc/cb` }}</FormInfo> - <FormInput v-model="discordClientId"> + <FormInput v-model="discordClientId" class="_formBlock"> <template #prefix><i class="fas fa-key"></i></template> - Client ID + <template #label>Client ID</template> </FormInput> - <FormInput v-model="discordClientSecret"> + <FormInput v-model="discordClientSecret" class="_formBlock"> <template #prefix><i class="fas fa-key"></i></template> - Client Secret + <template #label>Client Secret</template> </FormInput> </template> - <FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> + <FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> </FormSuspense> -</FormBase> +</MkSpacer> </template> <script lang="ts"> import { defineComponent } from 'vue'; -import FormSwitch from '@/components/debobigego/switch.vue'; -import FormInput from '@/components/debobigego/input.vue'; -import FormButton from '@/components/debobigego/button.vue'; -import FormBase from '@/components/debobigego/base.vue'; -import FormInfo from '@/components/debobigego/info.vue'; -import FormSuspense from '@/components/debobigego/suspense.vue'; +import FormSwitch from '@/components/form/switch.vue'; +import FormInput from '@/components/form/input.vue'; +import FormButton from '@/components/ui/button.vue'; +import FormInfo from '@/components/ui/info.vue'; +import FormSuspense from '@/components/form/suspense.vue'; import * as os from '@/os'; import * as symbols from '@/symbols'; import { fetchInstance } from '@/instance'; @@ -40,7 +39,6 @@ export default defineComponent({ components: { FormSwitch, FormInput, - FormBase, FormInfo, FormButton, FormSuspense, diff --git a/packages/client/src/pages/admin/integrations-github.vue b/packages/client/src/pages/admin/integrations-github.vue index ecb2fd67fa..7c257b6ec8 100644 --- a/packages/client/src/pages/admin/integrations-github.vue +++ b/packages/client/src/pages/admin/integrations-github.vue @@ -1,37 +1,36 @@ <template> -<FormBase> +<MkSpacer :content-max="700" :margin-min="16" :margin-max="32"> <FormSuspense :p="init"> - <FormSwitch v-model="enableGithubIntegration"> - {{ $ts.enable }} + <FormSwitch v-model="enableGithubIntegration" class="_formBlock"> + <template #label>{{ $ts.enable }}</template> </FormSwitch> <template v-if="enableGithubIntegration"> - <FormInfo>Callback URL: {{ `${uri}/api/gh/cb` }}</FormInfo> + <FormInfo class="_formBlock">Callback URL: {{ `${uri}/api/gh/cb` }}</FormInfo> - <FormInput v-model="githubClientId"> + <FormInput v-model="githubClientId" class="_formBlock"> <template #prefix><i class="fas fa-key"></i></template> - Client ID + <template #label>Client ID</template> </FormInput> - <FormInput v-model="githubClientSecret"> + <FormInput v-model="githubClientSecret" class="_formBlock"> <template #prefix><i class="fas fa-key"></i></template> - Client Secret + <template #label>Client Secret</template> </FormInput> </template> - <FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> + <FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> </FormSuspense> -</FormBase> +</MkSpacer> </template> <script lang="ts"> import { defineComponent } from 'vue'; -import FormSwitch from '@/components/debobigego/switch.vue'; -import FormInput from '@/components/debobigego/input.vue'; -import FormButton from '@/components/debobigego/button.vue'; -import FormBase from '@/components/debobigego/base.vue'; -import FormInfo from '@/components/debobigego/info.vue'; -import FormSuspense from '@/components/debobigego/suspense.vue'; +import FormSwitch from '@/components/form/switch.vue'; +import FormInput from '@/components/form/input.vue'; +import FormButton from '@/components/ui/button.vue'; +import FormInfo from '@/components/ui/info.vue'; +import FormSuspense from '@/components/form/suspense.vue'; import * as os from '@/os'; import * as symbols from '@/symbols'; import { fetchInstance } from '@/instance'; @@ -40,7 +39,6 @@ export default defineComponent({ components: { FormSwitch, FormInput, - FormBase, FormInfo, FormButton, FormSuspense, diff --git a/packages/client/src/pages/admin/integrations-twitter.vue b/packages/client/src/pages/admin/integrations-twitter.vue index 1404102c57..4709103ee6 100644 --- a/packages/client/src/pages/admin/integrations-twitter.vue +++ b/packages/client/src/pages/admin/integrations-twitter.vue @@ -1,37 +1,36 @@ <template> -<FormBase> +<MkSpacer :content-max="700" :margin-min="16" :margin-max="32"> <FormSuspense :p="init"> - <FormSwitch v-model="enableTwitterIntegration"> - {{ $ts.enable }} + <FormSwitch v-model="enableTwitterIntegration" class="_formBlock"> + <template #label>{{ $ts.enable }}</template> </FormSwitch> <template v-if="enableTwitterIntegration"> - <FormInfo>Callback URL: {{ `${uri}/api/tw/cb` }}</FormInfo> + <FormInfo class="_formBlock">Callback URL: {{ `${uri}/api/tw/cb` }}</FormInfo> - <FormInput v-model="twitterConsumerKey"> + <FormInput v-model="twitterConsumerKey" class="_formBlock"> <template #prefix><i class="fas fa-key"></i></template> - Consumer Key + <template #label>Consumer Key</template> </FormInput> - <FormInput v-model="twitterConsumerSecret"> + <FormInput v-model="twitterConsumerSecret" class="_formBlock"> <template #prefix><i class="fas fa-key"></i></template> - Consumer Secret + <template #label>Consumer Secret</template> </FormInput> </template> - <FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> + <FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> </FormSuspense> -</FormBase> +</MkSpacer> </template> <script lang="ts"> import { defineComponent } from 'vue'; -import FormSwitch from '@/components/debobigego/switch.vue'; -import FormInput from '@/components/debobigego/input.vue'; -import FormButton from '@/components/debobigego/button.vue'; -import FormBase from '@/components/debobigego/base.vue'; -import FormInfo from '@/components/debobigego/info.vue'; -import FormSuspense from '@/components/debobigego/suspense.vue'; +import FormSwitch from '@/components/form/switch.vue'; +import FormInput from '@/components/form/input.vue'; +import FormButton from '@/components/ui/button.vue'; +import FormInfo from '@/components/ui/info.vue'; +import FormSuspense from '@/components/form/suspense.vue'; import * as os from '@/os'; import * as symbols from '@/symbols'; import { fetchInstance } from '@/instance'; @@ -40,7 +39,6 @@ export default defineComponent({ components: { FormSwitch, FormInput, - FormBase, FormInfo, FormButton, FormSuspense, diff --git a/packages/client/src/pages/admin/integrations.vue b/packages/client/src/pages/admin/integrations.vue index c21eebc1c6..6a6432d2e1 100644 --- a/packages/client/src/pages/admin/integrations.vue +++ b/packages/client/src/pages/admin/integrations.vue @@ -1,32 +1,27 @@ <template> -<FormBase> +<MkSpacer :content-max="700" :margin-min="16" :margin-max="32"> <FormSuspense :p="init"> - <FormLink to="/admin/integrations/twitter"> + <FormLink to="/admin/integrations/twitter" class="_formBlock"> <i class="fab fa-twitter"></i> Twitter <template #suffix>{{ enableTwitterIntegration ? $ts.enabled : $ts.disabled }}</template> </FormLink> - <FormLink to="/admin/integrations/github"> + <FormLink to="/admin/integrations/github" class="_formBlock"> <i class="fab fa-github"></i> GitHub <template #suffix>{{ enableGithubIntegration ? $ts.enabled : $ts.disabled }}</template> </FormLink> - <FormLink to="/admin/integrations/discord"> + <FormLink to="/admin/integrations/discord" class="_formBlock"> <i class="fab fa-discord"></i> Discord <template #suffix>{{ enableDiscordIntegration ? $ts.enabled : $ts.disabled }}</template> </FormLink> </FormSuspense> -</FormBase> +</MkSpacer> </template> <script lang="ts"> import { defineComponent } from 'vue'; -import FormLink from '@/components/debobigego/link.vue'; -import FormInput from '@/components/debobigego/input.vue'; -import FormButton from '@/components/debobigego/button.vue'; -import FormBase from '@/components/debobigego/base.vue'; -import FormGroup from '@/components/debobigego/group.vue'; -import FormTextarea from '@/components/debobigego/textarea.vue'; -import FormInfo from '@/components/debobigego/info.vue'; -import FormSuspense from '@/components/debobigego/suspense.vue'; +import FormLink from '@/components/form/link.vue'; +import FormSecion from '@/components/form/section.vue'; +import FormSuspense from '@/components/form/suspense.vue'; import * as os from '@/os'; import * as symbols from '@/symbols'; import { fetchInstance } from '@/instance'; @@ -34,12 +29,7 @@ import { fetchInstance } from '@/instance'; export default defineComponent({ components: { FormLink, - FormInput, - FormBase, - FormGroup, - FormButton, - FormTextarea, - FormInfo, + FormSecion, FormSuspense, }, |