29 lines
987 B
TypeScript
29 lines
987 B
TypeScript
import { defineComponent } from 'vue'
|
|
import useGameNews from './useGameNews'
|
|
|
|
export default defineComponent(() => {
|
|
const store = useGameNews()
|
|
return () => (
|
|
<div
|
|
class="w-full h-full grid grid-cols-1 grid-rows-3 p-2 gap-y-1"
|
|
style={{
|
|
background: 'rgba(23,33,45,.6)'
|
|
}}
|
|
>
|
|
{store.list
|
|
.filter((_, index) => index < 3)
|
|
.map((item) => (
|
|
<div class={'w-full rounded-xl bg-[#17212d] flex gap-x-2 p-1'}>
|
|
<img class={'h-full w-[45px] rounded-lg object-cover'} src={item.cover}></img>
|
|
<div class={'flex flex-col overflow-hidden justify-between py-[2px]'}>
|
|
<span class={'text-white text-nowrap text-[14px] text-ellipsis overflow-hidden'}>
|
|
{item.title}
|
|
</span>
|
|
<span class={'text-white text-nowrap text-[12px] opacity-60 text-ellipsis overflow-hidden'}>{item.content}</span>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
)
|
|
})
|