main
fadeaway 8 months ago
parent 0fb6dc2407
commit a0ace3bda9

@ -2,6 +2,8 @@
import Image from 'next/image';
import AppLogo from '@/components/AppLogo';
import { download } from '@/utils/download';
import useUA from '@/hooks/useUA';
@ -36,12 +38,7 @@ export default function Download() {
</div>
)}
<div className="flex flex-col items-center mt-[151px]">
<Image className="w-[90px] h-[90px]" width={90} height={90} src="/img/app_icon_white_bg.svg" alt="queyue" />
<p className="text-[20px] leading-[24px] font-['Fontquan-XinYiJiXiangSong-Regular'] mt-[20px] tracking-[3px]">
</p>
</div>
<AppLogo className="mt-[151px]" />
<button
className="w-[283px] h-[48px] flex items-center justify-center bg-[#B44343] font-medium text-[17px] rounded-full mt-[44px]"

@ -2,31 +2,6 @@
@tailwind components;
@tailwind utilities;
@font-face {
font-family: 'PingFang SC-Regular';
src: url('/fonts/ping-fang-hei-ti-zhun-jian.ttf') format('truetype');
}
@font-face {
font-family: 'PingFang SC-Medium';
src: url('/fonts/pingfang-sc-medium.otf') format('opentype');
}
@font-face {
font-family: 'PingFang SC-Semibold';
src: url('/fonts/pingfangsc-semibold.otf') format('opentype');
}
@font-face {
font-family: 'Abhaya Libre SemiBold-Regular';
src: url('/fonts/ping-fang-hei-ti-zhun-jian.ttf') format('truetype');
}
@font-face {
font-family: 'Fontquan-XinYiJiXiangSong-Regular';
src: url('/fonts/Fontquan-XinYiJiXiangSong.ttf') format('truetype');
}
:root {
--body-bg-color: #1a1a1a;
}
@ -39,7 +14,6 @@
body {
background: var(--body-bg-color);
font-family: 'PingFang SC-Regular', Helvetica;
/* padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom); */
}

@ -1,37 +1,31 @@
'use client';
import LibFlexible from '@/components/LibFlexible';
import { useState, useEffect } from 'react';
import { RegularFont } from '@/utils/font';
import './globals.css';
import type { Metadata, Viewport } from 'next';
export default function RootLayout({ children }: Readonly<{ children: React.ReactNode }>) {
const [loaded, setLoaded] = useState(false);
import './globals.css';
const setRem = async () => {
await import('lib-flexible');
setLoaded(true);
};
export const metadata: Metadata = {
title: '雀乐',
description: '独立 不独于世',
};
useEffect(() => {
setRem();
window.addEventListener('resize', setRem);
return () => {
window.removeEventListener('resize', setRem);
};
}, []);
export const viewport: Viewport = {
width: 'device-width',
initialScale: 1,
maximumScale: 1,
minimumScale: 1,
userScalable: false,
viewportFit: 'cover',
};
export default function RootLayout({ children }: Readonly<{ children: React.ReactNode }>) {
return (
<html lang="zn-ch">
<head>
<meta
name="viewport"
content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover"
/>
<meta httpEquiv="X-UA-Compatible" content="ie=edge" />
<title></title>
<meta name="description" content="独立 不独于世" />
</head>
<body>{loaded ? children : null}</body>
<html lang="zn-ch" className={RegularFont.className}>
<body>
<LibFlexible>{children}</LibFlexible>
</body>
</html>
);
}

@ -5,6 +5,8 @@ import { useRef } from 'react';
import Image from 'next/image';
import Link from 'next/link';
import AppLogo from '@/components/AppLogo';
import { download } from '@/utils/download';
import useUA from '@/hooks/useUA';
@ -36,10 +38,7 @@ export default function Home() {
{!inWX && <h1 className="text-center text-[17px] h-[44px] leading-[44px]"></h1>}
{/* App logo */}
<div className="flex flex-col items-center absolute top-[25%]">
<Image className="w-[90px] h-[90px]" width={90} height={90} src="/img/app_icon_white_bg.svg" alt="queyue" />
<p className="text-[20px] font-['Fontquan-XinYiJiXiangSong-Regular'] mt-3 tracking-[3px]"> </p>
</div>
<AppLogo className="absolute top-[22%]" />
<div className="w-full flex flex-col items-center absolute bottom-0">
<button
@ -135,18 +134,18 @@ export default function Home() {
</p>
{/* <h5 className="text-[#ffffffb2] text-center text-[15px] leading-[21px] mt-[47px] mb-[4px]"></h5>
<p className="text-center text-[20px] font-medium leading-[33.6px] flex items-center justify-center">
<span className="relative">
<Image
className="w-[24px] h-[24px] absolute top-[50%] right-[-24px] translate-y-[-50%]"
width={24}
height={24}
src="/img/icon.svg"
alt="arrow-right"
/>
</span>
</p> */}
<p className="text-center text-[20px] font-medium leading-[33.6px] flex items-center justify-center">
<span className="relative">
<Image
className="w-[24px] h-[24px] absolute top-[50%] right-[-24px] translate-y-[-50%]"
width={24}
height={24}
src="/img/icon.svg"
alt="arrow-right"
/>
</span>
</p> */}
<Link
className="block w-[fit-content] mt-[68px] ml-auto mr-auto"

@ -0,0 +1,15 @@
import Image from 'next/image';
import { XinYiJiXiangSongFont } from '@/utils/font';
export default function AppLogo(props: { className?: string }) {
const cls = props.className || '';
return (
<div className={`flex flex-col items-center ${cls}`}>
<Image className="w-[90px] h-[90px]" width={90} height={90} src="/img/app_icon_white_bg.svg" alt="queyue" />
<p className={`${XinYiJiXiangSongFont.className} text-[20px] leading-[24px] mt-[20px] tracking-[3px]`}>
</p>
</div>
);
}

@ -0,0 +1,17 @@
'use client';
import { useState, useEffect } from 'react';
export default function LibFlexible({ children }: Readonly<{ children: React.ReactNode }>) {
const [loaded, setLoaded] = useState(false);
useEffect(() => {
const setRem = async () => {
await import('lib-flexible');
setLoaded(true);
};
setRem();
}, []);
return loaded ? children : null;
}

@ -0,0 +1,31 @@
import localFont from 'next/font/local';
export const RegularFont = localFont({
src: '../../public/fonts/ping-fang-hei-ti-zhun-jian.ttf',
display: 'swap',
});
export const MediumFont = localFont({
src: '../../public/fonts/pingfang-sc-medium.otf',
display: 'swap',
});
export const SemiboldFont = localFont({
src: '../../public/fonts/pingfangsc-semibold.otf',
display: 'swap',
});
export const AbhayaFont = localFont({
src: '../../public/fonts/AlibabaPuHuiTi-3-65-Medium.woff2',
display: 'swap',
});
export const AbhayaSemiboldFont = localFont({
src: '../../public/fonts/abhayalibre-semibold.ttf',
display: 'swap',
});
export const XinYiJiXiangSongFont = localFont({
src: '../../public/fonts/Fontquan-XinYiJiXiangSong.ttf',
display: 'swap',
});
Loading…
Cancel
Save