V13 update pt2

system/styles/scss/global-appv2.scss

@@ -52,7 +52,7 @@
     gap: 4px; // halve the distance between menu icons
 }
 
-#sidebar-content {
+#sidebar-content.expanded {
     background: url("../assets/ui/bgSidebar.webp") no-repeat;
     border-image: url("../assets/ui/macro-button.webp") 10 repeat;
     border-style: solid;
@@ -89,4 +89,14 @@
             border-image-width: 0.25rem;
         }
     }
+}
+
+#menu.active {
+    transition: max-height 150ms ease-in;
+}
+
+#menu {
+    // Foundry listens to transitionend and then close the menu so need something here.
+    // otherwise using ESC will result in a long wait and missed trigger events
+    transition: max-height 10ms ease-out;
 }

system/styles/scss/l5r5e-global.scss

@@ -43,4 +43,66 @@ textarea {
 }
 input[type="number"] {
     text-align: center;
-}
+}
+
+&.system-badge {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: .5rem;
+    padding: .25rem;
+
+    > img {
+      height: 128px;
+      border: none;
+      object-fit: contain;
+    }
+
+    .system-info {
+      position: relative;
+      font-size: var(--font-size-16);
+      i {
+        padding-inline-start: 2px;
+        font-size: var(--font-size-12);
+      }
+    }
+}
+
+&.sidebar-info {
+    margin-bottom: -.5rem;
+
+    .system-badge { margin-top: .5rem; }
+
+    .notification-pip {
+      color: var(--color-text-accent);
+      font-size: var(--font-size-12);
+      top: 4px;
+      right: -14px;
+    }
+
+    ul.unlist {
+        display: flex;
+        flex-wrap: wrap;
+        padding-left: 0;
+        list-style: none;
+        clip-path: inset(0 0 0 2ch); // remove separator if on new line
+    }
+    ul.links {
+      gap: 0;
+      margin-top: 6px;
+      margin-left: 10%; // just to center the link list a little
+
+      li {
+        padding-left: 1ch;
+        white-space: nowrap;
+      }
+
+      li::before {
+        content: "•";
+        display: inline-block;
+        margin-right: 1ch;
+        width: 1ch;
+        text-align: center;
+      }
+    }
+  }

system/styles/scss/ui.scss

@@ -585,12 +585,15 @@ l5r5e-multi-select:has( > button.gm) {
     }
 }
 
-#client-settings:has( l5r5e-multi-select) {
-    .form-fields:has(l5r5e-multi-select) {
-        order: 3; // Move the multiselect to be below the title and description for nicer ui
+form#settings-config {
+
+    div.form-group:has(l5r5e-multi-select) {
+        .form-fields {
+            order: 3; // Move the multiselect to be below the title and description for nicer ui
+        }
     }
 
-    [data-setting-id="l5r5e.compendium-unofficial-content-for-players"] {
+    div.form-group:has(#settings-config-l5r5e\.compendium-unofficial-content-for-players) {
         // Move the tags and input fields to a similar place as for the multiselect
         .form-fields {
             order: 3;