From 87f8bafa7ecbcc80824e52d90d95f112d55b6cb8 Mon Sep 17 00:00:00 2001
From: Jarek Radosz <jradosz@gmail.com>
Date: Thu, 15 Sep 2022 16:54:08 +0200
Subject: [PATCH] DEV: Remove obsolete CSS prefixes (#18262)

---
 app/assets/stylesheets/common/base/compose.scss    |  8 --------
 app/assets/stylesheets/common/base/discourse.scss  | 14 ++++----------
 app/assets/stylesheets/common/base/lightbox.scss   |  1 -
 app/assets/stylesheets/common/base/onebox.scss     |  1 -
 app/assets/stylesheets/common/base/rtl.scss        |  4 ----
 .../stylesheets/common/base/search-menu.scss       |  3 ---
 .../stylesheets/common/components/buttons.scss     |  1 -
 .../components/conditional-loading-section.scss    | 10 ----------
 .../stylesheets/common/components/user-card.scss   |  1 -
 .../stylesheets/common/foundation/mixins.scss      |  6 +-----
 .../common/select-kit/category-chooser.scss        | 11 -----------
 .../common/select-kit/category-row.scss            |  2 --
 app/assets/stylesheets/common/topic-timeline.scss  |  7 ++++---
 app/assets/stylesheets/desktop/modal.scss          |  3 +--
 app/assets/stylesheets/desktop/topic-post.scss     |  9 ---------
 app/assets/stylesheets/mobile/header.scss          |  3 +--
 16 files changed, 11 insertions(+), 73 deletions(-)

diff --git a/app/assets/stylesheets/common/base/compose.scss b/app/assets/stylesheets/common/base/compose.scss
index f621404b15a..b3e700f8951 100644
--- a/app/assets/stylesheets/common/base/compose.scss
+++ b/app/assets/stylesheets/common/base/compose.scss
@@ -500,14 +500,6 @@ div.ac-wrap {
   }
 }
 
-@-webkit-keyframes transformer {
-  90% {
-    -webkit-filter: opacity(1);
-  }
-  100% {
-    -webkit-filter: opacity(0);
-  }
-}
 @keyframes transformer {
   90% {
     opacity: 1;
diff --git a/app/assets/stylesheets/common/base/discourse.scss b/app/assets/stylesheets/common/base/discourse.scss
index da34e5319a2..40a63f4c279 100644
--- a/app/assets/stylesheets/common/base/discourse.scss
+++ b/app/assets/stylesheets/common/base/discourse.scss
@@ -558,22 +558,16 @@ table {
 .ring {
   $gradient-start: transparent;
   $gradient-end: #090;
-  background: -webkit-radial-gradient($gradient-start, $gradient-end);
-  background: -o-radial-gradient($gradient-start, $gradient-end);
-  background: -moz-radial-gradient($gradient-start, $gradient-end);
   background: radial-gradient($gradient-start, $gradient-end);
   top: -11px !important;
   right: 23.5px !important;
   border-radius: 100%;
   width: 20px;
   height: 20px;
-  -moz-animation-iteration-count: infinite;
-  -webkit-animation-iteration-count: infinite;
-  -webkit-transform-origin: center;
-  -moz-animation-duration: 3s;
-  -webkit-animation-duration: 3s;
-  -moz-animation-name: ping;
-  -webkit-animation-name: ping;
+  transform-origin: center;
+  animation-iteration-count: infinite;
+  animation-duration: 3s;
+  animation-name: ping;
 }
 
 .fade {
diff --git a/app/assets/stylesheets/common/base/lightbox.scss b/app/assets/stylesheets/common/base/lightbox.scss
index e6d786b72b5..2d063563aac 100644
--- a/app/assets/stylesheets/common/base/lightbox.scss
+++ b/app/assets/stylesheets/common/base/lightbox.scss
@@ -75,7 +75,6 @@ $meta-element-margin: 6px;
 
 .discourse-no-touch {
   a.lightbox {
-    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
     transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
   }
 
diff --git a/app/assets/stylesheets/common/base/onebox.scss b/app/assets/stylesheets/common/base/onebox.scss
index dd5d5dbed4b..2cd9d112fb7 100644
--- a/app/assets/stylesheets/common/base/onebox.scss
+++ b/app/assets/stylesheets/common/base/onebox.scss
@@ -10,7 +10,6 @@ a.loading-onebox {
     border: 2px solid var(--primary-low-mid);
     border-right-color: transparent;
     border-radius: 50%;
-    -webkit-animation: rotate-forever 1s infinite linear;
     animation: rotate-forever 1s infinite linear;
   }
 }
diff --git a/app/assets/stylesheets/common/base/rtl.scss b/app/assets/stylesheets/common/base/rtl.scss
index 4c4051b5769..74b40404733 100644
--- a/app/assets/stylesheets/common/base/rtl.scss
+++ b/app/assets/stylesheets/common/base/rtl.scss
@@ -4,10 +4,6 @@
 
 // This is used to flip the .d-icon-caret-right
 @mixin rotate($degrees) {
-  -webkit-transform: rotate(#{$degrees}deg);
-  -moz-transform: rotate(#{$degrees}deg);
-  -ms-transform: rotate(#{$degrees}deg);
-  -o-transform: rotate(#{$degrees}deg);
   transform: rotate(#{$degrees}deg);
 }
 
diff --git a/app/assets/stylesheets/common/base/search-menu.scss b/app/assets/stylesheets/common/base/search-menu.scss
index 898e5e60b58..0e83373c827 100644
--- a/app/assets/stylesheets/common/base/search-menu.scss
+++ b/app/assets/stylesheets/common/base/search-menu.scss
@@ -70,11 +70,8 @@ $search-pad-horizontal: 0.5em;
           // https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/
           overflow-wrap: break-word;
           word-wrap: break-word;
-          -ms-word-break: break-all;
           word-break: break-all;
           word-break: break-word;
-          -ms-hyphens: auto;
-          -moz-hyphens: auto;
           -webkit-hyphens: auto;
           hyphens: auto;
           margin-top: 0.25em;
diff --git a/app/assets/stylesheets/common/components/buttons.scss b/app/assets/stylesheets/common/components/buttons.scss
index 1725ba2cc9a..5246af69180 100644
--- a/app/assets/stylesheets/common/components/buttons.scss
+++ b/app/assets/stylesheets/common/components/buttons.scss
@@ -95,7 +95,6 @@
     }
 
     .loading-icon {
-      -webkit-animation: rotate-forever 1s infinite linear, fadein 1s;
       animation: rotate-forever 1s infinite linear, fadein 1s;
     }
   }
diff --git a/app/assets/stylesheets/common/components/conditional-loading-section.scss b/app/assets/stylesheets/common/components/conditional-loading-section.scss
index 6074df14e82..fac4abe5d46 100644
--- a/app/assets/stylesheets/common/components/conditional-loading-section.scss
+++ b/app/assets/stylesheets/common/components/conditional-loading-section.scss
@@ -16,7 +16,6 @@
 
   &:not(.is-loading) {
     animation: fadein 0.5s;
-    -webkit-animation: fadein 0.5s;
   }
 
   @keyframes fadein {
@@ -27,13 +26,4 @@
       opacity: 1;
     }
   }
-
-  @-webkit-keyframes fadein {
-    from {
-      opacity: 0;
-    }
-    to {
-      opacity: 1;
-    }
-  }
 }
diff --git a/app/assets/stylesheets/common/components/user-card.scss b/app/assets/stylesheets/common/components/user-card.scss
index 4d9f5a9b56f..14d723e9cfa 100644
--- a/app/assets/stylesheets/common/components/user-card.scss
+++ b/app/assets/stylesheets/common/components/user-card.scss
@@ -38,7 +38,6 @@ $avatar_margin: -50px; // negative margin makes avatars extend above cards
   background: var(--secondary) center center;
   background-size: cover;
   transition: opacity 0.2s, transform 0.2s;
-  -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
   opacity: 0;
   @include transform(scale(0.9));
   &.show {
diff --git a/app/assets/stylesheets/common/foundation/mixins.scss b/app/assets/stylesheets/common/foundation/mixins.scss
index 4438596094e..8e62e10f6cb 100644
--- a/app/assets/stylesheets/common/foundation/mixins.scss
+++ b/app/assets/stylesheets/common/foundation/mixins.scss
@@ -81,6 +81,7 @@ $breakpoints: (
   text-overflow: ellipsis;
   word-wrap: break-word;
   -webkit-line-clamp: $lines;
+  -moz-box-orient: vertical;
   -webkit-box-orient: vertical;
 }
 
@@ -113,8 +114,6 @@ $hpad: 0.65em;
 
 @mixin user-select($mode) {
   -webkit-user-select: $mode;
-  -moz-user-select: $mode;
-  -ms-user-select: $mode;
   user-select: $mode;
 }
 
@@ -131,7 +130,6 @@ $hpad: 0.65em;
 
 // We still need -webkit for latest iPhone and Safari
 @mixin transform($transforms) {
-  -webkit-transform: $transforms;
   transform: $transforms;
 }
 
@@ -149,8 +147,6 @@ $hpad: 0.65em;
 }
 
 @mixin fa-rotate($degrees, $rotation) {
-  -webkit-transform: rotate($degrees);
-  -ms-transform: rotate($degrees);
   transform: rotate($degrees);
 }
 
diff --git a/app/assets/stylesheets/common/select-kit/category-chooser.scss b/app/assets/stylesheets/common/select-kit/category-chooser.scss
index 2e0f418e097..b02aaa3404d 100644
--- a/app/assets/stylesheets/common/select-kit/category-chooser.scss
+++ b/app/assets/stylesheets/common/select-kit/category-chooser.scss
@@ -4,15 +4,8 @@
       width: 300px;
 
       .select-kit-row {
-        display: -webkit-box;
-        display: -ms-flexbox;
         display: flex;
-        -webkit-box-align: flex-start;
-        -ms-flex-align: flex-start;
         align-items: flex-start;
-        -webkit-box-orient: vertical;
-        -webkit-box-direction: normal;
-        -ms-flex-direction: column;
         flex-direction: column;
 
         &.none {
@@ -32,14 +25,10 @@
         .category-status {
           color: var(--primary);
           line-height: $line-height-large;
-          -webkit-box-flex: 0;
-          -ms-flex: 1 1 auto;
           flex: 1 1 auto;
         }
 
         .category-desc {
-          -webkit-box-flex: 0;
-          -ms-flex: 1 1 auto;
           flex: 1 1 auto;
           font-size: $font-down-1;
           line-height: $line-height-large;
diff --git a/app/assets/stylesheets/common/select-kit/category-row.scss b/app/assets/stylesheets/common/select-kit/category-row.scss
index 23d904fdf6b..5ada7d72175 100644
--- a/app/assets/stylesheets/common/select-kit/category-row.scss
+++ b/app/assets/stylesheets/common/select-kit/category-row.scss
@@ -7,8 +7,6 @@
       display: flex;
       align-items: center;
       max-width: 100%;
-      -webkit-box-flex: 0;
-      -ms-flex: 1 1 auto;
       flex: 1 1 auto;
     }
     .category-desc p {
diff --git a/app/assets/stylesheets/common/topic-timeline.scss b/app/assets/stylesheets/common/topic-timeline.scss
index c331ebd9aed..8328170997f 100644
--- a/app/assets/stylesheets/common/topic-timeline.scss
+++ b/app/assets/stylesheets/common/topic-timeline.scss
@@ -5,7 +5,8 @@
 .timeline-container {
   box-sizing: border-box;
   z-index: z("timeline");
-  -webkit-transform: translate3d(0, 0, 0);
+  transform: translateZ(0);
+
   &.timeline-docked-bottom {
     margin-bottom: -4em;
     @media screen and (prefers-reduced-motion: no-preference) {
@@ -80,7 +81,7 @@
         display: block;
         @include line-clamp(8);
         @media screen and (max-height: 425px) {
-          -webkit-line-clamp: 5;
+          @include line-clamp(5);
         }
       }
       .username {
@@ -220,7 +221,7 @@
       margin-left: 0.5em;
       border-left: 1px solid var(--tertiary-low-or-tertiary-high);
       position: relative;
-      -webkit-transform: translate3d(0, 0, 0);
+      transform: translateZ(0);
     }
 
     .timeline-padding {
diff --git a/app/assets/stylesheets/desktop/modal.scss b/app/assets/stylesheets/desktop/modal.scss
index 689b01474ce..d739b9878a5 100644
--- a/app/assets/stylesheets/desktop/modal.scss
+++ b/app/assets/stylesheets/desktop/modal.scss
@@ -10,7 +10,6 @@
 }
 
 .modal.in {
-  -webkit-animation: fade 0.25s;
   animation: fade 0.25s;
 }
 
@@ -121,7 +120,7 @@
 
   .modal-inner-container {
     width: 40em; // scale with user font-size
-    max-width: 100vw; // prevent overflow if user font-size is enourmous
+    max-width: 100vw; // prevent overflow if user font-size is enormous
   }
 }
 
diff --git a/app/assets/stylesheets/desktop/topic-post.scss b/app/assets/stylesheets/desktop/topic-post.scss
index 9d4cc4933ee..6869ed00729 100644
--- a/app/assets/stylesheets/desktop/topic-post.scss
+++ b/app/assets/stylesheets/desktop/topic-post.scss
@@ -382,15 +382,6 @@ video {
   }
 }
 
-@-webkit-keyframes fadein {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-
 @keyframes fadein {
   from {
     opacity: 0;
diff --git a/app/assets/stylesheets/mobile/header.scss b/app/assets/stylesheets/mobile/header.scss
index 8ca1b8c49ee..9a0250e6347 100644
--- a/app/assets/stylesheets/mobile/header.scss
+++ b/app/assets/stylesheets/mobile/header.scss
@@ -9,7 +9,6 @@
   .title {
     max-width: 75%;
     @include ellipsis;
-    -webkit-animation: fadein 0.5s;
     animation: fadein 0.5s;
     // This acts as a placeholder if for some reason the small logo takes a while
     // to load - prevents topic title from shifting after the small logo loads.
@@ -68,7 +67,7 @@
   // A rendering bug in safari causes header SVGs to jitter after animations.
   // translateZ() forces gpu rendering which fixes the issue.
   .d-header-icons {
-    -webkit-transform: translateZ(0);
+    transform: translateZ(0);
   }
 }