feat: update README with folder structure and execution instructions; add scraping scripts for news articles

This commit is contained in:
yuanhau 2025-05-11 17:31:37 +08:00
parent c68606ffbe
commit f8fa412de9
7 changed files with 188 additions and 41 deletions

View file

@ -10,20 +10,30 @@ gsap.registerPlugin(TextPlugin);
// Import Windows
import SignIn from "~/components/app/windows/login.vue";
// Import Shadcn/UI components
import AlertComponent from "~/components/ui/alert/Alert.vue";
import ButtonComponent from "~/components/ui/button/Button.vue";
import DialogComponent from "~/components/ui/dialog/Dialog.vue";
import ProgressComponent from "~/components/ui/progress/Progress.vue";
import HoverCardComponent from "~/components/ui/hover-card/HoverCard.vue";
// Icons
import { ComputerDesktopIcon, UserIcon, LanguageIcon, ChevronRightIcon} from "@heroicons/vue/24/outline";
import { ComputerDesktopIcon, UserIcon, LanguageIcon, ChevronRightIcon } from "@heroicons/vue/24/outline";
// i18n
const { t, locale, locales } = useI18n();
const switchLocalePath = useSwitchLocalePath();
const localePath = useLocalePath();
// Router
const router = useRouter();
// values
const popMessage = ref(null);
const menuOpen = ref(false);
const langMenuOpen = ref(false);
const lang = ref(locale.value);
// Date
const currentDate = ref(
new Date().toLocaleDateString("zh-TW", {
@ -51,35 +61,6 @@ onMounted(() => {
});
// functions
const showLogin = () => {
const desktopEl = document.getElementById('desktop');
if (!desktopEl) return;
const loginWindow = document.createElement("div");
loginWindow.className = "login-window absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2";
desktopEl.appendChild(loginWindow);
const app = createApp(SignIn);
app.mount(loginWindow);
setTimeout(() => {
gsap.fromTo(
loginWindow,
{ opacity: 0, scale: 0.5 },
{ opacity: 1, scale: 1, duration: 0.5 },
);
}, 100);
setTimeout(() => {
gsap.to(loginWindow, {
opacity: 0,
scale: 0.5,
duration: 0.5,
onComplete: () => {
desktopEl.removeChild(loginWindow);
},
});
}, 5000);
}
const openWindow = (windowName?: string) => {
console.log(windowName);
menuOpen.value = false;
@ -103,15 +84,15 @@ const toggleLangMenu = () => {
</script>
<template>
<div
class="absolute inset-x-0 flex flex-row px-2 py-1 bg-white dark:bg-gray-900 justify-between align-center text-center z-50"
class="absolute inset-x-0 flex flex-row px-2 py-1 bg-[#7D7C7C]/70 text-white justify-between align-center text-center z-50"
>
<div class="flex flex-row g-2 text-gray-400 dark:text-gray-500">
<button @click="toggleMenu" class="w-8 h-8 text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-all duration-100 flex flex-row">
<div class="flex flex-row g-2 text-gray-400 text-white ">
<button @click="toggleMenu" class="w-8 h-8 text-white hover:text-blue-500 transition-all duration-100 flex flex-row">
<ComputerDesktopIcon/>
</button>
<span class="ml-1 mr-2 text-[20px]">|</span>
</div>
<div class="text-gray-400">{{ currentDate }}</div>
<div class="text-center align-middle justify-center text-white">{{ currentDate }}</div>
</div>
<div class="w-full h-[2.5em]"></div>
<Transition
@ -131,7 +112,7 @@ const toggleLangMenu = () => {
class="flex flex-col justify-center align-center text-center absolute w-full h-screen inset-x-0 inset-y-0 z-[-1]"
id="desktop"
>
</div>
<div
class="absolute w-[calc(100% - 5px)] inset-x-0 bottom-0 mx-[1.5px] p-3 justify-between align-center flex flex-row"
@ -156,8 +137,8 @@ const toggleLangMenu = () => {
<!--Clerk-->
<SignedOut>
<SignInButton>
<button @click="showLogin" class="w-8 h-8 text-gray-400 dark:text-gray-500 flex flex-row">
<UserIcon class="w-8 h-8 text-gray-400 dark:text-gray-500 hover:text-blue-500 transition-all duration-100" />
<button @click="openWindow('login')" class="w-8 h-8 text-gray-400 flex flex-row">
<UserIcon class="w-8 h-8 text-gray-400 hover:text-blue-500 transition-all duration-100" />
</button>
</SignInButton>
</SignedOut>