chiyiandDevin
602664c122
- Logo 渐变从粉紫改为橙/粉/蓝蜡笔色，快门圆点改橙色 - 批量替换 accent：violet→orange、fuchsia→rose、indigo→sky、purple→orange， 十六进制与 rgb 字面量同步换算为 Tailwind 对应色 - 修复类名合并冲突：管理员筛选 pill 改 fp-orange、会员号改 fp-pink（新增）， style.css 中去重 fp-rose/fp-orange 并补 fp-pink 的浅色模式变体 - 选区色、标签输入框、筛选 pill、图表、滑块等所有紫色残留全部归位 Generated with [Devin](https://devin.ai) Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>
43 lines
1.7 KiB
Vue
43 lines
1.7 KiB
Vue
<script setup>
|
|
// Vivid mark: an open spectrum ring (lens/aperture) around a folded "V", with a
|
|
// shutter dot closing the gap — image + video in one glyph. Transparent
|
|
// background so it reads on both the dark and light shells. Colors follow the
|
|
// memphis crayon palette (orange / pink / blue).
|
|
// Each instance gets unique gradient ids (useId) so multiple logos on one
|
|
// page don't share/clobber defs.
|
|
import { useId } from 'vue'
|
|
|
|
defineProps({ size: { type: [Number, String], default: 40 } })
|
|
|
|
const uid = useId()
|
|
const gRing = `vring-${uid}`
|
|
const gV = `vv-${uid}`
|
|
</script>
|
|
|
|
<template>
|
|
<svg :width="size" :height="size" viewBox="0 0 48 48" fill="none"
|
|
xmlns="http://www.w3.org/2000/svg" class="shrink-0">
|
|
<defs>
|
|
<linearGradient :id="gRing" x1="6" y1="6" x2="42" y2="42" gradientUnits="userSpaceOnUse">
|
|
<stop stop-color="#ec5b13" />
|
|
<stop offset="0.5" stop-color="#f472b6" />
|
|
<stop offset="1" stop-color="#38bdf8" />
|
|
</linearGradient>
|
|
<linearGradient :id="gV" x1="14" y1="14" x2="34" y2="34" gradientUnits="userSpaceOnUse">
|
|
<stop stop-color="#f97316" />
|
|
<stop offset="1" stop-color="#ec5b13" />
|
|
</linearGradient>
|
|
</defs>
|
|
|
|
<g transform="translate(24 24)">
|
|
<!-- open ring: dash gap leaves room for the shutter dot -->
|
|
<circle r="18.5" fill="none" :stroke="`url(#${gRing})`" stroke-width="3.2"
|
|
stroke-linecap="round" stroke-dasharray="86 30" transform="rotate(-58)" />
|
|
<!-- folded V -->
|
|
<path d="M-8 -7.5 L0 9 L8 -7.5" fill="none" :stroke="`url(#${gV})`" stroke-width="4.8"
|
|
stroke-linecap="round" stroke-linejoin="round" />
|
|
<circle cx="13" cy="-13" r="3.4" fill="#ec5b13" />
|
|
</g>
|
|
</svg>
|
|
</template>
|