library-frontend/index.html at main · library-fullstack/library-frontend · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
<!DOCTYPE html>
<html lang="vi">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/png" href="/favicon.png" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta
      name="description"
      content="Thư viện trực tuyến HBH - Khám phá hàng nghìn cuốn sách học tập, nghiên cứu và giải trí. Đặt mượn sách online dễ dàng, nhanh chóng."
    />
    <meta
      name="keywords"
      content="thư viện, sách, mượn sách online, đọc sách, học tập, HBH, diễn đàn"
    />
    <meta name="author" content="Thư viện trực tuyến HBH" />
    <meta name="robots" content="index, follow" />
    <meta
      name="theme-color"
      content="#1b1c22"
      media="(prefers-color-scheme: dark)"
    />
    <meta
      name="theme-color"
      content="#f8fafc"
      media="(prefers-color-scheme: light)"
    />

    <!-- dns prefetch để phân giải CDN nhanh hơn -->
    <link rel="dns-prefetch" href="https://fonts.googleapis.com" />
    <link rel="dns-prefetch" href="https://fonts.gstatic.com" />
    <link rel="dns-prefetch" href="https://res.cloudinary.com" />
    <link rel="dns-prefetch" href="https://api.libsys.me" />

    <!-- preconnect để cải thiện hiệu năng (thiết lập kết nối sớm) -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link rel="preconnect" href="https://res.cloudinary.com" />
    <link rel="preconnect" href="https://api.libsys.me" crossorigin />

    <!-- prefetch các tài nguyên quan trọng -->
    <link rel="prefetch" href="/assets/fonts/" />

    <!-- sitemap cho SEO -->
    <link rel="sitemap" href="/sitemap.xml" type="application/xml" />

    <!-- tối ưu fonts - load async để không block render -->
    <link
      href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap"
      rel="stylesheet"
      media="print"
      onload="this.media='all'"
    />
    <noscript>
      <link
        href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap"
        rel="stylesheet"
      />
    </noscript>

    <script>
      (function () {
        const saved = localStorage.getItem("themeMode");
        const prefersDark =
          window.matchMedia &&
          window.matchMedia("(prefers-color-scheme: dark)").matches;
        const dark = saved === "dark" || (!saved && prefersDark);
        const color = dark ? "#1b1c22" : "#f8fafc";

        const style = document.createElement("style");
        style.textContent = `html,body{background-color:${color}!important;}`;
        document.head.appendChild(style);

        document.documentElement.dataset.theme = dark ? "dark" : "light";

        if ("scrollRestoration" in history) {
          history.scrollRestoration = "manual";
        }
      })();
    </script>

    <title>Thư viện trực tuyến - HBH</title>

    <!-- CSS cho loader -->
    <link rel="stylesheet" href="/loader.css" />
  </head>

  <body>
    <div id="initial-loader">
      <div class="loader-ring"></div>
      <div class="loader-text">Đang tải...</div>
    </div>

    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>