element-plus/docs/.vitepress/vitepress/components/sponsors/right-logo-small-list.vue

46 lines
1.3 KiB
Vue
Raw Normal View History

2022-06-11 16:35:10 +08:00
<script setup lang="ts">
import { rightLogoSmallSponsors } from '../../../config/sponsors'
import { sendEvent } from '../../../config/analytics'
import { isDark } from '../../composables/dark'
const onItemClick = (item: any) => {
sendEvent('sp_click', item.name, 'right_logo_small')
}
</script>
<template>
<div class="m-t-16px flex flex-wrap justify-between">
2022-06-12 00:09:01 +08:00
<template
2022-06-11 16:35:10 +08:00
v-for="item in rightLogoSmallSponsors.concat([{} as any])"
:key="item.name"
>
<div
2022-06-12 00:09:01 +08:00
v-if="!item.url"
2022-06-11 16:35:10 +08:00
:class="[
2022-06-12 00:09:01 +08:00
isDark && '!bg-#262729 color-$text-color-placeholder',
2022-06-11 16:35:10 +08:00
'flex bg-#F9F9F9 rd-0px h-40px w-89px justify-center items-center',
]"
>
2022-06-12 00:09:01 +08:00
<div class="color-#ddd text-13px cursor-default">Your logo</div>
2022-06-11 16:35:10 +08:00
</div>
2022-06-12 00:09:01 +08:00
<a
v-else
:href="item.url"
:title="`${item.name_cn || item.name} - ${
item.slogan_cn || item.slogan
}`"
target="_blank"
@click="onItemClick(item)"
>
<div
:class="[
isDark && '!bg-#262729',
2022-08-31 00:30:42 +08:00
'flex m-b-2px bg-#F9F9F9 rd-0px h-40px w-89px justify-center items-center',
2022-06-12 00:09:01 +08:00
]"
>
<img :src="item.imgL" :alt="item.name" />
</div>
</a>
</template>
2022-06-11 16:35:10 +08:00
</div>
</template>