Wickedness/heros_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add Fu Pass entry chapter

Browse Source
This commit is contained in:
Wickedness
2026-06-23 09:14:41 +09:00
parent 17cbaab55d
commit 8349d1044f
11 changed files with 1260 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

121
src/assets/images/battle/twenty-eighth-battle-map.svg Normal file
View File

@@ -0,0 +1,121 @@
<svg xmlns="http://www.w3.org/2000/svg" width="5600" height="3800" viewBox="0 0 5600 3800">
<defs>
<filter id="grain" x="-5%" y="-5%" width="110%" height="110%">
<feTurbulence type="fractalNoise" baseFrequency="0.028" numOctaves="4" seed="28" result="noise"/>
<feColorMatrix type="saturate" values="0.44"/>
<feBlend in="SourceGraphic" in2="noise" mode="multiply"/>
</filter>
<filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
<feDropShadow dx="0" dy="16" stdDeviation="10" flood-color="#1d130c" flood-opacity="0.42"/>
</filter>
<linearGradient id="plain" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#7d784f"/>
<stop offset="0.48" stop-color="#a38d5d"/>
<stop offset="1" stop-color="#666d4c"/>
</linearGradient>
<linearGradient id="road" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#b9915d"/>
<stop offset="0.5" stop-color="#d7bf82"/>
<stop offset="1" stop-color="#896f48"/>
</linearGradient>
<linearGradient id="river" x1="0" y1="0" x2="1" y2="0">
<stop offset="0" stop-color="#263f58"/>
<stop offset="0.5" stop-color="#5d8da7"/>
<stop offset="1" stop-color="#243c54"/>
</linearGradient>
<linearGradient id="mountain" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#555234"/>
<stop offset="0.58" stop-color="#2f3421"/>
<stop offset="1" stop-color="#151912"/>
</linearGradient>
<pattern id="scrub" width="220" height="180" patternUnits="userSpaceOnUse">
<path d="M-50 150 C20 105 80 90 150 42 M30 194 C96 145 152 126 245 78" fill="none" stroke="#d4bd82" stroke-width="11" stroke-opacity="0.18"/>
<circle cx="44" cy="58" r="8" fill="#405f32" opacity="0.2"/>
<circle cx="150" cy="122" r="7" fill="#405f32" opacity="0.18"/>
</pattern>
</defs>
<rect width="5600" height="3800" fill="url(#plain)"/>
<rect width="5600" height="3800" fill="url(#scrub)" opacity="0.82" filter="url(#grain)"/>
<g opacity="0.48">
<path d="M0 0 L1050 0 C835 360 760 770 860 1230 C965 1710 900 2265 690 2860 C570 3200 560 3500 690 3800 L0 3800Z" fill="#111711"/>
<path d="M5600 0 L4920 0 C4685 380 4695 735 4970 1030 C5295 1380 5450 1820 5290 2280 C5150 2670 5165 3260 5390 3800 L5600 3800Z" fill="#111711"/>
<path d="M4450 0 C4380 280 4490 585 4750 820 L4860 0Z" fill="#111711"/>
</g>
<g filter="url(#shadow)">
<path d="M1190 0 C1160 360 1225 780 1270 1140 C1330 1635 1300 2200 1195 2710" fill="none" stroke="#1c3148" stroke-width="255" stroke-linecap="round"/>
<path d="M1215 0 C1190 360 1250 785 1300 1145 C1360 1632 1328 2190 1220 2700" fill="none" stroke="url(#river)" stroke-width="192" stroke-linecap="round"/>
<path d="M1285 70 C1270 455 1335 800 1380 1165 C1430 1580 1400 2050 1320 2460" fill="none" stroke="#9bcbdc" stroke-width="22" stroke-linecap="round" opacity="0.5"/>
<path d="M3010 260 C3100 825 3070 1395 3025 2290" fill="none" stroke="#1c3148" stroke-width="245" stroke-linecap="round"/>
<path d="M3040 265 C3120 835 3090 1395 3060 2280" fill="none" stroke="url(#river)" stroke-width="180" stroke-linecap="round"/>
<path d="M3105 360 C3150 870 3135 1370 3100 2100" fill="none" stroke="#9fd0df" stroke-width="20" stroke-linecap="round" opacity="0.48"/>
<path d="M3855 2860 C3845 3180 3890 3480 3890 3800" fill="none" stroke="#1c3148" stroke-width="235" stroke-linecap="round"/>
<path d="M3885 2870 C3870 3190 3910 3485 3915 3800" fill="none" stroke="url(#river)" stroke-width="170" stroke-linecap="round"/>
</g>
<g filter="url(#shadow)">
<path d="M420 760 C720 310 1100 130 1530 70 C1740 38 1900 35 2140 90 C1810 430 1550 750 1360 1180 C1145 1090 910 1070 690 1160 C560 1215 455 1105 420 760Z" fill="url(#mountain)"/>
<path d="M1970 130 C2310 5 2640 80 2920 380 C2720 650 2590 900 2530 1210 C2235 1020 1950 945 1630 1060 C1660 735 1775 410 1970 130Z" fill="url(#mountain)"/>
<path d="M3160 320 C3650 135 4085 245 4450 780 C4185 1005 4030 1295 3925 1640 C3650 1430 3310 1365 2990 1495 C3030 1070 3080 660 3160 320Z" fill="url(#mountain)"/>
<path d="M2320 3190 C2695 2920 3140 2940 3480 3160 C3290 3380 3195 3560 3150 3800 L2210 3800 C2220 3570 2250 3375 2320 3190Z" fill="url(#mountain)"/>
<path d="M4200 2580 C4630 2415 5120 2530 5460 2930 C5215 3165 5055 3470 5010 3800 L4230 3800 C4350 3390 4330 2990 4200 2580Z" fill="url(#mountain)"/>
</g>
<g opacity="0.96">
<path d="M450 3340 C1020 3190 1390 3230 1900 2980 C2355 2755 2700 2580 3370 2520 C3920 2470 4300 2130 4890 1740 C5090 1605 5280 1580 5430 1650" fill="none" stroke="#5b3f2e" stroke-width="330" stroke-linecap="round" stroke-linejoin="round" opacity="0.38"/>
<path d="M455 3315 C1035 3175 1425 3180 1920 2940 C2395 2710 2740 2508 3360 2465 C3890 2428 4265 2100 4855 1700 C5070 1550 5280 1525 5440 1600" fill="none" stroke="url(#road)" stroke-width="220" stroke-linecap="round" stroke-linejoin="round" filter="url(#grain)"/>
<path d="M760 3360 C1425 3205 1790 3150 2320 2820 C2740 2558 3065 2450 3475 2450" fill="none" stroke="#f0daa1" stroke-width="34" stroke-linecap="round" stroke-opacity="0.42"/>
</g>
<g filter="url(#shadow)">
<path d="M4560 1250 L5305 1250 L5430 1395 L5430 2190 L4495 2190 L4495 1395Z" fill="#69583f" stroke="#221912" stroke-width="36"/>
<path d="M4670 1380 L5245 1380 L5330 1475 L5330 2095 L4590 2095 L4590 1475Z" fill="#997d50" stroke="#2d1d13" stroke-width="24"/>
<path d="M4840 1610 L5060 1610 L5060 2095 L4840 2095Z" fill="#251c15"/>
<path d="M4520 1235 L4435 1370 L4495 1395 L5430 1395 L5505 1315 L5305 1250Z" fill="#373027"/>
<path d="M4715 1175 L4845 1090 L4975 1175 L4975 1300 L4715 1300Z" fill="#454034" stroke="#211912" stroke-width="22"/>
<path d="M5100 1195 L5205 1130 L5310 1195 L5310 1300 L5100 1300Z" fill="#454034" stroke="#211912" stroke-width="22"/>
<path d="M4470 2205 C4750 2305 5080 2305 5380 2205" fill="none" stroke="#3c2c1c" stroke-width="42" stroke-linecap="round"/>
</g>
<g opacity="0.74">
<circle cx="790" cy="1760" r="220" fill="#294f28"/>
<circle cx="1110" cy="1540" r="250" fill="#345c31"/>
<circle cx="1450" cy="1810" r="275" fill="#2c4f28"/>
<circle cx="1920" cy="1320" r="250" fill="#31572e"/>
<circle cx="2320" cy="1580" r="285" fill="#294a26"/>
<circle cx="2740" cy="2030" r="250" fill="#355f32"/>
<circle cx="3460" cy="3060" r="285" fill="#315c31"/>
<circle cx="3990" cy="3190" r="330" fill="#294c2a"/>
<circle cx="4630" cy="2740" r="300" fill="#31582f"/>
<circle cx="5190" cy="3160" r="330" fill="#294b27"/>
</g>
<g opacity="0.95">
<g transform="translate(1720 2840)">
<path d="M0 88 L138 0 L276 88 L250 255 L28 255Z" fill="#746640" stroke="#2b2015" stroke-width="18"/>
<path d="M42 95 L138 35 L234 95 L214 136 L138 88 L62 136Z" fill="#ce8428"/>
<rect x="98" y="136" width="82" height="116" fill="#2d2116"/>
<path d="M35 262 C110 294 178 294 250 262" fill="none" stroke="#25301c" stroke-width="20"/>
</g>
<g transform="translate(3200 2400) scale(0.92)">
<path d="M0 88 L138 0 L276 88 L250 255 L28 255Z" fill="#716241" stroke="#2b2015" stroke-width="18"/>
<path d="M42 95 L138 35 L234 95 L214 136 L138 88 L62 136Z" fill="#ce8428"/>
<rect x="98" y="136" width="82" height="116" fill="#2d2116"/>
</g>
<g transform="translate(3890 1800) scale(0.86)">
<path d="M0 88 L138 0 L276 88 L250 255 L28 255Z" fill="#746340" stroke="#2b2015" stroke-width="18"/>
<path d="M42 95 L138 35 L234 95 L214 136 L138 88 L62 136Z" fill="#ce8428"/>
<rect x="98" y="136" width="82" height="116" fill="#2d2116"/>
</g>
</g>
<g opacity="0.24">
<path d="M0 3060 C460 2925 780 2910 1180 3020" fill="none" stroke="#ead49c" stroke-width="28"/>
<path d="M3520 1550 C3900 1300 4270 1190 4680 1200" fill="none" stroke="#ead49c" stroke-width="24"/>
<path d="M1440 2860 C1900 2790 2380 2590 2820 2320" fill="none" stroke="#49321e" stroke-width="18"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 7.9 KiB