DEV: Remove obsolete CSS prefixes (#18262)

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;

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;
+  transform-origin: center;
-  -webkit-animation-iteration-count: infinite;
+  animation-iteration-count: infinite;
-  -webkit-transform-origin: center;
+  animation-duration: 3s;
-  -moz-animation-duration: 3s;
+  animation-name: ping;
-  -webkit-animation-duration: 3s;
-  -moz-animation-name: ping;
-  -webkit-animation-name: ping;
 }
 
 .fade {

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);
   }
 

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;
   }
 }

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);
 }
 

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;

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;
     }
   }

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;
-    }
-  }
 }

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 {

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);
 }
 

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;

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 {

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 {

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
   }
 }
 

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;

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);
   }
 }