feat: 更新 index.html 和样式文件,优化样式导入和结构
This commit is contained in:
28
index.html
28
index.html
@ -2,25 +2,25 @@
|
|||||||
<html lang="zh-CN" data-build-time="%VITE_BUILD_TIME%" data-commit="%VITE_BUILD_COMMIT%">
|
<html lang="zh-CN" data-build-time="%VITE_BUILD_TIME%" data-commit="%VITE_BUILD_COMMIT%">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" href="/favicon.ico" />
|
<link rel="icon" href="data:;base64,iVBORw0KGgo=" />
|
||||||
<meta
|
<meta
|
||||||
name="viewport"
|
name="viewport"
|
||||||
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover, user-scalable=no"
|
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover, user-scalable=no"
|
||||||
/>
|
/>
|
||||||
<meta name="format-detection" content="telephone=no" />
|
<meta name="format-detection" content="telephone=no" />
|
||||||
<title>vue-ts-example</title>
|
<title>vue-ts-example</title>
|
||||||
<link rel="stylesheet" href="https://testingcf.jsdelivr.net/npm/@unocss/reset/tailwind.min.css" />
|
|
||||||
<script>
|
|
||||||
function setAppHeight() {
|
|
||||||
const app = document.getElementById('app');
|
|
||||||
app.style.minHeight = `${window.innerHeight}px`;
|
|
||||||
}
|
|
||||||
|
|
||||||
// window.addEventListener('resize', setAppHeight);
|
|
||||||
// window.addEventListener('load', setAppHeight);
|
|
||||||
</script>
|
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
|
*,
|
||||||
|
*::before,
|
||||||
|
*::after {
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin: 0;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
body {
|
body {
|
||||||
|
text-rendering: optimizeLegibility;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
@ -55,10 +55,8 @@
|
|||||||
</div>
|
</div>
|
||||||
<script type="module" src="/src/main.ts"></script>
|
<script type="module" src="/src/main.ts"></script>
|
||||||
<script src="https://fastly.jsdelivr.net/npm/@vant/touch-emulator/dist/index.min.js"></script>
|
<script src="https://fastly.jsdelivr.net/npm/@vant/touch-emulator/dist/index.min.js"></script>
|
||||||
<link rel="stylesheet" href="https://testingcf.jsdelivr.net/npm/nprogress/nprogress.css" />
|
|
||||||
</body>
|
</body>
|
||||||
<!-- TODO: use.typekit.net被墙 -->
|
<script>
|
||||||
<!-- <script>
|
|
||||||
(function (d) {
|
(function (d) {
|
||||||
var config = {
|
var config = {
|
||||||
kitId: 'whk2tto',
|
kitId: 'whk2tto',
|
||||||
@ -87,5 +85,5 @@
|
|||||||
};
|
};
|
||||||
s.parentNode.insertBefore(tk, s);
|
s.parentNode.insertBefore(tk, s);
|
||||||
})(document);
|
})(document);
|
||||||
</script> -->
|
</script>
|
||||||
</html>
|
</html>
|
||||||
|
@ -1,62 +1,4 @@
|
|||||||
/* color palette from <https://github.com/vuejs/theme> */
|
|
||||||
:root {
|
|
||||||
--vt-c-white: #ffffff;
|
|
||||||
--vt-c-white-soft: #f8f8f8;
|
|
||||||
--vt-c-white-mute: #f2f2f2;
|
|
||||||
|
|
||||||
--vt-c-black: #181818;
|
|
||||||
--vt-c-black-soft: #222222;
|
|
||||||
--vt-c-black-mute: #282828;
|
|
||||||
|
|
||||||
--vt-c-indigo: #2c3e50;
|
|
||||||
|
|
||||||
--vt-c-divider-light-1: rgba(60, 60, 60, 0.29);
|
|
||||||
--vt-c-divider-light-2: rgba(60, 60, 60, 0.12);
|
|
||||||
--vt-c-divider-dark-1: rgba(84, 84, 84, 0.65);
|
|
||||||
--vt-c-divider-dark-2: rgba(84, 84, 84, 0.48);
|
|
||||||
|
|
||||||
--vt-c-text-light-1: var(--vt-c-indigo);
|
|
||||||
--vt-c-text-light-2: rgba(60, 60, 60, 0.66);
|
|
||||||
--vt-c-text-dark-1: var(--vt-c-white);
|
|
||||||
--vt-c-text-dark-2: rgba(235, 235, 235, 0.64);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* semantic color variables for this project */
|
|
||||||
:root {
|
|
||||||
--color-background: var(--vt-c-white);
|
|
||||||
--color-background-soft: var(--vt-c-white-soft);
|
|
||||||
--color-background-mute: var(--vt-c-white-mute);
|
|
||||||
|
|
||||||
--color-border: var(--vt-c-divider-light-2);
|
|
||||||
--color-border-hover: var(--vt-c-divider-light-1);
|
|
||||||
|
|
||||||
--color-heading: var(--vt-c-text-light-1);
|
|
||||||
--color-text: var(--vt-c-text-light-1);
|
|
||||||
|
|
||||||
--section-gap: 160px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
|
||||||
:root {
|
|
||||||
--color-background: var(--vt-c-black);
|
|
||||||
--color-background-soft: var(--vt-c-black-soft);
|
|
||||||
--color-background-mute: var(--vt-c-black-mute);
|
|
||||||
|
|
||||||
--color-border: var(--vt-c-divider-dark-2);
|
|
||||||
--color-border-hover: var(--vt-c-divider-dark-1);
|
|
||||||
|
|
||||||
--color-heading: var(--vt-c-text-dark-1);
|
|
||||||
--color-text: var(--vt-c-text-dark-2);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
*,
|
|
||||||
*::before,
|
|
||||||
*::after {
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin: 0;
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--h-base-font: lxgw-wenkai-mono-tc, alibaba-puhuiti, Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
|
--h-base-font: lxgw-wenkai-mono-tc, alibaba-puhuiti, Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
|
||||||
|
@ -1,6 +1,10 @@
|
|||||||
|
import 'nprogress/nprogress.css'; // <link rel="stylesheet" href="https://testingcf.jsdelivr.net/npm/nprogress/nprogress.css" />
|
||||||
|
|
||||||
import './main.less';
|
import './main.less';
|
||||||
|
|
||||||
|
import '@unocss/reset/tailwind-compat.css'; // https://unocss.dev/guide/style-reset#tailwind-compat // <link rel="stylesheet" href="https://testingcf.jsdelivr.net/npm/@unocss/reset/tailwind.min.css" />
|
||||||
|
|
||||||
import 'primeicons/primeicons.css';
|
import 'primeicons/primeicons.css';
|
||||||
import './reset-primevue.css';
|
import './reset-primevue.css';
|
||||||
|
|
||||||
import 'uno.css';
|
import 'virtual:uno.css';
|
||||||
|
@ -20,6 +20,7 @@ function setupRouter(app: import('vue').App) {
|
|||||||
.use(router); // adding the router will trigger the initial navigation
|
.use(router); // adding the router will trigger the initial navigation
|
||||||
}
|
}
|
||||||
export { router, setupRouter };
|
export { router, setupRouter };
|
||||||
|
|
||||||
// ========================================================================
|
// ========================================================================
|
||||||
// =========================== Router Guards ==============================
|
// =========================== Router Guards ==============================
|
||||||
// ========================================================================
|
// ========================================================================
|
Reference in New Issue
Block a user