Lots of ux fixes, simplify edition, add validation, init shelves

assets/controllers/inline-edit-book-controller.js

@@ -0,0 +1,21 @@
+import { Controller } from '@hotwired/stimulus';
+import { getComponent } from '@symfony/ux-live-component';
+
+/*
+ * This is an example Stimulus controller!
+ *
+ * Any element with a data-controller="hello" attribute will cause
+ * this controller to be executed. The name "hello" comes from the filename:
+ * hello_controller.js -> "hello"
+ *
+ * Delete this file or adapt it for your use!
+ */
+
+export default class extends Controller {
+    async initialize() {
+
+        window.addEventListener('manager:flush', () => location.reload());
+
+    }
+
+}

assets/styles/global.scss

@@ -1,92 +1,14 @@
 // the ~ allows you to reference things in node_modules
 @import "~bootstrap/scss/bootstrap";
-@import "~@fortawesome/fontawesome-free/scss/fontawesome";
-@import "~@fortawesome/fontawesome-free/scss/solid";
-
-.bd-placeholder-img {
-  font-size: 1.125rem;
-  text-anchor: middle;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  user-select: none;
-}
-
-@media (min-width: 768px) {
-  .bd-placeholder-img-lg {
-    font-size: 3.5rem;
-  }
-}
-
-.b-example-divider {
-  width: 100%;
-  height: 3rem;
-  background-color: rgba(0, 0, 0, .1);
-  border: solid rgba(0, 0, 0, .15);
-  border-width: 1px 0;
-  box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
-}
+@import "~bootstrap-icons/font/bootstrap-icons.css";
 
-.b-example-vr {
-  flex-shrink: 0;
-  width: 1.5rem;
-  height: 100vh;
-}
-
-.bi {
-  vertical-align: -.125em;
-  fill: currentColor;
-}
-
-.nav-scroller {
-  position: relative;
-  z-index: 2;
-  height: 2.75rem;
-  overflow-y: hidden;
-}
-
-.nav-scroller .nav {
-  display: flex;
-  flex-wrap: nowrap;
-  padding-bottom: 1rem;
-  margin-top: -1px;
-  overflow-x: auto;
-  text-align: center;
-  white-space: nowrap;
-  -webkit-overflow-scrolling: touch;
-}
-
-.btn-bd-primary {
-  --bd-violet-bg: #712cf9;
-  --bd-violet-rgb: 112.520718, 44.062154, 249.437846;
-
-  --bs-btn-font-weight: 600;
-  --bs-btn-color: var(--bs-white);
-  --bs-btn-bg: var(--bd-violet-bg);
-  --bs-btn-border-color: var(--bd-violet-bg);
-  --bs-btn-hover-color: var(--bs-white);
-  --bs-btn-hover-bg: #6528e0;
-  --bs-btn-hover-border-color: #6528e0;
-  --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
-  --bs-btn-active-color: var(--bs-btn-hover-color);
-  --bs-btn-active-bg: #5a23c8;
-  --bs-btn-active-border-color: #5a23c8;
-}
-.bd-mode-toggle {
-  z-index: 1500;
-}
-.bi {
-  display: inline-block;
-  width: 1rem;
-  height: 1rem;
-}
 
 /*
  * Sidebar
  */
 
 @media (min-width: 768px) {
   .sidebar .offcanvas-lg {
-    position: -webkit-sticky;
     position: sticky;
     top: 48px;
   }
@@ -97,12 +19,21 @@
   font-weight: 500;
 }
 
-.sidebar .nav-link.active {
-  color: #2470dc;
+.sidebar .nav-item.active >.nav-link {
+  font-weight: bold;
+  color: brown;
+}
+.sidebar .icon-link .bi {
+   height: auto;
+}
+
+.bi {
+   height: auto;
 }
 
 .sidebar-heading {
   font-size: .75rem;
+  color: brown;
 }
 
 /*

config/packages/knp_menu.yaml

@@ -0,0 +1,3 @@
+knp_menu:
+  twig:
+    template: 'main_menu.html.twig'

config/packages/knp_paginator.yaml

@@ -1,5 +1,5 @@
 knp_paginator:
-    page_range: 5                      # number of links shown in the pagination menu (e.g: you have 10 pages, a page_range of 3, on the 5th page you'll see links to page 4, 5, 6)
+    page_range: 3                      # number of links shown in the pagination menu (e.g: you have 10 pages, a page_range of 3, on the 5th page you'll see links to page 4, 5, 6)
     default_options:
         page_name: page                 # page query parameter name
         sort_field_name: sort           # sort field query parameter name