Update formatting - Prettier 3.0

- Run formatting with latest version of Prettier

client/scss/components/_messages.scss

@@ -83,7 +83,10 @@
 
 .ready .messages > ul,
 .messages.appear > ul {
-  transition: top 0.5s ease, opacity 0.5s ease, max-height 1.2s ease;
+  transition:
+    top 0.5s ease,
+    opacity 0.5s ease,
+    max-height 1.2s ease;
   opacity: 1;
   top: 0;
 }

client/scss/components/_userbar.scss

@@ -8,7 +8,8 @@
 
 $size-home-button: 3.5em;
 $position: 2em;
-$box-shadow-props: 0 0 1px 0 rgba(107, 214, 230, 1),
+$box-shadow-props:
+  0 0 1px 0 rgba(107, 214, 230, 1),
   0 1px 10px 0 rgba(107, 214, 230, 0.7);
 $max-items: 12;
 $userbar-radius: 6px;

client/scss/components/forms/_select.scss

@@ -22,10 +22,12 @@ $chevron-inline-end-offset: math.div($select-size - $chevron-width, 2);
       theme('colors.text-label') 66%,
       transparent 66%
     );
-  background-position: calc(100% - $chevron-top-offset - $chevron-width)
+  background-position:
-      $chevron-top-offset,
+    calc(100% - $chevron-top-offset - $chevron-width) $chevron-top-offset,
     calc(100% - $chevron-inline-end-offset) $chevron-top-offset;
-  background-size: $chevron-width $chevron-width, $chevron-width $chevron-width;
+  background-size:
+    $chevron-width $chevron-width,
+    $chevron-width $chevron-width;
   background-repeat: no-repeat;
 }
 

client/scss/elements/_elements.scss

@@ -41,7 +41,9 @@ body {
   &:after {
     content: '';
     position: fixed;
-    transition: visibility 0s linear 0s, opacity 0.2s ease-out;
+    transition:
+      visibility 0s linear 0s,
+      opacity 0.2s ease-out;
     background: theme('colors.white-50');
     width: 100%;
     height: 100%;

client/src/components/CommentApp/components/Comment/style.scss

@@ -3,7 +3,9 @@
 
   width: 300px;
   display: block;
-  transition: top 0.5s ease 0s, inset-inline-end 0.5s ease 0s,
+  transition:
+    top 0.5s ease 0s,
+    inset-inline-end 0.5s ease 0s,
     height 0.5s ease 0s;
   pointer-events: auto;
   padding-bottom: 0;

client/src/components/Sidebar/modules/WagtailBranding.scss

@@ -22,8 +22,10 @@ $logo-size: 110px;
   text-align: center;
   width: $logo-size;
   height: $logo-size;
-  transition: transform 150ms cubic-bezier(0.28, 0.15, 0, 2.1),
+  transition:
-    width $menu-transition-duration ease, height $menu-transition-duration ease,
+    transform 150ms cubic-bezier(0.28, 0.15, 0, 2.1),
+    width $menu-transition-duration ease,
+    height $menu-transition-duration ease,
     padding-top $menu-transition-duration ease;
   border-radius: 100%;
 

client/src/components/StreamField/blocks/BaseSequenceBlock.js

@@ -2,8 +2,8 @@
 
 /* global $ */
 
-import { v4 as uuidv4 } from 'uuid';
 import EventEmitter from 'events';
+import { v4 as uuidv4 } from 'uuid';
 import { escapeHtml as h } from '../../../utils/text';
 import {
   initCollapsiblePanel,
@@ -146,11 +146,11 @@ export class BaseSequenceChild extends EventEmitter {
         <input type="hidden" name="${this.prefix}-deleted" value="">
         <input type="hidden" name="${this.prefix}-order" value="${index}">
         <input type="hidden" name="${this.prefix}-type" value="${h(
-      this.type || '',
+          this.type || '',
-    )}">
+        )}">
         <input type="hidden" name="${this.prefix}-id" value="${h(
-      this.id || '',
+          this.id || '',
-    )}">
+        )}">
         <section class="w-panel w-panel--nested" id="${panelId}" aria-labelledby="${headingId}" data-panel>
           <div class="w-panel__header">
             <a class="w-panel__anchor w-panel__anchor--prefix" href="#${panelId}" aria-labelledby="${headingId}" data-panel-anchor>

client/src/components/Transition/Transition.scss

@@ -12,7 +12,8 @@ $c-transition-duration: 200ms;
 
 .c-transition-push-enter {
   transform: translateX(calc(var(--w-direction-factor) * 100%));
-  transition: transform $c-transition-duration ease,
+  transition:
+    transform $c-transition-duration ease,
     opacity $c-transition-duration linear;
   opacity: 0;
 }
@@ -24,7 +25,8 @@ $c-transition-duration: 200ms;
 
 .c-transition-push-leave {
   transform: translateX(0);
-  transition: transform $c-transition-duration ease,
+  transition:
+    transform $c-transition-duration ease,
     opacity $c-transition-duration linear;
   opacity: 1;
 }
@@ -39,7 +41,8 @@ $c-transition-duration: 200ms;
 // =============================================================================
 .c-transition-pop-enter {
   transform: translateX(calc(var(--w-direction-factor) * -100%));
-  transition: transform $c-transition-duration ease,
+  transition:
+    transform $c-transition-duration ease,
     opacity $c-transition-duration linear;
   opacity: 0;
 }
@@ -51,7 +54,8 @@ $c-transition-duration: 200ms;
 
 .c-transition-pop-leave {
   transform: translateX(0);
-  transition: transform $c-transition-duration ease,
+  transition:
+    transform $c-transition-duration ease,
     opacity $c-transition-duration linear;
   opacity: 1;
 }