feat(vk): move the tile letter to the corner, add the light cover
Sets the letter in the tile's top-left corner with the value staying bottom right — the in-game tile layout — instead of centring it. The glyph is placed by its ink box rather than the text origin, so every letter lands on the same corner whatever its side bearings and ascent. Adds day-spot: the same crop and camera as night-spot on a light ground, so the chosen composition exists as a light/dark pair.
This commit is contained in:
@@ -425,11 +425,15 @@ function tileTexture(pal, grid, opts) {
|
||||
ctx.stroke();
|
||||
ctx.restore();
|
||||
|
||||
// Letter in the top-left corner, value in the bottom-right — the in-game tile layout.
|
||||
// The glyph is placed by its INK box, not by the text origin, so every letter lines up
|
||||
// on the same corner regardless of its side bearings and ascent.
|
||||
ctx.fillStyle = pal.tileText;
|
||||
ctx.font = brand ? `${TEX_CELL * 0.74}px EruditBrand` : `700 ${TEX_CELL * 0.66}px DejaVu Sans`;
|
||||
ctx.textAlign = 'center';
|
||||
ctx.textAlign = 'left';
|
||||
ctx.textBaseline = 'alphabetic';
|
||||
ctx.fillText(letter, x + w * 0.46, y + w * (brand ? 0.79 : 0.775));
|
||||
const m = ctx.measureText(letter);
|
||||
ctx.fillText(letter, x + w * 0.1 + m.actualBoundingBoxLeft, y + w * 0.1 + m.actualBoundingBoxAscent);
|
||||
|
||||
ctx.font = `600 ${TEX_CELL * 0.23}px DejaVu Sans`;
|
||||
ctx.textAlign = 'right';
|
||||
@@ -679,6 +683,22 @@ const VARIANTS = [
|
||||
vignette(ctx, W, H, 0.6);
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'day-spot',
|
||||
title: 'День — тот же кадр, светлая пара к night-spot',
|
||||
palette: WARM,
|
||||
font: 'brand',
|
||||
cam: { elevDeg: 27, dist: 24, widthFrac: 1.4, aimX: 0.8, aimY: WORDS_Y, aimYFrac: 0.56 },
|
||||
background(ctx, W, H) {
|
||||
linear(ctx, W, H, [[0, '#fbf3e7'], [0.6, '#f0e2ce'], [1, '#d8bd98']], 0, 0, 0, H);
|
||||
radialGlow(ctx, W, H, W * 0.5, H * 0.5, W * 0.55, 'rgba(255,250,236,0.85)', 'rgba(255,250,236,0)');
|
||||
},
|
||||
effects(ctx, W, H) {
|
||||
farHaze(ctx, W, H, '251,243,231', 0.5, 0.9);
|
||||
nearFade(ctx, W, H, '150,113,72', 0.84, 0.35);
|
||||
vignette(ctx, W, H, 0.3);
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'brand-blue',
|
||||
title: 'Бренд-градиент — доска парит, продуктовый вид',
|
||||
|
||||
Reference in New Issue
Block a user