Update badge defaults and add nickname customization
Changes price-tag defaults to priceY=9 and priceSize=60% (was 0/100) per real-world feedback — the band sits a bit lower and is more compact by default. Adds three nickname controls mirroring the price- tag ones: text size slider (60-160%), edge-offset slider (0-30% inset from the circle edge, default 14%), and a color row with six preset swatches plus a native color picker for custom colors. The legacy white/black radio is gone; existing items with "white"/"black" values are migrated to hex on first render. Shadow color now auto-flips based on text brightness so any color stays readable. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -639,12 +639,12 @@ https://live.staticflickr.com/65535/12345678901_abcdef1234_b.jpg"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Положение по вертикали: <span id="badge-price-y-value">0</span></label>
|
||||
<input type="range" id="badge-price-y" min="-50" max="20" step="1" value="0">
|
||||
<label>Положение по вертикали: <span id="badge-price-y-value">9</span></label>
|
||||
<input type="range" id="badge-price-y" min="-50" max="20" step="1" value="9">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Размер плашки: <span id="badge-price-size-value">100%</span></label>
|
||||
<input type="range" id="badge-price-size" min="60" max="160" step="5" value="100">
|
||||
<label>Размер плашки: <span id="badge-price-size-value">60%</span></label>
|
||||
<input type="range" id="badge-price-size" min="60" max="160" step="5" value="60">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Цвет ленты:</label>
|
||||
@@ -685,17 +685,24 @@ https://live.staticflickr.com/65535/12345678901_abcdef1234_b.jpg"></textarea>
|
||||
<input type="text" id="badge-nickname-value" maxlength="40" placeholder="Никнейм">
|
||||
<span class="hint">По умолчанию — из настроек.</span>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Размер текста: <span id="badge-nick-size-value">100%</span></label>
|
||||
<input type="range" id="badge-nick-size" min="60" max="160" step="5" value="100">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Отступ от края: <span id="badge-nick-edge-value">14</span></label>
|
||||
<input type="range" id="badge-nick-edge" min="0" max="30" step="1" value="14">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Цвет текста:</label>
|
||||
<div class="badge-radio-row">
|
||||
<label class="radio-label">
|
||||
<input type="radio" name="badge-nick-color" value="white" checked>
|
||||
<span>Белый (с тенью)</span>
|
||||
</label>
|
||||
<label class="radio-label">
|
||||
<input type="radio" name="badge-nick-color" value="black">
|
||||
<span>Чёрный</span>
|
||||
</label>
|
||||
<div class="badge-color-row" data-target="nick">
|
||||
<button type="button" class="badge-color-swatch" data-color="#FFFFFF" style="background:#FFFFFF;border-color:#ccc" title="Белый"></button>
|
||||
<button type="button" class="badge-color-swatch" data-color="#000000" style="background:#000000" title="Чёрный"></button>
|
||||
<button type="button" class="badge-color-swatch" data-color="#FFCC00" style="background:#FFCC00" title="Жёлтый"></button>
|
||||
<button type="button" class="badge-color-swatch" data-color="#FF3B30" style="background:#FF3B30" title="Красный"></button>
|
||||
<button type="button" class="badge-color-swatch" data-color="#34C759" style="background:#34C759" title="Зелёный"></button>
|
||||
<button type="button" class="badge-color-swatch" data-color="#007AFF" style="background:#007AFF" title="Синий"></button>
|
||||
<input type="color" id="badge-nick-color" value="#FFFFFF" title="Свой цвет текста">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user