diff --git a/public/css/app.css b/public/css/app.css index a9f66c6..1f068ef 100644 --- a/public/css/app.css +++ b/public/css/app.css @@ -1,8 +1,26 @@ -#pageHeader { - text-align: center; +/* + * Typography + */ + +body { + font-family: Verdana, Arial, sans-serif; + font-size: 16px; } -.positive, .negative { +.page-title { + font-size: 3em; + text-align: center; + @media screen and (min-width: 1024px) { + text-align: left; + } +} + +details h2 { + display: inline; +} + +.positive, +.negative { font-weight: bold; } @@ -19,23 +37,52 @@ font-size: 0.8em; } +/* + * Layout + */ + +.other-links { + display: block; + text-align: center; + margin: auto; +} + +.trip-meta { + display: block; + width: 100%; +} + +.main--list { + margin: auto; + width: 100%; + max-width: 980px; +} + #routeContainer { display: grid; + grid-gap: 20px; + @media screen and (min-width: 1024px) { + grid-template-columns: 3fr 1fr; + } } #map { height: 400px; grid-column-start: 1; grid-column-end: 3; + @media screen and (min-width: 1024px) { + height: auto; + min-height: 800px; + grid-column-end: 2; + } } #checkinList { grid-column-start: 1; grid-column-end: 3; -} - -details h2 { - display: inline; + @media screen and (min-width: 1024px) { + grid-column-start: 2; + } } details { @@ -55,6 +102,9 @@ details[open] summary { max-width: 85vw; max-height: 85vh; min-width: 60vw; + @media screen and (min-width: 1024px) { + min-width: 350px; + } } .leaflet-popup-content { @@ -65,29 +115,7 @@ details[open] summary { width: auto; height: auto; max-width: 70vw; -} - -@media screen and (min-width: 1024px) { - #routeContainer { - grid-template-columns: 3fr 1fr; - } - - #map { - height: auto; - min-height: 800px; - grid-column-end: 2; - } - - #checkinList { - grid-column-start: 2; - } - - .leaflet-popup { - min-width: 350px; - } - - .popup__image { + @media screen and (min-width: 1024px) { max-width: 50vw; } } - diff --git a/resources/views/no-trip.blade.php b/resources/views/no-trip.blade.php index 5894b6d..decb9aa 100644 --- a/resources/views/no-trip.blade.php +++ b/resources/views/no-trip.blade.php @@ -18,8 +18,12 @@
-

No Trip in Progress at the Moment

-

Past trips

+

No Trip in Progress at the Moment

+
diff --git a/resources/views/past-trip.blade.php b/resources/views/past-trip.blade.php index 4c4b1a9..e269d54 100644 --- a/resources/views/past-trip.blade.php +++ b/resources/views/past-trip.blade.php @@ -18,13 +18,20 @@
-

Where in the World was Ben?

-

Current trip

-

Past trips

-

- Tracking started: {{ date('j M Y (G:H)', strtotime($trip->date_start)) }} | - (Last update: {{ date('j M Y (G:H)', strtotime($trip->updated_at)) }}) -

+

{{ $trip->name }}

+ + +
+

+ Tracking started: {{ date('j M Y (G:H)', strtotime($trip->date_start)) }} | + Tracking Ended: {{ date('j M Y (G:H)', strtotime($trip->updated_at)) }} +

+
diff --git a/resources/views/past-trips.blade.php b/resources/views/past-trips.blade.php index de3d48f..10d4187 100644 --- a/resources/views/past-trips.blade.php +++ b/resources/views/past-trips.blade.php @@ -18,11 +18,15 @@
-

Past Trips

-

Current trip

+

Past Trips

+
-
+
diff --git a/resources/views/tracker.blade.php b/resources/views/tracker.blade.php index b615a85..619855d 100644 --- a/resources/views/tracker.blade.php +++ b/resources/views/tracker.blade.php @@ -18,14 +18,20 @@
-

Where in the World is Ben?

-

Past trips

-

- Tracking started: {{ date('j M Y (G:H)', strtotime($trip->date_start)) }} | - {{ ($trip->is_active) ? "Active" : "Ended" }} | - {{ ($trip->is_tracking) ? "Currently tracking" : "Not currently tracking" }} - (Last update: {{ date('j M Y (G:H)', strtotime($trip->updated_at)) }}) -

+

Where in the World is Ben?

+ +
+

+ Tracking started: {{ date('j M Y (G:H)', strtotime($trip->date_start)) }} | + {{ ($trip->is_active) ? "Active" : "Ended" }} | + {{ ($trip->is_tracking) ? "Currently tracking" : "Not currently tracking" }} + (Last update: {{ date('j M Y (G:H)', strtotime($trip->updated_at)) }}) +

+