wizz-method 2.0.0 → 2.1.1

package/src/skills-lib/wizz-huashu-design/assets/showcases/ppt/ppt-build.html

@@ -1,382 +0,0 @@
-<!DOCTYPE html>
-<html lang="zh-CN">
-<head>
-<meta charset="UTF-8">
-<meta name="viewport" content="width=1920">
-<title>GLM-4.7 Coding Benchmark - Build Studio Style</title>
-<link href="https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600&display=swap" rel="stylesheet">
-<style>
-  * { margin: 0; padding: 0; box-sizing: border-box; }
-  body {
-    width: 1920px;
-    height: 1080px;
-    overflow: hidden;
-    margin: 0;
-    background: #FAFAF8;
-    font-family: 'Inter', sans-serif;
-    color: #2A2A2A;
-    position: relative;
-  }
-
-  .container {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    padding: 64px 96px 48px 96px;
-    justify-content: space-between;
-  }
-
-  /* Top section */
-  .top-row {
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-start;
-    margin-bottom: 16px;
-  }
-
-  .eyebrow {
-    font-size: 10px;
-    font-weight: 400;
-    letter-spacing: 4px;
-    text-transform: uppercase;
-    color: #B0ACA4;
-  }
-
-  .source-note {
-    font-size: 10px;
-    font-weight: 300;
-    color: #C0BCB6;
-    text-align: right;
-    line-height: 1.6;
-  }
-
-  /* Title area */
-  .title-area {
-    margin-bottom: 0;
-    padding-bottom: 24px;
-    border-bottom: 1px solid #EEECE8;
-  }
-
-  .main-title {
-    font-size: 40px;
-    font-weight: 200;
-    color: #2A2A2A;
-    letter-spacing: -0.5px;
-    line-height: 1.2;
-  }
-
-  .main-title .accent {
-    font-weight: 400;
-    color: #2A2A2A;
-  }
-
-  .subtitle {
-    font-size: 14px;
-    font-weight: 300;
-    color: #A0A09A;
-    margin-top: 8px;
-    letter-spacing: 0.3px;
-  }
-
-  /* Center: Hero data section */
-  .hero-data {
-    flex: 1;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    gap: 0;
-    position: relative;
-    padding-bottom: 32px;
-    border-bottom: 1px solid #EEECE8;
-  }
-
-  /* Three metric cards */
-  .metric-card {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    position: relative;
-    padding: 32px 24px;
-  }
-
-  .metric-card::after {
-    content: '';
-    position: absolute;
-    right: 0;
-    top: 25%;
-    height: 50%;
-    width: 1px;
-    background: linear-gradient(to bottom, transparent, #E0DCD6 50%, transparent);
-  }
-
-  .metric-card:last-child::after {
-    display: none;
-  }
-
-  .metric-value {
-    font-size: 112px;
-    font-weight: 200;
-    color: #2A2A2A;
-    letter-spacing: -4px;
-    line-height: 1;
-    position: relative;
-  }
-
-  .metric-value .dot {
-    color: #D4A574;
-    font-weight: 300;
-  }
-
-  .metric-unit {
-    font-size: 28px;
-    font-weight: 200;
-    color: #D4A574;
-    vertical-align: super;
-    margin-left: 2px;
-    opacity: 0.8;
-  }
-
-  .metric-name {
-    font-size: 12px;
-    font-weight: 500;
-    letter-spacing: 2px;
-    text-transform: uppercase;
-    color: #888888;
-    margin-top: 16px;
-    margin-bottom: 8px;
-  }
-
-  .metric-category {
-    font-size: 11px;
-    font-weight: 300;
-    color: #B8B4AE;
-    letter-spacing: 0.5px;
-  }
-
-  /* Comparison bars below each metric */
-  .comparison-group {
-    margin-top: 24px;
-    width: 280px;
-  }
-
-  .comp-row {
-    display: flex;
-    align-items: center;
-    margin-bottom: 8px;
-    gap: 8px;
-  }
-
-  .comp-label {
-    font-size: 11px;
-    font-weight: 400;
-    color: #A8A4A0;
-    width: 72px;
-    text-align: right;
-    flex-shrink: 0;
-  }
-
-  .comp-track {
-    flex: 1;
-    height: 2px;
-    background: #EEECEA;
-    border-radius: 1px;
-    position: relative;
-    overflow: hidden;
-  }
-
-  .comp-fill {
-    height: 100%;
-    border-radius: 1px;
-    background: #D8D5D0;
-  }
-
-  .comp-fill.gold {
-    background: #D4A574;
-    height: 3px;
-    margin-top: -0.5px;
-  }
-
-  .comp-val {
-    font-size: 11px;
-    font-weight: 500;
-    color: #999999;
-    width: 40px;
-    flex-shrink: 0;
-  }
-
-  .comp-val.gold {
-    color: #D4A574;
-    font-weight: 500;
-  }
-
-  /* Bottom section */
-  .bottom-section {
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-end;
-    padding-top: 24px;
-  }
-
-  .insight-text {
-    font-size: 13px;
-    font-weight: 300;
-    color: #999;
-    line-height: 1.8;
-    max-width: 560px;
-  }
-
-  .insight-text strong {
-    font-weight: 500;
-    color: #666;
-  }
-
-  .brand-mark {
-    display: flex;
-    align-items: center;
-    gap: 16px;
-  }
-
-  .brand-line {
-    width: 32px;
-    height: 1px;
-    background: #D4A574;
-    opacity: 0.6;
-  }
-
-  .brand-text {
-    font-size: 10px;
-    font-weight: 400;
-    letter-spacing: 3px;
-    color: #C8C4BC;
-  }
-
-  /* Slide indicator — functional PPT element */
-  .slide-indicator {
-    position: absolute;
-    top: 64px;
-    right: 96px;
-    display: flex;
-    gap: 6px;
-    align-items: center;
-  }
-
-  .slide-dot {
-    width: 4px;
-    height: 4px;
-    border-radius: 50%;
-    background: #E0DCD6;
-  }
-
-  .slide-dot.active {
-    background: #D4A574;
-    width: 16px;
-    border-radius: 2px;
-  }
-</style>
-</head>
-<body>
-<div class="container">
-  <!-- Top row -->
-  <div class="top-row">
-    <div class="eyebrow">GLM-4.7 Open-Source Model</div>
-    <div class="source-note">Benchmark Evaluation 2025<br>Official Results</div>
-  </div>
-
-  <!-- Title -->
-  <div class="title-area">
-    <div class="main-title">Coding Capability <span style="font-weight:400;">Breakthrough</span><span style="color:#D4A574; font-weight:300; font-size:48px;">.</span></div>
-    <div class="subtitle">First open-source model to achieve state-of-the-art across all major coding benchmarks</div>
-  </div>
-
-  <!-- Hero data -->
-  <div class="hero-data">
-    <!-- AIME 2025 -->
-    <div class="metric-card">
-      <div class="metric-value">95<span class="dot">.</span>7</div>
-      <div class="metric-name">AIME 2025</div>
-      <div class="metric-category">Mathematical Reasoning</div>
-      <div class="comparison-group">
-        <div class="comp-row">
-          <span class="comp-label">GLM-4.7</span>
-          <div class="comp-track"><div class="comp-fill gold" style="width: 100%;"></div></div>
-          <span class="comp-val gold">95.7</span>
-        </div>
-        <div class="comp-row">
-          <span class="comp-label">Claude 3.5</span>
-          <div class="comp-track"><div class="comp-fill" style="width: 92.2%;"></div></div>
-          <span class="comp-val">88.2</span>
-        </div>
-        <div class="comp-row">
-          <span class="comp-label">GPT-4o</span>
-          <div class="comp-track"><div class="comp-fill" style="width: 87.4%;"></div></div>
-          <span class="comp-val">83.6</span>
-        </div>
-      </div>
-    </div>
-
-    <!-- SWE-bench Verified -->
-    <div class="metric-card">
-      <div class="metric-value">73<span class="dot">.</span>8<span class="metric-unit">%</span></div>
-      <div class="metric-name">SWE-bench Verified</div>
-      <div class="metric-category">Software Engineering</div>
-      <div class="comparison-group">
-        <div class="comp-row">
-          <span class="comp-label">GLM-4.7</span>
-          <div class="comp-track"><div class="comp-fill gold" style="width: 100%;"></div></div>
-          <span class="comp-val gold">73.8%</span>
-        </div>
-        <div class="comp-row">
-          <span class="comp-label">Claude 3.5</span>
-          <div class="comp-track"><div class="comp-fill" style="width: 72.2%;"></div></div>
-          <span class="comp-val">53.3%</span>
-        </div>
-        <div class="comp-row">
-          <span class="comp-label">GPT-4o</span>
-          <div class="comp-track"><div class="comp-fill" style="width: 65.3%;"></div></div>
-          <span class="comp-val">48.2%</span>
-        </div>
-      </div>
-    </div>
-
-    <!-- Tau-bench -->
-    <div class="metric-card">
-      <div class="metric-value">87<span class="dot">.</span>4</div>
-      <div class="metric-name">&tau;&sup2;-Bench</div>
-      <div class="metric-category">Agent Task Completion</div>
-      <div class="comparison-group">
-        <div class="comp-row">
-          <span class="comp-label">GLM-4.7</span>
-          <div class="comp-track"><div class="comp-fill gold" style="width: 100%;"></div></div>
-          <span class="comp-val gold">87.4</span>
-        </div>
-        <div class="comp-row">
-          <span class="comp-label">Claude 3.5</span>
-          <div class="comp-track"><div class="comp-fill" style="width: 90.3%;"></div></div>
-          <span class="comp-val">78.9</span>
-        </div>
-        <div class="comp-row">
-          <span class="comp-label">GPT-4o</span>
-          <div class="comp-track"><div class="comp-fill" style="width: 81.8%;"></div></div>
-          <span class="comp-val">71.5</span>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Bottom -->
-  <div class="bottom-section">
-    <div class="insight-text">
-      GLM-4.7 demonstrates that <strong>open-source models can compete at the frontier</strong> of coding intelligence,
-      outperforming leading proprietary models with margins of <strong>+7.5 to +20.5 points</strong> across benchmarks.
-    </div>
-    <div class="brand-mark">
-      <div class="brand-line"></div>
-      <span class="brand-text">ZHIPU AI</span>
-    </div>
-  </div>
-</div>
-</body>
-</html>