From e832f22c6f6267894c2c68c70b4ac9dea0235808 Mon Sep 17 00:00:00 2001 From: absidue <48293849+absidue@users.noreply.github.com> Date: Thu, 7 Sep 2023 05:43:27 +0200 Subject: [PATCH 001/176] Default theatre mode no sidebar (#3981) * Revert "! Fix watch page layout when theatre mode enabled and sidebar "hidden" (#3931)" This reverts commit 621cc279385f5f37db63643de3f8182930b10b6e. * Fix the watch page layout when the sidebar is hidden and theatre mode mode is enabled by default * Do not use theatre mode while loading --- src/renderer/views/Watch/Watch.js | 2 +- src/renderer/views/Watch/Watch.scss | 12 +----------- src/renderer/views/Watch/Watch.vue | 2 +- 3 files changed, 3 insertions(+), 13 deletions(-) diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js index 507a45384b37f..236bfdec07235 100644 --- a/src/renderer/views/Watch/Watch.js +++ b/src/renderer/views/Watch/Watch.js @@ -240,7 +240,7 @@ export default defineComponent({ mounted: function () { this.videoId = this.$route.params.id this.activeFormat = this.defaultVideoFormat - this.useTheatreMode = this.defaultTheatreMode + this.useTheatreMode = this.defaultTheatreMode && this.theatrePossible this.checkIfPlaylist() this.checkIfTimestamp() diff --git a/src/renderer/views/Watch/Watch.scss b/src/renderer/views/Watch/Watch.scss index 180f443d7f292..90e5360a4993f 100644 --- a/src/renderer/views/Watch/Watch.scss +++ b/src/renderer/views/Watch/Watch.scss @@ -3,17 +3,7 @@ } @mixin theatre-mode-template { - grid-template: 'video video video' auto - 'info info sidebar' auto - 'info info sidebar' auto / 1fr 1fr 1fr; - - // When there is no sidebar (but the empty container element still exists) - // The info element need to be expanded with following rule(s) - @at-root .videoLayout.noSidebar { - grid-template: 'video video video' auto - 'info info info' auto - 'info info info' auto / 1fr 1fr 1fr; - } + grid-template: 'video video video' auto 'info info sidebar' auto 'info info sidebar' auto / 1fr 1fr 1fr; } @mixin single-column-template { diff --git a/src/renderer/views/Watch/Watch.vue b/src/renderer/views/Watch/Watch.vue index 380321cf9e74a..7fafe72915510 100644 --- a/src/renderer/views/Watch/Watch.vue +++ b/src/renderer/views/Watch/Watch.vue @@ -3,7 +3,7 @@ class="videoLayout" :class="{ isLoading, - useTheatreMode, + useTheatreMode: useTheatreMode && !isLoading, noSidebar: !theatrePossible }" > From 704e34418ffdce803fdbd5c6bf179861f6d222d1 Mon Sep 17 00:00:00 2001 From: Eric Date: Thu, 7 Sep 2023 03:59:09 +0000 Subject: [PATCH 002/176] Translated using Weblate (Chinese (Simplified)) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/zh_Hans/ --- static/locales/zh-CN.yaml | 3 +++ 1 file changed, 3 insertions(+) diff --git a/static/locales/zh-CN.yaml b/static/locales/zh-CN.yaml index 31af1c966e661..f6f76aedbc96f 100644 --- a/static/locales/zh-CN.yaml +++ b/static/locales/zh-CN.yaml @@ -701,6 +701,7 @@ Video: Show Super Chat Comment: 显示超级聊天评论 Upcoming: 即将到来 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': 实时聊天对此音视频流不可用。上传者可能禁用了它。 + Pause on Current Video: 当前视频播完后不自动播放列表中下一视频 Videos: #& Sort By Sort By: @@ -920,3 +921,5 @@ Ok: 好 Hashtag: Hashtag: 话题标签 This hashtag does not currently have any videos: 此话题标签下当前没有任何短视频 +Playlist will pause when current video is finished: 当前视频播完后播放列表会暂停 +Playlist will not pause when current video is finished: 当前视频播完后播放列表不会暂停 From 33f415f8ef8975bb78a025ae70a829c40fc1974e Mon Sep 17 00:00:00 2001 From: Retrial Date: Thu, 7 Sep 2023 01:35:03 +0000 Subject: [PATCH 003/176] Translated using Weblate (Greek) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/el/ --- static/locales/el.yaml | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/static/locales/el.yaml b/static/locales/el.yaml index 675e7d5bc80d3..44c4cb3b8a19b 100644 --- a/static/locales/el.yaml +++ b/static/locales/el.yaml @@ -836,6 +836,7 @@ Video: 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': "Η Zωντανή συνομιλία δεν είναι διαθέσιμη για αυτήν τη ροή.\nΜπορεί να έχει απενεργοποιηθεί από τον χρήστη." + Pause on Current Video: Παύση στο Τρέχον Βίντεο Videos: #& Sort By Sort By: @@ -1086,3 +1087,7 @@ Hashtag: Hashtag: Hashtag This hashtag does not currently have any videos: Αυτό το hashtag δεν έχει προς το παρόν κανένα βίντεο +Playlist will pause when current video is finished: Η Λίστα Αναπαραγωγής θα σταματήσει + όταν ολοκληρωθεί το τρέχον βίντεο +Playlist will not pause when current video is finished: Η Λίστα Αναπαραγωγής δεν θα + σταματήσει όταν ολοκληρωθεί το τρέχον βίντεο From 4485e70125188844eed42e3d51ae21cc503da386 Mon Sep 17 00:00:00 2001 From: bittin1ddc447d824349b2 Date: Thu, 7 Sep 2023 02:27:36 +0000 Subject: [PATCH 004/176] Translated using Weblate (Swedish) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/sv/ --- static/locales/sv.yaml | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/static/locales/sv.yaml b/static/locales/sv.yaml index 75721e0b85d20..4da709084951f 100644 --- a/static/locales/sv.yaml +++ b/static/locales/sv.yaml @@ -790,6 +790,7 @@ Video: Scroll to Bottom: Skrolla till botten 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': Livechatt är inte tillgängligt för den här strömmen. Den kan ha inaktiverats av uppladdaren. + Pause on Current Video: Pausa på aktuell video Videos: #& Sort By Sort By: @@ -1012,3 +1013,7 @@ Hashtag: Hashtag: Hashtaggar This hashtag does not currently have any videos: Den här hashtaggen har för närvarande inga videor +Playlist will pause when current video is finished: Spellistan pausas när den aktuella + videon är klar +Playlist will not pause when current video is finished: Spellistan kommer inte att + pausas när den aktuella videon är klar From e9cad447142ed4a3eaffdc37eb2c4210ece6eeaf Mon Sep 17 00:00:00 2001 From: Yaron Shahrabani Date: Thu, 7 Sep 2023 03:20:24 +0000 Subject: [PATCH 005/176] Translated using Weblate (Hebrew) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/he/ --- static/locales/he.yaml | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/static/locales/he.yaml b/static/locales/he.yaml index 425a15770f3bf..0f360369d08cc 100644 --- a/static/locales/he.yaml +++ b/static/locales/he.yaml @@ -792,6 +792,7 @@ Video: Upcoming: בקרוב 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': הצ׳אט לא זמין לשידור הזה. יכול להיות שהוא הושבת על ידי המעלה. + Pause on Current Video: השהייה על הסרטון הנוכחי Videos: #& Sort By Sort By: @@ -1002,3 +1003,7 @@ Ok: אישור Hashtag: This hashtag does not currently have any videos: לתגית ההקבץ הזו אין סרטונים כרגע Hashtag: תגית הקבץ +Playlist will pause when current video is finished: רשימת הנגינה תושהה עם סיום הסרטון + הנוכחי +Playlist will not pause when current video is finished: רשימת הנגינה לא תושהה עם סיום + הסרטון הנוכחי From 81b8523a57136a0ca45982f941dfa17e4c05a65b Mon Sep 17 00:00:00 2001 From: Sameer Sharma <100503303+capecrusader-121@users.noreply.github.com> Date: Thu, 7 Sep 2023 12:48:05 +0530 Subject: [PATCH 006/176] Update Snap Information (#4006) New store name + manifest location updated. --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 8c538e9df15a0..c5b532b939a85 100644 --- a/README.md +++ b/README.md @@ -97,7 +97,7 @@ These builds are maintained by the community. While they should be safe, downloa * Scoop (Windows Only): [Usage](https://github.com/ScoopInstaller/Scoop) -* Snap: [Download](https://snapcraft.io/freetube-snap) and [Source Code](https://launchpad.net/freetube) +* Snap: [Download](https://snapcraft.io/freetube) and [Source Code](https://git.launchpad.net/freetube) * Windows Package Manager (winget): [Usage](https://docs.microsoft.com/en-us/windows/package-manager/winget/) From 51eb5790cb6c664858c05a250fd5a76086e5c346 Mon Sep 17 00:00:00 2001 From: Jeff Huang Date: Thu, 7 Sep 2023 06:15:18 +0000 Subject: [PATCH 007/176] Translated using Weblate (Chinese (Traditional)) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/zh_Hant/ --- static/locales/zh-TW.yaml | 3 +++ 1 file changed, 3 insertions(+) diff --git a/static/locales/zh-TW.yaml b/static/locales/zh-TW.yaml index 08bd3032d3930..0d848431290ed 100644 --- a/static/locales/zh-TW.yaml +++ b/static/locales/zh-TW.yaml @@ -710,6 +710,7 @@ Video: Scroll to Bottom: 捲動至底部 Upcoming: 即將到來 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': 即時聊天在此串流不可用。其可能被上傳者停用了。 + Pause on Current Video: 暫停目前影片 Videos: #& Sort By Sort By: @@ -929,3 +930,5 @@ Ok: 確定 Hashtag: Hashtag: 主題標籤 This hashtag does not currently have any videos: 此標籤目前沒有任何影片 +Playlist will pause when current video is finished: 當目前影片結束時,播放清單將會暫停 +Playlist will not pause when current video is finished: 當目前影片結束時,播放清單將不會暫停 From feb6ae6f942b6ce395ad0121f27c0dcc7da57762 Mon Sep 17 00:00:00 2001 From: Carlos Luiz Date: Thu, 7 Sep 2023 13:05:29 +0000 Subject: [PATCH 008/176] Translated using Weblate (Portuguese (Brazil)) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/pt_BR/ --- static/locales/pt-BR.yaml | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/static/locales/pt-BR.yaml b/static/locales/pt-BR.yaml index 8ee4e8303e428..e6cca13ff7fd6 100644 --- a/static/locales/pt-BR.yaml +++ b/static/locales/pt-BR.yaml @@ -177,6 +177,8 @@ Settings: Dracula: 'Drácula' System Default: Padrão do sistema Catppuccin Mocha: Catppuccin Mocha + Pastel Pink: Rosa Pastel + Hot Pink: Rosa Choque Main Color Theme: Main Color Theme: 'Cor principal' Red: 'Vermelha' @@ -771,6 +773,7 @@ Video: 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': O bate-papo ao vivo não está disponível para esta transmissão. Pode ter sido desativado pelo responsável. + Pause on Current Video: Pausar no vídeo atual Videos: #& Sort By Sort By: @@ -1056,3 +1059,7 @@ Hashtag: This hashtag does not currently have any videos: Esta hashtag não tem atualmente nenhum vídeo Hashtag: Hashtag +Playlist will pause when current video is finished: Lista de reprodução será pausada + quando vídeo atual terminar +Playlist will not pause when current video is finished: Lista de reprodução não será + pausada quando vídeo atual terminar From 3807ae618e4033743208011b837959cab139254b Mon Sep 17 00:00:00 2001 From: Ihor Hordiichuk Date: Thu, 7 Sep 2023 12:48:09 +0000 Subject: [PATCH 009/176] Translated using Weblate (Ukrainian) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/uk/ --- static/locales/uk.yaml | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/static/locales/uk.yaml b/static/locales/uk.yaml index 73beba12ab576..d568bffd48cef 100644 --- a/static/locales/uk.yaml +++ b/static/locales/uk.yaml @@ -749,6 +749,7 @@ Video: Upcoming: Незабаром 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': Спілкування наживо недоступне для цієї трансляції. Можливо, вивантажувач вимкнув його. + Pause on Current Video: Призупинити на поточному відео Videos: #& Sort By Sort By: @@ -983,3 +984,7 @@ Ok: Гаразд Hashtag: Hashtag: Хештег This hashtag does not currently have any videos: За цим хештегом наразі немає відео +Playlist will pause when current video is finished: Добірка призупиняється, коли поточне + відео завершено +Playlist will not pause when current video is finished: Добірка не призупиняється, + коли поточне відео завершено From b9dcb9615d9a03f75546fd8b82d6ee8497ea7a54 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?O=C4=9Fuz=20Ersen?= Date: Thu, 7 Sep 2023 16:34:14 +0000 Subject: [PATCH 010/176] Translated using Weblate (Turkish) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/tr/ --- static/locales/tr.yaml | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/static/locales/tr.yaml b/static/locales/tr.yaml index 47030119451be..96818ac0acd87 100644 --- a/static/locales/tr.yaml +++ b/static/locales/tr.yaml @@ -820,6 +820,7 @@ Video: 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': Canlı sohbet bu yayın için kullanılamıyor. Yükleyen tarafından devre dışı bırakılmış olabilir. + Pause on Current Video: Geçerli Videoda Duraklat Videos: #& Sort By Sort By: @@ -1051,3 +1052,7 @@ Hashtag: Hashtag: Hashtag This hashtag does not currently have any videos: Bu hashtag'in şu anda herhangi bir videosu yok +Playlist will pause when current video is finished: Geçerli video bittiğinde oynatma + listesi duraklatılacak +Playlist will not pause when current video is finished: Geçerli video bittiğinde oynatma + listesi duraklatılmayacak From 508c2de20e0b55097a052d1953ec228ea60e0544 Mon Sep 17 00:00:00 2001 From: Fjuro Date: Thu, 7 Sep 2023 17:57:46 +0000 Subject: [PATCH 011/176] Translated using Weblate (Czech) Currently translated at 99.7% (715 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/cs/ --- static/locales/cs.yaml | 1 + 1 file changed, 1 insertion(+) diff --git a/static/locales/cs.yaml b/static/locales/cs.yaml index 7fb6701a4e026..458735fb6e241 100644 --- a/static/locales/cs.yaml +++ b/static/locales/cs.yaml @@ -794,6 +794,7 @@ Video: Upcoming: Nadcházející 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': Živý chat není pro tento stream k dispozici. Je možné, že byl vypnut nahrávajícím. + Pause on Current Video: Pozastavit na současném videu Videos: #& Sort By Sort By: From fe332eeb9b28cbaf32b7ec131638ef9ae690a9b8 Mon Sep 17 00:00:00 2001 From: Fjuro Date: Thu, 7 Sep 2023 17:58:44 +0000 Subject: [PATCH 012/176] Translated using Weblate (Czech) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/cs/ --- static/locales/cs.yaml | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/static/locales/cs.yaml b/static/locales/cs.yaml index 458735fb6e241..9015527aa22b7 100644 --- a/static/locales/cs.yaml +++ b/static/locales/cs.yaml @@ -1021,3 +1021,7 @@ Ok: Ok Hashtag: Hashtag: Hashtag This hashtag does not currently have any videos: Tento hashtag nemá žádná videa +Playlist will pause when current video is finished: Po přehrání aktuálního videa bude + playlist pozastaven +Playlist will not pause when current video is finished: Po přehrání aktuálního videa + nebude playlist pozastaven From f60f262c20e2f2fd8f6716c19868ead16b866ee5 Mon Sep 17 00:00:00 2001 From: Rusi Dimitrov Date: Thu, 7 Sep 2023 19:56:42 +0000 Subject: [PATCH 013/176] Translated using Weblate (Bulgarian) Currently translated at 99.0% (710 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/bg/ --- static/locales/bg.yaml | 1 + 1 file changed, 1 insertion(+) diff --git a/static/locales/bg.yaml b/static/locales/bg.yaml index 2edf120a2814e..e98c43ac82999 100644 --- a/static/locales/bg.yaml +++ b/static/locales/bg.yaml @@ -154,6 +154,7 @@ Settings: Beginning: 'Начало на видео' Middle: 'Среда на видео' End: 'Край на видео' + Hidden: Скрити 'Invidious Instance (Default is https://invidious.snopyta.org)': 'Излед на Invidious (по подразбиране е https://invidious.snopyta.org)' Region for Trending: 'Регион за набиращи популярност' From b4539094416eb9fb7de6f3d47638f4152372fd33 Mon Sep 17 00:00:00 2001 From: Kyotaro Iijima Date: Thu, 7 Sep 2023 21:02:17 +0000 Subject: [PATCH 014/176] Translated using Weblate (Japanese) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/ja/ --- static/locales/ja.yaml | 3 +++ 1 file changed, 3 insertions(+) diff --git a/static/locales/ja.yaml b/static/locales/ja.yaml index 6d9d1f17cfbc8..a931a0745b8c1 100644 --- a/static/locales/ja.yaml +++ b/static/locales/ja.yaml @@ -707,6 +707,7 @@ Video: Scroll to Bottom: 下までスクロール Upcoming: 今後の配信予定 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': この配信ではライブチャットは使用できません。配信者によって無効に設定されているようです。 + Pause on Current Video: 現在の動画の一時停止 Videos: #& Sort By Sort By: @@ -933,3 +934,5 @@ Ok: OK Hashtag: Hashtag: ハッシュタグ This hashtag does not currently have any videos: このハッシュタグには現在動画がありません +Playlist will pause when current video is finished: 現在のビデオが終了すると、プレイリストは停止します +Playlist will not pause when current video is finished: 現在のビデオが終了しても、プレイリストは停止しません From 87f83cfdafbc7714d7471bf7670464c77dcf1ae6 Mon Sep 17 00:00:00 2001 From: Rex_sa Date: Thu, 7 Sep 2023 22:52:19 +0000 Subject: [PATCH 015/176] Translated using Weblate (Arabic) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/ar/ --- static/locales/ar.yaml | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/static/locales/ar.yaml b/static/locales/ar.yaml index 32fbc940f4385..55c89c8ed26a1 100644 --- a/static/locales/ar.yaml +++ b/static/locales/ar.yaml @@ -799,6 +799,7 @@ Video: Upcoming: القادمة 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': الدردشة المباشرة غير متاحة لهذا البث. ربما تم تعطيلها من قبل القائم بالتحميل. + Pause on Current Video: توقف مؤقتًا على الفيديو الحالي Videos: #& Sort By Sort By: @@ -1020,3 +1021,7 @@ Hashtag: This hashtag does not currently have any videos: هذا الهاشتاج ليس لديه حاليا أي مقاطع فيديو Hashtag: هاشتاج +Playlist will pause when current video is finished: ستتوقف قائمة التشغيل مؤقتًا عند + انتهاء الفيديو الحالي +Playlist will not pause when current video is finished: لن تتوقف قائمة التشغيل مؤقتًا + عند انتهاء الفيديو الحالي From fb575e563bd1bdaaf088031bcb366e09965e67a3 Mon Sep 17 00:00:00 2001 From: Rusi Dimitrov Date: Thu, 7 Sep 2023 19:59:57 +0000 Subject: [PATCH 016/176] Translated using Weblate (Bulgarian) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/bg/ --- static/locales/bg.yaml | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/static/locales/bg.yaml b/static/locales/bg.yaml index e98c43ac82999..925f9f260a265 100644 --- a/static/locales/bg.yaml +++ b/static/locales/bg.yaml @@ -187,6 +187,8 @@ Settings: Dracula: Dracula System Default: Стандартна за системата Catppuccin Mocha: Catppuccin Mocha + Pastel Pink: Пастелно розово + Hot Pink: Горещо розово Main Color Theme: Main Color Theme: 'Основна цветова тема' Red: 'Червено' @@ -430,6 +432,8 @@ Settings: Hide Subscriptions Shorts: Скриване на кратките видеа в абонаментите Hide Subscriptions Live: Скриване на абонаментите на живо Hide Channel Podcasts: Скриване на подкастите на канала + Blur Thumbnails: Размазване на миниатюрите + Hide Profile Pictures in Comments: Скриване на профилните снимки в коментарите The app needs to restart for changes to take effect. Restart and apply change?: Приложението трябва да се рестартира за да се приложат промените. Рестартиране? Proxy Settings: @@ -814,6 +818,7 @@ Video: Upcoming: Предстои 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': Чатът на живо не е наличен за този поток. Възможно е да е бил деактивиран от качващия. + Pause on Current Video: Пауза на текущото видео Videos: #& Sort By Sort By: @@ -1042,3 +1047,7 @@ Ok: Добре Hashtag: Hashtag: Хаштаг This hashtag does not currently have any videos: В момента този хаштаг няма видеа +Playlist will pause when current video is finished: Плейлистът ще бъде спрян на пауза, + когато текущото видео приключи +Playlist will not pause when current video is finished: Плейлистът няма да спре, когато + текущото видео е завършено From b482dc89a555a999566f7d93ce98d3fe1046b530 Mon Sep 17 00:00:00 2001 From: Massimo Pissarello Date: Fri, 8 Sep 2023 03:11:04 +0000 Subject: [PATCH 017/176] Translated using Weblate (Italian) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/it/ --- static/locales/it.yaml | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/static/locales/it.yaml b/static/locales/it.yaml index bd9baac45fb09..e56c73401ea26 100644 --- a/static/locales/it.yaml +++ b/static/locales/it.yaml @@ -780,6 +780,7 @@ Video: 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': La chat dal vivo non è disponibile per questo video. Potrebbe essere stata disattivata dall'autore del caricamento. + Pause on Current Video: Pausa sul video attuale Videos: #& Sort By Sort By: @@ -1063,3 +1064,7 @@ Hashtag: This hashtag does not currently have any videos: Questo hashtag attualmente non ha alcun video Hashtag: Hashtag +Playlist will pause when current video is finished: La playlist verrà messa in pausa + al termine del video attuale +Playlist will not pause when current video is finished: La playlist non verrà messa + in pausa al termine del video attuale From 8539e6e4033a3faf43903f9fe13fa7b832626d67 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 8 Sep 2023 11:07:21 +0200 Subject: [PATCH 018/176] Bump the eslint group with 1 update (#4001) Bumps the eslint group with 1 update: [eslint-plugin-prettier](https://github.com/prettier/eslint-plugin-prettier). - [Release notes](https://github.com/prettier/eslint-plugin-prettier/releases) - [Changelog](https://github.com/prettier/eslint-plugin-prettier/blob/master/CHANGELOG.md) - [Commits](https://github.com/prettier/eslint-plugin-prettier/compare/v4.2.1...v5.0.0) --- updated-dependencies: - dependency-name: eslint-plugin-prettier dependency-type: direct:development update-type: version-update:semver-major dependency-group: eslint ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package.json | 2 +- yarn.lock | 175 ++++++++++++++++++++++++++++++++++++++++++++++++--- 2 files changed, 169 insertions(+), 8 deletions(-) diff --git a/package.json b/package.json index a7ede245d9416..20bfdd80ea968 100644 --- a/package.json +++ b/package.json @@ -98,7 +98,7 @@ "eslint-plugin-import": "^2.28.1", "eslint-plugin-jsonc": "^2.9.0", "eslint-plugin-n": "^16.0.2", - "eslint-plugin-prettier": "^4.2.1", + "eslint-plugin-prettier": "^5.0.0", "eslint-plugin-promise": "^6.1.1", "eslint-plugin-unicorn": "^48.0.1", "eslint-plugin-vue": "^9.17.0", diff --git a/yarn.lock b/yarn.lock index 7dbfc7a8d997f..2fea278954125 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1420,6 +1420,18 @@ resolved "https://registry.yarnpkg.com/@pkgjs/parseargs/-/parseargs-0.11.0.tgz#a77ea742fab25775145434eb1d2328cf5013ac33" integrity sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg== +"@pkgr/utils@^2.3.1": + version "2.4.2" + resolved "https://registry.yarnpkg.com/@pkgr/utils/-/utils-2.4.2.tgz#9e638bbe9a6a6f165580dc943f138fd3309a2cbc" + integrity sha512-POgTXhjrTfbTV63DiFXav4lBHiICLKKwDeaKn9Nphwj7WH6m0hMMCaJkMyRWjgtPFyRKRVoMXXjczsTQRDEhYw== + dependencies: + cross-spawn "^7.0.3" + fast-glob "^3.3.0" + is-glob "^4.0.3" + open "^9.1.0" + picocolors "^1.0.0" + tslib "^2.6.0" + "@seald-io/binary-search-tree@^1.0.3": version "1.0.3" resolved "https://registry.yarnpkg.com/@seald-io/binary-search-tree/-/binary-search-tree-1.0.3.tgz#165a9a456eaa30d15885b25db83861bcce2c6a74" @@ -2313,6 +2325,11 @@ bcrypt-pbkdf@^1.0.0: dependencies: tweetnacl "^0.14.3" +big-integer@^1.6.44: + version "1.6.51" + resolved "https://registry.yarnpkg.com/big-integer/-/big-integer-1.6.51.tgz#0df92a5d9880560d3ff2d5fd20245c889d130686" + integrity sha512-GPEid2Y9QU1Exl1rpO9B2IPJGHPSupF5GnVIP0blYvNOMer2bTvSWs1jGOUg04hTmu67nmLsQ9TBo1puaotBHg== + big.js@^5.2.2: version "5.2.2" resolved "https://registry.yarnpkg.com/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328" @@ -2373,6 +2390,13 @@ boolean@^3.0.1: resolved "https://registry.yarnpkg.com/boolean/-/boolean-3.2.0.tgz#9e5294af4e98314494cbb17979fa54ca159f116b" integrity sha512-d0II/GO9uf9lfUHH2BQsjxzRJZBdsjgsBiW4BvhWk/3qoKwQFjIDVN19PfX8F2D/r9PCMTtLWjYVCFrpeYUzsw== +bplist-parser@^0.2.0: + version "0.2.0" + resolved "https://registry.yarnpkg.com/bplist-parser/-/bplist-parser-0.2.0.tgz#43a9d183e5bf9d545200ceac3e712f79ebbe8d0e" + integrity sha512-z0M+byMThzQmD9NILRniCUXYsYpjwnlO8N5uCFaCqIOpqRsJCrQL9NK3JsD67CN5a08nF5oIL2bD6loTdHOuKw== + dependencies: + big-integer "^1.6.44" + brace-expansion@^1.1.7: version "1.1.11" resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd" @@ -2470,6 +2494,13 @@ builtins@^5.0.1: dependencies: semver "^7.0.0" +bundle-name@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/bundle-name/-/bundle-name-3.0.0.tgz#ba59bcc9ac785fb67ccdbf104a2bf60c099f0e1a" + integrity sha512-PKA4BeSvBpQKQ8iPOGCSiell+N8P+Tf1DlwqmYhpe2gAhKPHn8EYOxVT+ShuGmhg8lN8XiSlS80yiExKXrURlw== + dependencies: + run-applescript "^5.0.0" + busboy@^1.6.0: version "1.6.0" resolved "https://registry.yarnpkg.com/busboy/-/busboy-1.6.0.tgz#966ea36a9502e43cdb9146962523b92f531f6893" @@ -3083,6 +3114,24 @@ deep-is@^0.1.3: resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.4.tgz#a6f2dce612fadd2ef1f519b73551f17e85199831" integrity sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ== +default-browser-id@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/default-browser-id/-/default-browser-id-3.0.0.tgz#bee7bbbef1f4e75d31f98f4d3f1556a14cea790c" + integrity sha512-OZ1y3y0SqSICtE8DE4S8YOE9UZOJ8wO16fKWVP5J1Qz42kV9jcnMVFrEE/noXb/ss3Q4pZIH79kxofzyNNtUNA== + dependencies: + bplist-parser "^0.2.0" + untildify "^4.0.0" + +default-browser@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/default-browser/-/default-browser-4.0.0.tgz#53c9894f8810bf86696de117a6ce9085a3cbc7da" + integrity sha512-wX5pXO1+BrhMkSbROFsyxUm0i/cJEScyNhA4PPxc41ICuv05ZZB/MX28s8aZx6xjmatvebIapF6hLEKEcpneUA== + dependencies: + bundle-name "^3.0.0" + default-browser-id "^3.0.0" + execa "^7.1.1" + titleize "^3.0.0" + default-gateway@^6.0.3: version "6.0.3" resolved "https://registry.yarnpkg.com/default-gateway/-/default-gateway-6.0.3.tgz#819494c888053bdb743edbf343d6cdf7f2943a71" @@ -3100,6 +3149,11 @@ define-lazy-prop@^2.0.0: resolved "https://registry.yarnpkg.com/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz#3f7ae421129bcaaac9bc74905c98a0009ec9ee7f" integrity sha512-Ds09qNh8yw3khSjiJjiUInaGX9xlqZDY7JVryGxdxV7NPeuqQfplOpQ66yJFZut3jLa5zOwkXw1g9EI2uKh4Og== +define-lazy-prop@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/define-lazy-prop/-/define-lazy-prop-3.0.0.tgz#dbb19adfb746d7fc6d734a06b72f4a00d021255f" + integrity sha512-N+MeXYoqr3pOgn8xfyRPREN7gHakLYjhsHhWGT3fWAiL4IkAt0iDw14QiiEm2bE30c5XX5q0FtAA3CK5f9/BUg== + define-properties@^1.1.3, define-properties@^1.1.4: version "1.1.4" resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.1.4.tgz#0b14d7bd7fbeb2f3572c3a7eda80ea5d57fb05b1" @@ -3747,12 +3801,13 @@ eslint-plugin-n@^16.0.2: resolve "^1.22.2" semver "^7.5.3" -eslint-plugin-prettier@^4.2.1: - version "4.2.1" - resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-4.2.1.tgz#651cbb88b1dab98bfd42f017a12fa6b2d993f94b" - integrity sha512-f/0rXLXUt0oFYs8ra4w49wYZBG5GKZpAYsJSm6rnYL5uVDjd+zowwMwVZHnAjf4edNrKpCDYfXDgmRE/Ak7QyQ== +eslint-plugin-prettier@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-5.0.0.tgz#6887780ed95f7708340ec79acfdf60c35b9be57a" + integrity sha512-AgaZCVuYDXHUGxj/ZGu1u8H8CYgDY3iG6w5kUFw4AzMVXzB7VvbKgYR4nATIN+OvUrghMbiDLeimVjVY5ilq3w== dependencies: prettier-linter-helpers "^1.0.0" + synckit "^0.8.5" eslint-plugin-promise@^6.1.1: version "6.1.1" @@ -3949,6 +4004,21 @@ execa@^5.0.0: signal-exit "^3.0.3" strip-final-newline "^2.0.0" +execa@^7.1.1: + version "7.2.0" + resolved "https://registry.yarnpkg.com/execa/-/execa-7.2.0.tgz#657e75ba984f42a70f38928cedc87d6f2d4fe4e9" + integrity sha512-UduyVP7TLB5IcAQl+OzLyLcS/l32W/GLg+AhHJ+ow40FOk2U3SAllPwR44v4vmdFwIWqpdwxxpQbF1n5ta9seA== + dependencies: + cross-spawn "^7.0.3" + get-stream "^6.0.1" + human-signals "^4.3.0" + is-stream "^3.0.0" + merge-stream "^2.0.0" + npm-run-path "^5.1.0" + onetime "^6.0.0" + signal-exit "^3.0.7" + strip-final-newline "^3.0.0" + express@^4.17.3: version "4.18.1" resolved "https://registry.yarnpkg.com/express/-/express-4.18.1.tgz#7797de8b9c72c857b9cd0e14a5eea80666267caf" @@ -4037,7 +4107,7 @@ fast-diff@^1.1.2: resolved "https://registry.yarnpkg.com/fast-diff/-/fast-diff-1.2.0.tgz#73ee11982d86caaf7959828d519cfe927fac5f03" integrity sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w== -fast-glob@^3.2.11, fast-glob@^3.2.9, fast-glob@^3.3.1: +fast-glob@^3.2.11, fast-glob@^3.2.9, fast-glob@^3.3.0, fast-glob@^3.3.1: version "3.3.1" resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.1.tgz#784b4e897340f3dbbef17413b3f11acf03c874c4" integrity sha512-kNFPyjhh5cKjrUltxs+wFx+ZkbRaxxmZ+X0ZU31SOsxCEtP9VPgtq2teZw1DebupL5GmDaNQ6yKMMVcM41iqDg== @@ -4331,7 +4401,7 @@ get-stream@^5.1.0: dependencies: pump "^3.0.0" -get-stream@^6.0.0: +get-stream@^6.0.0, get-stream@^6.0.1: version "6.0.1" resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-6.0.1.tgz#a262d8eef67aced57c2852ad6167526a43cbf7b7" integrity sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg== @@ -4750,6 +4820,11 @@ human-signals@^2.1.0: resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-2.1.0.tgz#dc91fcba42e4d06e4abaed33b3e7a3c02f514ea0" integrity sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw== +human-signals@^4.3.0: + version "4.3.1" + resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-4.3.1.tgz#ab7f811e851fca97ffbd2c1fe9a958964de321b2" + integrity sha512-nZXjEF2nbo7lIw3mgYjItAfgQXog3OjJogSbKa2CQIIvSGWcKgeJnQlNXip6NglNzYH45nSRiEVimMvYL8DDqQ== + iconv-corefoundation@^1.1.7: version "1.1.7" resolved "https://registry.yarnpkg.com/iconv-corefoundation/-/iconv-corefoundation-1.1.7.tgz#31065e6ab2c9272154c8b0821151e2c88f1b002a" @@ -4999,6 +5074,11 @@ is-docker@^2.0.0, is-docker@^2.1.1: resolved "https://registry.yarnpkg.com/is-docker/-/is-docker-2.2.1.tgz#33eeabe23cfe86f14bde4408a02c0cfb853acdaa" integrity sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ== +is-docker@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/is-docker/-/is-docker-3.0.0.tgz#90093aa3106277d8a77a5910dbae71747e15a200" + integrity sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ== + is-extglob@^2.1.1: version "2.1.1" resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2" @@ -5028,6 +5108,13 @@ is-glob@^4.0.0, is-glob@^4.0.1, is-glob@^4.0.3, is-glob@~4.0.1: dependencies: is-extglob "^2.1.1" +is-inside-container@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/is-inside-container/-/is-inside-container-1.0.0.tgz#e81fba699662eb31dbdaf26766a61d4814717ea4" + integrity sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA== + dependencies: + is-docker "^3.0.0" + is-negative-zero@^2.0.2: version "2.0.2" resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.2.tgz#7bf6f03a28003b8b3965de3ac26f664d765f3150" @@ -5092,6 +5179,11 @@ is-stream@^2.0.0: resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-2.0.1.tgz#fac1e3d53b97ad5a9d0ae9cef2389f5810a5c077" integrity sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg== +is-stream@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-3.0.0.tgz#e6bfd7aa6bef69f4f472ce9bb681e3e57b4319ac" + integrity sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA== + is-string@^1.0.5, is-string@^1.0.7: version "1.0.7" resolved "https://registry.yarnpkg.com/is-string/-/is-string-1.0.7.tgz#0dd12bf2006f255bb58f695110eff7491eebc0fd" @@ -5744,6 +5836,11 @@ mimic-fn@^2.1.0: resolved "https://registry.yarnpkg.com/mimic-fn/-/mimic-fn-2.1.0.tgz#7ed2c2ccccaf84d3ffcb7a69b57711fc2083401b" integrity sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg== +mimic-fn@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/mimic-fn/-/mimic-fn-4.0.0.tgz#60a90550d5cb0b239cca65d893b1a53b29871ecc" + integrity sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw== + mimic-response@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-1.0.1.tgz#4923538878eef42063cb8a3e3b0798781487ab1b" @@ -5989,6 +6086,13 @@ npm-run-path@^4.0.1: dependencies: path-key "^3.0.0" +npm-run-path@^5.1.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/npm-run-path/-/npm-run-path-5.1.0.tgz#bc62f7f3f6952d9894bd08944ba011a6ee7b7e00" + integrity sha512-sJOdmRGrY2sjNTRMbSvluQqg+8X7ZK61yvzBEIDhz4f8z1TZFYABsqjjCBd/0PUNE9M6QDgHJXQkGUEm7Q+l9Q== + dependencies: + path-key "^4.0.0" + nth-check@^2.0.1, nth-check@^2.1.1: version "2.1.1" resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-2.1.1.tgz#c9eab428effce36cd6b92c924bdb000ef1f1ed1d" @@ -6100,6 +6204,13 @@ onetime@^5.1.2: dependencies: mimic-fn "^2.1.0" +onetime@^6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/onetime/-/onetime-6.0.0.tgz#7c24c18ed1fd2e9bca4bd26806a33613c77d34b4" + integrity sha512-1FlR+gjXK7X+AsAHso35MnyN5KqGwJRi/31ft6x0M194ht7S+rWAvd7PHss9xSKMzE0asv1pyIHaJYq+BbacAQ== + dependencies: + mimic-fn "^4.0.0" + open@^8.0.9: version "8.4.0" resolved "https://registry.yarnpkg.com/open/-/open-8.4.0.tgz#345321ae18f8138f82565a910fdc6b39e8c244f8" @@ -6109,6 +6220,16 @@ open@^8.0.9: is-docker "^2.1.1" is-wsl "^2.2.0" +open@^9.1.0: + version "9.1.0" + resolved "https://registry.yarnpkg.com/open/-/open-9.1.0.tgz#684934359c90ad25742f5a26151970ff8c6c80b6" + integrity sha512-OS+QTnw1/4vrf+9hh1jc1jnYjzSG4ttTBB8UxOwAnInG3Uo4ssetzC1ihqaIHjLJnA5GGlRl6QlZXOTQhRBUvg== + dependencies: + default-browser "^4.0.0" + define-lazy-prop "^3.0.0" + is-inside-container "^1.0.0" + is-wsl "^2.2.0" + optionator@^0.9.3: version "0.9.3" resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.9.3.tgz#007397d44ed1872fdc6ed31360190f81814e2c64" @@ -6257,6 +6378,11 @@ path-key@^3.0.0, path-key@^3.1.0: resolved "https://registry.yarnpkg.com/path-key/-/path-key-3.1.1.tgz#581f6ade658cbba65a0d3380de7753295054f375" integrity sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q== +path-key@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/path-key/-/path-key-4.0.0.tgz#295588dc3aee64154f877adb9d780b81c554bf18" + integrity sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ== + path-parse@^1.0.7: version "1.0.7" resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.7.tgz#fbc114b60ca42b30d9daf5858e4bd68bbedb6735" @@ -7112,6 +7238,13 @@ roarr@^2.15.3: semver-compare "^1.0.0" sprintf-js "^1.1.2" +run-applescript@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/run-applescript/-/run-applescript-5.0.0.tgz#e11e1c932e055d5c6b40d98374e0268d9b11899c" + integrity sha512-XcT5rBksx1QdIhlFOCtgZkB99ZEouFZ1E2Kc2LHqNW13U3/74YGdkQRmThTwxy4QIyookibDKYZOPqX//6BlAg== + dependencies: + execa "^5.0.0" + run-parallel@^1.1.9: version "1.2.0" resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.2.0.tgz#66d1368da7bdf921eb9d95bd1a9229e7f21a43ee" @@ -7364,7 +7497,7 @@ side-channel@^1.0.4: get-intrinsic "^1.0.2" object-inspect "^1.9.0" -signal-exit@^3.0.3: +signal-exit@^3.0.3, signal-exit@^3.0.7: version "3.0.7" resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.7.tgz#a9a1767f8af84155114eaabd73f99273c8f59ad9" integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ== @@ -7654,6 +7787,11 @@ strip-final-newline@^2.0.0: resolved "https://registry.yarnpkg.com/strip-final-newline/-/strip-final-newline-2.0.0.tgz#89b852fb2fcbe936f6f4b3187afb0a12c1ab58ad" integrity sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA== +strip-final-newline@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/strip-final-newline/-/strip-final-newline-3.0.0.tgz#52894c313fbff318835280aed60ff71ebf12b8fd" + integrity sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw== + strip-indent@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/strip-indent/-/strip-indent-3.0.0.tgz#c32e1cee940b6b3432c771bc2c54bcce73cd3001" @@ -7827,6 +7965,14 @@ svgo@^3.0.2: csso "^5.0.5" picocolors "^1.0.0" +synckit@^0.8.5: + version "0.8.5" + resolved "https://registry.yarnpkg.com/synckit/-/synckit-0.8.5.tgz#b7f4358f9bb559437f9f167eb6bc46b3c9818fa3" + integrity sha512-L1dapNV6vu2s/4Sputv8xGsCdAVlb5nRDMFU/E27D44l5U6cw1g0dGd45uLc+OXjNMmF4ntiMdCimzcjFKQI8Q== + dependencies: + "@pkgr/utils" "^2.3.1" + tslib "^2.5.0" + table@^6.8.1: version "6.8.1" resolved "https://registry.yarnpkg.com/table/-/table-6.8.1.tgz#ea2b71359fe03b017a5fbc296204471158080bdf" @@ -7909,6 +8055,11 @@ tiny-slider@^2.9.2: resolved "https://registry.yarnpkg.com/tiny-slider/-/tiny-slider-2.9.4.tgz#dd5cbf3065f1688ade8383ea6342aefcba22ccc4" integrity sha512-LAs2kldWcY+BqCKw4kxd4CMx2RhWrHyEePEsymlOIISTlOVkjfK40sSD7ay73eKXBLg/UkluAZpcfCstimHXew== +titleize@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/titleize/-/titleize-3.0.0.tgz#71c12eb7fdd2558aa8a44b0be83b8a76694acd53" + integrity sha512-KxVu8EYHDPBdUYdKZdKtU2aj2XfEx9AfjXxE/Aj0vT06w2icA09Vus1rh6eSu1y01akYg6BjIK/hxyLJINoMLQ== + tmp-promise@^3.0.2: version "3.0.3" resolved "https://registry.yarnpkg.com/tmp-promise/-/tmp-promise-3.0.3.tgz#60a1a1cc98c988674fcbfd23b6e3367bdeac4ce7" @@ -7980,6 +8131,11 @@ tslib@^2.0.3, tslib@^2.3.0, tslib@^2.5.0: resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.5.0.tgz#42bfed86f5787aeb41d031866c8f402429e0fddf" integrity sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg== +tslib@^2.6.0: + version "2.6.2" + resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae" + integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q== + tunnel-agent@^0.6.0: version "0.6.0" resolved "https://registry.yarnpkg.com/tunnel-agent/-/tunnel-agent-0.6.0.tgz#27a5dea06b36b04a0a9966774b290868f0fc40fd" @@ -8141,6 +8297,11 @@ unpipe@1.0.0, unpipe@~1.0.0: resolved "https://registry.yarnpkg.com/unpipe/-/unpipe-1.0.0.tgz#b2bf4ee8514aae6165b4817829d21b2ef49904ec" integrity sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw= +untildify@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/untildify/-/untildify-4.0.0.tgz#2bc947b953652487e4600949fb091e3ae8cd919b" + integrity sha512-KK8xQ1mkzZeg9inewmFVDNkg3l5LUhoq9kN6iWYB/CC9YMG8HA+c1Q8HwDe6dEX7kErrEVNVBO3fWsVq5iDgtw== + unused-filename@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/unused-filename/-/unused-filename-2.1.0.tgz#33719c4e8d9644f32d2dec1bc8525c6aaeb4ba51" From 906d776e24d11b7720ccb7e7549917741a56226f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sveinn=20=C3=AD=20Felli?= Date: Fri, 8 Sep 2023 08:29:33 +0000 Subject: [PATCH 019/176] Translated using Weblate (Icelandic) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/is/ --- static/locales/is.yaml | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/static/locales/is.yaml b/static/locales/is.yaml index 05664a18f74c4..e70d3042e9061 100644 --- a/static/locales/is.yaml +++ b/static/locales/is.yaml @@ -160,6 +160,7 @@ Settings: Beginning: 'Upphaf' Middle: 'Miðja' End: 'Endir' + Hidden: Falið 'Invidious Instance (Default is https://invidious.snopyta.org)': 'Invidious-tilvik (sjálfgefið er https://invidious.snopyta.org)' View all Invidious instance information: 'Skoða allar upplýsingar um Invidious-tilvik' @@ -193,6 +194,8 @@ Settings: Dracula: 'Drakúla' System Default: Sjálfgefið í kerfinu Catppuccin Mocha: Catppuccin Mocha + Pastel Pink: Pastelbleikt + Hot Pink: Dimmbleikt Main Color Theme: Main Color Theme: 'Aðallitur þema' Red: 'Rautt' @@ -355,6 +358,8 @@ Settings: Hide Subscriptions Shorts: Fela stuttmyndir áskrifta Hide Subscriptions Live: Fela bein streymi áskrifta Hide Subscriptions Videos: Fela myndskeið áskrifta + Blur Thumbnails: Móska smámyndir + Hide Profile Pictures in Comments: Fela auðkennismyndir í athugasemdum Data Settings: Data Settings: 'Stillingar gagna' Select Import Type: 'Veldu tegund innflutnings' @@ -499,6 +504,7 @@ About: these people and projects: 'þessu fólki og verkefnum' Donate: 'Styrkja' + Discussions: Umræður Profile: Profile Select: 'Val á notkunarsniði' Profile Filter: 'Sía notkunarsnið' @@ -594,6 +600,9 @@ Channel: Community: Community: Samfélag This channel currently does not have any posts: Þessi rás er ekki með neinar færslur + Reveal Answers: Birta svör + Hide Answers: Fela svör + votes: '{votes} atkvæði' Shorts: This channel does not currently have any shorts: Þessi rás er í augnablikinu ekki með neinar stuttmyndir @@ -751,6 +760,7 @@ Video: 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': Spjall í beinni er ekki tiltækt fyrir þetta streymi. Sá sem sendi þetta inn gæti hafa gert það óvirkt. + Pause on Current Video: Setja núverandi myndskeið í bið Videos: #& Sort By Sort By: @@ -983,3 +993,7 @@ Hashtag: Hashtag: Myllumerki This hashtag does not currently have any videos: Þetta myllumerki er í augnablikinu ekki með nein myndskeið +Playlist will pause when current video is finished: Spilunarlisti mun fara í bið eftir + að núverandi myndskeið klárast +Playlist will not pause when current video is finished: Spilunarlisti mun ekki fara + í bið eftir að núverandi myndskeið klárast From 110e68f073cdd7cd348d96fc5220f3abe4491004 Mon Sep 17 00:00:00 2001 From: Dragibus Noir Date: Fri, 8 Sep 2023 11:45:51 +0000 Subject: [PATCH 020/176] Translated using Weblate (French) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/fr/ --- static/locales/fr-FR.yaml | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/static/locales/fr-FR.yaml b/static/locales/fr-FR.yaml index 5f1bc21505dde..ef75b936c0bfa 100644 --- a/static/locales/fr-FR.yaml +++ b/static/locales/fr-FR.yaml @@ -188,7 +188,7 @@ Settings: System Default: Paramètres système Catppuccin Mocha: Catppuccin Moka Pastel Pink: Rose Pastel - Hot Pink: Rose Chaud + Hot Pink: Rose Vif Main Color Theme: Main Color Theme: 'Couleur principale du thème' Red: 'Rouge' @@ -805,6 +805,7 @@ Video: 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': Le chat en direct n'est pas disponible pour ce flux. Il a peut-être été désactivé par le téléchargeur. + Pause on Current Video: Pause sur la vidéo en cours Videos: #& Sort By Sort By: @@ -1101,3 +1102,7 @@ Hashtag: Hashtag: Mot-clé This hashtag does not currently have any videos: Ce mot-clé n'a actuellement aucune vidéo +Playlist will pause when current video is finished: La liste de lecture se met en + pause lorsque la vidéo en cours est terminée +Playlist will not pause when current video is finished: La liste de lecture ne se + met pas en pause lorsque la vidéo en cours est terminée From edd4e1cc63b1429c86d6b690d37b0f5ac1cde8aa Mon Sep 17 00:00:00 2001 From: gallegonovato Date: Fri, 8 Sep 2023 12:42:29 +0000 Subject: [PATCH 021/176] Translated using Weblate (Spanish) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/es/ --- static/locales/es.yaml | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/static/locales/es.yaml b/static/locales/es.yaml index d0939320e78fc..ff43f63f0d1ff 100644 --- a/static/locales/es.yaml +++ b/static/locales/es.yaml @@ -815,6 +815,7 @@ Video: 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': El chat en vivo no está disponible para esta transmisión. Tal vez estaba deshabilitado antes de la retransmisión. + Pause on Current Video: Pausa en el vídeo actual Videos: #& Sort By Sort By: @@ -1055,3 +1056,7 @@ Hashtag: Hashtag: Hashtag This hashtag does not currently have any videos: Este hashtag no tiene actualmente ningún vídeo +Playlist will pause when current video is finished: La lista de reproducción se detendrá + cuando termine el vídeo actual +Playlist will not pause when current video is finished: La lista de reproducción no + se detendrá cuando termine el vídeo actual From 754afef419da49359cd9e62fff04c5e73bd3b7b0 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 8 Sep 2023 11:42:46 -0400 Subject: [PATCH 022/176] Bump electron from 22.3.18 to 22.3.21 (#4008) Bumps [electron](https://github.com/electron/electron) from 22.3.18 to 22.3.21. - [Release notes](https://github.com/electron/electron/releases) - [Changelog](https://github.com/electron/electron/blob/main/docs/breaking-changes.md) - [Commits](https://github.com/electron/electron/compare/v22.3.18...v22.3.21) --- updated-dependencies: - dependency-name: electron dependency-type: direct:development ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index 20bfdd80ea968..fcae38247825c 100644 --- a/package.json +++ b/package.json @@ -90,7 +90,7 @@ "copy-webpack-plugin": "^11.0.0", "css-loader": "^6.8.1", "css-minimizer-webpack-plugin": "^5.0.1", - "electron": "^22.3.18", + "electron": "^22.3.21", "electron-builder": "^24.6.4", "eslint": "^8.48.0", "eslint-config-prettier": "^9.0.0", diff --git a/yarn.lock b/yarn.lock index 2fea278954125..a6dcdf5fed6ca 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3437,10 +3437,10 @@ electron-to-chromium@^1.4.431: resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.454.tgz#774dc7cb5e58576d0125939ec34a4182f3ccc87d" integrity sha512-pmf1rbAStw8UEQ0sr2cdJtWl48ZMuPD9Sto8HVQOq9vx9j2WgDEN6lYoaqFvqEHYOmGA9oRGn7LqWI9ta0YugQ== -electron@^22.3.18: - version "22.3.18" - resolved "https://registry.yarnpkg.com/electron/-/electron-22.3.18.tgz#5ee55633b3912fec9df6d8f039acf2c016274cfc" - integrity sha512-JgjB966ghTBszAX/GgVgDY/2CktWCjTZWGJI0WISRHDudBZ8/WPkI/hIjsMiLQLe0wSTk6S+WHOYbIqyw0I/sg== +electron@^22.3.21: + version "22.3.21" + resolved "https://registry.yarnpkg.com/electron/-/electron-22.3.21.tgz#a817446cc1e62e9650522fa7eae389f9fc5b5e19" + integrity sha512-9JzWgvehRrqA30M7RvWCwwbyq2EgPUSbCFaqyZGnG0B52m4ayB8H+uFNIKXyWuyFwAEPDpQW5cGwCzXir1HuLA== dependencies: "@electron/get" "^2.0.0" "@types/node" "^16.11.26" From 6a6f37e2863342e5593dc66061bcca9f530d57b6 Mon Sep 17 00:00:00 2001 From: Ettore Atalan Date: Fri, 8 Sep 2023 16:55:23 +0000 Subject: [PATCH 023/176] Translated using Weblate (German) Currently translated at 100.0% (717 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/de/ --- static/locales/de-DE.yaml | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/static/locales/de-DE.yaml b/static/locales/de-DE.yaml index aab5db15fccf1..6dda03e79cf20 100644 --- a/static/locales/de-DE.yaml +++ b/static/locales/de-DE.yaml @@ -792,6 +792,7 @@ Video: Upcoming: Demnächst 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': Live-Chat ist für diesen Stream nicht verfügbar. Möglicherweise wurde es vom Uploader deaktiviert. + Pause on Current Video: Pause für aktuelles Video Videos: #& Sort By Sort By: @@ -1076,3 +1077,7 @@ Hashtag: Hashtag: Schlagwort This hashtag does not currently have any videos: Unter diesem Schlagwort konnten derzeit keine Videos gefunden werden +Playlist will pause when current video is finished: Wiedergabeliste wird pausiert, + wenn das aktuelle Video beendet ist +Playlist will not pause when current video is finished: Wiedergabeliste wird nicht + pausiert, wenn das aktuelle Video beendet ist From 1533e9ec90a7b4f2a41d72dab4396eb23a134ebe Mon Sep 17 00:00:00 2001 From: ChunkyProgrammer <78101139+ChunkyProgrammer@users.noreply.github.com> Date: Fri, 8 Sep 2023 19:37:16 -0400 Subject: [PATCH 024/176] Enable Persian language (#4010) --- static/locales/activeLocales.json | 1 + 1 file changed, 1 insertion(+) diff --git a/static/locales/activeLocales.json b/static/locales/activeLocales.json index d376267a33aa1..58d8b378d00bf 100644 --- a/static/locales/activeLocales.json +++ b/static/locales/activeLocales.json @@ -13,6 +13,7 @@ "es-MX", "et", "eu", + "fa", "fi", "fr-FR", "gl", From 68dd15baff33f0166ba0bbee751ef047aea4bd95 Mon Sep 17 00:00:00 2001 From: ovari Date: Sat, 9 Sep 2023 01:42:34 +0000 Subject: [PATCH 025/176] Translated using Weblate (Hungarian) Currently translated at 99.7% (715 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/hu/ --- static/locales/hu.yaml | 1 + 1 file changed, 1 insertion(+) diff --git a/static/locales/hu.yaml b/static/locales/hu.yaml index 0c2c8d3f42040..12543c78998b0 100644 --- a/static/locales/hu.yaml +++ b/static/locales/hu.yaml @@ -813,6 +813,7 @@ Video: Upcoming: Közelgő 'Live Chat is unavailable for this stream. It may have been disabled by the uploader.': Az élő csevegés nem érhető el ehhez az adatfolyamhoz. Lehet, hogy a feltöltő letiltotta. + Pause on Current Video: Jelenlegi videó szüneteltetése Videos: #& Sort By Sort By: From 24ee3289fe110d38f2a5656da38279985e2ba8b6 Mon Sep 17 00:00:00 2001 From: Philip Goto Date: Sat, 9 Sep 2023 08:25:09 +0000 Subject: [PATCH 026/176] Translated using Weblate (Dutch) Currently translated at 98.4% (706 of 717 strings) Translation: FreeTube/Translations Translate-URL: https://hosted.weblate.org/projects/free-tube/translations/nl/ --- static/locales/nl.yaml | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) diff --git a/static/locales/nl.yaml b/static/locales/nl.yaml index 734527b07eb9a..55dff7df34204 100644 --- a/static/locales/nl.yaml +++ b/static/locales/nl.yaml @@ -93,6 +93,9 @@ Subscriptions: Vernieuw abonnementen om ze hier te zien. Empty Channels: Je geabonneerde kanalen hebben momenteel geen video's. Subscriptions Tabs: Abonnement­tabbladen + All Subscription Tabs Hidden: Alle abonnementstabbladen zijn verborgen. Om de inhoud + hier te zien moet u enkele tabbladen zichtbaar maken in de sectie ‘{subsection}’ + onder ‘{settingsSection}’. Trending: Trending: 'Trending' Trending Tabs: Tending-tabbladen @@ -303,6 +306,8 @@ Settings: Remove All Subscriptions / Profiles: Verwijder alle abonnementen / profielen Automatically Remove Video Meta Files: Bestanden met metadata van video's automatisch verwijderen + Save Watched Videos With Last Viewed Playlist: Houd bekeken video's bij met de + afspeellijst ‘Laatst bekeken’ Subscription Settings: Subscription Settings: 'Abonnement­instellingen' Hide Videos on Watch: 'Bekeken video''s verbergen' @@ -490,6 +495,8 @@ Settings: Set Password: Wachtwoord instellen Remove Password: Wachtwoord verwijderen Password Settings: Wachtwoord­instellingen + Set Password To Prevent Access: Stel een wachtwoord in om toegang tot instellingen + te beperken Password Dialog: Password: Wachtwoord Password Incorrect: Wachtwoord onjuist @@ -594,17 +601,30 @@ Channel: Channel Tabs: Kanaal­tabbladen Live: Live: Live + This channel does not currently have any live streams: Dit kanaal heeft momenteel + geen livestreams Podcasts: Podcasts: Podcasts + This channel does not currently have any podcasts: Dit kanaal heeft momenteel + geen podcasts Community: Community: Gemeenschap Reveal Answers: Antwoorden onthullen Hide Answers: Antwoorden verbergen votes: '{votes} stemmen' + This channel currently does not have any posts: Dit kanaal heeft momenteel geen + posts Releases: Releases: Uitgaven + This channel does not currently have any releases: Dit kanaal heeft momenteel + geen uitgaven This channel does not exist: Dit kanaal bestaat niet This channel does not allow searching: Dit kanaal staat zoeken niet toe + Shorts: + This channel does not currently have any shorts: Dit kanaal heeft momenteel geen + Shorts + This channel is age-restricted and currently cannot be viewed in FreeTube.: Dit + kanaal heeft een leeftijdsbeperking en kan momenteel niet worden bekeken in FreeTube. Video: Mark As Watched: 'Markeren als bekeken' Remove From History: 'Uit geschiedenis verwijderen' @@ -745,6 +765,7 @@ Video: Scroll to Bottom: Helemaal naar onderen scrollen Upcoming: Aankomend Show Super Chat Comment: Superchat-opmerking tonen + Pause on Current Video: Pauzeren bij huidige video Videos: #& Sort By Sort By: From 6f2a5352125b6538ffd1a78bb9d015d38d2ff259 Mon Sep 17 00:00:00 2001 From: Jason <84899178+jasonhenriquez@users.noreply.github.com> Date: Sat, 9 Sep 2023 16:29:26 +0000 Subject: [PATCH 027/176] Implement right-to-left interface (#3970) * Replace margin-left with margin-inline-start * Replace margin-right with margin-inline-end * Replace padding-left with padding-inline-start * Replace padding-right with padding-inline-end * Replace padding-top & padding-bottom with padding-block; continue replacing padding-left and padding-right with padding-inline-start and padding-inline-end * Add updated rtl-compatible margins to ft-slider and fix indentation * Replace margin-top & margin-bottom with margin-block; continue replacing margin-left and margin-right with margin-inline-start and margin-inline-end * Continue replacing with margin-block and margin-inline * Replace left and right with inset-inline-start and inset-inline-end This commit also changes border-left to border-inline-start, and border-right to border-inline-end. * Replace margin-bottom, top, and bottom with margin-block-end, inset-block-start, and inset-block-end This commit also replaces border-top and border-bottom with border-block-start and border-block-end. * Replace text-align left and right with text-align start and end * Fix syntax error with inset-block-end * Implement dynamic float: left/right based on direction ltr/rtl * Implement dynamic navigation arrow placement based on direction ltr/rtl To the fullest of my understanding, it is expected for the left navigation in rtl-supporting browsers to be for forward navigation, and the right one to be for backward navigation. * Add direction to body based on preferred language * Implement horizontal directionality coefficient to fix translate working in wrong x-direction for rtl languages * Add explicit text-align: start in places to ensure rtl version is correctly aligned * Add text-align: start to places where it is not inferred to enable proper rtl text orientation * Fix search bar magnifying glass being too far right issue * Move body.dir-setting logic to setLocale to fix dir not setting correctly on page reload * Change .switchColumn to have align-items: start instead of justify-items: start I have validated this for all settings tabs; the justify-content: start did nothing in any language, left-to-right or right-to-left. Replacing it with align-items: start aligned all menu switch items by their switches, not by their labels. This makes for a much more uniform settings section for trl languages. * Fix emergent bug in which history icons are temporarily disabled on changing language to one with different directionality Given that which icon is displayed for which history arrow is now dynamic based on the user's directionality, changing of the icon resets the font-awesome-icon state and thus re-adds the base disabled class to both arrows. This means that changing your language to one that has a different directionality was falsely setting the arrows to their disabled state (until the route is changed, after which the history icons will be fully back to normal). This commmit refactors the history icon setting logic to use class binding to two booleans in the top-nav component's data rather than adding and removing the disabled classes directly to the arrow elements' classLists, thus cleaning up the implementation and fixing the bug. * Add Kurdish to rtl languages list & add li items to be right-aligned on rtl languages * Force FreeTube logo to be ordered left-to-right for 'brand consistency' * Add styling flipping font-awesome icons for rtl languages except for exclusion list * Update isRightAligned with additional languages, and use it instead of locale value from store Kudos to absidue for pointing out this existing function for representing this, and that it grabs directly from the i18n object. This means that FreeTube will display the proper rtl interface if one is the user's system language, where it did not before. * Update isRightAligned property name to more clearly reflect rtl purpose * Simplify left/right arrow display logic Leverage the icons being flipped rather than manually setting the classes to their opposites when the directionality is RTL. * Replace justify-self: left & justify-self: right with justify-self; start and justify-self: end * Remove misguided attempt to emulate directionality-agnosticism with rightAligned class * Explicitly center FreeTube version on About page * Replace pre-existing identation issue * Replace margin-left with margin-inline-start * Replace margin-right with margin-inline-end * Replace padding-left with padding-inline-start * Replace padding-right with padding-inline-end * Replace padding-top & padding-bottom with padding-block; continue replacing padding-left and padding-right with padding-inline-start and padding-inline-end * Add updated rtl-compatible margins to ft-slider and fix indentation * Replace margin-top & margin-bottom with margin-block; continue replacing margin-left and margin-right with margin-inline-start and margin-inline-end * Continue replacing with margin-block and margin-inline * Replace left and right with inset-inline-start and inset-inline-end This commit also changes border-left to border-inline-start, and border-right to border-inline-end. * Replace margin-bottom, top, and bottom with margin-block-end, inset-block-start, and inset-block-end This commit also replaces border-top and border-bottom with border-block-start and border-block-end. * Replace text-align left and right with text-align start and end * Fix syntax error with inset-block-end * Implement dynamic float: left/right based on direction ltr/rtl * Implement dynamic navigation arrow placement based on direction ltr/rtl To the fullest of my understanding, it is expected for the left navigation in rtl-supporting browsers to be for forward navigation, and the right one to be for backward navigation. * Add direction to body based on preferred language * Implement horizontal directionality coefficient to fix translate working in wrong x-direction for rtl languages * Add explicit text-align: start in places to ensure rtl version is correctly aligned * Add text-align: start to places where it is not inferred to enable proper rtl text orientation * Fix search bar magnifying glass being too far right issue * Move body.dir-setting logic to setLocale to fix dir not setting correctly on page reload * Change .switchColumn to have align-items: start instead of justify-items: start I have validated this for all settings tabs; the justify-content: start did nothing in any language, left-to-right or right-to-left. Replacing it with align-items: start aligned all menu switch items by their switches, not by their labels. This makes for a much more uniform settings section for trl languages. * Fix emergent bug in which history icons are temporarily disabled on changing language to one with different directionality Given that which icon is displayed for which history arrow is now dynamic based on the user's directionality, changing of the icon resets the font-awesome-icon state and thus re-adds the base disabled class to both arrows. This means that changing your language to one that has a different directionality was falsely setting the arrows to their disabled state (until the route is changed, after which the history icons will be fully back to normal). This commmit refactors the history icon setting logic to use class binding to two booleans in the top-nav component's data rather than adding and removing the disabled classes directly to the arrow elements' classLists, thus cleaning up the implementation and fixing the bug. * Add Kurdish to rtl languages list & add li items to be right-aligned on rtl languages * Force FreeTube logo to be ordered left-to-right for 'brand consistency' * Add styling flipping font-awesome icons for rtl languages except for exclusion list * Update isRightAligned with additional languages, and use it instead of locale value from store Kudos to absidue for pointing out this existing function for representing this, and that it grabs directly from the i18n object. This means that FreeTube will display the proper rtl interface if one is the user's system language, where it did not before. * Update isRightAligned property name to more clearly reflect rtl purpose * Simplify left/right arrow display logic Leverage the icons being flipped rather than manually setting the classes to their opposites when the directionality is RTL. * Replace justify-self: left & justify-self: right with justify-self; start and justify-self: end * Remove misguided attempt to emulate directionality-agnosticism with rightAligned class * Explicitly center FreeTube version on About page * Fix question mark reversing logic for Arabic, Hebrew, Persian, and Urdu * Fix minor indentation issue Co-authored-by: absidue <48293849+absidue@users.noreply.github.com> * Remove unused function Co-authored-by: absidue <48293849+absidue@users.noreply.github.com> * Update src/renderer/components/ft-slider/ft-slider.css Co-authored-by: PikachuEXE --------- Co-authored-by: absidue <48293849+absidue@users.noreply.github.com> Co-authored-by: PikachuEXE --- src/renderer/App.css | 18 +- src/renderer/App.js | 10 +- src/renderer/App.vue | 2 +- .../channel-about/channel-about.css | 6 +- .../experimental-settings.css | 4 +- .../ft-age-restricted/ft-age-restricted.scss | 6 +- .../components/ft-button/ft-button.css | 7 +- src/renderer/components/ft-card/ft-card.css | 5 +- .../ft-channel-bubble/ft-channel-bubble.css | 6 +- .../ft-community-poll/ft-community-poll.css | 21 +- .../ft-community-post/ft-community-post.scss | 32 +-- .../ft-icon-button/ft-icon-button.scss | 16 +- .../ft-input-tags/ft-input-tags.css | 9 +- src/renderer/components/ft-input/ft-input.css | 43 ++-- .../components/ft-loader/ft-loader.css | 7 +- .../ft-notification-banner.css | 10 +- .../ft-profile-bubble/ft-profile-bubble.css | 9 +- .../ft-profile-channel-list.css | 4 +- .../ft-profile-edit/ft-profile-edit.css | 13 +- .../ft-profile-filter-channels-list.css | 4 +- .../ft-profile-selector.css | 20 +- .../ft-progress-bar/ft-progress-bar.css | 4 +- .../components/ft-prompt/ft-prompt.css | 9 +- .../ft-radio-button/ft-radio-button.css | 24 +- .../ft-search-filters/ft-search-filters.css | 12 +- .../components/ft-select/ft-select.css | 42 ++-- .../ft-settings-section.scss | 36 +-- .../ft-share-button/ft-share-button.scss | 8 +- .../components/ft-slider/ft-slider.css | 238 +++++++++--------- .../ft-sponsor-block-category.scss | 5 +- .../ft-subscribe-button.css | 2 +- src/renderer/components/ft-toast/ft-toast.css | 6 +- .../ft-toggle-switch/ft-toggle-switch.scss | 20 +- .../components/ft-tooltip/ft-tooltip.css | 55 ++-- .../ft-video-player/ft-video-player.css | 2 +- .../player-settings/player-settings.scss | 5 +- .../playlist-info/playlist-info.scss | 4 +- .../side-nav-more-options.css | 19 +- src/renderer/components/side-nav/side-nav.css | 61 ++--- .../subscriptions-tab-ui.css | 8 +- src/renderer/components/top-nav/top-nav.js | 14 +- src/renderer/components/top-nav/top-nav.scss | 45 ++-- src/renderer/components/top-nav/top-nav.vue | 11 +- .../watch-video-chapters.css | 11 +- .../watch-video-comments.css | 74 +++--- .../watch-video-info/watch-video-info.scss | 46 ++-- .../watch-video-live-chat.css | 64 ++--- .../watch-video-playlist.css | 14 +- src/renderer/scss-partials/_ft-list-item.scss | 37 +-- src/renderer/themes.css | 30 ++- src/renderer/views/About/About.scss | 8 +- src/renderer/views/Channel/Channel.css | 45 ++-- src/renderer/views/Hashtag/Hashtag.css | 5 +- src/renderer/views/History/History.css | 4 +- src/renderer/views/Playlist/Playlist.css | 10 +- src/renderer/views/Popular/Popular.css | 8 +- .../views/ProfileSettings/ProfileSettings.css | 8 +- src/renderer/views/Search/Search.css | 6 +- src/renderer/views/Settings/Settings.css | 3 +- .../SubscribedChannels/SubscribedChannels.css | 11 +- .../views/Subscriptions/Subscriptions.css | 12 +- src/renderer/views/Trending/Trending.css | 16 +- .../views/UserPlaylists/UserPlaylists.css | 4 +- src/renderer/views/Watch/Watch.scss | 38 +-- 64 files changed, 723 insertions(+), 613 deletions(-) diff --git a/src/renderer/App.css b/src/renderer/App.css index e6bceeb967f60..1c616d95969c1 100644 --- a/src/renderer/App.css +++ b/src/renderer/App.css @@ -12,16 +12,19 @@ .routerView { flex: 1 1 0%; - margin: 18px 10px; + margin-block: 18px; + margin-inline: 10px; } .banner { width: 85%; - margin: 20px auto 0; + margin-block: 20px; + margin-inline: auto; } .banner-wrapper { - margin: 0 10px; + margin-block: 0; + margin-inline: 10px; } .flexBox { @@ -45,16 +48,17 @@ @media only screen and (max-width: 680px) { .routerView { - margin: 68px 8px 68px; + margin-block: 68px; + margin-inline: 8px; } .banner { width: 80%; - margin-top: 20px; + margin-block-start: 20px; } .flexBox { - margin-top: 60px; - margin-bottom: -75px; + margin-block-start: 60px; + margin-block-end: -75px; } } diff --git a/src/renderer/App.js b/src/renderer/App.js index 340e7b9825ece..21db0394f2e90 100644 --- a/src/renderer/App.js +++ b/src/renderer/App.js @@ -59,8 +59,9 @@ export default defineComponent({ showProgressBar: function () { return this.$store.getters.getShowProgressBar }, - isRightAligned: function () { - return this.locale === 'ar' || this.locale === 'he' + isLocaleRightToLeft: function () { + return this.locale === 'ar' || this.locale === 'fa' || this.locale === 'he' || + this.locale === 'ur' || this.locale === 'yi' || this.locale === 'ku' }, checkForUpdates: function () { return this.$store.getters.getCheckForUpdates @@ -509,6 +510,11 @@ export default defineComponent({ setLocale: function() { document.documentElement.setAttribute('lang', this.locale) + if (this.isLocaleRightToLeft) { + document.body.dir = 'rtl' + } else { + document.body.dir = 'ltr' + } }, /** diff --git a/src/renderer/App.vue b/src/renderer/App.vue index 84ecb7ba348ab..ed2ec65454021 100644 --- a/src/renderer/App.vue +++ b/src/renderer/App.vue @@ -4,7 +4,7 @@ id="app" :class="{ hideOutlines: hideOutlines, - rightAligned: isRightAligned + isLocaleRightToLeft: isLocaleRightToLeft }" > diff --git a/src/renderer/components/channel-about/channel-about.css b/src/renderer/components/channel-about/channel-about.css index e8e10f4c39861..b7d8b49c9a7f6 100644 --- a/src/renderer/components/channel-about/channel-about.css +++ b/src/renderer/components/channel-about/channel-about.css @@ -1,6 +1,6 @@ .about { background-color: var(--card-bg-color); - margin-top: 0; + margin-block-start: 0; padding: 10px; position: relative; z-index: 1; @@ -34,9 +34,9 @@ } .aboutDetails { - text-align: left; + text-align: start; } .aboutDetails th { - padding-right: 10px; + padding-inline-end: 10px; } diff --git a/src/renderer/components/experimental-settings/experimental-settings.css b/src/renderer/components/experimental-settings/experimental-settings.css index 58e50c3ab6762..3f20bf0554619 100644 --- a/src/renderer/components/experimental-settings/experimental-settings.css +++ b/src/renderer/components/experimental-settings/experimental-settings.css @@ -1,6 +1,6 @@ .experimental-warning { text-align: center; font-weight: bold; - padding-left: 4%; - padding-right: 4% + padding-inline-start: 4%; + padding-inline-end: 4% } diff --git a/src/renderer/components/ft-age-restricted/ft-age-restricted.scss b/src/renderer/components/ft-age-restricted/ft-age-restricted.scss index a30ab65b880bd..34bc140b7e4b9 100644 --- a/src/renderer/components/ft-age-restricted/ft-age-restricted.scss +++ b/src/renderer/components/ft-age-restricted/ft-age-restricted.scss @@ -3,7 +3,8 @@ h2 { background-color: var(--card-bg-color); - padding: 10px 0; + padding-block: 10px; + padding-inline: 0; text-align: center; width: 100%; } @@ -12,7 +13,8 @@ background-color: var(--card-bg-color); font-size: 10em; height: 100%; - padding: 20px 0; + padding-block: 20px; + padding-inline: 0; text-align: center; width: 100%; } diff --git a/src/renderer/components/ft-button/ft-button.css b/src/renderer/components/ft-button/ft-button.css index 49e3a6e1c5757..e37af8dbcbf35 100644 --- a/src/renderer/components/ft-button/ft-button.css +++ b/src/renderer/components/ft-button/ft-button.css @@ -2,7 +2,8 @@ font-family: 'Roboto', sans-serif; min-width: 100px; font-size: 0.9rem; - padding: 10px 20px; + padding-block: 10px; + padding-inline: 20px; box-sizing: border-box; cursor: pointer; display: inline-block; @@ -36,8 +37,8 @@ position: absolute; width: 100%; height: 100%; - top: 0; - left: 0; + inset-block-start: 0; + inset-inline-start: 0; pointer-events: none; background-image: radial-gradient(circle, #fff 10%, transparent 10.01%); background-repeat: no-repeat; diff --git a/src/renderer/components/ft-card/ft-card.css b/src/renderer/components/ft-card/ft-card.css index 7048b65424b4a..b9ef73f8b7f41 100644 --- a/src/renderer/components/ft-card/ft-card.css +++ b/src/renderer/components/ft-card/ft-card.css @@ -1,8 +1,7 @@ .ft-card { background-color: var(--card-bg-color); margin: 8px; - padding: 16px; - padding-top: 3px; - padding-bottom: 16px; + padding-block: 3px 16px; + padding-inline: 16px; box-shadow: 0 1px 2px rgba(0,0,0,.1); } diff --git a/src/renderer/components/ft-channel-bubble/ft-channel-bubble.css b/src/renderer/components/ft-channel-bubble/ft-channel-bubble.css index 4c4b3f57161d4..36128dc741f03 100644 --- a/src/renderer/components/ft-channel-bubble/ft-channel-bubble.css +++ b/src/renderer/components/ft-channel-bubble/ft-channel-bubble.css @@ -34,7 +34,7 @@ .selected { position: absolute; - top: 10px; + inset-block-start: 10px; background-color: rgba(0, 0, 0, 0.5); } @@ -42,8 +42,8 @@ color: #EEEEEE; font-size: 25px; position: absolute; - top: 12px; - left: 12px; + inset-block-start: 12px; + inset-inline-start: 12px; } .channelName { diff --git a/src/renderer/components/ft-community-poll/ft-community-poll.css b/src/renderer/components/ft-community-poll/ft-community-poll.css index a92808a54be03..4466c81766ab3 100644 --- a/src/renderer/components/ft-community-poll/ft-community-poll.css +++ b/src/renderer/components/ft-community-poll/ft-community-poll.css @@ -1,5 +1,5 @@ .vote-count { - padding-bottom: 6px; + padding-block-end: 6px; font-size: smaller; } @@ -9,21 +9,21 @@ border-style: solid; border-width: 2px; display: block; - float: left; + float: var(--float-left-ltr-rtl-value); height: 10px; - left: 5px; + inset-inline-start: 5px; position: relative; - top: 8px; + inset-block-start: 8px; width: 10px; } - + .filled-circle { border-radius: 50%; background-color: black; - float: left; + float: var(--float-left-ltr-rtl-value); height: 6px; - left: 2px; - top: 2px; + inset-inline-start: 2px; + inset-block-start: 2px; position: relative; width: 6px; } @@ -32,11 +32,12 @@ border-radius: 5px; border-style: solid; border-width: 2px; - padding: 5px 25px; + padding-block: 5px; + padding-inline: 25px; } .option { - padding-bottom: 10px; + padding-block-end: 10px; } .correct-option { diff --git a/src/renderer/components/ft-community-post/ft-community-post.scss b/src/renderer/components/ft-community-post/ft-community-post.scss index ad3cf1c875022..6f56df4f4c38c 100644 --- a/src/renderer/components/ft-community-post/ft-community-post.scss +++ b/src/renderer/components/ft-community-post/ft-community-post.scss @@ -22,7 +22,7 @@ -webkit-border-radius: 50%; border-radius: 50%; height: 55px; - margin-right: 5px; + margin-inline-end: 5px; width: 55px; } @@ -32,12 +32,14 @@ .authorName { font-size: 15px; font-weight: bold; - margin: 5px 6px 0 5px; + margin-block: 5px 0; + margin-inline: 5px 6px; } .publishedText { font-size: 15px; - margin: 5px 6px 0 5px; + margin-block: 5px 0; + margin-inline: 5px 6px; } } @@ -51,24 +53,24 @@ display: block; flex-direction: column; font-size: 15px; - margin-top: 4px; + margin-block-start: 4px; max-width: 210px; - text-align: left; + text-align: start; @media screen and (max-width: 680px) { - margin-left: 0; - text-align: left; + margin-inline-start: 0; + text-align: start; } .likeBar { border-radius: 4px; height: 8px; - margin-bottom: 4px; + margin-block-end: 4px; } .likeCount { - margin-left: 5px; - margin-right: 6px; + margin-inline-start: 5px; + margin-inline-end: 6px; } } @@ -77,8 +79,8 @@ .videoThumbnail { display: flex; - margin-bottom: auto; - margin-top: auto; + margin-block-end: auto; + margin-block-start: auto; position: relative; width: fit-content; @@ -91,7 +93,7 @@ } .playlistText { - margin-left: 10px; + margin-inline-start: 10px; width: 50%; word-wrap: break-word; @@ -111,7 +113,7 @@ color: var(--primary-text-color); display: flex; font-size: small; - padding-top: 10px; + padding-block-start: 10px; text-decoration-line: none; width: 100%; } @@ -128,5 +130,5 @@ .ft-list-item.grid { min-height: 0 !important; - padding-bottom: 20px; + padding-block-end: 20px; } diff --git a/src/renderer/components/ft-icon-button/ft-icon-button.scss b/src/renderer/components/ft-icon-button/ft-icon-button.scss index 4bf9ef447298a..076a690f3fc00 100644 --- a/src/renderer/components/ft-icon-button/ft-icon-button.scss +++ b/src/renderer/components/ft-icon-button/ft-icon-button.scss @@ -95,19 +95,19 @@ z-index: 3; &.left { - right: calc(50% - 10px); + inset-inline-end: calc(50% - 10px); } &.right { - left: calc(50% - 10px); + inset-inline-start: calc(50% - 10px); } &.top { - bottom: 45px; + inset-block-end: 45px; } &.bottom { - top: 45px; + inset-block-start: 45px; } .list { @@ -119,7 +119,8 @@ .listItem { cursor: pointer; margin: 0; - padding: 8px 10px; + padding-block: 8px; + padding-inline: 10px; transition: background 0.2s ease-out; white-space: nowrap; @@ -138,8 +139,9 @@ } .listItemDivider { - border-top: 1px solid var(--tertiary-text-color); - margin: 1px auto; + border-block-start: 1px solid var(--tertiary-text-color); + margin-block: 1px; + margin-inline: auto; // Too "visible" with current color opacity: 0.5; width: 95%; diff --git a/src/renderer/components/ft-input-tags/ft-input-tags.css b/src/renderer/components/ft-input-tags/ft-input-tags.css index d5878a42a6204..cc167aba2face 100644 --- a/src/renderer/components/ft-input-tags/ft-input-tags.css +++ b/src/renderer/components/ft-input-tags/ft-input-tags.css @@ -20,13 +20,12 @@ margin: 5px; border-radius: 5px; display:flex; - float: left; + float: var(--float-left-ltr-rtl-value); } .ft-tag-box li>span { - padding-top: 10px; - padding-bottom: 10px; - padding-left: 10px; + padding-block: 10px; + padding-inline-start: 10px; overflow-wrap: break-word; word-wrap: break-word; word-break: break-all; @@ -45,7 +44,7 @@ } :deep(.ft-input-component .ft-input) { - margin-top: 10px; + margin-block-start: 10px; } @media only screen and (max-width: 576px) { diff --git a/src/renderer/components/ft-input/ft-input.css b/src/renderer/components/ft-input/ft-input.css index 07090a95e9594..f7ac9e2145e52 100644 --- a/src/renderer/components/ft-input/ft-input.css +++ b/src/renderer/components/ft-input/ft-input.css @@ -2,23 +2,32 @@ position: relative; } + body[dir='rtl'] .ft-input-component.search.showClearTextButton .inputAction { + inset-inline-end: -30px; + } + + body[dir='rtl'] .ft-input-component.search.clearTextButtonVisible .inputAction, + body[dir='rtl'] .ft-input-component.search.showClearTextButton:focus-within .inputAction { + inset-inline-end: 0; + } + .ft-input-component.search.showClearTextButton { - padding-left: 30px; + padding-inline-start: 30px; } .ft-input-component.search.clearTextButtonVisible, .ft-input-component.search.showClearTextButton:focus-within { - padding-left: 0; + padding-inline-start: 0; } .ft-input-component.showClearTextButton:not(.search) .ft-input { - padding-left: 46px; + padding-inline-start: 46px; } /* Main search input */ .clearTextButtonVisible.search .ft-input, .ft-input-component.search.showClearTextButton:focus-within .ft-input { - padding-left: 46px; + padding-inline-start: 46px; } .ft-input-component:focus-within .clearInputTextButton { @@ -38,11 +47,12 @@ .clearInputTextButton { position: absolute; - top: 5px; - left: 0; + inset-block-start: 5px; + inset-inline-start: 0; /* To be higher than `.inputWrapper` */ z-index: 1; - margin: 0 3px; + margin-block: 0; + margin-inline: 3px; padding: 10px; border-radius: 100%; color: var(--primary-text-color); @@ -70,7 +80,7 @@ } .search .clearInputTextButton { - top: 12px; + inset-block-start: 12px; } .forceTextColor .clearInputTextButton { @@ -89,7 +99,7 @@ width: 100%; padding: 1rem; border: none; - margin-bottom: 10px; + margin-block-end: 10px; font-size: 16px; height: 45px; color: var(--secondary-text-color); @@ -125,10 +135,11 @@ .inputAction { position: absolute; - margin: 0 3px; + margin-block: 0; + margin-inline: 3px; padding: 10px; - top: -8px; - right: 0; + inset-block-start: -8px; + inset-inline-end: 0; border-radius: 100%; color: var(--primary-text-color); /* this should look disabled by default */ @@ -155,7 +166,7 @@ With arrow present means the text might get under the arrow with normal padding */ - padding-right: calc(36px + 6px); + padding-inline-end: calc(36px + 6px); } .inputAction.enabled:hover { @@ -187,7 +198,8 @@ width: 100%; list-style: none; margin: 0; - padding: 5px 0; + padding-block: 5px; + padding-inline: 0; z-index: 10; border-radius: 0 0 5px 5px; word-wrap: break-word; @@ -197,7 +209,8 @@ .list li { display: block; - padding: 0 15px; + padding-block: 0; + padding-inline: 15px; line-height: 2rem; } diff --git a/src/renderer/components/ft-loader/ft-loader.css b/src/renderer/components/ft-loader/ft-loader.css index 9216fc6e7781a..538b43ee85acb 100644 --- a/src/renderer/components/ft-loader/ft-loader.css +++ b/src/renderer/components/ft-loader/ft-loader.css @@ -39,7 +39,8 @@ width: 40px; height: 40px; position: relative; - margin: 100px auto; + margin-block: 100px; + margin-inline: auto; } .double-bounce1, @@ -49,8 +50,8 @@ border-radius: 50%; opacity: 0.6; position: absolute; - top: 0; - left: 0; + inset-block-start: 0; + inset-inline-start: 0; background-color: var(--primary-color); -webkit-animation: sk-bounce 2.0s infinite ease-in-out; diff --git a/src/renderer/components/ft-notification-banner/ft-notification-banner.css b/src/renderer/components/ft-notification-banner/ft-notification-banner.css index fc4d165581095..4bf8377664972 100644 --- a/src/renderer/components/ft-notification-banner/ft-notification-banner.css +++ b/src/renderer/components/ft-notification-banner/ft-notification-banner.css @@ -7,8 +7,8 @@ */ margin: 4px; padding: 16px; - padding-top: 3px; - padding-bottom: 5px; + padding-block: 3px 5px; + padding-inline: 16px; box-shadow: 0 1px 2px rgba(0,0,0,.1); position: relative; cursor: pointer; @@ -19,13 +19,13 @@ } .message { - margin-right: 25px; + margin-inline-end: 25px; cursor: pointer; } .bannerIcon { position: absolute; - top: 35%; - right: 10px; + inset-block-start: 35%; + inset-inline-end: 10px; cursor: pointer; } diff --git a/src/renderer/components/ft-profile-bubble/ft-profile-bubble.css b/src/renderer/components/ft-profile-bubble/ft-profile-bubble.css index 1db16e8fecfe5..c5d0a6afd3666 100644 --- a/src/renderer/components/ft-profile-bubble/ft-profile-bubble.css +++ b/src/renderer/components/ft-profile-bubble/ft-profile-bubble.css @@ -1,7 +1,8 @@ .bubblePadding { width: 100px; height: 115px; - padding: 10px 10px 30px 10px; + padding-block: 10px 30px; + padding-inline: 10px; cursor: pointer; -webkit-transition: background 0.2s ease-out; -moz-transition: background 0.2s ease-out; @@ -20,7 +21,8 @@ .bubble { width: 70px; height: 70px; - margin: 20px auto 5px auto; + margin-block: 20px 5px; + margin-inline: auto; border-radius: 50%; -webkit-border-radius: 50%; } @@ -29,7 +31,8 @@ font-size: 35px; line-height: 1em; text-align: center; - padding: 17.5px 0; + padding-block: 17.5px; + padding-inline: 0; user-select: none; -webkit-user-select: none; } diff --git a/src/renderer/components/ft-profile-channel-list/ft-profile-channel-list.css b/src/renderer/components/ft-profile-channel-list/ft-profile-channel-list.css index ba8f5fc06c845..4beaf2f6b792f 100644 --- a/src/renderer/components/ft-profile-channel-list/ft-profile-channel-list.css +++ b/src/renderer/components/ft-profile-channel-list/ft-profile-channel-list.css @@ -1,5 +1,5 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 15px; + margin-block: 0 15px; + margin-inline: auto; } diff --git a/src/renderer/components/ft-profile-edit/ft-profile-edit.css b/src/renderer/components/ft-profile-edit/ft-profile-edit.css index 3db26c9236a2e..c72cf594982c9 100644 --- a/src/renderer/components/ft-profile-edit/ft-profile-edit.css +++ b/src/renderer/components/ft-profile-edit/ft-profile-edit.css @@ -1,7 +1,7 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 15px; + margin-block: 0 15px; + margin-inline: auto; } .message { @@ -13,13 +13,13 @@ } .bottomMargin { - margin-bottom: 30px; + margin-block-end: 30px; } .colorOptions { max-width: 1000px; - margin: 0 auto; - margin-bottom: 30px; + margin-block: 0 30px; + margin-inline: auto; } .colorOption { @@ -35,7 +35,8 @@ font-size: 50px; line-height: 1em; text-align: center; - padding: 25px 0; + padding-block: 25px; + padding-inline: 0px; user-select: none; -webkit-user-select: none; } diff --git a/src/renderer/components/ft-profile-filter-channels-list/ft-profile-filter-channels-list.css b/src/renderer/components/ft-profile-filter-channels-list/ft-profile-filter-channels-list.css index 7243d3db9ed77..8a902e94724c8 100644 --- a/src/renderer/components/ft-profile-filter-channels-list/ft-profile-filter-channels-list.css +++ b/src/renderer/components/ft-profile-filter-channels-list/ft-profile-filter-channels-list.css @@ -1,7 +1,7 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 30px; + margin-block: 0 30px; + margin-inline: auto; } .selected { diff --git a/src/renderer/components/ft-profile-selector/ft-profile-selector.css b/src/renderer/components/ft-profile-selector/ft-profile-selector.css index 1b8f0c11e55d6..0c2b2acf1536f 100644 --- a/src/renderer/components/ft-profile-selector/ft-profile-selector.css +++ b/src/renderer/components/ft-profile-selector/ft-profile-selector.css @@ -24,8 +24,8 @@ .profileList { display: inline; position: absolute; - top: 60px; - right: 10px; + inset-block-start: 60px; + inset-inline-end: 10px; min-width: 250px; height: 400px; padding: 5px; @@ -34,7 +34,7 @@ } .profileWrapper { - margin-top: 60px; + margin-block-start: 60px; height: 340px; overflow-y: auto; } @@ -57,9 +57,9 @@ } .profile .colorOption { - float: left; + float: var(--float-left-ltr-rtl-value); position: relative; - bottom: 5px; + inset-block-end: 5px; margin: 10px; } @@ -67,18 +67,18 @@ display: flex; align-items: center; height: 50px; - padding-right: 10px; + padding-inline-end: 10px; } .profileListTitle { position: absolute; margin: 0; - left: 10px; + inset-inline-start: 10px; } .profileSettings { - float: right; + float: var(--float-right-ltr-rtl-value); position: absolute; - top: 10px; - right: 5px; + inset-block-start: 10px; + inset-inline-end: 5px; } diff --git a/src/renderer/components/ft-progress-bar/ft-progress-bar.css b/src/renderer/components/ft-progress-bar/ft-progress-bar.css index 43816bd2f3671..8dc334371cfbe 100644 --- a/src/renderer/components/ft-progress-bar/ft-progress-bar.css +++ b/src/renderer/components/ft-progress-bar/ft-progress-bar.css @@ -1,8 +1,8 @@ .progressBar { position: fixed; height: 3px; - bottom: 0px; - left: 0px; + inset-block-end: 0px; + inset-inline-start: 0px; background-color: var(--primary-color); z-index: 1; transition: width 0.5s; diff --git a/src/renderer/components/ft-prompt/ft-prompt.css b/src/renderer/components/ft-prompt/ft-prompt.css index 87e71c4fcf410..ed37a7f7636ff 100644 --- a/src/renderer/components/ft-prompt/ft-prompt.css +++ b/src/renderer/components/ft-prompt/ft-prompt.css @@ -1,7 +1,7 @@ .prompt { position: fixed; - top: 0px; - left: 0px; + inset-block-start: 0px; + inset-inline-start: 0px; width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.7); @@ -15,7 +15,8 @@ .promptCard.autosize { box-sizing: border-box; - margin: 0 auto; + margin-block: 0; + margin-inline: auto; max-width: 95%; } @@ -23,7 +24,7 @@ width: 95%; margin: 0; position: absolute; - left: 2.5%; + inset-inline-start: 2.5%; box-sizing: border-box; } diff --git a/src/renderer/components/ft-radio-button/ft-radio-button.css b/src/renderer/components/ft-radio-button/ft-radio-button.css index 7c5aa29e1254f..670616ecb077e 100644 --- a/src/renderer/components/ft-radio-button/ft-radio-button.css +++ b/src/renderer/components/ft-radio-button/ft-radio-button.css @@ -17,13 +17,13 @@ pure-checkbox input[type="checkbox"], .pure-radiobutton input[type="checkbox"], .pure-checkbox input[type="checkbox"] + label, .pure-radiobutton input[type="checkbox"] + label, .pure-checkbox input[type="radio"] + label, .pure-radiobutton input[type="radio"] + label { position: relative; - padding-left: 2em; + padding-inline-start: 2em; vertical-align: middle; -webkit-user-select: none; user-select: none; cursor: pointer; display: block; - margin-bottom: -20px; + margin-block-end: -20px; } .pure-checkbox input[type="checkbox"] + label:before, .pure-radiobutton input[type="checkbox"] + label:before, .pure-checkbox input[type="radio"] + label:before, .pure-radiobutton input[type="radio"] + label:before { @@ -31,11 +31,11 @@ pure-checkbox input[type="checkbox"], .pure-radiobutton input[type="checkbox"], content: ''; color: var(--primary-color); position: absolute; - top: 50%; - left: 0; + inset-block-start: 50%; + inset-inline-start: 0; width: 14px; height: 14px; - margin-top: -9px; + margin-block-start: -9px; border: 2px solid var(--primary-color); text-align: center; transition: all 0.4s ease; @@ -46,11 +46,11 @@ pure-checkbox input[type="checkbox"], .pure-radiobutton input[type="checkbox"], content: ''; background-color: var(--primary-color); position: absolute; - top: 50%; - left: 4px; + inset-block-start: 50%; + inset-inline-start: 4px; width: 10px; height: 10px; - margin-top: -5px; + margin-block-start: -5px; transform: scale(0); transform-origin: 50%; transition: transform 200ms ease-out; @@ -64,11 +64,11 @@ pure-checkbox input[type="checkbox"], .pure-radiobutton input[type="checkbox"], .pure-checkbox input[type="checkbox"] + label:after, .pure-radiobutton input[type="checkbox"] + label:after { background-color: transparent; - top: 50%; - left: 4px; + inset-block-start: 50%; + inset-inline-start: 4px; width: 8px; height: 3px; - margin-top: -4px; + margin-block-start: -4px; border-style: solid; border-width: 0 0 3px 3px; border-image: none; @@ -103,5 +103,5 @@ borderscale { 50% { } .radioTitle { - margin-bottom: -20px; + margin-block-end: -20px; } diff --git a/src/renderer/components/ft-search-filters/ft-search-filters.css b/src/renderer/components/ft-search-filters/ft-search-filters.css index b9052b3050c85..0159e28feffff 100644 --- a/src/renderer/components/ft-search-filters/ft-search-filters.css +++ b/src/renderer/components/ft-search-filters/ft-search-filters.css @@ -1,9 +1,10 @@ .searchFilterInner { max-width: 800px; - margin-left: auto; - margin-right: auto; + margin-inline-start: auto; + margin-inline-end: auto; - padding: 20px 20px 70px 20px; + padding-block: 20px 70px; + padding-inline: 20px; max-height: 410px; overflow-y: auto; @@ -23,11 +24,12 @@ .radioFlexBox { max-width: 1000px; - margin: 0 auto; + margin-block: 0; + margin-inline: auto; } @media only screen and (max-width: 600px) { .searchRadio { - border-right: 0; + border-inline-end: 0; } } diff --git a/src/renderer/components/ft-select/ft-select.css b/src/renderer/components/ft-select/ft-select.css index 5387cdbbc2cd4..67a822bbf7775 100644 --- a/src/renderer/components/ft-select/ft-select.css +++ b/src/renderer/components/ft-select/ft-select.css @@ -24,8 +24,9 @@ .select { position: relative; width: 200px; - padding: 0px 10px 10px 0; - margin-top: 30px; + padding-block: 0 10px; + padding-inline: 0 10px; + margin-block-start: 30px; } .disabled, .disabled + svg.iconSelect { @@ -39,7 +40,8 @@ background-color: transparent; color: var(--primary-text-color); width: 240px; - padding: 10px 10px 10px 0; + padding-block: 10px; + padding-inline: 0 10px; font-size: 18px; border-radius: 0; border: none; @@ -60,26 +62,26 @@ appearance: none; -webkit-appearance:none; text-overflow: ellipsis; - padding-right: 1.1rem; + padding-inline-end: 1.1rem; } .iconSelect { position: absolute; - top: 10px; - right: 15px; + inset-block-start: 10px; + inset-inline-end: 15px; /* Styling the down arrow */ padding: 0; content: ''; - border-left: 6px solid transparent; - border-right: 6px solid transparent; + border-inline-start: 6px solid transparent; + border-inline-end: 6px solid transparent; pointer-events: none; color: var(--tertiary-text-color); } .selectTooltip { position: absolute; - top: -20px; - right: 17px; + inset-block-start: -20px; + inset-inline-end: 17px; } @@ -88,8 +90,8 @@ font-size: 18px; font-weight: normal; position: absolute; - left: 0; - top: 10px; + inset-inline-start: 0; + inset-block-start: 10px; transition: 0.2s ease all; color: var(--tertiary-text-color); } @@ -97,7 +99,7 @@ /* active state */ .select-text:focus ~ .select-label, .select-text:valid ~ .select-label { color: var(--accent-color); - top: -20px; + inset-block-start: -20px; transition: 0.2s ease all; font-size: 14px; } @@ -113,18 +115,18 @@ content: ''; height: 2px; width: 0; - bottom: 1px; + inset-block-end: 1px; position: absolute; background: var(--accent-color); transition: 0.2s ease all; } .select-bar:before { - left: 50%; + inset-inline-start: 50%; } .select-bar:after { - right: 50%; + inset-inline-end: 50%; } /* active state */ @@ -137,8 +139,8 @@ position: absolute; height: 60%; width: 100px; - top: 25%; - left: 0; + inset-block-start: 25%; + inset-inline-start: 0; pointer-events: none; opacity: 0.5; } @@ -162,6 +164,6 @@ @media only screen and (max-width: 680px) { .select { padding: 0px; - margin-right: -15px; - } + margin-inline-end: -15px; + } } diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.scss b/src/renderer/components/ft-settings-section/ft-settings-section.scss index f22fce69983d7..9fa31bcf8cf44 100644 --- a/src/renderer/components/ft-settings-section/ft-settings-section.scss +++ b/src/renderer/components/ft-settings-section/ft-settings-section.scss @@ -1,6 +1,7 @@ .settingsSection { background-color: var(--card-bg-color); - margin: 0 auto; + margin-block: 0; + margin-inline: auto; width: 85%; @media only screen and (max-width: 800px) { @@ -8,18 +9,19 @@ } &[open] { - padding-bottom: 15px; + padding-block-end: 15px; } > div { box-sizing: border-box; - padding: 0 20px; + padding-block: 0; + padding-inline: 20px; width: 100%; } > div:not(:last-child, .ft-flex-box) { @media only screen and (max-width: 800px) { - margin-bottom: 20px; + margin-block-end: 20px; } } } @@ -28,7 +30,7 @@ background-color: var(--primary-color); border: 0; height: 2px; - margin-top: -1px; + margin-block-start: -1px; width: 100%; } @@ -41,7 +43,7 @@ .sectionTitle { -webkit-user-select: none; user-select: none; - margin-left: 2%; + margin-inline-start: 2%; } :deep(.switchGrid) { @@ -64,7 +66,7 @@ :deep(.switchColumn) { display: flex; flex-direction: column; - justify-items: start; + align-items: start; } :deep(.center) { @@ -87,32 +89,34 @@ .settingsSection { > div { :deep(.text.bottom) { - left: -85px; + inset-inline-start: -85px; } } :deep(.switch-ctn.containsTooltip) { - left: -10px; - margin-right: 5px; - padding: 0 10px; + inset-inline-start: -10px; + margin-inline-end: 5px; + padding-block: 0; + padding-inline: 10px; } :not(.select, .selectLabel) { > :deep(.tooltip) { display: inline-block; position: absolute; - right: -25px; - top: 12px; + inset-inline-end: -25px; + inset-block-start: 12px; } } .settingsFlexStart460px :deep(.tooltip) { - right: 0; - top: -2px; + inset-inline-end: 0; + inset-block-start: -2px; } :deep(.switch-ctn) { - margin: 10px 7px; + margin-block: 10px; + margin-inline: 7px; } } } diff --git a/src/renderer/components/ft-share-button/ft-share-button.scss b/src/renderer/components/ft-share-button/ft-share-button.scss index 3cd776cf697f0..982767c7e26fa 100644 --- a/src/renderer/components/ft-share-button/ft-share-button.scss +++ b/src/renderer/components/ft-share-button/ft-share-button.scss @@ -9,7 +9,8 @@ color: var(--primary-text-color); font-size: 18px; font-weight: bold; - margin: 4px 0 8px; + margin-block: 4px 8px; + margin-inline: 0; } .buttons { @@ -24,7 +25,8 @@ .divider { background: var(--tertiary-text-color); grid-row: span 3; - margin: 0 12px; + margin-block: 0; + margin-inline: 12px; width: 1px; } @@ -61,7 +63,7 @@ background-size: cover; display: inline-block; height: 20px; - margin-right: 2px; + margin-inline-end: 2px; width: 20px; @at-root { diff --git a/src/renderer/components/ft-slider/ft-slider.css b/src/renderer/components/ft-slider/ft-slider.css index b4169819a5365..501d1cddac0c4 100644 --- a/src/renderer/components/ft-slider/ft-slider.css +++ b/src/renderer/components/ft-slider/ft-slider.css @@ -1,250 +1,256 @@ .pure-material-slider { - --pure-material-safari-helper1: var(--accent-color-opacity1); - --pure-material-safari-helper2: var(--accent-color-opacity2); - --pure-material-safari-helper3: var(--accent-color-opacity3); - --pure-material-safari-helper4: var(--accent-color-opacity4); - display: inline-block; - width: 380px; - color: rgba(var(--primary-text-color), 0.87); - font-family: var(--pure-material-font, "Roboto", "Segoe UI", BlinkMacSystemFont, system-ui, -apple-system); - font-size: 16px; - line-height: 1.5; - padding: 5px; - margin: 12px 8px; + --pure-material-safari-helper1: var(--accent-color-opacity1); + --pure-material-safari-helper2: var(--accent-color-opacity2); + --pure-material-safari-helper3: var(--accent-color-opacity3); + --pure-material-safari-helper4: var(--accent-color-opacity4); + display: inline-block; + width: 380px; + color: rgba(var(--primary-text-color), 0.87); + font-family: var(--pure-material-font, "Roboto", "Segoe UI", BlinkMacSystemFont, system-ui, -apple-system); + font-size: 16px; + line-height: 1.5; + padding: 5px; + margin-block: 12px; + margin-inline: 8px; } /* Input */ .pure-material-slider > input { - -webkit-appearance: none; - position: relative; - top: 24px; - display: block; - margin: 0 0 -36px; - width: 100%; - height: 36px; - background-color: transparent; - cursor: pointer; + -webkit-appearance: none; + position: relative; + inset-block-start: 24px; + display: block; + margin-block: 0 -36px; + margin-inline: 0; + width: 100%; + height: 36px; + background-color: transparent; + cursor: pointer; } /* Without Span */ .pure-material-slider > input:last-child { - position: static; - margin: 0; + position: static; + margin: 0; } /* Span */ .pure-material-slider > span { - display: inline-block; - margin-bottom: 36px; + display: inline-block; + margin-block-end: 36px; } /* Focus */ .pure-material-slider > input:focus { - outline: none; + outline: none; } /* Disabled */ .pure-material-slider > input:disabled { - cursor: default; - opacity: 0.38; + cursor: default; + opacity: 0.38; } .pure-material-slider > input:disabled + span { - opacity: 0.38; + opacity: 0.38; } /* Webkit | Track */ .pure-material-slider > input::-webkit-slider-runnable-track { - margin: 17px 0; - border-radius: 1px; - width: 100%; - height: 2px; - background-color: var(--accent-color-opacity4); + margin-block: 17px; + margin-inline: 0; + border-radius: 1px; + width: 100%; + height: 2px; + background-color: var(--accent-color-opacity4); } /* Webkit | Thumb */ .pure-material-slider > input::-webkit-slider-thumb { - appearance: none; - -webkit-appearance: none; - border: none; - border-radius: 50%; - height: 2px; - width: 2px; - background-color: var(--accent-color); - transform: scale(6, 6); - transition: box-shadow 0.2s; + appearance: none; + -webkit-appearance: none; + border: none; + border-radius: 50%; + height: 2px; + width: 2px; + background-color: var(--accent-color); + transform: scale(6, 6); + transition: box-shadow 0.2s; } /* Webkit | Hover, Focus */ .pure-material-slider:hover > input::-webkit-slider-thumb { - box-shadow: 0 0 0 2px var(--pure-material-safari-helper1); + box-shadow: 0 0 0 2px var(--pure-material-safari-helper1); } .pure-material-slider > input:focus::-webkit-slider-thumb { - box-shadow: 0 0 0 2px var(--pure-material-safari-helper2); + box-shadow: 0 0 0 2px var(--pure-material-safari-helper2); } .pure-material-slider:hover > input:focus::-webkit-slider-thumb { - box-shadow: 0 0 0 2px var(--pure-material-safari-helper3); + box-shadow: 0 0 0 2px var(--pure-material-safari-helper3); } /* Webkit | Active */ .pure-material-slider > input:active::-webkit-slider-thumb { - box-shadow: 0 0 0 2px var(--pure-material-safari-helper4) !important; + box-shadow: 0 0 0 2px var(--pure-material-safari-helper4) !important; } /* Webkit | Disabled */ .pure-material-slider > input:disabled::-webkit-slider-runnable-track { - background-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38); + background-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38); } .pure-material-slider > input:disabled::-webkit-slider-thumb { - background-color: rgb(var(--pure-material-onsurface-rgb, 0, 0, 0)); - color: rgb(var(--pure-material-surface-rgb, 255, 255, 255)); /* Safari */ - box-shadow: 0 0 0 1px rgb(var(--pure-material-surface-rgb, 255, 255, 255)) !important; - transform: scale(4, 4); + background-color: rgb(var(--pure-material-onsurface-rgb, 0, 0, 0)); + color: rgb(var(--pure-material-surface-rgb, 255, 255, 255)); /* Safari */ + box-shadow: 0 0 0 1px rgb(var(--pure-material-surface-rgb, 255, 255, 255)) !important; + transform: scale(4, 4); } /* Moz | Track */ .pure-material-slider > input::-moz-range-track { - margin: 17px 0; - border-radius: 1px; - width: 100%; - height: 2px; - background-color: var(--accent-color-opacity4); + margin-block: 0; + margin-auto: 17px; + border-radius: 1px; + width: 100%; + height: 2px; + background-color: var(--accent-color-opacity4); } /* Moz | Thumb */ .pure-material-slider > input::-moz-range-thumb { - appearance: none; - -moz-appearance: none; - border: none; - border-radius: 50%; - height: 2px; - width: 2px; - background-color: var(--accent-color); - transform: scale(6, 6); - transition: box-shadow 0.2s; + appearance: none; + -moz-appearance: none; + border: none; + border-radius: 50%; + height: 2px; + width: 2px; + background-color: var(--accent-color); + transform: scale(6, 6); + transition: box-shadow 0.2s; } /* Moz | Progress */ .pure-material-slider > input::-moz-range-progress { - border-radius: 1px; - height: 2px; - background-color: var(--accent-color); + border-radius: 1px; + height: 2px; + background-color: var(--accent-color); } /* Moz | Hover, Focus */ .pure-material-slider:hover > input:hover::-moz-range-thumb { - box-shadow: 0 0 0 2px var(--accent-color-opacity1); + box-shadow: 0 0 0 2px var(--accent-color-opacity1); } .pure-material-slider > input:focus::-moz-range-thumb { - box-shadow: 0 0 0 2px var(--accent-color-opacity2); + box-shadow: 0 0 0 2px var(--accent-color-opacity2); } .pure-material-slider:hover > input:focus::-moz-range-thumb { - box-shadow: 0 0 0 2px var(--accent-color-opacity3); + box-shadow: 0 0 0 2px var(--accent-color-opacity3); } /* Moz | Active */ .pure-material-slider > input:active::-moz-range-thumb { - box-shadow: 0 0 0 2px var(--accent-color-opacity4) !important; + box-shadow: 0 0 0 2px var(--accent-color-opacity4) !important; } /* Moz | Disabled */ .pure-material-slider > input:disabled::-moz-range-track { - background-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38); + background-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38); } .pure-material-slider > input:disabled::-moz-range-progress { - background-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.87); + background-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.87); } - .pure-material-slider > input:disabled::-moz-range-thumb { - background-color: rgb(var(--pure-material-onsurface-rgb, 0, 0, 0)); - box-shadow: 0 0 0 1px rgb(var(--pure-material-surface-rgb, 255, 255, 255)) !important; - transform: scale(4, 4); + background-color: rgb(var(--pure-material-onsurface-rgb, 0, 0, 0)); + box-shadow: 0 0 0 1px rgb(var(--pure-material-surface-rgb, 255, 255, 255)) !important; + transform: scale(4, 4); } .pure-material-slider > input::-moz-focus-outer { - border: none; + border: none; } /* MS | Track */ .pure-material-slider > input::-ms-track { - box-sizing: border-box; - margin: 17px 0; - border: none; - border-radius: 1px; - padding: 0 17px; - width: 100%; - height: 2px; - background-color: transparent; + box-sizing: border-box; + margin-block: 17px; + margin-inline: 0; + border: none; + border-radius: 1px; + padding-block: 0; + padding-inline: 17px; + width: 100%; + height: 2px; + background-color: transparent; } .pure-material-slider > input::-ms-fill-lower { - border-radius: 1px; - height: 2px; - background-color: var(--accent-color); + border-radius: 1px; + height: 2px; + background-color: var(--accent-color); } /* MS | Progress */ .pure-material-slider > input::-ms-fill-upper { - border-radius: 1px; - height: 2px; - background-color: var(--accent-color-opacity4); + border-radius: 1px; + height: 2px; + background-color: var(--accent-color-opacity4); } /* MS | Thumb */ .pure-material-slider > input::-ms-thumb { - appearance: none; - margin: 0 17px; - border: none; - border-radius: 50%; - height: 2px; - width: 2px; - background-color: var(--accent-color); - transform: scale(6, 6); - transition: box-shadow 0.2s; + appearance: none; + margin-block: 0; + margin-inline: 17px; + border: none; + border-radius: 50%; + height: 2px; + width: 2px; + background-color: var(--accent-color); + transform: scale(6, 6); + transition: box-shadow 0.2s; } /* MS | Hover, Focus */ .pure-material-slider:hover > input::-ms-thumb { - box-shadow: 0 0 0 2px var(--accent-color-opacity1); + box-shadow: 0 0 0 2px var(--accent-color-opacity1); } .pure-material-slider > input:focus::-ms-thumb { - box-shadow: 0 0 0 2px var(--accent-color-opacity2); + box-shadow: 0 0 0 2px var(--accent-color-opacity2); } .pure-material-slider:hover > input:focus::-ms-thumb { - box-shadow: 0 0 0 2px var(--accent-color-opacity3); + box-shadow: 0 0 0 2px var(--accent-color-opacity3); } /* MS | Active */ .pure-material-slider > input:active::-ms-thumb { - box-shadow: 0 0 0 2px var(--accent-color-opacity4) !important; + box-shadow: 0 0 0 2px var(--accent-color-opacity4) !important; } /* MS | Disabled */ .pure-material-slider > input:disabled::-ms-fill-lower { - background-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38); + background-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38); } .pure-material-slider > input:disabled::-ms-fill-upper { - background-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38); - opacity: 0.38; + background-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38); + opacity: 0.38; } .pure-material-slider > input:disabled::-ms-thumb { - background-color: rgb(var(--pure-material-onsurface-rgb, 0, 0, 0)); - box-shadow: 0 0 0 1px rgb(var(--pure-material-surface-rgb, 255, 255, 255)) !important; - transform: scale(4, 4); + background-color: rgb(var(--pure-material-onsurface-rgb, 0, 0, 0)); + box-shadow: 0 0 0 1px rgb(var(--pure-material-surface-rgb, 255, 255, 255)) !important; + transform: scale(4, 4); } @media only screen and (max-width: 680px) { - .pure-material-slider { - width: 100%; - } + .pure-material-slider { + width: 100%; + } } diff --git a/src/renderer/components/ft-sponsor-block-category/ft-sponsor-block-category.scss b/src/renderer/components/ft-sponsor-block-category/ft-sponsor-block-category.scss index 9fff4e5cc826b..3afca0e66b660 100644 --- a/src/renderer/components/ft-sponsor-block-category/ft-sponsor-block-category.scss +++ b/src/renderer/components/ft-sponsor-block-category/ft-sponsor-block-category.scss @@ -1,6 +1,7 @@ .sponsorBlockCategory { - margin-top: 30px; - padding: 0 10px; + margin-block-start: 30px; + padding-block: 0; + padding-inline: 10px; @media only screen and (max-width: 680px) { width: 100%; diff --git a/src/renderer/components/ft-subscribe-button/ft-subscribe-button.css b/src/renderer/components/ft-subscribe-button/ft-subscribe-button.css index 7aff233049d6e..9faeb44025d03 100644 --- a/src/renderer/components/ft-subscribe-button/ft-subscribe-button.css +++ b/src/renderer/components/ft-subscribe-button/ft-subscribe-button.css @@ -1,6 +1,6 @@ .subscribeButton { align-self: center; height: 50%; - margin-bottom: 10px; + margin-block-end: 10px; min-width: 150px; } diff --git a/src/renderer/components/ft-toast/ft-toast.css b/src/renderer/components/ft-toast/ft-toast.css index 686b9c32f2afb..99274cece4058 100644 --- a/src/renderer/components/ft-toast/ft-toast.css +++ b/src/renderer/components/ft-toast/ft-toast.css @@ -1,8 +1,8 @@ .toast-holder { position: fixed; - left: 50vw; - transform: translate(-50%, 0); - bottom: 50px; + inset-inline-start: 50vw; + transform: translate(calc(-50% * var(--horizontal-directionality-coefficient)), 0); + inset-block-end: 50px; z-index: 1; display: flex; flex-direction: column; diff --git a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.scss b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.scss index d116fcf7450e4..dc4207e1675a8 100644 --- a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.scss +++ b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.scss @@ -1,7 +1,8 @@ /* Thanks to Guus Lieben for the Material Design Switch */ .switch-ctn { - margin: 20px 16px; + margin-block: 20px; + margin-inline: 16px; position: relative; &.compact { @@ -12,9 +13,9 @@ .switch-input { appearance: none; height: 20px; - left: -3px; + inset-inline-start: -3px; position: absolute; - top: calc(50% - 3px); + inset-block-start: calc(50% - 3px); transform: translate(0, -50%); width: 34px; } @@ -23,9 +24,10 @@ cursor: pointer; display: inline-block; font-weight: 500; - padding: 12px 0 12px 44px; + padding-block: 12px; + padding-inline: 44px 0; position: relative; - text-align: left; + text-align: start; &::before, &::after { @@ -33,7 +35,7 @@ margin: 0; outline: 0; position: absolute; - top: 50%; + inset-block-start: 50%; transform: translate(0, -50%); transition: all 0.3s ease; } @@ -42,7 +44,7 @@ background-color: #9e9e9e; border-radius: 8px; height: 14px; - left: 1px; + inset-inline-start: 1px; width: 34px; .switch-input:checked + & { @@ -59,12 +61,12 @@ border-radius: 50%; box-shadow: 0 3px 1px -2px rgb(0 0 0 / 14%), 0 2px 2px 0 rgb(0 0 0 / 9.8%), 0 1px 5px 0 rgb(0 0 0 / 8.4%); height: 20px; - left: 0; + inset-inline-start: 0; width: 20px; .switch-input:checked + & { background-color: var(--accent-color); - transform: translate(80%, -50%); + transform: translate(calc(80% * var(--horizontal-directionality-coefficient)), -50%); } .switch-input:disabled + & { diff --git a/src/renderer/components/ft-tooltip/ft-tooltip.css b/src/renderer/components/ft-tooltip/ft-tooltip.css index 3a1977d79983f..7af822570323f 100644 --- a/src/renderer/components/ft-tooltip/ft-tooltip.css +++ b/src/renderer/components/ft-tooltip/ft-tooltip.css @@ -19,8 +19,8 @@ .button:hover + .text.bottom-left, .button:focus + .text.top, .button:hover + .text.top { - -webkit-transform: translate(-50%, 0); - transform: translate(-50%, 0); + -webkit-transform: translate(calc(-50% * var(--horizontal-directionality-coefficient)), 0); + transform: translate(calc(-50% * var(--horizontal-directionality-coefficient)), 0); } .button:focus + .text.left, @@ -41,7 +41,8 @@ max-width: max-content; min-width: 15em; opacity: 0; - padding: 10px 8px; + padding-block: 10px; + padding-inline: 8px; pointer-events: none; position: absolute; text-align: center; @@ -52,43 +53,43 @@ } .text.bottom { - margin-top: 1em; - top: 100%; - left: 50%; - -webkit-transform: translate(-50%, -1em); - transform: translate(-50%, -1em); + margin-block-start: 1em; + inset-block-start: 100%; + inset-inline-start: 50%; + -webkit-transform: translate(calc(-50% * var(--horizontal-directionality-coefficient)), -1em); + transform: translate(calc(-50% * var(--horizontal-directionality-coefficient)), -1em); } .text.bottom-left { - margin-top: 1em; - top: 100%; - left: -100px; + margin-block-start: 1em; + inset-block-start: 100%; + inset-inline-start: -100px; -webkit-transform: translate(-50%, -1em); - transform: translate(-50%, -1em); + transform: translate(calc(-50% * var(--horizontal-directionality-coefficient)), -1em); } .text.left { - margin-right:1em; - right: 100%; - top: 50%; - -webkit-transform: translate(1em, -50%); - transform: translate(1em, -50%); + margin-inline-end:1em; + inset-inline-end: 100%; + inset-block-start: 50%; + -webkit-transform: translate(calc(1em * var(--horizontal-directionality-coefficient)), -50%); + transform: translate(calc(1em * var(--horizontal-directionality-coefficient)), -50%); } .text.right { - left: 100%; - margin-left: 1em; - top: 50%; - -webkit-transform: translate(-1em, -50%); - transform: translate(-1em, -50%); + inset-inline-start: 100%; + margin-inline-start: 1em; + inset-block-start: 50%; + -webkit-transform: translate(calc(-1em * var(--horizontal-directionality-coefficient)), -50%); + transform: translate(calc(-1em * var(--horizontal-directionality-coefficient)), -50%); } .text.top { - bottom: 100%; - left: 50%; - margin-bottom: 1em; - -webkit-transform: translate(-50%, 1em); - transform: translate(-50%, 1em); + inset-block-end: 100%; + inset-inline-start: 50%; + margin-block-end: 1em; + -webkit-transform: translate(calc(-50% * var(--horizontal-directionality-coefficient)), 1em); + transform: translate(calc(-50% * var(--horizontal-directionality-coefficient)), 1em); } .tooltip { diff --git a/src/renderer/components/ft-video-player/ft-video-player.css b/src/renderer/components/ft-video-player/ft-video-player.css index d34fd7dd84118..c751799f90781 100644 --- a/src/renderer/components/ft-video-player/ft-video-player.css +++ b/src/renderer/components/ft-video-player/ft-video-player.css @@ -22,7 +22,7 @@ :deep(.chapterMarker) { height: 100%; - top: 0; + inset-block-start: 0; width: 2px; z-index: 2; background-color: #000; diff --git a/src/renderer/components/player-settings/player-settings.scss b/src/renderer/components/player-settings/player-settings.scss index 246dc136e4685..19bfa9b25f8e9 100644 --- a/src/renderer/components/player-settings/player-settings.scss +++ b/src/renderer/components/player-settings/player-settings.scss @@ -5,7 +5,8 @@ .screenshotFolderContainer { align-items: center; column-gap: 1rem; - margin: 0 auto; + margin-block: 0; + margin-inline: auto; width: 95%; .screenshotFolderLabel, @@ -18,6 +19,6 @@ .screenshotFilenamePatternInput, .screenshotFilenamePatternExample { flex-grow: 1; - margin-top: 10px; + margin-block-start: 10px; } } diff --git a/src/renderer/components/playlist-info/playlist-info.scss b/src/renderer/components/playlist-info/playlist-info.scss index f06dca68fe2e3..ef4e1f6429d5b 100644 --- a/src/renderer/components/playlist-info/playlist-info.scss +++ b/src/renderer/components/playlist-info/playlist-info.scss @@ -21,7 +21,7 @@ } .playlistTitle { - margin-bottom: 0.1em; + margin-block-end: 0.1em; } .playlistDescription { @@ -45,7 +45,7 @@ .channelThumbnail { border-radius: 200px; - float: left; + float: var(--float-left-ltr-rtl-value); width: 40px; } diff --git a/src/renderer/components/side-nav-more-options/side-nav-more-options.css b/src/renderer/components/side-nav-more-options/side-nav-more-options.css index bf70da54812b7..2d3eaf16334cc 100644 --- a/src/renderer/components/side-nav-more-options/side-nav-more-options.css +++ b/src/renderer/components/side-nav-more-options/side-nav-more-options.css @@ -30,7 +30,7 @@ .moreOptionContainer { position: fixed; background-color: var(--side-nav-color); - bottom: 60px; + inset-block-end: 60px; width: 70px; z-index: 0; -webkit-box-shadow: 3px -3px 5px 0px rgba(0,0,0,0.2); @@ -44,33 +44,34 @@ } .sideNav, .closed { - margin-top: 0px; + margin-block-start: 0px; height: 60px; width: 100%; - bottom: 0px; - top: auto; + inset-block-end: 0px; + inset-block-start: auto; overflow-y: inherit; } .navOption, .closed .navOption { width: 70px; height: 40px; - padding: 10px 0px; + padding-block: 10px; + padding-inline: 0; } .navLabel { - margin-left: 0px; + margin-inline-start: 0px; width: 100%; text-align: center; - left: 0px; + inset-inline-start: 0px; font-size: 11px; } .navIcon { - margin-left: 0px; + margin-inline-start: 0px; width: 100%; display: block; - margin-top: 0.5em; + margin-block-start: 0.5em; } .moreOption { diff --git a/src/renderer/components/side-nav/side-nav.css b/src/renderer/components/side-nav/side-nav.css index 1157b67eb6c10..1325afb972e0d 100644 --- a/src/renderer/components/side-nav/side-nav.css +++ b/src/renderer/components/side-nav/side-nav.css @@ -4,8 +4,8 @@ width: 200px; overflow-x: hidden; position: sticky; - left: 0; - top: 60px; + inset-inline-start: 0; + inset-block-start: 60px; z-index: 3; box-shadow: 1px -1px 1px -1px var(--primary-shadow-color); background-color: var(--side-nav-color); @@ -36,7 +36,7 @@ } .topNavOption { - margin-top: 10px; + margin-block-start: 10px; } .navOption, .navChannel { @@ -67,18 +67,18 @@ } .navIcon { - margin-left: 10px; + margin-inline-start: 10px; } .navOption .navLabel { - margin-left: 40px; + margin-inline-start: 40px; overflow: hidden; word-break: break-word; } .navChannel .navLabel { overflow: hidden; - margin-left: 40px; + margin-inline-start: 40px; word-break: break-word; font-size: 12px; } @@ -87,7 +87,7 @@ width: 35px; margin: 0; position: absolute; - top: 50%; + inset-block-start: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); } @@ -116,8 +116,8 @@ .refreshIcon { position: absolute; - top: 20px; - right: 20px; + inset-block-start: 20px; + inset-inline-end: 20px; } .closed .refreshIcon { @@ -126,24 +126,25 @@ .closed .navOption { width: 100%; - padding: 5px 0px; + padding-block: 5px; + padding-inline: 0; } .closed .navIcon { - margin-left: 0px; + margin-inline-start: 0px; width: 100%; display: block; - margin-bottom: 0px; + margin-block-end: 0px; } .closed .navIconExpand{ height:1.3em; } .closed .navLabel { - margin-left: 0px; + margin-inline-start: 0px; width: 100%; text-align: center; - left: 0px; + inset-inline-start: 0px; font-size: 11px; margin-block-end: 0em; } @@ -151,15 +152,17 @@ .closed .navChannel { width: 100%; height: 45px; - padding: 5px 0px; + padding-block: 5px; + padding-inline: 0; } .closed .thumbnailContainer { position: static; display: block; float: none; - margin: 0 auto; - top: 0px; + margin-block: 0; + margin-inline: auto; + inset-block-start: 0px; -ms-transform: none; transform: none; margin-block-start: 0.3em; @@ -177,24 +180,24 @@ .sideNav { position: fixed; - left: 0; - bottom: 0; + inset-inline-start: 0; + inset-block-end: 0; display: flex; } .topNavOption { - margin-top: 0px; - padding-left: 10px; - padding-right: 10px; + margin-block-start: 0px; + padding-inline-start: 10px; + padding-inline-end: 10px; } .sideNav, .closed { - margin-top: 0px; + margin-block-start: 0px; height: 60px; width: 100%; - bottom: 0px; - top: auto; + inset-block-end: 0px; + inset-block-start: auto; overflow-y: hidden; } @@ -202,15 +205,15 @@ width: 70px; height: 40px; padding: 0px; - padding-top: 10px; - padding-bottom: 10px; + padding-block-start: 10px; + padding-block-end: 10px; } .navLabel { - margin-left: 0px; + margin-inline-start: 0px; width: 100%; text-align: center; - left: 0px; + inset-inline-start: 0px; font-size: 11px; } diff --git a/src/renderer/components/subscriptions-tab-ui/subscriptions-tab-ui.css b/src/renderer/components/subscriptions-tab-ui/subscriptions-tab-ui.css index 8c2f61968d9a0..103af5333ec49 100644 --- a/src/renderer/components/subscriptions-tab-ui/subscriptions-tab-ui.css +++ b/src/renderer/components/subscriptions-tab-ui/subscriptions-tab-ui.css @@ -1,7 +1,7 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 60px; + margin-block: 0 60px; + margin-inline: auto; } .message { @@ -10,8 +10,8 @@ .floatingTopButton { position: fixed; - top: 70px; - right: 10px; + inset-block-start: 70px; + inset-inline-end: 10px; } @media only screen and (max-width: 350px) { diff --git a/src/renderer/components/top-nav/top-nav.js b/src/renderer/components/top-nav/top-nav.js index 347d02ab6fc37..801bb2c92da6c 100644 --- a/src/renderer/components/top-nav/top-nav.js +++ b/src/renderer/components/top-nav/top-nav.js @@ -25,6 +25,8 @@ export default defineComponent({ searchFilterValueChanged: false, historyIndex: 1, isForwardOrBack: false, + isArrowBackwardDisabled: true, + isArrowForwardDisabled: true, searchSuggestionsDataList: [], lastSuggestionQuery: '' } @@ -280,8 +282,8 @@ export default defineComponent({ navigateHistory: function () { if (!this.isForwardOrBack) { this.historyIndex = window.history.length - this.$refs.historyArrowBack.classList.remove('fa-arrow-left') - this.$refs.historyArrowForward.classList.add('fa-arrow-right') + this.isArrowBackwardDisabled = false + this.isArrowForwardDisabled = true } else { this.isForwardOrBack = false } @@ -293,9 +295,9 @@ export default defineComponent({ if (this.historyIndex > 1) { this.historyIndex-- - this.$refs.historyArrowForward.classList.remove('fa-arrow-right') + this.isArrowForwardDisabled = false if (this.historyIndex === 1) { - this.$refs.historyArrowBack.classList.add('fa-arrow-left') + this.isArrowBackwardDisabled = true } } }, @@ -306,10 +308,10 @@ export default defineComponent({ if (this.historyIndex < window.history.length) { this.historyIndex++ - this.$refs.historyArrowBack.classList.remove('fa-arrow-left') + this.isArrowBackwardDisabled = false if (this.historyIndex === window.history.length) { - this.$refs.historyArrowForward.classList.add('fa-arrow-right') + this.isArrowForwardDisabled = true } } }, diff --git a/src/renderer/components/top-nav/top-nav.scss b/src/renderer/components/top-nav/top-nav.scss index d1a398a0a953d..03d532e487e12 100644 --- a/src/renderer/components/top-nav/top-nav.scss +++ b/src/renderer/components/top-nav/top-nav.scss @@ -14,11 +14,11 @@ box-shadow: 0 2px 1px 0 var(--primary-shadow-color); display: flex; height: 60px; - left: 0; + inset-inline-start: 0; line-height: 60px; position: sticky; - right: 0; - top: 0; + inset-inline-end: 0; + inset-block-start: 0; width: 100%; z-index: 4; @@ -56,9 +56,10 @@ color: var(--text-with-main-color); } - &.fa-arrow-left, - &.fa-arrow-right { - opacity: 0.4; + &.arrowBackwardDisabled, + &.arrowForwardDisabled { + color: gray; + opacity: 0.5; pointer-events: none; -webkit-user-select: none; user-select: none; @@ -88,7 +89,7 @@ .navFilterIcon { $effect-distance: 10px; - margin-left: $effect-distance; + margin-inline-start: $effect-distance; &.filterChanged { box-shadow: 0 0 $effect-distance var(--primary-color); @@ -103,7 +104,8 @@ align-items: center; display: flex; gap: 3px; - margin: 0 6px; + margin-block: 0; + margin-inline: 6px; &.profiles { justify-content: flex-end; @@ -125,7 +127,8 @@ align-items: center; cursor: pointer; display: flex; - padding: 0 25px 0 10px; + padding-block: 0; + padding-inline: 10px 25px; &:active { background-color: var(--tertiary-text-color); @@ -155,9 +158,9 @@ background-repeat: no-repeat; background-size: 100px; height: 40px; - margin-left: 5px; + margin-inline-start: 5px; position: relative; - top: -3px; + inset-block-start: -3px; width: 100px; @media only screen and (max-width: 680px) { @@ -181,10 +184,10 @@ @media only screen and (max-width: 680px) { background-color: var(--side-nav-color); - left: 0; + inset-inline-start: 0; position: fixed; - right: 0; - top: 60px; + inset-inline-end: 0; + inset-block-start: 60px; @include top-nav-is-colored { background-color: var(--primary-color-hover); @@ -197,16 +200,18 @@ } .searchFilters { - left: 0; - margin: 10px 20px 20px 220px; + inset-inline-start: 0; + margin-block: 10px 20px; + margin-inline: 220px 20px; position: absolute; - right: 0; + inset-inline-end: 0; transition: margin 150ms ease-in-out; @media only screen and (max-width: 680px) { - left: 0; - margin: 95px 10px 0; - right: 0; + inset-inline-start: 0; + margin-block: 95px 0; + margin-inline: 10px; + inset-inline-end: 0; } } } diff --git a/src/renderer/components/top-nav/top-nav.vue b/src/renderer/components/top-nav/top-nav.vue index 291948ec65b7d..03cd544ce1ac6 100644 --- a/src/renderer/components/top-nav/top-nav.vue +++ b/src/renderer/components/top-nav/top-nav.vue @@ -14,8 +14,9 @@ @keydown.enter.prevent="toggleSideNav" /> In order to let ::-webkit-progress-value take effect, appearance needs to be set to none on the element. */ /* https://developer.mozilla.org/en-US/docs/Web/CSS/::-webkit-progress-value */ appearance: none; @@ -40,7 +40,7 @@ width: 20px; font-size: 20px; padding: 10px; - margin-top: -25px; + margin-block-start: -25px; cursor: pointer; border-radius: 50%; color: var(--tertiary-text-color); @@ -70,7 +70,7 @@ } .playlistItem:not(:last-child) { - margin-bottom: 8px; + margin-block-end: 8px; } .playlistItem:hover { @@ -93,7 +93,7 @@ } .videoInfo { - margin-left: 30px; + margin-inline-start: 30px; position: relative; - bottom: 7px; + inset-block-end: 7px; } diff --git a/src/renderer/scss-partials/_ft-list-item.scss b/src/renderer/scss-partials/_ft-list-item.scss index f1a4fbb106bf7..e03c2b2a0fcf3 100644 --- a/src/renderer/scss-partials/_ft-list-item.scss +++ b/src/renderer/scss-partials/_ft-list-item.scss @@ -109,7 +109,7 @@ $watched-transition-duration: 0.5s; align-self: flex-start; background-color: var(--bg-color); color: var(--primary-text-color); - justify-self: left; + justify-self: start; opacity: $thumbnail-overlay-opacity; padding: 2px; pointer-events: none; @@ -121,11 +121,13 @@ $watched-transition-duration: 0.5s; border-radius: 5px; color: var(--primary-text-color); font-size: 15px; - justify-self: right; + justify-self: end; line-height: 1.2; - margin: 0 4px 4px 0; + margin-block: 0 4px; + margin-inline: 0 4px; opacity: $thumbnail-overlay-opacity; - padding: 3px 4px; + padding-block: 3px; + padding-inline: 4px; pointer-events: none; @include is-watch-playlist-item { @@ -141,16 +143,16 @@ $watched-transition-duration: 0.5s; .externalPlayerIcon { align-self: flex-end; font-size: 17px; - justify-self: left; - margin-bottom: 4px; - margin-left: 4px; + justify-self: start; + margin-block-end: 4px; + margin-inline-start: 4px; } .favoritesIcon { font-size: 17px; - justify-self: right; - margin-right: 3px; - margin-top: 3px; + justify-self: end; + margin-inline-end: 3px; + margin-block-start: 3px; height: fit-content; } @@ -166,7 +168,7 @@ $watched-transition-duration: 0.5s; align-self: stretch; display: grid; font-size: 20px; - justify-self: right; + justify-self: end; width: 60px; .background { @@ -229,8 +231,9 @@ $watched-transition-duration: 0.5s; .infoLine { font-size: 14px; grid-area: infoLine; - margin-top: 5px; + margin-block-start: 5px; overflow-wrap: anywhere; + text-align: start; @include is-sidebar-item { font-size: 12px; @@ -261,13 +264,13 @@ $watched-transition-duration: 0.5s; @include is-sidebar-item { .videoThumbnail { - margin-right: 10px; + margin-inline-end: 10px; } } .videoThumbnail, .channelThumbnail { - margin-right: 20px; + margin-inline-end: 20px; } .channelThumbnail { @@ -279,11 +282,11 @@ $watched-transition-duration: 0.5s; display: flex; flex-direction: column; min-height: 230px; - padding-bottom: 20px; + padding-block-end: 20px; .videoThumbnail, .channelThumbnail { - margin-bottom: 12px; + margin-block-end: 12px; .thumbnailImage { width: 100%; @@ -296,7 +299,7 @@ $watched-transition-duration: 0.5s; .infoLine { font-size: 13px; - margin-top: 8px; + margin-block-start: 8px; } } diff --git a/src/renderer/themes.css b/src/renderer/themes.css index 038ec5dc03e54..a59f26f6d9de7 100644 --- a/src/renderer/themes.css +++ b/src/renderer/themes.css @@ -1003,6 +1003,32 @@ it can be safely elided. This looks quite pleasant on this theme. */ --accent-color-opacity4: rgba(180,190,254,0.24); } +body[dir='ltr'] { + --ltr-or-rtl: ltr; + --float-left-ltr-rtl-value: left; + --float-right-ltr-rtl-value: right; + --horizontal-directionality-coefficient: 1; +} + +body[dir='rtl'] { + --ltr-or-rtl: rtl; + --float-left-ltr-rtl-value: right; + --float-right-ltr-rtl-value: left; + --horizontal-directionality-coefficient: -1; +} + +body[dir='rtl'] [data-prefix="fas"]:not([data-icon="magnifying-glass"]):not([data-icon="circle-question"]) { + transform: scale(-1,1); +} + +/* Arabic, Kurdish, Persian and Urdu have a reversed question mark, but not Hebrew and Yiddish */ +html[lang='ar'] [data-prefix="fas"][data-icon="circle-question"], +html[lang='fa'] [data-prefix="fas"][data-icon="circle-question"], +html[lang='ku'] [data-prefix="fas"][data-icon="circle-question"], +html[lang='ur'] [data-prefix="fas"][data-icon="circle-question"] { + transform: scale(-1, 1) +} + body { margin: 0; min-height: 100vh; @@ -1020,10 +1046,6 @@ body { outline: none; } -.rightAligned { - text-align: right; -} - a:link { color: var(--link-color); } diff --git a/src/renderer/views/About/About.scss b/src/renderer/views/About/About.scss index 5d683607044e9..a03e061095f0e 100644 --- a/src/renderer/views/About/About.scss +++ b/src/renderer/views/About/About.scss @@ -1,6 +1,6 @@ .card { - margin: 0 auto; - margin-bottom: 60px; + margin-block: 0 60px; + margin-inline: auto; width: 85%; @media only screen and (max-width: 680px) { @@ -18,6 +18,7 @@ } .version { + text-align: center; font-size: 2em; } @@ -25,7 +26,8 @@ display: grid; grid-gap: 16px; grid-template-columns: 1fr 1fr; - margin: 80px auto; + margin-block: 80; + margin-inline: auto; max-width: 860px; @media only screen and (max-width: 650px) { diff --git a/src/renderer/views/Channel/Channel.css b/src/renderer/views/Channel/Channel.css index 190fd2e8ad7e8..77d807acd49aa 100644 --- a/src/renderer/views/Channel/Channel.css +++ b/src/renderer/views/Channel/Channel.css @@ -1,7 +1,8 @@ .card { position: relative; width: 85%; - margin: 0 auto 20px; + margin-block: 0 20px; + margin-inline: auto; box-sizing: border-box; } @@ -28,8 +29,9 @@ .channelInfoContainer { position: relative; background-color: var(--card-bg-color); - margin-top: 10px; - padding: 0 16px; + margin-block-start: 10px; + padding-block: 0; + padding-inline: 16px; } .channelInfo { @@ -40,7 +42,7 @@ } .channelInfoHasError { - padding-bottom: 10px; + padding-block-end: 10px; } .channelThumbnail { @@ -59,8 +61,8 @@ .channelSubCount { color: var(--tertiary-text-color); - top: 50px; - left: 120px; + inset-block-start: 50px; + inset-inline-start: 120px; } .channelInfoActionsContainer { @@ -75,13 +77,13 @@ .channelSearch { width: 220px; - margin-left: auto; + margin-inline-start: auto; align-self: flex-end; flex: 1 1 0%; } .sortSelect { - margin-left: auto; + margin-inline-start: auto; } .channelInfoTabs { @@ -90,7 +92,8 @@ height: auto; justify-content: unset; gap: 32px; - padding: .3em 0; + padding-block: .3em; + padding-inline: 0; } .tabs { @@ -106,29 +109,29 @@ align-self: flex-end; text-align: center; color: var(--tertiary-text-color); - border-bottom: 3px solid transparent; + border-block-end: 3px solid transparent; } .tab:hover, .tab:focus { font-weight: bold; - border-bottom: 3px solid var(--tertiary-text-color); + border-block-end: 3px solid var(--tertiary-text-color); } .selectedTab { color: var(--primary-text-color); - border-bottom: 3px solid var(--primary-color); + border-block-end: 3px solid var(--primary-color); font-weight: bold; box-sizing: border-box; } .channelSearch { - margin-top: 10px; + margin-block-start: 10px; max-width: 250px; } .elementListLoading { - margin-top: 200px; + margin-block-start: 200px; } .message { @@ -142,7 +145,7 @@ line-height: 45px; text-align: center; cursor: pointer; - margin-top: 16px; + margin-block-start: 16px; } .thumbnailContainer { @@ -153,7 +156,7 @@ display: flex; justify-content: center; flex-direction: column; - padding-left: 1em; + padding-inline-start: 1em; } .channelLineContainer h1, @@ -171,13 +174,13 @@ .ft-community-image { display: block; - margin-left: auto; - margin-right: auto; + margin-inline-start: auto; + margin-inline-end: auto; } .community-post-container { - padding-left: 30%; - padding-right: 30%; + padding-inline-start: 30%; + padding-inline-end: 30%; } @media only screen and (max-width: 800px) { @@ -195,6 +198,6 @@ overflow-x: scroll; } #communityPanel { - margin-top: 1rem; + margin-block-start: 1rem; } } diff --git a/src/renderer/views/Hashtag/Hashtag.css b/src/renderer/views/Hashtag/Hashtag.css index d511fd4473953..33f866ba4d97c 100644 --- a/src/renderer/views/Hashtag/Hashtag.css +++ b/src/renderer/views/Hashtag/Hashtag.css @@ -5,7 +5,7 @@ line-height: 45px; text-align: center; cursor: pointer; - margin-top: 16px; + margin-block-start: 16px; } .getNextPage:hover, .getNextPage:focus { @@ -14,7 +14,8 @@ } .card { - margin: 0 auto 20px; + margin-block: 0 20px; + margin-inline: auto; width: 85%; } diff --git a/src/renderer/views/History/History.css b/src/renderer/views/History/History.css index b6db9095ce937..924a994f96e38 100644 --- a/src/renderer/views/History/History.css +++ b/src/renderer/views/History/History.css @@ -1,7 +1,7 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 60px; + margin-block: 0 60px; + margin-inline: auto; } .message { diff --git a/src/renderer/views/Playlist/Playlist.css b/src/renderer/views/Playlist/Playlist.css index f762bfc71f93d..59550e3a65ca8 100644 --- a/src/renderer/views/Playlist/Playlist.css +++ b/src/renderer/views/Playlist/Playlist.css @@ -6,11 +6,11 @@ background-color: var(--card-bg-color); box-sizing: border-box; height: calc(100vh - 132px); - margin-right: 1em; + margin-inline-end: 1em; overflow-y: auto; padding: 10px; position: sticky; - top: 96px; + inset-block-start: 96px; width: 30%; } @@ -40,8 +40,8 @@ } :deep(.videoThumbnail) { - margin-top: auto; - margin-bottom: auto; + margin-block-start: auto; + margin-block-end: auto; } :deep(.thumbnailImage) { @@ -56,7 +56,7 @@ .playlistInfo { box-sizing: border-box; position: relative; - top: 0; + inset-block-start: 0; height: auto; width: 100%; } diff --git a/src/renderer/views/Popular/Popular.css b/src/renderer/views/Popular/Popular.css index a08e05caeaca8..ac963d12e854d 100644 --- a/src/renderer/views/Popular/Popular.css +++ b/src/renderer/views/Popular/Popular.css @@ -1,13 +1,13 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 60px; + margin-block: 0 60px; + margin-inline: auto; } .floatingTopButton { position: fixed; - top: 70px; - right: 10px; + inset-block-start: 70px; + inset-inline-end: 10px; } @media only screen and (max-width: 350px) { diff --git a/src/renderer/views/ProfileSettings/ProfileSettings.css b/src/renderer/views/ProfileSettings/ProfileSettings.css index 670ae2a98f8da..ae0b80968567b 100644 --- a/src/renderer/views/ProfileSettings/ProfileSettings.css +++ b/src/renderer/views/ProfileSettings/ProfileSettings.css @@ -1,7 +1,7 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 60px; + margin-block: 0 60px; + margin-inline: auto; } .message { @@ -10,8 +10,8 @@ .profileList { max-width: 1000px; - margin: 0 auto; - margin-bottom: 10px; + margin-block: 0 10px; + margin-inline: auto; } @media only screen and (max-width: 680px) { diff --git a/src/renderer/views/Search/Search.css b/src/renderer/views/Search/Search.css index 9224332692460..a862a4bbc6528 100644 --- a/src/renderer/views/Search/Search.css +++ b/src/renderer/views/Search/Search.css @@ -5,7 +5,7 @@ line-height: 45px; text-align: center; cursor: pointer; - margin-top: 16px; + margin-block-start: 16px; } .getNextPage:hover, .getNextPage:focus { @@ -15,8 +15,8 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 60px; + margin-block: 0 60px; + margin-inline: auto; } @media only screen and (max-width: 680px) { diff --git a/src/renderer/views/Settings/Settings.css b/src/renderer/views/Settings/Settings.css index c308b9a836525..ef60230187c1c 100644 --- a/src/renderer/views/Settings/Settings.css +++ b/src/renderer/views/Settings/Settings.css @@ -1,7 +1,8 @@ hr { height: 2px; width: 85%; - margin: 0 auto; + margin-block: 0; + margin-inline: auto; border: 0; background-color: var(--scrollbar-color-hover); } diff --git a/src/renderer/views/SubscribedChannels/SubscribedChannels.css b/src/renderer/views/SubscribedChannels/SubscribedChannels.css index 78781b0371bed..aefeadce2bf30 100644 --- a/src/renderer/views/SubscribedChannels/SubscribedChannels.css +++ b/src/renderer/views/SubscribedChannels/SubscribedChannels.css @@ -1,7 +1,7 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 60px; + margin-block: 0 60px; + margin-inline: auto; } .message { @@ -9,7 +9,7 @@ } .count { - margin-top: 1rem; + margin-block-start: 1rem; } .channels { @@ -17,7 +17,7 @@ display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr) ); gap: 2.5rem; - margin-top: 2rem; + margin-block-start: 2rem; } .channel { @@ -52,7 +52,8 @@ display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; - padding: 0 4px; + padding-block: 0; + padding-inline: 4px; } .unsubscribeContainer { diff --git a/src/renderer/views/Subscriptions/Subscriptions.css b/src/renderer/views/Subscriptions/Subscriptions.css index 3e37187ae8802..21a6d79aea7ea 100644 --- a/src/renderer/views/Subscriptions/Subscriptions.css +++ b/src/renderer/views/Subscriptions/Subscriptions.css @@ -1,7 +1,7 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 60px; + margin-block: 0 60px; + margin-inline: auto; } .message { @@ -10,17 +10,17 @@ .subscriptionTabs { width: 100%; - margin-top: -3px; + margin-block-start: -3px; color: var(--tertiary-text-color); - margin-bottom: 10px; + margin-block-end: 10px; } .selectedTab { - border-bottom: 3px solid var(--primary-color); + border-block-end: 3px solid var(--primary-color); color: var(--primary-text-color); font-weight: bold; box-sizing: border-box; - margin-bottom: -3px; + margin-block-end: -3px; } .tab { diff --git a/src/renderer/views/Trending/Trending.css b/src/renderer/views/Trending/Trending.css index 3f5bf94dc39cb..51640fed1f5f4 100644 --- a/src/renderer/views/Trending/Trending.css +++ b/src/renderer/views/Trending/Trending.css @@ -1,30 +1,30 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 60px; + margin-block: 0 60px; + margin-inline: auto; } .floatingTopButton { position: fixed; - top: 70px; - right: 10px; + inset-block-start: 70px; + inset-inline-end: 10px; } .trendingInfoTabs { width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; - margin-top: -3px; + margin-block-start: -3px; color: var(--tertiary-text-color); - margin-bottom: 10px; + margin-block-end: 10px; } .selectedTab { - border-bottom: 3px solid var(--primary-color); + border-block-end: 3px solid var(--primary-color); color: var(--primary-text-color); font-weight: bold; box-sizing: border-box; - margin-bottom: -3px; + margin-block-end: -3px; } .tab { diff --git a/src/renderer/views/UserPlaylists/UserPlaylists.css b/src/renderer/views/UserPlaylists/UserPlaylists.css index b6db9095ce937..924a994f96e38 100644 --- a/src/renderer/views/UserPlaylists/UserPlaylists.css +++ b/src/renderer/views/UserPlaylists/UserPlaylists.css @@ -1,7 +1,7 @@ .card { width: 85%; - margin: 0 auto; - margin-bottom: 60px; + margin-block: 0 60px; + margin-inline: auto; } .message { diff --git a/src/renderer/views/Watch/Watch.scss b/src/renderer/views/Watch/Watch.scss index 90e5360a4993f..97f3661c54c38 100644 --- a/src/renderer/views/Watch/Watch.scss +++ b/src/renderer/views/Watch/Watch.scss @@ -36,7 +36,8 @@ grid-area: video; .videoAreaMargin { - margin: 0 0 16px; + margin-block: 0 16px; + margin-inline: 0; } .videoPlayer { @@ -53,22 +54,25 @@ align-items: center; background-color: rgb(0 0 0 / 80%); border-radius: 5px; - bottom: 12px; + inset-block-end: 12px; color: #fff; display: flex; height: 60px; - left: 12px; - padding: 0 12px; + inset-inline-start: 12px; + padding-block: 0; + padding-inline: 12px; position: absolute; .premiereIcon { - float: left; + float: var(--float-left-ltr-rtl-value); font-size: 25px; - margin: 0 12px; + margin-block: 0; + margin-inline: 12px; } .premiereText { - margin: 0 12px; + margin-block: 0; + margin-inline: 12px; min-width: 200px; .premiereTextTimestamp { @@ -82,7 +86,8 @@ .watchVideo { grid-column: 1; - margin: 0 0 16px; + margin-block: 0 16px; + margin-inline: 0; } .infoArea { @@ -105,7 +110,8 @@ .watchVideoPlaylist, .watchVideoSidebar, .theatrePlaylist { - margin: 0 8px 16px; + margin-block: 0 16px; + margin-inline: 8px; } .watchVideoSidebar, @@ -115,8 +121,8 @@ .watchVideoPlaylist { :deep(.videoThumbnail) { - margin-top: auto; - margin-bottom: auto; + margin-block-start: auto; + margin-block-end: auto; } @media (max-width: 768px) { height: auto; @@ -125,10 +131,12 @@ .watchVideoRecommendations, .theatreRecommendations { - margin: 0 0 16px; + margin-block: 0 16px; + margin-inline: 0; @media only screen and (min-width: 901px) { - margin: 0 8px 16px; + margin-block: 0 16px; + margin-inline: 8px; } } @@ -148,12 +156,12 @@ @media only screen and (min-width: 901px) { .infoArea { - scroll-margin-top: 76px; + scroll-margin-block-start: 76px; } .infoAreaSticky { position: sticky; - top: 76px; + inset-block-start: 76px; } } } From c7025b648c21c479dd89076057e579547381a062 Mon Sep 17 00:00:00 2001 From: ChunkyProgrammer <78101139+ChunkyProgrammer@users.noreply.github.com> Date: Sat, 9 Sep 2023 12:32:59 -0400 Subject: [PATCH 028/176] Search: Add hashtags to results (#3780) * Add hashtags to search results * add global count , implement changes from code review Co-Authored-By: absidue <48293849+absidue@users.noreply.github.com> * use h3 for title of hashtag element * implement suggestions from code review * use hashtag.text, move url update logic * encodeURI for hashtag url --------- Co-authored-by: absidue <48293849+absidue@users.noreply.github.com> --- .../ft-element-list/ft-element-list.vue | 2 +- .../ft-list-hashtag/ft-list-hashtag.js | 44 ++++++++++++++++ .../ft-list-hashtag/ft-list-hashtag.scss | 6 +++ .../ft-list-hashtag/ft-list-hashtag.vue | 51 +++++++++++++++++++ .../ft-list-lazy-wrapper.js | 4 +- .../ft-list-lazy-wrapper.vue | 5 ++ src/renderer/helpers/api/local.js | 13 ++++- src/renderer/main.js | 2 + src/renderer/views/Search/Search.js | 2 +- static/locales/en-US.yaml | 3 ++ 10 files changed, 128 insertions(+), 4 deletions(-) create mode 100644 src/renderer/components/ft-list-hashtag/ft-list-hashtag.js create mode 100644 src/renderer/components/ft-list-hashtag/ft-list-hashtag.scss create mode 100644 src/renderer/components/ft-list-hashtag/ft-list-hashtag.vue diff --git a/src/renderer/components/ft-element-list/ft-element-list.vue b/src/renderer/components/ft-element-list/ft-element-list.vue index 22c4a343fadad..5bdb836059ef1 100644 --- a/src/renderer/components/ft-element-list/ft-element-list.vue +++ b/src/renderer/components/ft-element-list/ft-element-list.vue @@ -4,7 +4,7 @@ > +
+
+ +
+
+ +

+ {{ title }} +

+
+
+ + {{ $tc('Global.Counts.Channel Count', channelCount, {count: parsedChannelCount}) }} + + + + {{ $tc('Global.Counts.Video Count', videoCount, {count: parsedVideosCount}) }} + +
+
+
+ + +