gebäude markieren
This commit is contained in:
parent
78a714bdbd
commit
befe8613f1
32
public/css/launcher.css
Normal file
32
public/css/launcher.css
Normal 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);
|
||||
}
|
||||
@ -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>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user