Merge branch 'FreeTubeApp:development' into development

src/renderer/components/ft-list-channel/ft-list-channel.js

@@ -1,10 +1,14 @@
 import { defineComponent } from 'vue'
+import FtSubscribeButton from '../../components/ft-subscribe-button/ft-subscribe-button.vue'
 import { youtubeImageUrlToInvidious } from '../../helpers/api/invidious'
 import { formatNumber } from '../../helpers/utils'
 import { parseLocalSubscriberCount } from '../../helpers/api/local'
 
 export default defineComponent({
   name: 'FtListChannel',
+  components: {
+    'ft-subscribe-button': FtSubscribeButton
+  },
   props: {
     data: {
       type: Object,

src/renderer/components/ft-list-channel/ft-list-channel.vue

@@ -10,6 +10,7 @@
     <div class="channelThumbnail">
       <router-link
         :to="`/channel/${id}`"
+        class="channelThumbnailLink"
         tabindex="-1"
         aria-hidden="true"
       >
@@ -20,42 +21,50 @@
         >
       </router-link>
     </div>
-    <div class="info">
-      <router-link
-        class="title"
-        :to="`/channel/${id}`"
-      >
-        <h3 class="h3Title">
-          {{ channelName }}
-        </h3>
-      </router-link>
-      <div class="infoLine">
+    <div class="infoAndSubscribe">
+      <div class="info">
         <router-link
-          v-if="handle !== null"
-          class="handle"
+          class="title"
           :to="`/channel/${id}`"
         >
-          {{ handle }}
+          <h3 class="h3Title">
+            {{ channelName }}
+          </h3>
         </router-link>
-        <span
-          v-if="subscriberCount !== null && !hideChannelSubscriptions"
-          class="subscriberCount"
-        >
-          <template v-if="handle !== null"> • </template>
-          {{ $tc('Global.Counts.Subscriber Count', subscriberCount, {count: formattedSubscriberCount}) }}
-        </span>
-        <span
-          v-if="handle == null && videoCount != null"
-          class="videoCount"
-        >
-          <template v-if="subscriberCount !== null && !hideChannelSubscriptions"> • </template>
-          {{ $tc('Global.Counts.Video Count', videoCount, {count: formattedVideoCount}) }}
-        </span>
+        <div class="infoLine">
+          <router-link
+            v-if="handle !== null"
+            class="handle"
+            :to="`/channel/${id}`"
+          >
+            {{ handle }}
+          </router-link>
+          <span
+            v-if="subscriberCount !== null && !hideChannelSubscriptions"
+            class="subscriberCount"
+          >
+            <template v-if="handle !== null"> • </template>
+            {{ $tc('Global.Counts.Subscriber Count', subscriberCount, {count: formattedSubscriberCount}) }}
+          </span>
+          <span
+            v-if="handle == null && videoCount != null"
+            class="videoCount"
+          >
+            <template v-if="subscriberCount !== null && !hideChannelSubscriptions"> • </template>
+            {{ $tc('Global.Counts.Video Count', videoCount, {count: formattedVideoCount}) }}
+          </span>
+        </div>
+        <p
+          v-if="listType !== 'grid'"
+          class="description"
+          v-html="description"
+        />
       </div>
-      <p
-        v-if="listType !== 'grid'"
-        class="description"
-        v-html="description"
+      <ft-subscribe-button
+        class="channelSubscribeButton"
+        :channel-id="id"
+        :channel-name="channelName"
+        :channel-thumbnail="thumbnail"
       />
     </div>
   </div>

src/renderer/components/ft-list-hashtag/ft-list-hashtag.vue

@@ -9,6 +9,7 @@
   >
     <div class="channelThumbnail">
       <router-link
+        class="channelThumbnailLink"
         tabindex="-1"
         aria-hidden="true"
         :to="url"

src/renderer/components/ft-list-playlist/ft-list-playlist.vue

@@ -1,8 +1,11 @@
 <template>
   <div
     class="ft-list-video ft-list-item"
-    :appearance="appearance"
-    :class="{ list: listType === 'list', grid: listType === 'grid' }"
+    :class="{
+      [appearance]: true,
+      list: listType === 'list',
+      grid: listType === 'grid'
+    }"
   >
     <div
       class="videoThumbnail"

src/renderer/components/ft-list-video/ft-list-video.vue

@@ -121,7 +121,8 @@
         @click="handleOptionsClick"
       />
       <p
-        v-if="listType !== 'grid' && appearance === 'result'"
+        v-if="((listType === 'list' || forceListType === 'list') && forceListType !== 'grid') &&
+          appearance === 'result'"
         class="description"
         v-html="description"
       />

src/renderer/scss-partials/_ft-list-item.scss

@@ -170,6 +170,7 @@ $watched-transition-duration: 0.5s;
       font-size: 20px;
       justify-self: end;
       inline-size: 60px;
+      pointer-events: none;
 
       .background {
         background-color: var(--bg-color);
@@ -191,9 +192,14 @@ $watched-transition-duration: 0.5s;
     display: flex;
     justify-content: center;
 
-    .channelImage {
-      border-radius: 50%;
-      block-size: 130px;
+    .channelThumbnailLink {
+      inline-size: 100%;
+      text-align: center;
+
+      .channelImage {
+        border-radius: 50%;
+        block-size: 130px;
+      }
     }
   }
 
@@ -201,6 +207,7 @@ $watched-transition-duration: 0.5s;
     align-content: flex-start;
     display: grid;
     flex: 1;
+    min-inline-size: 10em;
     grid-template:
       'title optionsExternalButton' auto
       'infoLine optionsExternalButton' auto
@@ -268,13 +275,38 @@ $watched-transition-duration: 0.5s;
       }
     }
 
+    &.result {
+      .videoThumbnail,
+      .channelThumbnailLink,
+      .thumbnailLink,
+      .thumbnailImage {
+        inline-size: 336px;
+        max-inline-size: 25vw;
+
+        @media only screen and (max-width: 680px) {
+          max-inline-size: 30vw;
+        }
+      }
+
+      .channelImage {
+        max-inline-size: 25vw;
+        max-block-size: 25vw;
+
+        @media only screen and (max-width: 680px) {
+          max-inline-size: 30vw;
+          max-block-size: 30vw;
+        }
+      }
+    }
+
+
     .videoThumbnail,
     .channelThumbnail {
       margin-inline-end: 20px;
     }
 
-    .channelThumbnail {
-      inline-size: 231px;
+    .info .description {
+      margin-inline-end: 10px;
     }
   }
 
@@ -289,10 +321,10 @@ $watched-transition-duration: 0.5s;
     .videoThumbnail,
     .channelThumbnail {
       margin-block-end: 12px;
+    }
 
-      .thumbnailImage {
-        inline-size: 100%;
-      }
+    .thumbnailImage, .channelThumbnail {
+      inline-size: 100%;
     }
 
     .title {
@@ -336,6 +368,45 @@ $watched-transition-duration: 0.5s;
   }
 }
 
+.ft-list-channel {
+  .infoAndSubscribe {
+    display: flex;
+    flex-flow: row wrap;
+    justify-content: center;
+    inline-size: 100%;
+  }
+
+  &.grid {
+    align-items: center;
+    text-align: center;
+
+    .infoAndSubscribe {
+      flex-flow: column wrap;
+      align-items: center;
+
+      .info {
+        margin-block-end: 12px;
+
+        .infoLine {
+          text-align: center;
+        }
+      }
+    }
+  }
+
+  &.list {
+    .infoAndSubscribe {
+      flex-flow: row wrap;
+      justify-content: center;
+
+      .channelSubscribeButton {
+        margin-block: auto;
+        margin-inline: 7px;
+      }
+    }
+  }
+}
+
 .videoWatched,
 .live,
 .upcoming {

src/renderer/views/Playlist/Playlist.css

@@ -45,10 +45,6 @@
   margin-block-end: auto;
 }
 
-:deep(.thumbnailImage) {
-  max-inline-size: 25vw;
-}
-
 @media only screen and (max-width: 850px) {
   .routerView {
     flex-direction: column;
@@ -66,8 +62,4 @@
     box-sizing: border-box;
     inline-size: 100%;
   }
-
-  :deep(.thumbnailImage) {
-    max-inline-size: 35vw;
-  }
 }

static/locales/cs.yaml

@@ -327,6 +327,8 @@ Settings:
     Fetch Feeds from RSS: 'Načíst kanály z RSS'
     Manage Subscriptions: 'Spravovat odebírané kanály'
     Fetch Automatically: Automaticky načítat odběry
+    Only Show Latest Video for Each Channel: U každého kanálu zobrazit pouze nejnovější
+      video
   Distraction Free Settings:
     Distraction Free Settings: 'Nastavení rozptylování'
     Hide Video Views: 'Skrýt počet přehrání videa'
@@ -512,6 +514,7 @@ Settings:
     Set Password To Prevent Access: Nastavte heslo, abyste zabránili přístupu k nastavení
     Remove Password: Odebrat heslo
     Set Password: Nastavit heslo
+  Expand All Settings Sections: Rozbalit všechny sekce nastavení
 About:
   #On About page
   About: 'O aplikaci'
@@ -614,6 +617,9 @@ Profile:
   Toggle Profile List: Přepnout seznam profilů
   Open Profile Dropdown: Otevřít rozbalovací nabídku profilu
   Close Profile Dropdown: Zavřít rozbalovací nabídku profilu
+  Profile Name: Jméno profilu
+  Edit Profile Name: Upravit jméno profilu
+  Create Profile Name: Vytvořit jméno profilu
 Channel:
   Subscribe: 'Odebírat'
   Unsubscribe: 'Zrušit odběr'

static/locales/is.yaml

@@ -332,6 +332,8 @@ Settings:
     Fetch Feeds from RSS: 'Ná í streymi úr RSS'
     Manage Subscriptions: 'Sýsla með áskriftir'
     Fetch Automatically: Sækja streymi sjálfvirkt
+    Only Show Latest Video for Each Channel: Aðeins birta nýjasta myndskeið fyrir
+      hverja myndskeiðarás
   Distraction Free Settings:
     Distraction Free Settings: 'Truflanaminnkandi stillingar'
     Hide Video Views: 'Fela fjölda áhorfa á myndskeið'
@@ -371,6 +373,13 @@ Settings:
     Blur Thumbnails: Móska smámyndir
     Hide Profile Pictures in Comments: Fela auðkennismyndir í athugasemdum
     Hide Subscriptions Community: Fela samfélag áskrifenda
+    Hide Channels Invalid: Uppgefið auðkenni rásar er ógilt
+    Hide Channels Disabled Message: Sumar rásir voru útilokaðar út frá auðkenni og
+      voru ekki meðhöndlaðar. Lokað er á eiginleikann á meðan verið er að uppfæra
+      þessi auðkenni
+    Hide Channels Already Exists: Auðkenni rásar er þegar til
+    Hide Channels API Error: Villa við að ná í notanda með uppgefið auðkenni. Athugaðu
+      aftur hvort auðkennið ré rétt.
   Data Settings:
     Data Settings: 'Stillingar gagna'
     Select Import Type: 'Veldu tegund innflutnings'
@@ -486,6 +495,7 @@ Settings:
     Set Password: Setja lykilorð
     Remove Password: Fjarlægja lykilorð
     Password Settings: Stillingar lykilorðs
+  Expand All Settings Sections: Fletta út öllum stillingahlutum
 About:
   #On About page
   About: 'Um hugbúnaðinn'
@@ -561,6 +571,11 @@ Profile:
 #On Channel Page
   Profile Settings: Stillingar notkunarsniðs
   Toggle Profile List: Víxla lista með notkunarsniðum af/á
+  Profile Name: Heiti notkunarsniðs
+  Edit Profile Name: Breyta heiti notkunarsniðs
+  Create Profile Name: Útbúa heiti á notkunarsnið
+  Open Profile Dropdown: Opna fellivalmynd notkunarsniðs
+  Close Profile Dropdown: Loka fellivalmynd notkunarsniðs
 Channel:
   Subscribe: 'Gerast áskrifandi'
   Unsubscribe: 'Segja upp áskrift'
@@ -1006,3 +1021,5 @@ Playlist will pause when current video is finished: Spilunarlisti mun fara í bi
 Playlist will not pause when current video is finished: Spilunarlisti mun ekki fara
   í bið eftir að núverandi myndskeið klárast
 Go to page: Fara á {page}
+Channel Hidden: '{channel} bætt við rásasíu'
+Channel Unhidden: '{channel} fjarlægt úr rásasíu'

static/locales/pl.yaml

@@ -313,6 +313,8 @@ Settings:
     How do I import my subscriptions?: 'Jak zaimportować swoje subskrypcje?'
     Fetch Feeds from RSS: Pobierz subskrypcje z RSS
     Fetch Automatically: Automatycznie odświeżaj subskrypcje
+    Only Show Latest Video for Each Channel: Pokaż tylko najnowszy film z każdego
+      kanału
   Advanced Settings:
     Advanced Settings: 'Ustawienia zaawansowane'
     Enable Debug Mode (Prints data to the console): 'Włącz tryb dubugowania (pokazuje
@@ -525,6 +527,7 @@ Settings:
     Set Password To Prevent Access: Ustaw hasło, aby zabezpieczyć dostęp do ustawień
     Set Password: Ustaw hasło
     Remove Password: Usuń hasło
+  Expand All Settings Sections: Rozwiń wszystkie sekcje ustawień
 About:
   #On About page
   About: 'O projekcie'
@@ -943,6 +946,9 @@ Profile:
   Toggle Profile List: Włącz/wyłącz listę profili
   Open Profile Dropdown: Otwórz rozwijane menu profilu
   Close Profile Dropdown: Zamknij rozwijane menu profilu
+  Profile Name: Nazwa profilu
+  Edit Profile Name: Edytuj nazwę profilu
+  Create Profile Name: Nadaj nazwę profilowi
 The playlist has been reversed: Playlista została odwrócona
 A new blog is now available, {blogTitle}. Click to view more: 'Nowy wpis na blogu
   jest dostępny, {blogTitle}. Kliknij, aby zobaczyć więcej'