{{ $tc('User Playlists.AddVideoPrompt.N playlists selected', selectedPlaylistCount, {
@@ -73,6 +73,8 @@
/>
- - {{ extraLabel }} - -
-+ + {{ extraLabel }} + +
+ {
+ // Change thumbnail size to 35x35, as that's the size we display it
+ // so we don't need to download a bigger image (the default is 176x176)
+ channel.thumbnail = channel.thumbnail?.replace(/=s\d+/, '=s35')
+ })
+
subscriptions.sort((a, b) => {
return a.name?.toLowerCase().localeCompare(b.name?.toLowerCase(), this.locale)
})
diff --git a/src/renderer/components/theme-settings/theme-settings.js b/src/renderer/components/theme-settings/theme-settings.js
index 0d706a6a8d2d..c3ce1a61b998 100644
--- a/src/renderer/components/theme-settings/theme-settings.js
+++ b/src/renderer/components/theme-settings/theme-settings.js
@@ -27,8 +27,8 @@ export default defineComponent({
disableSmoothScrollingToggleValue: false,
showRestartPrompt: false,
restartPromptValues: [
- 'yes',
- 'no'
+ 'restart',
+ 'cancel'
],
baseThemeValues: [
'system',
@@ -41,7 +41,9 @@ export default defineComponent({
'hotPink',
'nordic',
'gruvboxDark',
- 'gruvboxLight'
+ 'gruvboxLight',
+ 'solarizedDark',
+ 'solarizedLight'
]
}
},
@@ -92,8 +94,8 @@ export default defineComponent({
restartPromptNames: function () {
return [
- this.$t('Yes'),
- this.$t('No')
+ this.$t('Yes, Restart'),
+ this.$t('Cancel')
]
},
@@ -109,7 +111,9 @@ export default defineComponent({
this.$t('Settings.Theme Settings.Base Theme.Hot Pink'),
this.$t('Settings.Theme Settings.Base Theme.Nordic'),
this.$t('Settings.Theme Settings.Base Theme.Gruvbox Dark'),
- this.$t('Settings.Theme Settings.Base Theme.Gruvbox Light')
+ this.$t('Settings.Theme Settings.Base Theme.Gruvbox Light'),
+ this.$t('Settings.Theme Settings.Base Theme.Solarized Dark'),
+ this.$t('Settings.Theme Settings.Base Theme.Solarized Light')
]
},
@@ -145,7 +149,7 @@ export default defineComponent({
handleSmoothScrolling: function (value) {
this.showRestartPrompt = false
- if (value === null || value === 'no') {
+ if (value === null || value === 'cancel') {
this.disableSmoothScrollingToggleValue = !this.disableSmoothScrollingToggleValue
return
}
diff --git a/src/renderer/components/top-nav/top-nav.js b/src/renderer/components/top-nav/top-nav.js
index f6b02d609ae2..8e9d2433c4f8 100644
--- a/src/renderer/components/top-nav/top-nav.js
+++ b/src/renderer/components/top-nav/top-nav.js
@@ -1,7 +1,6 @@
import { defineComponent } from 'vue'
import { mapActions } from 'vuex'
import FtInput from '../ft-input/ft-input.vue'
-import FtSearchFilters from '../ft-search-filters/ft-search-filters.vue'
import FtProfileSelector from '../ft-profile-selector/ft-profile-selector.vue'
import debounce from 'lodash.debounce'
@@ -15,15 +14,12 @@ export default defineComponent({
name: 'TopNav',
components: {
FtInput,
- FtSearchFilters,
FtProfileSelector
},
data: () => {
return {
component: this,
showSearchContainer: true,
- showFilters: false,
- searchFilterValueChanged: false,
historyIndex: 1,
isForwardOrBack: false,
isArrowBackwardDisabled: true,
@@ -84,6 +80,10 @@ export default defineComponent({
return this.$store.getters.getExpandSideBar
},
+ searchFilterValueChanged: function () {
+ return this.$store.getters.getSearchFilterValueChanged
+ },
+
forwardText: function () {
return this.$t('Forward')
},
@@ -216,9 +216,6 @@ export default defineComponent({
}
}
})
-
- // Close the filter panel
- this.showFilters = false
},
focusSearch: function () {
@@ -295,11 +292,6 @@ export default defineComponent({
toggleSearchContainer: function () {
this.showSearchContainer = !this.showSearchContainer
- this.showFilters = false
- },
-
- handleSearchFilterValueChanged: function (filterValueChanged) {
- this.searchFilterValueChanged = filterValueChanged
},
navigateHistory: function () {
@@ -354,14 +346,12 @@ export default defineComponent({
navigate: function (route) {
this.$router.push('/' + route)
},
- hideFilters: function () {
- this.showFilters = false
- },
updateSearchInputText: function (text) {
this.$refs.searchInput.updateInputData(text)
},
...mapActions([
'getYoutubeUrlInfo',
+ 'showSearchFilters'
])
}
})
diff --git a/src/renderer/components/top-nav/top-nav.scss b/src/renderer/components/top-nav/top-nav.scss
index ef62946c1e52..c5917b0a7070 100644
--- a/src/renderer/components/top-nav/top-nav.scss
+++ b/src/renderer/components/top-nav/top-nav.scss
@@ -21,10 +21,6 @@
inline-size: 100%;
z-index: 4;
- &:has(+ .sideNav + .routerView .floatingRefreshSection) {
- box-shadow: none;
- }
-
@media only screen and (width >= 961px) {
display: grid;
grid-template-columns: 1fr 440px 1fr;
@@ -36,6 +32,10 @@
@media only screen and (width <= 680px) {
position: fixed;
+
+ &:has(+ .sideNav + .routerView .floatingRefreshSection) {
+ box-shadow: none;
+ }
}
}
@@ -89,15 +89,17 @@
}
.navFilterIcon {
- $effect-distance: 10px;
+ $effect-distance: 20px;
margin-inline-start: $effect-distance;
&.filterChanged {
box-shadow: 0 0 $effect-distance var(--primary-color);
+ color: var(--primary-color);
@include top-nav-is-colored {
box-shadow: 0 0 $effect-distance var(--text-with-main-color);
+ color: var(--text-with-main-color);
}
}
}
@@ -209,18 +211,4 @@
flex: 1;
}
}
-
- .searchFilters {
- inset-inline: 0;
- margin-block: 10px 20px;
- margin-inline: 220px 20px;
- position: absolute;
- transition: margin 150ms ease-in-out;
-
- @media only screen and (width <= 680px) {
- inset-inline: 0;
- margin-block: 95px 0;
- margin-inline: 10px;
- }
- }
}
diff --git a/src/renderer/components/top-nav/top-nav.vue b/src/renderer/components/top-nav/top-nav.vue
index 69a54ab70355..ca023d47795b 100644
--- a/src/renderer/components/top-nav/top-nav.vue
+++ b/src/renderer/components/top-nav/top-nav.vue
@@ -94,18 +94,13 @@
class="navFilterIcon navIcon"
:class="{ filterChanged: searchFilterValueChanged }"
:icon="['fas', 'filter']"
+ :title="$t('Search Filters.Search Filters')"
role="button"
tabindex="0"
- @click="showFilters = !showFilters"
- @keydown.enter.prevent="showFilters = !showFilters"
+ @click="showSearchFilters"
+ @keydown.enter.prevent="showSearchFilters"
/>
-
${this.$t('About.Licensed under the AGPLv3')} ${this.$t('About.View License')}`
+ content: `GitHub: FreeTubeApp/FreeTube
${this.$t('About.Licensed under the')} ${this.$t('About.AGPLv3')}`
},
{
icon: ['fas', 'file-download'],
diff --git a/src/renderer/views/Channel/Channel.js b/src/renderer/views/Channel/Channel.js
index 5cbf0a037a04..98a34a3b992a 100644
--- a/src/renderer/views/Channel/Channel.js
+++ b/src/renderer/views/Channel/Channel.js
@@ -16,6 +16,7 @@ import autolinker from 'autolinker'
import {
setPublishedTimestampsInvidious,
copyToClipboard,
+ ctrlFHandler,
extractNumberFromString,
formatNumber,
showToast,
@@ -435,6 +436,7 @@ export default defineComponent({
},
mounted: function () {
this.isLoading = true
+ document.addEventListener('keydown', this.keyboardShortcutHandler)
if (this.$route.query.url) {
this.resolveChannelUrl(this.$route.query.url, this.$route.params.currentTab)
@@ -461,6 +463,9 @@ export default defineComponent({
})
}
},
+ beforeDestroy() {
+ document.removeEventListener('keydown', this.keyboardShortcutHandler)
+ },
methods: {
resolveChannelUrl: async function (url, tab = undefined) {
let id
@@ -1951,6 +1956,10 @@ export default defineComponent({
})
},
+ keyboardShortcutHandler: function (event) {
+ ctrlFHandler(event, this.$refs.channelSearchBar)
+ },
+
getIconForSortPreference: (s) => getIconForSortPreference(s),
...mapActions([
diff --git a/src/renderer/views/Channel/Channel.vue b/src/renderer/views/Channel/Channel.vue
index e2ce0bc85b6e..4e0bda32f6c9 100644
--- a/src/renderer/views/Channel/Channel.vue
+++ b/src/renderer/views/Channel/Channel.vue
@@ -1,7 +1,5 @@
-