A whole lot of layout fixes for mobile

web/src/components/shopping_list.rs

@@ -43,6 +43,7 @@ pub fn shopping_list() -> View<G> {
                     table(class="pad-top shopping-list page-breaker container-fluid", role="grid") {
                         tr {
                             th { " Quantity " }
+                            th { " Delete " }
                             th { " Ingredient " }
                             th { " Recipes " }
                         }
@@ -59,6 +60,8 @@ pub fn shopping_list() -> View<G> {
                                     tr {
                                         td {
                                             input(bind:value=amt.clone(), type="text")
+                                        }
+                                        td {
                                             input(type="button", class="no-print destructive", value="X", on:click=cloned!((filtered_keys) => move |_| {
                                                 let mut keyset = (*filtered_keys.get()).clone();
                                                 keyset.insert(k.clone());

web/src/components/tabs.rs

@@ -24,7 +24,7 @@ pub struct TabState<G: GenericNode> {
 #[component(TabbedView<G>)]
 pub fn tabbed_view(state: TabState<G>) -> View<G> {
     cloned!((state) => view! {
-        header(class="no-print margin-medium") {
+        header(class="no-print") {
             nav {
                 ul {
                     li { a(href="#", class="no-print", on:click=cloned!((state) => move |_| {

web/static/app.css

@@ -24,34 +24,6 @@
     }
 }
 
-.item-count-sel {
-    width: 4em;
-}
-
-.ingredient-count-sel {
-    width: 15em !important;
-}
-
 .destructive {
     background-color: firebrick !important;
-}
-
-.no-left-mgn {
-    margin-left: 0px;
-}
-
-.pad-top {
-    margin-top: 1em;
-}
-
-.shopping-list {
-    width:max-content;
-}
-
-h1 {
-    padding-bottom: 1ch;
-}
-
-body{
-    padding-left: 1ch;
 }