```json
{
"summary

By admin, 24 July, 2025
角色
assistant
content

```json
{
"summary": "已为您创建一个校园生活页面的左右布局Section。左侧为带渐变背景的背景图卡片,右侧为两个并排的水平卡片。组件采用响应式设计,在移动端自动调整为垂直布局。",
"widget": {
"type": "custom-template",
"isAPI": false,
"fullWidth": true,
"html": "<div class=\"relative\">\n <div class=\"container relative z-10\">\n <div class=\"flex flex-col lg:flex-row gap-8 py-12\">\n <!-- 左侧大卡片 -->\n <div class=\"w-full lg:w-1/2 relative group overflow-hidden rounded-2xl h-[500px]\">\n <div class=\"absolute inset-0 bg-cover bg-center\" style=\"background-image: url('https://placehold.co/1000x700&#039;)\"></div>\n <div class=\"absolute inset-0 bg-gradient-to-t from-black/80 via-black/40 to-transparent\"></div>\n <div class=\"absolute bottom-0 left-0 right-0 p-6 text-white z-10 transform transition-transform duration-300 group-hover:translate-y-[-8px]\">\n <h3 class=\"text-2xl font-bold mb-2\">校园活动精彩回顾</h3>\n <p class=\"text-gray-200 mb-4 line-clamp-2\">记录校园内各类精彩活动瞬间,展现学生们的活力与创造力</p>\n <button class=\"inline-flex items-center text-white font-medium group-hover:underline\">\n 阅读更多\n <svg class=\"w-4 h-4 ml-1\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5l7 7-7 7\"></path>\n </svg>\n </button>\n </div>\n </div>\n \n <!-- 右侧两个卡片 -->\n <div class=\"w-full lg:w-1/2 flex flex-col gap-6\">\n <!-- 卡片1 -->\n <div class=\"flex flex-col md:flex-row gap-6 group\">\n <div class=\"w-full md:w-1/2 aspect-[4/3] overflow-hidden rounded-lg\">\n <img src=\"https://placehold.co/800x600\" alt=\"社团活动\" class=\"w-full h-full object-cover transition-transform duration-300 group-hover:scale-105\">\n </div>\n <div class=\"w-full md:w-1/2 flex flex-col justify-start\">\n <h3 class=\"text-lg font-bold text-gray-900 mb-2 group-hover:text-blue-600 transition-colors duration-300\">社团招新季</h3>\n <p class=\"text-gray-600 text-sm mb-3 line-clamp-3\">新学期伊始,各大社团纷纷开展招新活动。从学术科技到文艺体育,从公益服务到兴趣爱好,总有一个社团适合你。加入我们,发现更多可能性!</p>\n <a href=\"#\" class=\"text-blue-600 text-sm font-medium flex items-center group-hover:underline\">\n 阅读更多\n <svg class=\"w-4 h-4 ml-1\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5l7 7-7 7\"></path>\n </svg>\n </a>\n </div>\n </div>\n \n <!-- 卡片2 -->\n <div class=\"flex flex-col md:flex-row gap-6 group\">\n <div class=\"w-full md:w-1/2 aspect-[4/3] overflow-hidden rounded-lg\">\n <img src=\"https://placehold.co/800x601\" alt=\"学术讲座\" class=\"w-full h-full object-cover transition-transform duration-300 group-hover:scale-105\">\n </div>\n <div class=\"w-full md:w-1/2 flex flex-col justify-start\">\n <h3 class=\"text-lg font-bold text-gray-900 mb-2 group-hover:text-blue-600 transition-colors duration-300\">名师讲座系列</h3>\n <p class=\"text-gray-600 text-sm mb-3 line-clamp-3\">本周邀请到知名学者来校举办专题讲座,分享前沿学术研究成果。欢迎全校师生参与,共同探讨学术热点话题,拓展学术视野。</p>\n <a href=\"#\" class=\"text-blue-600 text-sm font-medium flex items-center group-hover:underline\">\n 阅读更多\n <svg class=\"w-4 h-4 ml-1\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5l7 7-7 7\"></path>\n </svg>\n </a>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>"
},
"next": [
"添加更多卡片样式",
"增加卡片悬停效果",
"调整渐变色方案",
"添加响应式断点优化",
"增加图标装饰元素"
]
}
```

total_tokens
2884