DEV: Remove unnecessary scss mixins (#31355)

app/assets/stylesheets/common/admin/admin_base.scss

@@ -862,18 +862,18 @@ $mobile-breakpoint: 700px;
 .admin-detail.mobile-open {
   @media (max-width: $mobile-breakpoint) {
     transition: transform 0.3s ease;
-    @include transform(translateX(250px));
+    transform: translateX(250px);
   }
   @media (max-width: 500px) {
     transition: transform 0.3s ease;
-    @include transform(translateX(50%));
+    transform: translateX(50%);
   }
 }
 
 .admin-detail.mobile-closed {
   @media (max-width: $mobile-breakpoint) {
     transition: transform 0.3s ease;
-    @include transform(translateX(0));
+    transform: translateX(0);
     padding: 30px 20px;
   }
 }

app/assets/stylesheets/common/base/_topic-list.scss

@@ -175,7 +175,7 @@
 }
 
 .sticky-header .topic-list-header {
-  @include sticky;
+  position: sticky;
   top: var(--header-offset, 60px);
   background: var(--secondary);
   z-index: 2;
@@ -432,7 +432,7 @@
 }
 
 .d-icon-thumbtack.unpinned {
-  @include fa-rotate(180deg, 1);
+  transform: rotate(180deg);
 }
 
 .top-title-buttons {

app/assets/stylesheets/common/base/discourse.scss

@@ -208,8 +208,8 @@ input {
   &[type="search"],
   &[type="tel"],
   &[type="color"] {
-    @include appearance-none;
     @include form-item-sizing;
+    appearance: none;
     display: inline-block;
     margin-bottom: 9px;
     color: var(--d-input-text-color);

app/assets/stylesheets/common/base/header.scss

@@ -1,5 +1,5 @@
 .d-header-wrap {
-  @include sticky;
+  position: sticky;
   top: 0;
   z-index: z("header");
 }

app/assets/stylesheets/common/base/json_schema.scss

@@ -67,8 +67,8 @@
     }
 
     select {
-      @include appearance-none;
       @include form-item-sizing;
+      appearance: none;
       display: inline-block;
       margin-bottom: var(--space-2);
       color: var(--primary);

app/assets/stylesheets/common/base/magnific-popup.scss

@@ -599,7 +599,7 @@ button {
 // Scale navigation arrows and reduce padding from sides
 @media all and (max-width: 900px) {
   .mfp-arrow {
-    @include transform(scale(0.75));
+    transform: scale(0.75);
   }
 
   .mfp-arrow-left {
@@ -636,7 +636,7 @@ button {
   &.mfp-ready {
     .mfp-content {
       opacity: 1;
-      @include transform(scale(1));
+      transform: scale(1);
     }
 
     &.mfp-bg {
@@ -647,7 +647,7 @@ button {
   /* animate out */
   &.mfp-removing {
     .mfp-content {
-      @include transform(scale(0.8));
+      transform: scale(0.8);
       opacity: 0;
     }
 

app/assets/stylesheets/common/base/search.scss

@@ -102,7 +102,7 @@
       }
 
       &.bulk-select-visible {
-        @include sticky;
+        position: sticky;
         top: 60px;
         z-index: 10;
       }

app/assets/stylesheets/common/base/topic.scss

@@ -34,7 +34,7 @@
     .topic-navigation {
       grid-area: timeline;
       align-self: start;
-      @include sticky;
+      position: sticky;
       top: calc(var(--header-offset, 60px) + 2em);
       margin-left: 1em;
       z-index: z("timeline");

app/assets/stylesheets/common/foundation/mixins.scss

@@ -120,17 +120,12 @@ $hpad: 0.65em;
   padding: $vpad $hpad;
 }
 
-@mixin sticky {
-  position: sticky;
-}
-
-// Unselectable (avoids unwanted selections with iPad, touch laptops, etc)
-
 @mixin user-select($mode) {
   -webkit-user-select: $mode;
   user-select: $mode;
 }
 
+// Unselectable (avoids unwanted selections with iPad, touch laptops, etc)
 @mixin unselectable {
   cursor: default;
   @include user-select(none);
@@ -142,26 +137,12 @@ $hpad: 0.65em;
   background-color: var(--blend-primary-secondary-5);
 }
 
-// We still need -webkit for latest iPhone and Safari
-@mixin transform($transforms) {
-  transform: $transforms;
-}
-
-@mixin appearance-none() {
-  // resets default browser styles
-  appearance: none;
-}
-
 @mixin default-focus() {
   border-color: var(--tertiary);
   outline: 2px solid var(--tertiary);
   outline-offset: -2px;
 }
 
-@mixin fa-rotate($degrees, $rotation) {
-  transform: rotate($degrees);
-}
-
 /// Helper function to easily use an SVG inline in CSS
 /// without encoding it to base64, saving bytes.
 /// It also helps with browser support, especially for IE11.

app/assets/stylesheets/mobile/topic-post.scss

@@ -158,7 +158,7 @@ nav.post-controls button.reply .d-icon {
     }
 
     .topic-avatar {
-      @include sticky;
+      position: sticky;
       top: calc(var(--header-offset) + 0.5em);
       margin-right: 15px;
     }