fix(quantik-game): отображать заработанные звёзды на узлах карты и экране победы

Правило .ic в ls.css (fill:none; stroke:currentColor) перебивало
presentation-атрибуты fill/stroke в starSvg → заработанные звёзды
рисовались как пустые (CSS-свойства приоритетнее presentation-атрибутов).
Цвета звёзд теперь задаются inline style (приоритетнее класса) и в map.js,
и в quantik-game.js. Заодно звезда главы становится сплошной золотой.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@
This commit is contained in:
Maxim Dolgolyov
2026-06-14 10:43:18 +03:00
parent 0b1925fd3b
commit 6e33be3de1
2 changed files with 9 additions and 4 deletions
+5 -2
View File
@@ -42,8 +42,11 @@
var s = size || 16;
var fill = filled ? '#FBBF24' : 'none';
var stroke = filled ? '#FBBF24' : 'rgba(148,163,184,0.55)';
return '<svg class="ic" viewBox="0 0 24 24" width="' + s + '" height="' + s + '" fill="' + fill +
'" stroke="' + stroke + '" stroke-width="1.5" stroke-linejoin="round"><path d="' + starPath() + '"/></svg>';
// Цвета — через inline style, а НЕ presentation-атрибуты: правило .ic в ls.css
// (fill:none; stroke:currentColor) перебивает атрибуты fill/stroke, из-за чего
// заработанные звёзды узлов не закрашивались. Inline style приоритетнее класса.
return '<svg class="ic" viewBox="0 0 24 24" width="' + s + '" height="' + s +
'" style="fill:' + fill + ';stroke:' + stroke + '" stroke-width="1.5" stroke-linejoin="round"><path d="' + starPath() + '"/></svg>';
}
function lockSvg(size) {
var s = size || 18;
+4 -2
View File
@@ -90,8 +90,10 @@
function starSvg(filled) {
var fill = filled ? '#FBBF24' : 'none';
var stroke = filled ? '#FBBF24' : '#64748B';
return '<svg class="ic qg-star-svg" viewBox="0 0 24 24" width="34" height="34" fill="' + fill +
'" stroke="' + stroke + '" stroke-width="1.6" stroke-linejoin="round">' +
// Цвета через inline style: .ic в ls.css (fill:none; stroke:currentColor) иначе
// перебивает атрибуты fill/stroke и заработанные звёзды не закрашиваются.
return '<svg class="ic qg-star-svg" viewBox="0 0 24 24" width="34" height="34" style="fill:' + fill +
';stroke:' + stroke + '" stroke-width="1.6" stroke-linejoin="round">' +
'<polygon points="12 2 15.1 8.6 22 9.3 17 14.1 18.2 21 12 17.6 5.8 21 7 14.1 2 9.3 8.9 8.6"/></svg>';
}