ltadeu6/skeledance
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use CC0 tileset gravestone PNG instead of CSS-drawn stone

Browse source 
Stone extracted from OpenGameArt's 'Free Graveyard Platformer Tileset'
(CC0) vector sheet, rendered at high res and tinted slate-purple to
match the gothic palette. Moss overlay is now masked by the stone's own
silhouette; skull and R.I.P. engraving stay as overlays.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_015HtPHsTnDcLVSCiF5FGHZj
This commit is contained in:
vini 2026-07-19 21:55:35 -03:00
parent d0a063e92a
commit 1338879e1d
2 changed files with 18 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

54
plugin/contents/ui/dancer.html
View file

@ -1285,51 +1285,33 @@ body.dia:not(.balada):not(.chuva) .grave-wrap { opacity: 1; }
box-shadow: inset 0 0.7vh 1.2vh rgba(225,232,190,0.20);
}
/* pedra gótica: arco ogival, ardósia escura, torta e comida pelo tempo */
/* pedra gótica: PNG do tileset CC0 de cemitério (OpenGameArt), tingido
de ardósia arroxeada em tools — ver gravestone.png */
.gravestone {
position: relative;
width: 15vh;
height: 21vh;
transform: rotate(-2.5deg);
clip-path: polygon(50% 0%, 60% 2%, 71% 8%, 81% 18%, 88% 32%, 91% 50%,
91% 100%, 9% 100%, 9% 50%, 12% 32%, 19% 18%, 29% 8%, 40% 2%);
background:
linear-gradient(115deg,
rgba(209,131,179,0.26) 0%, rgba(255,255,255,0.06) 34%,
rgba(8,5,18,0.50) 100%),
linear-gradient(to bottom, #4a4258 0%, #363048 55%, #241f34 100%);
box-shadow: inset 0 -1.4vh 2.4vh rgba(8,5,20,0.55);
width: 17vh;
height: 17.3vh; /* aspecto do PNG 195x198 */
background: url('gravestone.png') center / contain no-repeat;
filter: drop-shadow(0 0 14px rgba(209,131,179,0.22));
}
/* musgo subindo pela base da pedra */
/* musgo subindo pela base, recortado pela silhueta da pedra */
.gravestone::before {
content: '';
position: absolute;
inset: 0;
background:
radial-gradient(circle at 18% 102%, rgba(74,105,60,0.60), transparent 42%),
radial-gradient(circle at 78% 103%, rgba(58,88,46,0.50), transparent 38%),
radial-gradient(circle at 50% 108%, rgba(66,96,52,0.40), transparent 50%);
}
/* rachadura descendo do arco */
.gravestone::after {
content: '';
position: absolute;
top: 7%;
left: 30%;
width: 0.35vh;
height: 30%;
transform: rotate(16deg);
border-radius: 1px;
background: rgba(8,5,20,0.60);
box-shadow: 1px 0 0 rgba(255,255,255,0.07);
radial-gradient(circle at 18% 96%, rgba(74,105,60,0.60), transparent 40%),
radial-gradient(circle at 80% 97%, rgba(58,88,46,0.50), transparent 36%),
radial-gradient(circle at 50% 100%, rgba(66,96,52,0.42), transparent 46%);
-webkit-mask: url('gravestone.png') center / contain no-repeat;
mask: url('gravestone.png') center / contain no-repeat;
}
.grave-skull {
position: absolute;
top: 13%;
top: 9%;
width: 100%;
text-align: center;
font-size: 3.4vh;
font-size: 3.2vh;
color: #8d81a8;
text-shadow: 0 1px 0 rgba(255,255,255,0.16), 0 -1px 1px rgba(0,0,0,0.70);
}
@ -1341,21 +1323,21 @@ body.dia:not(.balada):not(.chuva) .grave-wrap { opacity: 1; }
text-align: center;
font-family: Georgia, 'Times New Roman', serif;
font-weight: bold;
font-size: 2.7vh;
letter-spacing: 0.42vh;
font-size: 2.4vh;
letter-spacing: 0.4vh;
color: #9187ae;
text-shadow: 0 1px 0 rgba(255,255,255,0.20), 0 -1px 1px rgba(5,3,14,0.80);
}
.grave-line {
position: absolute;
top: 52%;
left: 24%; right: 24%;
top: 51%;
left: 26%; right: 26%;
height: 0.5vh;
border-radius: 0.3vh;
background: rgba(14,10,30,0.62);
box-shadow: 0 1px 0 rgba(255,255,255,0.14);
}
.grave-line.short { top: 60%; left: 32%; right: 32%; }
.grave-line.short { top: 59%; left: 33%; right: 33%; }
/* tufos de capim para amarrar a base na cena */
.grass-tuft {