@7365admin1/layer-common 3.2.2-staging.87 → 3.2.2-staging.88

package/components/SiteSettings.vue

@@ -1,8 +1,13 @@
 <template>
   <v-row no-gutters>
-    <v-expansion-panels multiple v-model="openPanels">
+    <!--
+      The design draws settings as a stack of bordered sections with one open
+      at a time. `multiple` is BEHAVIOUR - which sections a user may have open
+      together - so it is left exactly as it was and only the drawing changes.
+    -->
+    <v-expansion-panels multiple v-model="openPanels" class="screen-accordion">
       <!-- SITE SETTINGS -->
-      <v-expansion-panel v-if="canManageSiteInformation" color="primary">
+      <v-expansion-panel v-if="canManageSiteInformation">
         <v-expansion-panel-title>
           <v-icon class="mr-2">mdi-cog</v-icon>
           Site Information
@@ -22,7 +27,7 @@
                   <v-img v-if="coverPhotoUrl" :src="coverPhotoUrl" aspect-ratio="16/9" cover rounded="lg"
                     class="w-100 border" />
                   <div v-else
-                    class="w-100 d-flex align-center justify-center rounded-lg bg-grey-lighten-4 border border-dashed"
+                    class="w-100 d-flex align-center justify-center rounded-lg border border-dashed site-settings__placeholder"
                     style="aspect-ratio: 16/9">
                     <span class="text-caption text-medium-emphasis">No cover photo uploaded</span>
                   </div>
@@ -76,7 +81,7 @@
       </v-expansion-panel>
 
       <!-- ANPR CAMERA -->
-      <v-expansion-panel v-if="showAnprCamera && canManageANPRCamera" color="primary">
+      <v-expansion-panel v-if="showAnprCamera && canManageANPRCamera">
         <v-expansion-panel-title>
           <v-icon class="mr-2">mdi-camera</v-icon>
           ANPR Camera
@@ -118,7 +123,7 @@
       </v-expansion-panel>
 
       <!-- CCTV CAMERA -->
-      <v-expansion-panel v-if="showCctvCamera && canManageCCTVCamera" color="primary">
+      <v-expansion-panel v-if="showCctvCamera && canManageCCTVCamera">
         <v-expansion-panel-title>
           <v-icon class="mr-2">mdi-cctv</v-icon>
           CCTV Camera
@@ -129,7 +134,7 @@
         </v-expansion-panel-text>
       </v-expansion-panel>
 
-      <v-expansion-panel v-if="showDeliveryCompanies && canManageDeliveryCompanies" color="primary">
+      <v-expansion-panel v-if="showDeliveryCompanies && canManageDeliveryCompanies">
         <v-expansion-panel-title>
           <v-icon class="mr-2">mdi-truck</v-icon>
           Delivery Companies
@@ -140,7 +145,7 @@
         </v-expansion-panel-text>
       </v-expansion-panel>
 
-      <v-expansion-panel v-if="showResidentVisitors && canManageResidentVisitors" color="primary">
+      <v-expansion-panel v-if="showResidentVisitors && canManageResidentVisitors">
         <v-expansion-panel-title>
           <v-icon class="mr-2">mdi-car</v-icon>
           Resident Visitors
@@ -150,7 +155,7 @@
         </v-expansion-panel-text>
       </v-expansion-panel>
 
-      <v-expansion-panel color="primary">
+      <v-expansion-panel>
         <v-expansion-panel-title>
           <v-icon class="mr-2">mdi-face-recognition</v-icon>
           HID Face Reader
@@ -421,3 +426,11 @@ const saveANPRSettings = async () => {
   }
 };
 </script>
+
+<style scoped>
+/* Was `bg-grey-lighten-4`: a literal light grey, so the empty cover-photo tile
+   stayed a white slab on the dark page. */
+.site-settings__placeholder {
+  background: var(--thead);
+}
+</style>

package/package.json

@@ -2,7 +2,7 @@
   "name": "@7365admin1/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "3.2.2-staging.87",
+  "version": "3.2.2-staging.88",
   "author": "7365admin1",
   "main": "./nuxt.config.ts",
   "publishConfig": {