|
|
| 第1行： |
第1行： |
| <div class="tierlist-container">
| | {{#invoke:卡牌/怪物|main|害羞的园丁}} |
| <!-- Controls -->
| |
| <div class="tierlist-controls">
| |
| <h3>层级设置</h3>
| |
| <div id="tier-controls">
| |
| <div class="control-group" data-tier="S">
| |
| <span class="control-label">S级:</span>
| |
| <div class="tier-input" contenteditable="true" data-tier="S">S</div>
| |
| <div class="color-picker" data-tier="S" style="background-color: #ff0000;"></div>
| |
| </div>
| |
| <div class="control-group" data-tier="A">
| |
| <span class="control-label">A级:</span>
| |
| <div class="tier-input" contenteditable="true" data-tier="A">A</div>
| |
| <div class="color-picker" data-tier="A" style="background-color: #f1963b;"></div>
| |
| </div>
| |
| <div class="control-group" data-tier="B">
| |
| <span class="control-label">B级:</span>
| |
| <div class="tier-input" contenteditable="true" data-tier="B">B</div>
| |
| <div class="color-picker" data-tier="B" style="background-color: #ffef03;"></div>
| |
| </div>
| |
| <div class="control-group" data-tier="C">
| |
| <span class="control-label">C级:</span>
| |
| <div class="tier-input" contenteditable="true" data-tier="C">C</div>
| |
| <div class="color-picker" data-tier="C" style="background-color: #c2d402;"></div>
| |
| </div>
| |
| </div>
| |
|
| |
| <div style="margin-top: 20px;">
| |
| <div class="btn btn-success" id="add-tier">添加新层级</div>
| |
| <div class="btn" id="apply-settings">应用设置</div>
| |
| <div class="btn btn-success" id="save-image">保存为图片</div>
| |
| </div>
| |
| </div>
| |
|
| |
| <!-- Tier List Table -->
| |
| <table class="wikitable tierlist-table" id="tierlist-table">
| |
| <tr data-tier="S">
| |
| <th style="background-color: #ff0000; color: white;">S</th>
| |
| <td class="drop-zone"></td>
| |
| <td class="tier-delete">×</td>
| |
| </tr>
| |
| <tr data-tier="A">
| |
| <th style="background-color: #f1963b; color: white;">A</th>
| |
| <td class="drop-zone"></td>
| |
| <td class="tier-delete">×</td>
| |
| </tr>
| |
| <tr data-tier="B">
| |
| <th style="background-color: #ffef03; color: white;">B</th>
| |
| <td class="drop-zone"></td>
| |
| <td class="tier-delete">×</td>
| |
| </tr>
| |
| <tr data-tier="C">
| |
| <th style="background-color: #c2d402; color: white;">C</th>
| |
| <td class="drop-zone"></td>
| |
| <td class="tier-delete">×</td>
| |
| </tr>
| |
| </table>
| |
|
| |
| <!-- Character Pool -->
| |
| <div class="character-pool drop-zone" id="character-pool">
| |
| <div class="pool-title">角色池 (拖拽角色到上方表格)</div>
| |
| </div>
| |
|
| |
| <!-- Color Picker Dialog -->
| |
| <div id="color-dialog" style="display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; padding: 20px; border-radius: 8px; box-shadow: 0 4px 20px rgba(0,0,0,0.3); z-index: 1000;">
| |
| <div style="margin-bottom: 15px; font-weight: bold;">选择颜色</div>
| |
| <div id="color-palette" style="display: grid; grid-template-columns: repeat(8, 30px); gap: 5px; margin-bottom: 15px;"></div>
| |
| <div style="margin-bottom: 10px;">
| |
| <span>自定义颜色 (Hex): </span>
| |
| <div id="hex-input" contenteditable="true" style="display: inline-block; padding: 5px; border: 1px solid #ccc; border-radius: 4px; min-width: 80px;">#ff0000</div>
| |
| </div>
| |
| <div style="text-align: right;">
| |
| <div class="btn btn-success" id="color-ok" style="display: inline-block;">确定</div>
| |
| <div class="btn" id="color-cancel" style="display: inline-block;">取消</div>
| |
| </div>
| |
| </div>
| |
| <div id="color-overlay" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 999;"></div>
| |
| </div>
| |
| {{#微件:节奏榜生成器}} | |
