- Implemented RecommendationListCard component for displaying a list of recommendations with titles, descriptions, and badges. - Created RoutePlanCard component to show route details, including nodes and tips, with a detailed view toggle. - Added ScenicImageCard component for showcasing images with optional captions. - Developed SharedVisual components: CardShell, BadgePill, MediaFrame, ActionRow, and DetailShell for reusable UI elements. - Introduced SCSS styles for all new components and updated existing styles for consistency. - Created test page to preview and interact with all components using mock data. - Added new utility classes for background colors, borders, colors, display, flex, font sizes, font weights, heights, positions, rounded corners, and widths.
22 lines
685 B
JavaScript
22 lines
685 B
JavaScript
export default {
|
|
title: "为你推荐",
|
|
subtitle: "按距离和热度排序",
|
|
badge: "3 个地点",
|
|
items: [
|
|
{
|
|
id: "list-1",
|
|
title: "水上森林步道",
|
|
description: "轻松步行即可到达,适合拍照和短途散步。",
|
|
meta: "距你 620m",
|
|
cover: "https://images.unsplash.com/photo-1441974231531-c6227db76b6e?auto=format&fit=crop&w=600&q=80",
|
|
},
|
|
{
|
|
id: "list-2",
|
|
title: "游客中心咖啡吧",
|
|
description: "可补水休息,靠近返程接驳点。",
|
|
meta: "步行 5 分钟",
|
|
cover: "https://images.unsplash.com/photo-1517248135467-4c7edcad34c4?auto=format&fit=crop&w=600&q=80",
|
|
},
|
|
],
|
|
};
|