feat: rebrand site to CineK

This commit is contained in:
ngthanhvu
2026-05-24 22:35:13 +07:00
parent f2479074df
commit 30502c9854
25 changed files with 693 additions and 442 deletions
+21 -19
View File
@@ -1,4 +1,4 @@
<script setup lang="ts">
<script setup lang="ts">
import { ChevronLeft, ChevronRight, Search } from 'lucide-vue-next'
const route = useRoute()
@@ -8,12 +8,6 @@ const page = ref(Math.max(Number(route.query.page || 1), 1))
const keyword = ref(typeof route.query.q === 'string' ? route.query.q : '')
const debouncedKeyword = ref(keyword.value.trim())
const type = ref(typeof route.query.type === 'string' ? route.query.type : 'all')
const sourceOptions = [
{ label: 'Tất cả API', value: 'all' },
{ label: 'OPhim', value: 'ophim' },
{ label: 'NguonC', value: 'nguonc' },
{ label: 'KKPhim', value: 'kkphim' },
]
let searchTimer: ReturnType<typeof setTimeout> | undefined
@@ -93,11 +87,19 @@ onBeforeUnmount(() => {
})
useHead({
title: 'Duyệt phim Hàn Quốc - KR Phim',
title: 'Kho phim Hàn Quốc - CineK',
meta: [
{
name: 'description',
content: 'Tìm kiếm và lọc phim Hàn Quốc Vietsub trên KR Phim.',
content: 'Duyệt kho phim Hàn Quốc online trên CineK: tìm phim bộ, phim lẻ, phim mới cập nhật, Vietsub, thuyết minh và lồng tiếng.',
},
{
property: 'og:title',
content: 'Kho phim Hàn Quốc - CineK',
},
{
property: 'og:description',
content: 'Tìm kiếm và lọc phim Hàn Quốc online theo thể loại, tập mới và nội dung mới cập nhật.',
},
],
})
@@ -110,7 +112,7 @@ useHead({
<section class="mx-auto max-w-390 px-4 pb-16 pt-36 sm:px-6 lg:px-8 lg:pt-28 xl:px-10">
<div class="mb-8 flex flex-col gap-5 lg:flex-row lg:items-end lg:justify-between">
<div>
<p class="text-sm font-semibold text-emerald-200">Kho phim Hàn Quốc</p>
<p class="text-sm font-semibold text-yellow-200">Kho phim Hàn Quốc</p>
<h1 class="mt-2 text-3xl font-black text-white sm:text-5xl">
Duyệt phim
</h1>
@@ -118,8 +120,8 @@ useHead({
<div class="flex w-full flex-col gap-3 sm:flex-row lg:max-w-3xl">
<div
class="flex min-w-0 flex-1 items-center rounded-full border border-white/10 bg-white/8 px-4 py-3 shadow-2xl shadow-emerald-950/20">
<Search class="mr-3 size-4 shrink-0 text-emerald-200" />
class="flex min-w-0 flex-1 items-center rounded-full border border-white/10 bg-white/8 px-4 py-3 shadow-2xl shadow-yellow-950/20">
<Search class="mr-3 size-4 shrink-0 text-yellow-200" />
<input v-model="keyword" type="search" placeholder="Tìm phim Hàn Quốc..."
class="w-full bg-transparent text-sm text-white outline-none placeholder:text-slate-400">
</div>
@@ -127,15 +129,15 @@ useHead({
<div
class="grid grid-cols-3 rounded-full border border-white/10 bg-white/8 p-1 text-sm font-bold text-slate-200">
<button type="button" class="rounded-full px-4 py-2 transition"
:class="type === 'all' ? 'bg-emerald-300 text-slate-950' : 'hover:text-white'" @click="type = 'all'">
:class="type === 'all' ? 'bg-yellow-300 text-slate-950' : 'hover:text-white'" @click="type = 'all'">
Tất cả
</button>
<button type="button" class="rounded-full px-4 py-2 transition"
:class="type === 'series' ? 'bg-emerald-300 text-slate-950' : 'hover:text-white'" @click="type = 'series'">
:class="type === 'series' ? 'bg-yellow-300 text-slate-950' : 'hover:text-white'" @click="type = 'series'">
Phim bộ
</button>
<button type="button" class="rounded-full px-4 py-2 transition"
:class="type === 'single' ? 'bg-emerald-300 text-slate-950' : 'hover:text-white'" @click="type = 'single'">
:class="type === 'single' ? 'bg-yellow-300 text-slate-950' : 'hover:text-white'" @click="type = 'single'">
Phim lẻ
</button>
</div>
@@ -161,14 +163,14 @@ useHead({
<NuxtLink v-for="movie in filteredMovies" :key="`${movie.source}-${movie.slug}`"
:to="movieLink(movie)" class="group">
<div
class="relative aspect-2/3 overflow-hidden rounded-md bg-slate-900 shadow-xl shadow-black/25 ring-1 ring-white/10 transition duration-300 group-hover:-translate-y-1 group-hover:ring-emerald-300/60">
class="relative aspect-2/3 overflow-hidden rounded-md bg-slate-900 shadow-xl shadow-black/25 ring-1 ring-white/10 transition duration-300 group-hover:-translate-y-1 group-hover:ring-yellow-300/60">
<img :src="movie.thumb || movie.poster" :alt="movie.name"
class="h-full w-full object-cover transition duration-500 group-hover:scale-105">
<div class="absolute inset-x-0 bottom-0 bg-linear-to-t from-slate-950 via-slate-950/70 to-transparent p-3">
<p class="line-clamp-2 text-sm font-bold leading-snug text-white">{{ movie.name }}</p>
<p class="mt-1 truncate text-xs text-emerald-100">{{ movie.episode || movie.year || movie.quality }}</p>
<p class="mt-1 truncate text-xs text-yellow-100">{{ movie.episode || movie.year || movie.quality }}</p>
</div>
<span v-if="movie.sources?.length > 1" class="absolute left-2 top-2 rounded bg-emerald-400 px-2 py-1 text-xs font-black text-slate-950">
<span v-if="movie.sources?.length > 1" class="absolute left-2 top-2 rounded bg-yellow-400 px-2 py-1 text-xs font-black text-slate-950">
{{ movie.sources.length }} server
</span>
</div>
@@ -189,7 +191,7 @@ useHead({
<span class="text-sm text-slate-300">Trang {{ page }}<template v-if="totalPages"> / {{ totalPages
}}</template></span>
<button type="button"
class="grid size-11 place-items-center rounded-full bg-emerald-300 text-slate-950 hover:bg-white"
class="grid size-11 place-items-center rounded-full bg-yellow-300 text-slate-950 hover:bg-white"
aria-label="Trang sau" @click="nextPage">
<ChevronRight class="size-5" />
</button>