38d31572dd
- Updated padding and margin properties across various chat components to utilize responsive design tokens, ensuring better adaptability to different screen sizes. - Replaced fixed sizes with responsive variables for buttons, avatars, and bubbles to enhance UI flexibility. - Adjusted font sizes to use responsive tokens, improving text readability on various devices. - Standardized border-radius and other dimensions using CSS variables for a cohesive design language. - Enhanced dialog and screen components with safe area insets for better compatibility with modern devices.
31 lines
824 B
TypeScript
31 lines
824 B
TypeScript
/**
|
||
* Splash 背景图片
|
||
*
|
||
*
|
||
* `SizedBox.expand(child: Assets.images.picBgHome.image(fit: BoxFit.cover))`
|
||
* 资源: /public/images/splash/pic-bg-home.png (kebab-case 重命名后)
|
||
* 原名: pic_bg_home.png (snake_case)
|
||
*
|
||
* sizes 属性说明:
|
||
* 图片在 MobileShell 内(max-width: 540px)。
|
||
* - 视口 ≤ 540px:MobileShell = 100vw,图片 = 100vw
|
||
* - 视口 > 540px:MobileShell = 540px,图片 = 540px
|
||
*/
|
||
import Image from "next/image";
|
||
import styles from "./splash-background.module.css";
|
||
|
||
export function SplashBackground() {
|
||
return (
|
||
<div className={styles.bg}>
|
||
<Image
|
||
src="/images/splash/pic-bg-home.png"
|
||
alt=""
|
||
fill
|
||
priority
|
||
sizes="(max-width: 540px) 100vw, 540px"
|
||
className={styles.image}
|
||
/>
|
||
</div>
|
||
);
|
||
}
|