💄 调整链接组件样式

This commit is contained in:
目棃
2024-05-21 17:00:19 +08:00
parent 3ba6584b1e
commit 0c4a688535

View File

@@ -1,14 +1,13 @@
<template> <template>
<div <span
v-if="mode == 'link'" v-if="mode == 'link'"
class="tp-text-link" class="tp-text-link"
@click="toLink()" @click="toLink()"
:title="props.data.attributes?.link" :title="props.data.attributes?.link"
:style="getTextStyle()" :style="getTextStyle()"
> >
<v-icon size="small" v-if="!props.data.insert.startsWith('>>')">mdi-link-variant</v-icon> {{ props.data.insert }}
<span>{{ props.data.insert }}</span> </span>
</div>
<span v-else-if="mode == 'emoji'" class="tp-text-emoji"> <span v-else-if="mode == 'emoji'" class="tp-text-emoji">
<img :src="getEmojiUrl()" :alt="getEmojiName()" :title="getEmojiName()" /> <img :src="getEmojiUrl()" :alt="getEmojiName()" :title="getEmojiName()" />
</span> </span>
@@ -18,9 +17,7 @@
:data="emoji" :data="emoji"
:key="indexE" :key="indexE"
/> />
<span v-else :style="getTextStyle()"> <span v-else :style="getTextStyle()">{{ props.data.insert }}</span>
{{ props.data.insert }}
</span>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { onMounted, ref, StyleValue, toRaw } from "vue"; import { onMounted, ref, StyleValue, toRaw } from "vue";
@@ -157,11 +154,10 @@ function getEmojiName() {
</script> </script>
<style lang="css" scoped> <style lang="css" scoped>
.tp-text-link { .tp-text-link {
display: inline-flex;
align-items: center;
justify-content: center;
color: #00c3ff; color: #00c3ff;
cursor: pointer; cursor: pointer;
text-decoration: underline solid #00c3ff;
text-underline-position: under;
transform: translateY(2px); transform: translateY(2px);
} }