Compare commits
2 Commits
d995683b55
...
b67ee1e979
| Author | SHA1 | Date | |
|---|---|---|---|
| b67ee1e979 | |||
| e3ad003bcb |
45
index.html
45
index.html
@@ -8,23 +8,34 @@
|
|||||||
<script type="module" src="/main.js"></script>
|
<script type="module" src="/main.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header id="title">
|
<header id="header">
|
||||||
3D-LiDAR Visualisierung
|
<span>3D-LiDAR Visualisierung</span>
|
||||||
<img id="logoJadeHs" src="logoJadeHs.png" />
|
|
||||||
<img id="logoLbeg" src="logoLbeg.svg" />
|
|
||||||
</header>
|
</header>
|
||||||
<button id="resetBtn">Zurück auf Nord</button>
|
|
||||||
<select name="basemap" id="basemap">
|
<aside id="sidebar">
|
||||||
<option value="" disabled selected>Hintergrundkarte</option>
|
<button id="resetBtn">Zurück auf Nord</button>
|
||||||
<option value="openfree_bright">OpenFreeMap hell</option>
|
<select name="basemap" id="basemap">
|
||||||
<option value="openfree_dark">OpenFreeMap dunkel</option>
|
<option value="" disabled selected>Hintergrundkarte</option>
|
||||||
<option value="openfree_liberty">OpenFreeMap Liberty</option>
|
<option value="openfree_bright">OpenFreeMap hell</option>
|
||||||
<option value="google_satellite">Satellit</option>
|
<option value="openfree_dark">OpenFreeMap dunkel</option>
|
||||||
<option value="terrain">Terrain</option>
|
<option value="openfree_liberty">OpenFreeMap Liberty</option>
|
||||||
<option value="satellite_terrain">Terrain mit Satellitenbild</option>
|
<option value="google_satellite">Satellit</option>
|
||||||
</select>
|
<option value="terrain">Terrain</option>
|
||||||
|
<option value="satellite_terrain">Terrain mit Satellitenbild</option>
|
||||||
<div id="map"></div>
|
</select>
|
||||||
|
<div class="logos">
|
||||||
|
<a href="http://www.jade-hs.de">
|
||||||
|
<img id="logoJadeHs" src="logoJadeHs.png" />
|
||||||
|
</a>
|
||||||
|
<a href="https://www.lbeg.niedersachsen.de/startseite/">
|
||||||
|
<img id="logoLbeg" src="logoLbeg.svg" />
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
|
||||||
|
<main id="main">
|
||||||
|
<div id="map"></div>
|
||||||
|
</main>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
BIN
logoJadeHs.png
BIN
logoJadeHs.png
Binary file not shown.
|
Before Width: | Height: | Size: 652 KiB After Width: | Height: | Size: 22 KiB |
99
style.css
99
style.css
@@ -1,50 +1,65 @@
|
|||||||
body {
|
html, body {
|
||||||
padding: 0;
|
height: 100%;
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#title {
|
|
||||||
text-align: center;
|
|
||||||
font-size:xx-large;
|
|
||||||
font-family:'Trebuchet MS';
|
|
||||||
font-weight: bold;
|
|
||||||
width: 50%;
|
|
||||||
padding: 15px;
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-family:'Trebuchet MS';
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#logoJadeHs{
|
|
||||||
position: fixed;
|
|
||||||
top: 1%;
|
|
||||||
right: 10%;
|
|
||||||
width: 128px;
|
|
||||||
height: 69px;
|
|
||||||
transform-origin: center center;
|
|
||||||
z-index: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
#logoLbeg{
|
body {
|
||||||
position: fixed;
|
margin: 0;
|
||||||
top: 1%;
|
height: 100vh;
|
||||||
right: 1%;
|
display: grid;
|
||||||
width: 128px;
|
grid-template-rows: 80px 1fr;
|
||||||
height: 69px;
|
grid-template-columns: 250px 1fr;
|
||||||
transform-origin: center center;
|
grid-template-areas:
|
||||||
z-index: 0;
|
"header header"
|
||||||
|
"sidebar main";
|
||||||
|
font-family: 'Trebuchet MS';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#header {
|
||||||
|
color: white;
|
||||||
|
grid-area: header;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
position: relative;
|
||||||
|
font-size: 28px;
|
||||||
|
font-weight: bold;
|
||||||
|
background: rgb(0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.logos {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 20px;
|
||||||
|
display: flex;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logos img {
|
||||||
|
width: 100px;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#sidebar {
|
||||||
|
grid-area: sidebar;
|
||||||
|
padding: 20px;
|
||||||
|
background: #eeeeee;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#main {
|
||||||
|
grid-area: main;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
#map {
|
#map {
|
||||||
width: 85%;
|
width: 100%;
|
||||||
height: 90%;
|
height: 100%;
|
||||||
position: fixed;
|
|
||||||
right: 0%;
|
|
||||||
bottom: 0%;
|
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user