From 0f3ae7ab9b3f85ab569d502e2f8f82f18589c70a Mon Sep 17 00:00:00 2001
From: Jason Henriquez <jasonhenriquez@protonmail.com>
Date: Fri, 27 Oct 2023 19:00:52 -0500
Subject: [PATCH] Remove unneeded vendor-specific transition prefixes

See discussion here: https://www.web-plus-plus.com/Articles/css-transition-moz-and-webkit-vs-css3
---
 .../components/ft-channel-bubble/ft-channel-bubble.css    | 5 -----
 src/renderer/components/ft-input/ft-input.css             | 8 --------
 .../components/ft-profile-bubble/ft-profile-bubble.css    | 5 -----
 .../ft-profile-selector/ft-profile-selector.css           | 5 -----
 .../components/ft-subscribe-button/ft-subscribe-button.js | 2 +-
 .../ft-subscribe-button/ft-subscribe-button.scss          | 5 -----
 .../ft-subscribe-button/ft-subscribe-button.vue           | 8 ++++----
 .../side-nav-more-options/side-nav-more-options.css       | 4 ----
 src/renderer/components/side-nav/side-nav.css             | 4 ----
 9 files changed, 5 insertions(+), 41 deletions(-)

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 fcb7b96e50df7..1a4878d64cb3c 100644
--- a/src/renderer/components/ft-channel-bubble/ft-channel-bubble.css
+++ b/src/renderer/components/ft-channel-bubble/ft-channel-bubble.css
@@ -11,17 +11,12 @@
   overflow: hidden;
   color: inherit;
   text-decoration: none;
-  -webkit-transition: background 0.2s ease-out;
-  -moz-transition: background 0.2s ease-out;
-  -o-transition: background 0.2s ease-out;
   transition: background 0.2s ease-out;
 }
 
 .bubblePadding:hover {
   background-color: var(--side-nav-hover-color);
   color: var(--side-nav-hover-text-color);
-  -moz-transition: background 0.2s ease-in;
-  -o-transition: background 0.2s ease-in;
   transition: background 0.2s ease-in;
 }
 
diff --git a/src/renderer/components/ft-input/ft-input.css b/src/renderer/components/ft-input/ft-input.css
index a458b9869336d..4d383d327244e 100644
--- a/src/renderer/components/ft-input/ft-input.css
+++ b/src/renderer/components/ft-input/ft-input.css
@@ -57,8 +57,6 @@
   border-radius: 100%;
   color: var(--primary-text-color);
   opacity: 0;
-  -moz-transition: background 0.2s ease-in;
-  -o-transition: background 0.2s ease-in;
   transition: background 0.2s ease-in;
 }
 
@@ -74,8 +72,6 @@
 .clearInputTextButton.visible:active {
   background-color: var(--tertiary-text-color);
   color: var(--side-nav-active-text-color);
-  -moz-transition: background 0.2s ease-in;
-  -o-transition: background 0.2s ease-in;
   transition: background 0.2s ease-in;
 }
 
@@ -172,8 +168,6 @@
 .inputAction.enabled:hover {
   background-color: var(--side-nav-hover-color);
   color: var(--side-nav-hover-text-color);
-  -moz-transition: background 0.2s ease-in;
-  -o-transition: background 0.2s ease-in;
   transition: background 0.2s ease-in;
 }
 
@@ -184,8 +178,6 @@
 .inputAction.enabled:active {
   background-color: var(--tertiary-text-color);
   color: var(--side-nav-active-text-color);
-  -moz-transition: background 0.2s ease-in;
-  -o-transition: background 0.2s ease-in;
   transition: background 0.2s ease-in;
 }
 
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 a3266e01b7c1d..024da1567200b 100644
--- a/src/renderer/components/ft-profile-bubble/ft-profile-bubble.css
+++ b/src/renderer/components/ft-profile-bubble/ft-profile-bubble.css
@@ -4,17 +4,12 @@
   padding-block: 10px 30px;
   padding-inline: 10px;
   cursor: pointer;
-  -webkit-transition: background 0.2s ease-out;
-  -moz-transition: background 0.2s ease-out;
-  -o-transition: background 0.2s ease-out;
   transition: background 0.2s ease-out;
 }
 
 .bubblePadding:hover {
   background-color: var(--side-nav-hover-color);
   color: var(--side-nav-hover-text-color);
-  -moz-transition: background 0.2s ease-in;
-  -o-transition: background 0.2s ease-in;
   transition: background 0.2s ease-in;
 }
 
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 94ee6e91d376e..19c39f6d31e15 100644
--- a/src/renderer/components/ft-profile-selector/ft-profile-selector.css
+++ b/src/renderer/components/ft-profile-selector/ft-profile-selector.css
@@ -42,17 +42,12 @@
 .profile {
   cursor: pointer;
   block-size: 50px;
-  -webkit-transition: background 0.2s ease-out;
-  -moz-transition: background 0.2s ease-out;
-  -o-transition: background 0.2s ease-out;
   transition: background 0.2s ease-out;
 }
 
 .profile:hover {
   background-color: var(--side-nav-hover-color);
   color: var(--side-nav-hover-text-color);
-  -moz-transition: background 0.2s ease-in;
-  -o-transition: background 0.2s ease-in;
   transition: background 0.2s ease-in;
 }
 
diff --git a/src/renderer/components/ft-subscribe-button/ft-subscribe-button.js b/src/renderer/components/ft-subscribe-button/ft-subscribe-button.js
index aff9a9a71b29f..a8ab091770e86 100644
--- a/src/renderer/components/ft-subscribe-button/ft-subscribe-button.js
+++ b/src/renderer/components/ft-subscribe-button/ft-subscribe-button.js
@@ -51,7 +51,7 @@ export default defineComponent({
       return this.$store.getters.getProfileList
     },
 
-    /* sort by 'All Channels' -> active profile -> unsubscribed channels -> unsubscribed channels */
+    /* sort by 'All Channels' -> active profile -> unsubscribed channels -> subscribed channels */
     profileDisplayList: function () {
       const mainProfileAndActiveProfile = [this.profileList[0]]
       if (this.activeProfile._id !== MAIN_PROFILE_ID) {
diff --git a/src/renderer/components/ft-subscribe-button/ft-subscribe-button.scss b/src/renderer/components/ft-subscribe-button/ft-subscribe-button.scss
index 303dbccc94f5a..1d8667fa14491 100644
--- a/src/renderer/components/ft-subscribe-button/ft-subscribe-button.scss
+++ b/src/renderer/components/ft-subscribe-button/ft-subscribe-button.scss
@@ -94,16 +94,11 @@
     padding-inline-start: 0.5em;
     block-size: 50px;
     align-items: center;
-    -webkit-transition: background 0.2s ease-out;
-    -moz-transition: background 0.2s ease-out;
-    -o-transition: background 0.2s ease-out;
     transition: background 0.2s ease-out;
 
     &:hover {
       background-color: var(--side-nav-hover-color);
       color: var(--side-nav-hover-text-color);
-      -moz-transition: background 0.2s ease-in;
-      -o-transition: background 0.2s ease-in;
       transition: background 0.2s ease-in;
     }
 
diff --git a/src/renderer/components/ft-subscribe-button/ft-subscribe-button.vue b/src/renderer/components/ft-subscribe-button/ft-subscribe-button.vue
index 822a5c277eb15..7aded099d7e89 100644
--- a/src/renderer/components/ft-subscribe-button/ft-subscribe-button.vue
+++ b/src/renderer/components/ft-subscribe-button/ft-subscribe-button.vue
@@ -42,13 +42,13 @@
         >
           <li
             v-for="(profile, index) in profileDisplayList"
-            :id="'profile-' + index"
-            :key="'subscription-profile-' + index"
+            :id="'subscription-profile-' + index"
+            :key="index"
             class="profile"
             :class="{
               subscribed: isProfileSubscribed(profile)
             }"
-            :aria-labelledby="'profile-' + index + '-name'"
+            :aria-labelledby="'subscription-profile-' + index + '-name'"
             :aria-selected="isActiveProfile(profile)"
             :aria-checked="isProfileSubscribed(profile)"
             tabindex="0"
@@ -67,7 +67,7 @@
               </div>
             </div>
             <p
-              :id="'profile-' + index + '-name'"
+              :id="'subscription-profile-' + index + '-name'"
               class="profileName"
             >
               {{ profile.name }}
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 6da86c064ea0d..4945a84ecde27 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
@@ -14,16 +14,12 @@
 .navOption:hover {
   background-color: var(--side-nav-hover-color);
   color: var(--side-nav-hover-text-color);
-  -moz-transition: background 0.2s ease-in;
-  -o-transition: background 0.2s ease-in;
   transition: background 0.2s ease-in;
 }
 
 .navOption:active {
   background-color: var(--side-nav-active-color);
   color: var(--side-nav-active-text-color);
-  -moz-transition: background 0.2s ease-in;
-  -o-transition: background 0.2s ease-in;
   transition: background 0.2s ease-in;
 }
 
diff --git a/src/renderer/components/side-nav/side-nav.css b/src/renderer/components/side-nav/side-nav.css
index de36a3f621bf5..a9a869114a770 100644
--- a/src/renderer/components/side-nav/side-nav.css
+++ b/src/renderer/components/side-nav/side-nav.css
@@ -53,16 +53,12 @@
 .navOption:hover, .navChannel:hover {
   background-color: var(--side-nav-hover-color);
   color: var(--side-nav-hover-text-color);
-  -moz-transition: background 0.2s ease-in;
-  -o-transition: background 0.2s ease-in;
   transition: background 0.2s ease-in;
 }
 
 .navOption:active, .navChannel:active {
   background-color: var(--side-nav-active-color);
   color: var(--side-nav-active-text-color);
-  -moz-transition: background 0.2s ease-in;
-  -o-transition: background 0.2s ease-in;
   transition: background 0.2s ease-in;
 }