diff --git a/src/client/lib/src/pages/home.dart b/src/client/lib/src/pages/home.dart
index cca26b9..d2488e3 100644
--- a/src/client/lib/src/pages/home.dart
+++ b/src/client/lib/src/pages/home.dart
@@ -15,66 +15,67 @@ class HomePage extends ReactiveWidget<HomeModel> {
     appBar: AppBar(title: const Text("Counter")),
     body: Row(
       children: [
-        AnimatedContainer(
-          duration: Durations.short4,
-          width: model.shouldShowMarkers ? 300 : 0,
+        SizedBox(
+          width: 300,
           child: Sidebar(model),
         ),
         Expanded(
-          child: Column(
-            children: [
-              LatLongEditor(
-                latitudeController: model.startLatitudeController,
-                longitudeController: model.startLongitudeController,
-                label: "Start at",
-                isShowingMarkers: model.markerState == MarkerState.start,
-                showMarkers: () => model.showMarkers(MarkerState.start),
-                hideMarkers: model.hideMarkers,
-              ),
-              const SizedBox(height: 12),
-              LatLongEditor(
-                latitudeController: model.endLatitudeController,
-                longitudeController: model.endLongitudeController,
-                label: "End at",
-                isShowingMarkers: model.markerState == MarkerState.end,
-                showMarkers: () => model.showMarkers(MarkerState.end),
-                hideMarkers: model.hideMarkers,
-              ),
-              const SizedBox(height: 24),
-              FilledButton(onPressed: model.search, child: const Text("Search for a path")),
-              const SizedBox(height: 8),
-              const Divider(),
-              const SizedBox(height: 8),
-              if (model.isLoading)
-                const LinearProgressIndicator()
-              else if (model.isSearching && model.path == null)
-                const Text("Could not connect to API")
-              else
-                for (final step in model.path ?? <PathStep>[]) Text(
-                  "Get on at ${step.enter.lat}, ${step.enter.long}\n"
-                  "Get off at ${step.exit.lat}, ${step.exit.long}",
+          child: Card(
+            child: Column(
+              children: [
+                LatLongEditor(
+                  latitudeController: model.startLatitudeController,
+                  longitudeController: model.startLongitudeController,
+                  label: "Start at",
+                  isShowingMarkers: model.markerState == MarkerState.start,
+                  showMarkers: () => model.showMarkers(MarkerState.start),
+                  hideMarkers: model.hideMarkers,
                 ),
-              Expanded(
-                child: model.isGoogleReady
-                  ? GoogleMap(
-                    onMapCreated: (controller) => model.mapController = controller,
-                    initialCameraPosition: const CameraPosition(
-                      target: LatLng(42.10125081757972, -75.94181323552698),
-                      zoom: 14,
-                    ),
-                    markers: model.markers,
-                    onTap: model.onMapTapped,
-                    polylines: {
-                      for (final (index, route) in model.routes.indexed) Polyline(
-                        polylineId: PolylineId(index.toString()),
-                        color: routeColors[index],
-                        points: route,
+                const SizedBox(height: 12),
+                LatLongEditor(
+                  latitudeController: model.endLatitudeController,
+                  longitudeController: model.endLongitudeController,
+                  label: "End at",
+                  isShowingMarkers: model.markerState == MarkerState.end,
+                  showMarkers: () => model.showMarkers(MarkerState.end),
+                  hideMarkers: model.hideMarkers,
+                ),
+                const SizedBox(height: 24),
+                FilledButton(onPressed: model.search, child: const Text("Search for a path")),
+                const SizedBox(height: 8),
+                const Divider(),
+                const SizedBox(height: 8),
+                if (model.isLoading)
+                  const LinearProgressIndicator()
+                else if (model.isSearching && model.path == null)
+                  const Text("Could not connect to API")
+                else
+                  for (final step in model.path ?? <PathStep>[]) Text(
+                    "Get on at ${step.enter.lat}, ${step.enter.long}\n"
+                    "Get off at ${step.exit.lat}, ${step.exit.long}",
+                  ),
+                Expanded(
+                  child: model.isGoogleReady
+                    ? GoogleMap(
+                      onMapCreated: (controller) => model.mapController = controller,
+                      initialCameraPosition: const CameraPosition(
+                        target: LatLng(42.10125081757972, -75.94181323552698),
+                        zoom: 14,
                       ),
-                    },
-                  )
-                  : const Center(child: CircularProgressIndicator()),
-              ),
-            ],
+                      markers: model.markers,
+                      onTap: model.onMapTapped,
+                      polylines: {
+                        for (final (index, route) in model.routes.indexed) Polyline(
+                          polylineId: PolylineId(index.toString()),
+                          color: routeColors[index],
+                          points: route,
+                        ),
+                      },
+                    )
+                    : const Center(child: CircularProgressIndicator()),
+                ),
+              ],
+            ),
           ),
         ),
       ],
diff --git a/src/client/lib/src/widgets/lat_long_editor.dart b/src/client/lib/src/widgets/lat_long_editor.dart
index f99f879..d1d8516 100644
--- a/src/client/lib/src/widgets/lat_long_editor.dart
+++ b/src/client/lib/src/widgets/lat_long_editor.dart
@@ -45,14 +45,14 @@ class LatLongEditor extends StatelessWidget {
             ),
           ),
         ),
-        if (isShowingMarkers) IconButton(
-          icon: const Icon(Icons.location_on),
+        const SizedBox(width: 8),
+        if (isShowingMarkers) TextButton(
           onPressed: hideMarkers,
-          tooltip: "Hide stops on map",
-        ) else IconButton(
-          icon: const Icon(Icons.location_off),
+          child: const Text("Cancel"),
+        ) else TextButton.icon(
+          icon: const Icon(Icons.location_on),
           onPressed: showMarkers,
-          tooltip: "Show stops on map",
+          label: const Text("Pick on map"),
         ),
       ],
     ),
diff --git a/src/client/lib/src/widgets/sidebar.dart b/src/client/lib/src/widgets/sidebar.dart
index 44b4872..e6dc9d5 100644
--- a/src/client/lib/src/widgets/sidebar.dart
+++ b/src/client/lib/src/widgets/sidebar.dart
@@ -10,9 +10,9 @@ class Sidebar extends ReusableReactiveWidget<HomeModel> {
     length: 2,
     child: Card(
       clipBehavior: Clip.hardEdge,
-      elevation: 8,
       child: Column(
         children: [
+          const SizedBox(height: 16),
           Text(
             "Select routes",
             maxLines: 1,
@@ -26,35 +26,33 @@ class Sidebar extends ReusableReactiveWidget<HomeModel> {
             textAlign: TextAlign.center,
           ),
           const SizedBox(height: 8),
-          TabBar(
+          if (model.shouldShowMarkers) TabBar(
             tabs: [
               for (final (provider, _) in model.providers)
                 Tab(text: provider),
             ],
           ),
           Expanded(
-            child: TabBarView(
-              children: [
-                for (final (_, routesList) in model.providers)
-                  ListView(
-                    children: [
-                      for (final route in routesList) ListTile(
-                        title: Text(route, maxLines: 1),
-                        subtitle: Text(
-                          "${model.stopCounts[route] ?? 0} stops",
-                          maxLines: 1,
-                        ),
-                        // Can't use CheckboxListTile, since we must remove the
-                        // checkboxes manually to prevent layour errors
-                        trailing: !model.shouldShowMarkers ? null : Checkbox(
-                          value: model.routesToShow.contains(route),
-                          onChanged: (value) => model.showRoute(route, shouldShow: value!),
-                        ),
+            child: !model.shouldShowMarkers
+              ? const Center(child: Text("Choose start or end location"))
+              : TabBarView(
+                  children: [
+                    for (final (_, routesList) in model.providers)
+                      ListView(
+                        children: [
+                          for (final route in routesList) CheckboxListTile(
+                            title: Text(route, maxLines: 1),
+                            subtitle: Text(
+                              "${model.stopCounts[route] ?? 0} stops",
+                              maxLines: 1,
+                            ),
+                            value: model.routesToShow.contains(route),
+                            onChanged: (value) => model.showRoute(route, shouldShow: value!),
+                          ),
+                        ],
                       ),
-                    ],
-                  ),
-              ],
-            ),
+                  ],
+                ),
           ),
         ],
       ),