15 lines
8.6 KiB
JSON
15 lines
8.6 KiB
JSON
|
{
|
|||
|
|
"template_name": "液体玻璃",
|
|||
|
|
"description": "",
|
|||
|
|
"html_template": "<!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>{{ page_title }}</title>\n <script src=\"https://cdn.tailwindcss.com\"></script>\n <script src=\"https://cdn.jsdelivr.net/npm/chart.js\"></script>\n <script src=\"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/js/all.min.js\"></script>\n <style>\n /* --- 基础与背景设置 --- */\n html {\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #0a0a1a;\n }\n\n body {\n width: 1280px;\n height: 720px;\n margin: 0;\n padding: 0;\n position: relative;\n overflow: hidden;\n font-family: 'Inter', 'Microsoft YaHei', 'PingFang SC', sans-serif;\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n\n body::before {\n content: '';\n position: absolute;\n top: -20%; left: -20%; width: 140%; height: 140%;\n background: \n radial-gradient(circle at 20% 80%, rgba(0, 110, 255, 0.3), transparent 40%),\n radial-gradient(circle at 75% 30%, rgba(180, 50, 255, 0.3), transparent 40%);\n z-index: 1;\n animation: liquid-flow-outer 30s ease-in-out infinite alternate;\n }\n \n \n body::after {\n content: '';\n position: absolute;\n width: 1280px; /* 与幻灯片尺寸相同 */\n height: 720px;\n background: \n radial-gradient(circle at 20% 80%, rgba(0, 110, 255, 0.4), transparent 40%),\n radial-gradient(circle at 75% 30%, rgba(180, 50, 255, 0.4), transparent 40%);\n z-index: 2; /* 在外层背景之上，幻灯片面板之下 */\n border-radius: 40px; /* 与幻灯片面板圆角相同 */\n animation: liquid-flow-inner 20s ease-in-out infinite alternate;\n }\n\n @keyframes liquid-flow-outer {\n from { transform: rotate(0deg) scale(1.2); filter: blur(80px); }\n to { transform: rotate(180deg) scale(1.5); filter: blur(100px); }\n }\n \n @keyframes liquid-flow-inner {\n from { transform: rotate(0deg) scale(1); filter: blur(40px); }\n to { transform: rotate(-180deg) scale(1.2); filter: blur(50px); }\n }\n\n \n .slide-container {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n color: white;\n position: relative;\n z-index: 3; \n \n \n background: rgba(10, 10, 30, 0.1);\n backdrop-filter: blur(50px) saturate(180%);\n -webkit-backdrop-filter: blur(50px) saturate(180%);\n \n \n border-radius: 40px;\n border: 1.5px solid transparent;\n background-clip: padding-box;\n box-shadow: \n inset 0 0 2px 1px rgba(255, 255, 255, 0.2), \n 0 10px 40px rgba(0, 0, 0, 0.5); \n }\n \n .slide-header {\n padding: 40px 60px 20px 60px;\n border-bottom: 1px solid rgba(255, 255, 255, 0.15);\n }\n \n .slide-title {\n font-size: clamp(2.2rem, 4vw, 3.8rem);\n font-weight: 800; \n color: #ffffff;\n margin: 0;\n line-height: 1.2;\n text-shadow: 0 0 15px rgba(200, 220, 255, 0.5);\n }\n \n .slide-content {\n flex: 1;\n padding: 30px 60px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n max-height: 580px;\n overflow: auto;\n }\n
|
|||
|
|
"tags": [
|
|||
|
|
"液体",
|
|||
|
|
"玻璃"
|
|||
|
|
],
|
|||
|
|
"is_default": false,
|
|||
|
|
"export_info": {
|
|||
|
|
"exported_at": "2025-06-28T10:13:28.839Z",
|
|||
|
|
"original_id": 4,
|
|||
|
|
"original_created_at": 1750585141.5831485
|
|||
|
|
}
|
|||
|
|
}
|