UI Kit
本平台所有颜色、文字样式和组件的唯一权威参考。产品界面只能使用此处已固定的内容。
配色方案
字体排版
一级标题
二级标题
三级标题
四级标题
正文排版注重阅读体验:行距宽松、每行长度适中,无论是房源描述还是政策页面都不会显得拥挤。
Body text is set for comfortable reading: generous line height and a measured line length, so a listing description or a policy page never feels cramped.
Основной текст набран для комфортного чтения: увеличенный межстрочный интервал и умеренная длина строки — описание объекта или страница политики никогда не выглядят тесно.
ข้อความเนื้อหาถูกจัดวางให้อ่านสบาย: ระยะห่างบรรทัดกว้างขึ้นและความยาวบรรทัดพอเหมาะ ทำให้คำอธิบายประกาศหรือหน้านโยบายไม่รู้สึกอึดอัด
正文排版注重阅读体验:行距宽松、每行长度适中,无论是房源描述还是政策页面都不会显得拥挤。
好的设计是尽可能少的设计。
按钮
表单与输入框
交互组件
可预订日历
- 您的预订日期
- 已占用
- 今天
您的预订
- 入住
- 12月8日周二
- 退房
- 12月18日周五
- 10 晚
- $1040
- 长住折扣(10%)
- −$104
- 总计
- $936
- 平均每晚
- $94
房源资料完整度
标签
房源卡片
照片画廊
用于单个房源自己的页面,也用于包含多个单元的项目/楼盘页面。点击主图可全屏打开;在全屏模式下可用方向键和滑动切换。
浮层与弹窗
图表
地图
点击图钉可预览房源——拖动和双指缩放即可平移和缩放地图,与 Google 地图操作方式相同。
这张地图使用您自己的 MapTiler 密钥
现在标注会自动跟随网站当前语言,随页面语言切换而变化——不妨试试切换语言看看效果。免费套餐每月覆盖 5,000 次地图会话和 100,000 次 API 请求,无需信用卡;等地图从 /ui-kit 迁移到有真实流量的页面后,值得留意这个额度。再往上的 Flex 套餐每月 30 美元,提供 25,000 次会话和 500,000 次请求。