[pre-commit.ci lite] apply automatic fixes

Author: pre-commit-ci-lite[bot]

contentcuration/contentcuration/frontend/channelList/views/ChannelListIndex.vue

@@ -344,4 +344,4 @@
     height: 100%;
   }
 
-</style>
+</style>

contentcuration/contentcuration/frontend/shared/views/SkipNavigationLink.vue

@@ -86,4 +86,4 @@
     }
   }
 
-</style>
+</style>

contentcuration/contentcuration/frontend/shared/views/StudioNavigation.vue

@@ -10,12 +10,11 @@
   >
     <SkipNavigationLink />
     <header>
-      
       <KToolbar
         ref="toolbar"
         type="clear"
         :style="{
-          overflowX: 'hidden',  
+          overflowX: 'hidden',
           backgroundColor: $themeTokens.appBar,
           height: '56px',
         }"
@@ -69,9 +68,7 @@
                   icon="person"
                   color="black"
                 />
-                <span
-                  class="mx-2 subheading"
-                >
+                <span class="mx-2 subheading">
                   {{ user.first_name }}
                 </span>
                 <KIconButton
@@ -116,7 +113,6 @@
           </div>
         </template>
       </KToolbar>
-
     </header>
     <div
       v-if="hasTabs"
@@ -267,14 +263,12 @@
               @click.native="sidePanelOpen = false"
             />
 
-            
             <KExternalLink
               href="https://community.learningequality.org/c/support/studio"
               openInNewTab
               :text="$tr('giveFeedback')"
               @click.native="sidePanelOpen = false"
             />
-          
           </div>
         </div>
       </template>
@@ -296,7 +290,6 @@
   import SidePanelModal from './SidePanelModal';
   import SkipNavigationLink from './SkipNavigationLink.vue';
 
-
   export default {
     name: 'StudioNavigation',
     components: {
@@ -326,7 +319,7 @@
         },
       };
     },
-    
+
     computed: {
       ...mapState({
         user: state => state.session.currentUser,
@@ -413,7 +406,7 @@
       },
     },
     watch: {
-      '$route'() {
+      $route() {
         this.$nextTick(() => {
           this.moveIndicator();
         });
@@ -429,7 +422,7 @@
       if (el) {
         el.addEventListener('scroll', this.checkScrollPositions);
         this.checkScrollPositions();
-        
+
         const resizeObserver = new ResizeObserver(this.checkScrollPositions);
         resizeObserver.observe(el);
       }
@@ -559,7 +552,6 @@
         }
         return value;
       },
-
     },
     $trs: {
       title: 'Kolibri Studio',
@@ -612,16 +604,15 @@
   }
 
   .studio-navigation__title-container {
-    display: block;    
+    display: block;
+    padding-inline-start: 20px;
     overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
     font-size: 20px;
     font-weight: 500;
-    padding-inline-start: 20px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
   }
 
-
   .studio-navigation__actions {
     display: flex;
     align-items: center;
@@ -637,51 +628,49 @@
   .scroll-button {
     position: absolute;
     top: 0;
+    z-index: 5;
     display: flex;
     align-items: center;
     justify-content: center;
     height: 100%;
-    z-index: 5;
+    padding: 0 4px;
     cursor: pointer;
     user-select: none;
-    padding: 0 4px;
     transition: background-color 0.2s ease;
-  
-    
+
     &--left {
       left: 0;
       padding-right: 8px;
     }
-    
+
     &--right {
       right: 0;
       padding-left: 8px;
-     
     }
   }
 
   .studio-navigation__tabs-container {
     position: relative;
     display: flex;
     flex: 1;
+    height: 48px;
     padding: 0 24px;
     overflow-x: auto;
-    height: 48px;
-    list-style-type: none;
     white-space: nowrap;
+    list-style-type: none;
     scrollbar-width: none;
     scroll-behavior: auto;
   }
+
   .sliding-indicator {
     position: absolute;
     bottom: 0;
     left: 0;
-    height: 2px;
-    
-    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); 
-    pointer-events: none; 
     z-index: 1;
-}
+    height: 2px;
+    pointer-events: none;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  }
 
   /* Side panel styles */
   .side-panel-header {
@@ -702,7 +691,7 @@
     flex-direction: column;
     height: 100%;
   }
-  
+
   ::v-deep .side-panel-content {
     padding: 0 !important;
   }
@@ -713,8 +702,8 @@
 
   .side-panel-nav-item {
     display: flex;
-    align-items: center;
     gap: 12px;
+    align-items: center;
     width: 100%;
     padding: 4px 16px;
     cursor: pointer;
@@ -735,4 +724,4 @@
     font-size: 14px;
   }
 
-</style>
+</style>

contentcuration/contentcuration/frontend/shared/views/StudioNavigationTab.vue

@@ -5,11 +5,11 @@
     ref="tabElement"
     :to="to"
     :class="[
-      tabClasses, 
+      tabClasses,
       $computedClass({
         ':active': { backgroundColor: 'rgba(0, 0, 0, 0.2)' },
-        ':focus': { ...$coreOutline, outlineOffset: 0 }
-      })
+        ':focus': { ...$coreOutline, outlineOffset: 0 },
+      }),
     ]"
     :style="tabStyles"
     :aria-current="isActive ? 'page' : null"
@@ -67,7 +67,7 @@
           color: this.$themeTokens.text,
         };
       },
-      
+
       isActive() {
         if (!this.to || !this.$route) return false;
 
@@ -91,10 +91,10 @@
   .studio-navigation-tab {
     position: relative;
     display: flex;
+    flex: 0 0 auto;
     flex-direction: column;
     align-items: center;
     justify-content: center;
-    flex: 0 0 auto;
     min-width: 160px;
     max-width: 264px;
     height: 100%;
@@ -108,17 +108,16 @@
     text-transform: uppercase;
     white-space: normal;
     cursor: pointer;
+    user-select: none;
     background: transparent;
     outline: none;
-    user-select: none;
     transition: 0.3s cubic-bezier(0.25, 0.8, 0.5, 1);
   }
 
   .studio-navigation-tab:not(.studio-navigation-tab--active) {
     opacity: 0.7;
   }
 
-
   .studio-navigation-tab__content {
     position: relative;
     display: flex;
@@ -143,4 +142,4 @@
     transition: 0.3s;
   }
 
-</style>
+</style>