GithubBackup/PicList
1
0
Fork 0
mirror of https://github.com/Kuingsmile/PicList.git synced 2026-05-06 20:42:57 +08:00
Code Issues Packages Projects Releases Wiki Activity

✨ Feature(custom): optimze color of scripts action button

Browse Source
This commit is contained in:
Kuingsmile
2026-01-29 09:59:54 +08:00
parent 345bd1e7f7
commit a0f3b538f3
2 changed files with 30 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/renderer/assets/svg/BaseSvg.vue Normal file
View File

@@ -0,0 +1,21 @@
<template>
<svg :width="size" :height="size" :viewBox="viewBox" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<defs>
<symbol id="icon-GitHub" viewBox="0 0 24 24">
<path
d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"
/>
</symbol>
</defs>
<use :href="`#icon-${name}`" />
</svg>
</template>
<script setup>
defineProps({
name: { type: String, required: true },
size: { type: [Number, String], default: 18 },
viewBox: { type: String, default: '0 0 24 24' },
})
</script>

38
src/renderer/pages/ScriptPage.vue
View File

@@ -90,7 +90,7 @@
<Trash2 :size="14" /> <Trash2 :size="14" />
</button> </button>
<button <button
class="action-btn bg-accent text-white!" class="action-btn bg-accent/50 text-white! hover:bg-accent!"
:title="t('pages.scripts.marketplace.shareScript')" :title="t('pages.scripts.marketplace.shareScript')"
@click.stop="openShareDialog(item)" @click.stop="openShareDialog(item)"
> >
@@ -98,7 +98,7 @@
</button> </button>
<button <button
v-if="item.category === 'manualTrigger'" v-if="item.category === 'manualTrigger'"
class="action-btn bg-accent/50 text-white!" class="action-btn bg-accent/50 text-white! hover:bg-accent!"
:title="t('pages.scripts.runScript')" :title="t('pages.scripts.runScript')"
@click.stop="runScript(item.filePath)" @click.stop="runScript(item.filePath)"
> >
@@ -109,8 +109,8 @@
v-if="item.category !== 'manualTrigger' && item.category !== 'uploader.advancedplist'" v-if="item.category !== 'manualTrigger' && item.category !== 'uploader.advancedplist'"
class="action-btn border-none" class="action-btn border-none"
:class="{ :class="{
'bg-success/40': !item.enabled, 'bg-success/50 hover:bg-success!': !item.enabled,
'bg-error/40': item.enabled, 'bg-error/50 hover:bg-error!': item.enabled,
}" }"
:title="item.enabled ? t('pages.scripts.disableScript') : t('pages.scripts.enableScript')" :title="item.enabled ? t('pages.scripts.disableScript') : t('pages.scripts.enableScript')"
@click.stop="toggleScript(item.filePath)" @click.stop="toggleScript(item.filePath)"
@@ -257,12 +257,7 @@
@click="handleGitHubLogin" @click="handleGitHubLogin"
> >
<template #icon> <template #icon>
<svg width="18" height="18" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <BaseSvg name="GitHub" :size="18" color="black" />
<title>GitHub</title>
<path
d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"
/>
</svg>
</template> </template>
</CustomButton> </CustomButton>
</template> </template>
@@ -395,12 +390,7 @@
> >
<div class="flex flex-col gap-4 p-6"> <div class="flex flex-col gap-4 p-6">
<div v-if="!githubAuth.isAuthenticated" class="flex flex-col items-center gap-4 py-8"> <div v-if="!githubAuth.isAuthenticated" class="flex flex-col items-center gap-4 py-8">
<svg width="48" height="48" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <BaseSvg name="GitHub" :size="18" color="black" />
<title>GitHub</title>
<path
d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"
/>
</svg>
<p class="text-center text-sm text-secondary">{{ t('pages.scripts.marketplace.loginRequired') }}</p> <p class="text-center text-sm text-secondary">{{ t('pages.scripts.marketplace.loginRequired') }}</p>
<CustomButton <CustomButton
type="primary" type="primary"
@@ -409,12 +399,7 @@
@click="handleGitHubLogin" @click="handleGitHubLogin"
> >
<template #icon> <template #icon>
<svg width="18" height="18" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <BaseSvg name="GitHub" :size="18" color="black" />
<title>GitHub</title>
<path
d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"
/>
</svg>
</template> </template>
</CustomButton> </CustomButton>
</div> </div>
@@ -469,12 +454,7 @@
height="auto" height="auto"
> >
<div class="flex flex-col items-center gap-6 p-6"> <div class="flex flex-col items-center gap-6 p-6">
<svg width="48" height="48" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <BaseSvg name="GitHub" :size="18" color="black" />
<title>GitHub</title>
<path
d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"
/>
</svg>
<p class="text-center text-secondary"> <p class="text-center text-secondary">
{{ t('pages.scripts.marketplace.deviceFlowInstructions') }} {{ t('pages.scripts.marketplace.deviceFlowInstructions') }}
</p> </p>
@@ -549,6 +529,7 @@ import {
import { computed, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue' import { computed, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import BaseSvg from '@/assets/svg/BaseSvg.vue'
import CustomButton from '@/components/common/CustomButton.vue' import CustomButton from '@/components/common/CustomButton.vue'
import CustomInput from '@/components/common/CustomInput.vue' import CustomInput from '@/components/common/CustomInput.vue'
import CustomModal from '@/components/common/CustomModal.vue' import CustomModal from '@/components/common/CustomModal.vue'
@@ -852,7 +833,6 @@ async function fetchMarketplaceScripts() {
try { try {
const scripts = await window.electron.triggerRPC<IScriptMeta[]>(IRPCActionType.SCRIPT_MARKETPLACE_FETCH_LIST) const scripts = await window.electron.triggerRPC<IScriptMeta[]>(IRPCActionType.SCRIPT_MARKETPLACE_FETCH_LIST)
marketplaceScripts.value = scripts || [] marketplaceScripts.value = scripts || []
console.log('Fetched marketplace scripts:', marketplaceScripts.value)
} catch (error) { } catch (error) {
console.error('Failed to fetch marketplace scripts:', error) console.error('Failed to fetch marketplace scripts:', error)
marketplaceError.value = true marketplaceError.value = true