Remove unneeded vendor-specific transition prefixes

See discussion here: https://www.web-plus-plus.com/Articles/css-transition-moz-and-webkit-vs-css3
FreeTubeApp · Oct 28, 2023 · 0f3ae7a · 0f3ae7a
1 parent 8a2842d
commit 0f3ae7a
Show file tree

Hide file tree

Showing 9 changed files with 5 additions and 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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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;
 }