mirror/Hangar
2
0
Fork 0
mirror of https://github.com/HangarMC/Hangar.git synced 2024-11-27 06:01:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

Update close and disabled buttons

Browse Source
This commit is contained in:
Nassim Jahnke 2022-04-02 21:32:56 +02:00
parent a91af36ca8
commit 4186546e51
No known key found for this signature in database
GPG Key ID: 6BE3B555EBC5982B
10 changed files with 16 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
frontend-new/src/components/design/Button.vue
View File

@ -8,10 +8,12 @@ const props = withDefaults(
defineProps<{
disabled?: boolean;
size?: "small" | "medium" | "large";
type?: "primary" | "gray";
}>(),
{
disabled: false,
size: "small",
type: "primary",
}
);
const paddingClass = computed(() => {
@ -32,9 +34,7 @@ const paddingClass = computed(() => {
<template>
<button
:class="
'rounded-md text-white font-semibold h-min inline-flex items-center ' + paddingClass + (disabled ? ' bg-gray-500 cursor-not-allowed' : ' bg-primary-100')
"
:class="'rounded-md text-white font-semibold h-min inline-flex items-center ' + paddingClass + ' button-' + type"
:hover="disabled ? '' : 'bg-primary-50 text-primary-100'"
:disabled="disabled"
v-bind="$attrs"

2
frontend-new/src/components/modals/ChannelModal.vue
View File

@ -21,7 +21,7 @@ const i18n = useI18n();
<template #default="{ on }">
<!-- todo implement channel modal -->
<Button class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
<Button type="gray" class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
</template>
<template #activator="{ on }">
<slot name="activator" :on="on"></slot>

2
frontend-new/src/components/modals/DeletePageModal.vue
View File

@ -14,8 +14,8 @@ const i18n = useI18n();
<Modal :title="i18n.t('page.delete.title')">
<template #default="{ on }">
<p>{{ i18n.t("page.delete.text") }}</p>
<Button class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
<Button class="mt-2 ml-2" @click="emit('delete')">{{ i18n.t("general.delete") }}</Button>
<Button type="gray" class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
</template>
<template #activator="{ on }">
<slot name="activator" :on="on"></slot>

2
frontend-new/src/components/modals/DiffModal.vue
View File

@ -54,7 +54,7 @@ const prettyDiff = computed(() => {
<!-- eslint-disable-next-line vue/no-v-html -->
<div v-html="prettyDiff"></div>
<Button class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
<Button type="gray" class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
</template>
<template #activator="{ on }">
<slot name="activator" :on="on"></slot>

2
frontend-new/src/components/modals/MarkdownModal.vue
View File

@ -17,7 +17,7 @@ const i18n = useI18n();
<template #default="{ on }">
<Markdown :raw="markdown"></Markdown>
<Button class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
<Button type="gray" class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
</template>
<template #activator="{ on }">
<slot name="activator" :on="on"></slot>

2
frontend-new/src/components/modals/NewPageModal.vue
View File

@ -92,8 +92,8 @@ async function createPage() {
<InputSelect v-model="parent" :values="pageRoots" :label="i18n.t('page.new.parent')" />
</div>
<div>
<Button class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
<Button class="mt-2 ml-2" :disabled="validateLoading || loading" @click="createPage">{{ i18n.t("general.create") }}</Button>
<Button type="gray" class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
</div>
</template>
<template #activator="{ on }">

7
frontend-new/src/components/modals/TaglineModal.vue
View File

@ -40,10 +40,9 @@ async function save() {
<Modal :title="i18n.t('author.editTagline')">
<template #default="{ on }">
<InputText v-model.trim="newTagline" :label="i18n.t('author.taglineLabel')" counter :maxlength="backendData.validations.userTagline.max" />
<Button size="medium" class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
<Button size="medium" class="mt-2 ml-2" @click="newTagline = tagline">{{ i18n.t("general.reset") }}</Button>
<Button size="medium" class="mt-2 ml-2" @click="save">{{ i18n.t("general.change") }}</Button>
<br />
<Button size="medium" class="mt-2" @click="save">{{ i18n.t("general.change") }}</Button>
<Button type="gray" size="medium" class="mt-2 ml-2" v-on="on">{{ i18n.t("general.close") }}</Button>
</template>
<template #activator="{ on }">
<Button size="small" class="ml-2 inline-flex" v-on="on">

2
frontend-new/src/components/modals/TextAreaModal.vue
View File

@ -29,8 +29,8 @@ async function _submit(close: () => void) {
<template #default="{ on }">
<InputTextarea v-model.trim="message" :label="label" :rows="2" @keydown.enter.prevent="" />
<Button class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
<Button class="mt-2 ml-2" :disabled="loading" @click="_submit(on.click)">{{ i18n.t("general.submit") }}</Button>
<Button type="gray" class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
</template>
<template #activator="{ on }">
<slot name="activator" :on="on"></slot>

2
frontend-new/src/components/modals/VisibilityChangerModal.vue
View File

@ -49,8 +49,8 @@ async function submit(closeModal: () => void): Promise<void> {
<InputTextarea v-if="showTextarea" v-model.trim="reason" rows="2" :label="i18n.t('visibility.modal.reason')" />
<Button class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
<Button class="mt-2 ml-2" @click="submit(on.click)">{{ i18n.t("general.submit") }}</Button>
<Button type="gray" class="mt-2" v-on="on">{{ i18n.t("general.close") }}</Button>
</template>
<template #activator="{ on }">
<Button v-bind="$attrs" class="mr-1" v-on="on">

4
frontend-new/windi.config.ts
View File

@ -4,7 +4,7 @@ import typography from "windicss/plugin/typography";
export default defineConfig({
darkMode: "class",
safelist: "order-last",
safelist: "order-last button-primary button-gray",
attributify: true,
plugins: [typography()],
theme: {
@ -73,5 +73,7 @@ export default defineConfig({
"background-body": "bg-background-light-10 dark:bg-background-dark-80",
"color-primary": "text-primary-100 dark:text-primary-70",
"border-top-primary": "border-solid border-t-4 border-t-primary-100",
"button-gray": "bg-zinc-500 dark:bg-slate-700 disabled:(bg-gray-300 text-neutral-500 cursor-not-allowed)",
"button-primary": "bg-primary-100 disabled:(bg-gray-300 text-neutral-500 cursor-not-allowed)",
},
});