* Update less button to be after description stuff when tabbing

PikachuEXE · Dec 28, 2024 · bf07ad5 · bf07ad5
1 parent 67c14f8
commit bf07ad5
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 20 deletions.
diff --git a/src/renderer/components/WatchVideoDescription/WatchVideoDescription.css b/src/renderer/components/WatchVideoDescription/WatchVideoDescription.css
@@ -37,17 +37,9 @@
 .videoDescription:not(.short) .descriptionStatus {
   position: relative;
   margin-block-start: 1em;
-
-  /* Putting the control below description when expanded without separating template code */
-  order: 1;
 }
 
 .videoDescription.short .description {
   max-block-size: 4lh;
   overflow: hidden;
 }
-
-.videoDescription:not(.short) .description {
-  /* Putting the control below description when expanded without separating template code */
-  order: 0;
-}
diff --git a/src/renderer/components/WatchVideoDescription/WatchVideoDescription.vue b/src/renderer/components/WatchVideoDescription/WatchVideoDescription.vue
@@ -5,18 +5,7 @@
   >
     <template v-if="showControls">
       <span
-        v-if="showFullDescription"
-        class="descriptionStatus"
-        role="button"
-        tabindex="0"
-        @click="collapseDescription"
-        @keydown.space.prevent="collapseDescription"
-        @keydown.enter.prevent="collapseDescription"
-      >
-        {{ $t("Description.Collapse Description") }}
-      </span>
-      <span
-        v-else
+        v-if="!showFullDescription"
         class="descriptionStatus"
         role="button"
         tabindex="0"
@@ -35,6 +24,19 @@
       @timestamp-event="onTimestamp"
       @text-click="expandDescription"
     />
+    <template v-if="showControls">
+      <span
+        v-if="showFullDescription"
+        class="descriptionStatus"
+        role="button"
+        tabindex="0"
+        @click="collapseDescription"
+        @keydown.space.prevent="collapseDescription"
+        @keydown.enter.prevent="collapseDescription"
+      >
+        {{ $t("Description.Collapse Description") }}
+      </span>
+    </template>
   </FtCard>
 </template>