Rumperuu/Where-in-the-World-is-Ben
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases Wiki Activity

Fix view styling

Browse source
This commit is contained in:
Ben Goldsworthy 2022-10-19 21:14:10 +00:00
parent 9a000fb08e
commit 27ace62423
2 changed files with 26 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
public/css/app.css
View file

@ -44,10 +44,13 @@ details h2 {
.other-links {
display: block;
margin: auto;
overflow: auto;
}
.other-links ul {
list-style: none;
margin: 0 auto;
width: fit-content;
}
.other-links li {
@ -58,6 +61,7 @@ details h2 {
.trip-meta {
display: block;
width: 100%;
text-align: center;
}
.main--list {
@ -74,14 +78,19 @@ details h2 {
}
}
#map {
height: 400px;
#mapContainer {
grid-column-start: 1;
grid-column-end: 3;
@media screen and (min-width: 1024px) {
grid-column-end: 2;
}
}
#map {
height: 400px;
@media screen and (min-width: 1024px) {
height: auto;
min-height: 800px;
grid-column-end: 2;
}
}

26
resources/views/tracker.blade.php
View file

@ -37,21 +37,23 @@
</header>
<main id="routeContainer">
<div id="map"></div>
<section id="mapContainer">
<div id="map"></div>
</section>
<section id="checkinList">
<ol start="{{ count($trip->checkins) }}" reversed>
<ol start="{{ count($trip->checkins) }}" reversed>
@foreach(array_slice(array_reverse($trip->checkins), 0, 15) as $checkin)
<li n>
<details id="{{ $checkin->id }}" ontoggle="toggleCheckin(this.open, this.id)">
<summary><h2>{{ $checkin->title ?? "[No title]" }}</h2> <span>{{ date('j M Y (G:H)', strtotime($checkin->date)) }}</span></summary>
{{ $checkin->note ?? "[No note]" }}
@if($checkin->image_url)
<img class="popup__image" loading="lazy" src="{{ $checkin->image_url }}">
@endif
</details>
</li>
<li>
<details id="{{ $checkin->id }}" ontoggle="toggleCheckin(this.open, this.id)">
<summary><h2>{{ $checkin->title ?? "[No title]" }}</h2> <span>{{ date('j M Y (G:H)', strtotime($checkin->date)) }}</span></summary>
{{ $checkin->note ?? "[No note]" }}
@if($checkin->image_url)
<img class="popup__image" loading="lazy" src="{{ $checkin->image_url }}">
@endif
</details>
</li>
@endforeach
</ol>
</ol>
</section>
</main>