gebäude markieren

This commit is contained in:
Cay 2026-03-11 17:49:10 +00:00
parent 78a714bdbd
commit befe8613f1
2 changed files with 70 additions and 4 deletions

32
public/css/launcher.css Normal file
View File

@ -0,0 +1,32 @@
.map-container {
position: relative;
width: 100%;
max-width: 1400px;
margin: auto;
}
.map {
width: 100%;
display: block;
}
.map-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.area {
fill: rgba(255, 255, 255, 0);
cursor: pointer;
transition: all 0.3s;
}
.area:hover {
fill: rgba(255, 255, 255, 0.15);
stroke: #6ec6ff;
stroke-width: 3;
filter: drop-shadow(0 0 10px #6ec6ff);
}

View File

@ -3,6 +3,7 @@
<head>
<meta charset="UTF-8" />
<title>Dynasty of Knights</title>
<link rel="stylesheet" href="/css/launcher.css" />
<style>
body {
@ -30,12 +31,45 @@
</head>
<body>
<div class="panel">
<h1>Dynasty of Knights</h1>
<div class="map-container">
<img src="/images/dok_bg.png" class="map" />
<p>Launcher bereit</p>
<svg viewBox="0 0 2048 1024" class="map-overlay">
<a href="/castle">
<polygon
class="area"
points="920,230 1120,230 1180,350 860,350"
></polygon>
</a>
<button>Spiel starten</button>
<a href="/market">
<polygon
class="area"
points="870,500 1170,500 1230,630 810,630"
></polygon>
</a>
<a href="/portal">
<polygon
class="area"
points="230,140 330,140 350,310 210,310"
></polygon>
</a>
<a href="/tower">
<polygon
class="area"
points="1500,260 1600,260 1600,420 1500,420"
></polygon>
</a>
<a href="/church">
<polygon
class="area"
points="960,420 1030,420 1030,520 960,520"
></polygon>
</a>
</svg>
</div>
</body>
</html>