layout detail maps

This commit is contained in:
Robert Janetzko 2022-05-08 12:10:59 +00:00
parent bb46a77b21
commit 3b15a952ac
7 changed files with 249 additions and 218 deletions

View File

@ -8,9 +8,24 @@ a {
outline: 0;
}
.page-header {
display: flex;
width: 100%;
}
.page-tabs {
flex: 100%;
margin-right: 16px;
}
.page-map {
flex: 300px;
}
.object-map {
float: right !important;
margin-top: -7px;
margin-left: 16px;
margin-bottom: 16px;
}
.popover {

View File

@ -3,8 +3,11 @@
{{define "title"}}{{ title .Name }}{{end}}
{{define "content"}}
<h3>{{ title .Name }}</h3>
<p>
<div class="page-header">
<div class="page-tabs">
<h3>{{ title .Name }}</h3>
<p>
{{ .Race }}{{ if .Necromancer}} necromancer{{end}} {{ .Type }}
{{- if .Profession }}
of {{ .Profession }}s
@ -23,40 +26,32 @@
, dedicated to the mastery of {{ andList .Weapons }}
{{- end }}
{{- end }}
</p>
</p>
{{- if gt (len .Sites) 0 }}
<div class="object-map">
<div id="map" style="width: 300px; height: 300px"></div>
<!-- <img class="site-map" src="$suburi/sitemap/$site.id" width="300" /> -->
</div>
{{initMap}}
{{- range .Sites }}
{{ addSite . false }}
{{- end }}
{{- end }}
<nav>
<nav>
<div class="nav nav-tabs" id="nav-tab" role="tablist">
{{ $active := " active"}}
{{- if gt (len .Leaders) 0 }}
<button class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-leaders" type="button" role="tab">Leaders</button>
<button class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-leaders" type="button"
role="tab">Leaders</button>
{{ $active = ""}}{{- end}}
{{- if gt (len .Sites) 0 }}
<button class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-sites" type="button" role="tab">Sites</button>
{{ $active = ""}}{{- end}}
{{- if gt (len .HistfigId) 0 }}
<button class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-members" type="button" role="tab">Members</button>
<button class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-members" type="button"
role="tab">Members</button>
{{ $active = ""}}{{- end}}
{{- if gt (len .Child) 0 }}
<button class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-children" type="button" role="tab">Groups</button>
<button class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-children" type="button"
role="tab">Groups</button>
{{ $active = ""}}{{- end}}
{{- if gt (len .Wars) 0 }}
<button class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-wars" type="button" role="tab">Wars</button>
{{ $active = ""}}{{- end}}
</div>
</nav>
<div class="tab-content" id="nav-tabContent">
</nav>
<div class="tab-content" id="nav-tabContent">
{{ $active := " active"}}
{{- if gt (len .Leaders) 0 }}
<div class="tab-pane{{$active}}" id="nav-leaders" role="tabpanel">
@ -157,8 +152,21 @@
</table>
</div>
{{ $active = ""}}{{- end}}
</div>
</div>
{{- if gt (len .Sites) 0 }}
<div class="page-map">
<div id="map" style="width: 300px; height: 300px"></div>
<!-- <img class="site-map" src="$suburi/sitemap/$site.id" width="300" /> -->
{{initMap}}
{{- range .Sites }}
{{ addSite . false }}
{{- end }}
</div>
{{- end }}
</div>
<h5>Events</h5>
{{ template "events.html" events . }}

View File

@ -3,9 +3,6 @@
{{define "title"}}{{ title .Name }}{{end}}
{{define "content"}}
<h1>{{ title .Name }}</h1>
<p>landmass</p>
<div class="object-map">
<div id="map" style="width: 300px; height: 300px"></div>
</div>
@ -13,5 +10,8 @@
{{ addLandmass .Id }}
<script>map.addLayer(landmassesLayer);</script>
<h1>{{ title .Name }}</h1>
<p>landmass</p>
<p>{{ json . }}</p>
{{- end }}

View File

@ -3,15 +3,15 @@
{{define "title"}}{{ title .Name }}{{end}}
{{define "content"}}
<h3>{{ title .Name }}</h3>
<p>{{ if .IsVolcano }}volcano{{else}}mountain{{end}}</p>
<div class="object-map">
<div id="map" style="width: 300px; height: 300px"></div>
</div>
{{initMap}}
{{ addMountain .Id false }}
<h3>{{ title .Name }}</h3>
<p>{{ if .IsVolcano }}volcano{{else}}mountain{{end}}</p>
<dl class="row">
<dt class="col-2 col-lg-1">Height</dt>
<dd class="col-10 col-lg-11">{{ .Height }}</dd>

View File

@ -3,17 +3,12 @@
{{define "title"}}{{ title .Name }}{{end}}
{{define "content"}}
<h3>{{ title .Name }}</h3>
<p>{{ .Type_ }}</p>
<div class="page-header">
<div class="page-tabs">
<h3>{{ title .Name }}</h3>
<p>{{ .Type_ }}</p>
<div class="object-map">
<div id="map" style="width: 300px; height: 300px"></div>
<!-- <img class="site-map" src="$suburi/sitemap/$site.id" width="300" /> -->
</div>
{{initMap}}
{{ addSite .Id false }}
<nav>
<nav>
<div class="nav nav-tabs" id="nav-tab" role="tablist">
{{ $active := " active"}}
{{- if gt (len .Structures) 0 }}
@ -24,9 +19,11 @@
<button class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-site-properties" type="button"
role="tab">Properties</button>
{{ $active = ""}}{{- end}}
<button class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-history" type="button"
role="tab">History</button>
</div>
</nav>
<div class="tab-content" id="nav-tabContent">
</nav>
<div class="tab-content" id="nav-tabContent">
{{ $active := " active"}}
{{- if gt (len .Structures) 0 }}
<div class="tab-pane{{$active}}" id="nav-structures" role="tabpanel">
@ -61,6 +58,17 @@
</table>
</div>
{{ $active = ""}}{{- end}}
<div class="tab-pane{{$active}}" id="nav-history" role="tabpanel">
{{ template "events.html" events (history .Id) }}
</div>
</div>
</div>
<div class="page-map">
<div id="map" style="width: 300px; height: 300px"></div>
<!-- <img class="site-map" src="$suburi/sitemap/$site.id" width="300" /> -->
{{initMap}}
{{ addSite .Id false }}
</div>
</div>
<h5 class="mt-3">Events</h5>

View File

@ -3,15 +3,15 @@
{{define "title"}}{{ title .Name }}{{end}}
{{define "content"}}
<h3>{{ title .Name }}</h3>
{{ .Type_ }} in {{ site .SiteId }}
<div class="object-map">
<div id="map" style="width: 300px; height: 300px"></div>
</div>
{{initMap}}
{{ addSite .SiteId false }}
<h3>{{ title .Name }}</h3>
{{ .Type_ }} in {{ site .SiteId }}
<h5 class="mt-3">Events</h5>
{{ template "events.html" events . }}

View File

@ -3,15 +3,15 @@
{{define "title"}}{{ title .Name }}{{end}}
{{define "content"}}
<h3>{{ title .Name }}</h3>
<p>{{ .Type }}</p>
<div class="object-map">
<div id="map" style="width: 300px; height: 300px"></div>
</div>
{{initMap}}
{{ addWorldConstruction .Id }}
<h3>{{ title .Name }}</h3>
<p>{{ .Type }}</p>
{{- if gt (len .Parts) 0 }}
<h5>Parts</h5>
<ul>