mirror of
https://github.com/RhenCloud/Cloud-Home.git
synced 2026-01-22 17:39:07 +08:00
style(app): 使用 NuxtImg 替代 img 标签
在多个组件中将 `img` 标签替换为 `NuxtImg` 标签,提升图片加载的性能和优化。例如,在 `AboutSection.vue`、`FriendsSection.vue`、`HeroSection.vue`、`ProjectsSection.vue`、`SitesSection.vue` 和 `SkillsSection.vue` 中的图片标签。 refactor(app): 扩展 `nuxt.config.ts` 配置 扩展了 `nuxt.config.ts` 配置文件中的模块配置,添加了 `@nuxt/image` 和 `@nuxt/eslint` 模块。同时,优化了 `routeRules` 配置,以支持预渲染和增量静态生成。
This commit is contained in:
@@ -1,20 +1,23 @@
|
||||
<template>
|
||||
<div class="my-4 mx-auto max-w-3xl w-full px-4 py-3 grid grid-cols-[auto_1fr_auto] gap-3 items-center">
|
||||
<button :disabled="currentIndex <= 0" @click="goPrev"
|
||||
class="bg-white/10 text-text-primary border border-white/15 rounded-2xl px-3 py-2 cursor-pointer transition-all duration-200 hover:bg-primary/20 hover:border-primary/40 hover:text-primary disabled:opacity-50 disabled:cursor-not-allowed">
|
||||
<button
|
||||
:disabled="currentIndex <= 0" class="bg-white/10 text-text-primary border border-white/15 rounded-2xl px-3 py-2 cursor-pointer transition-all duration-200 hover:bg-primary/20 hover:border-primary/40 hover:text-primary disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
@click="goPrev">
|
||||
上一页
|
||||
</button>
|
||||
<div class="flex gap-2 flex-wrap justify-center">
|
||||
<button v-for="item in pages" :key="item.name" :class="{
|
||||
<button
|
||||
v-for="item in pages" :key="item.name" :class="{
|
||||
'bg-primary/30 border-primary/60 text-primary shadow-lg shadow-primary/25':
|
||||
item.name === route.name,
|
||||
}" @click="router.push({ name: item.name })"
|
||||
class="px-2.5 py-2 bg-white/10 text-text-primary border border-white/15 rounded-2xl cursor-pointer transition-all duration-200 hover:bg-white/15 hover:border-primary/40">
|
||||
}" class="px-2.5 py-2 bg-white/10 text-text-primary border border-white/15 rounded-2xl cursor-pointer transition-all duration-200 hover:bg-white/15 hover:border-primary/40"
|
||||
@click="router.push({ name: item.name })">
|
||||
{{ item.label }}
|
||||
</button>
|
||||
</div>
|
||||
<button :disabled="currentIndex >= pages.length - 1" @click="goNext"
|
||||
class="bg-white/10 text-text-primary border border-white/15 rounded-2xl px-3 py-2 cursor-pointer transition-all duration-200 hover:bg-primary/20 hover:border-primary/40 hover:text-primary disabled:opacity-50 disabled:cursor-not-allowed">
|
||||
<button
|
||||
:disabled="currentIndex >= pages.length - 1" class="bg-white/10 text-text-primary border border-white/15 rounded-2xl px-3 py-2 cursor-pointer transition-all duration-200 hover:bg-primary/20 hover:border-primary/40 hover:text-primary disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
@click="goNext">
|
||||
下一页
|
||||
</button>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user