Merge branch 'psi-delete-css' into 'master'

Removed some unused at extends from SCSS

See merge request gitlab-org/gitlab!57012

app/assets/stylesheets/fontawesome_custom.scss

-// Custom Font Awesome styles that render emojis in asciidoc
-.md {
-  .fa {
-    display: inline-block;
-    font-style: normal;
-    font-size: 14px;
-    text-rendering: auto;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-  }
-
-  .fa-2x {
-    font-size: 2em;
-  }
-
-  .fa-exclamation-triangle::before {
-    content: '⚠';
-  }
-
-  .fa-exclamation-circle::before {
-    content: '❗';
-  }
-
-  .fa-lightbulb-o::before {
-    content: '💡';
-  }
-
-  .fa-thumb-tack::before {
-    content: '📌';
-  }
-
-  .fa-fire::before {
-    content: '🔥';
-  }
-
-  .fa-square-o::before {
-    content: '\2610';
-  }
-
-  .fa-check-square-o::before {
-    content: '\2611';
-  }
-}

app/assets/stylesheets/framework/common.scss

@@ -292,11 +292,6 @@ img.emoji {
   }
 }
 
-.search_box {
-  @extend .card.card-body;
-  text-align: center;
-}
-
 .dropzone .dz-preview .dz-progress {
   border-color: $border-color !important;
 

app/assets/stylesheets/framework/filters.scss

@@ -204,10 +204,6 @@
     margin-bottom: 10px;
   }
 
-  &:hover {
-    @extend .form-control:hover;
-  }
-
   &.focus,
   &.focus:hover {
     border-color: $blue-300;

app/assets/stylesheets/framework/modal.scss

@@ -94,14 +94,6 @@ body.modal-open {
   padding-right: 0 !important;
 }
 
-.modal-no-backdrop {
-  @extend .modal-dialog;
-
-  .modal-content {
-    box-shadow: none;
-  }
-}
-
 .modal {
   background-color: $black-transparent;
 

app/assets/stylesheets/framework/page_header.scss

@@ -32,8 +32,10 @@
   }
 
   .avatar {
-    @extend .avatar-inline;
-    margin-left: 0;
+    float: none;
+    display: inline-block;
+    margin-left: 2px;
+    flex-shrink: 0;
 
     @include media-breakpoint-up(sm) {
       margin-left: 4px;

app/assets/stylesheets/framework/responsive_tables.scss

@@ -3,6 +3,7 @@
   max-width: #{$max + '%'};
 }
 
+.gl-responsive-table-row,
 .gl-responsive-table-row-layout {
   width: 100%;
 
@@ -17,7 +18,6 @@
 }
 
 .gl-responsive-table-row {
-  @extend .gl-responsive-table-row-layout;
   margin-top: 10px;
   border: 1px solid $border-color;
   color: $gray-500;

app/assets/stylesheets/framework/typography.scss

-// Custom Fontawesome icons
-@import 'fontawesome_custom';
-
 /**
  * Apply Markup (Markdown/AsciiDoc) typography
  *
@@ -435,7 +432,9 @@
     }
   }
 
-  a.with-attachment-icon {
+  a.with-attachment-icon,
+  a[href*='/uploads/'],
+  a[href*='storage.googleapis.com/google-code-attachments/'] {
     &::before {
       margin-right: 4px;
 
@@ -449,8 +448,6 @@
 
   a[href*='/uploads/'],
   a[href*='storage.googleapis.com/google-code-attachments/'] {
-    @extend .with-attachment-icon;
-
     &.no-attachment-icon {
       &::before {
         display: none;
@@ -507,32 +504,56 @@
     text-decoration: line-through;
   }
 
-  .admonitionblock td.icon {
-    width: 1%;
+  // Custom Font Awesome styles that render emojis in asciidoc
+  .fa {
+    display: inline-block;
+    font-style: normal;
+    font-size: 14px;
+    text-rendering: auto;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+  }
+
+  .fa-2x,
+  .admonitionblock td.icon [class^='fa icon-'] {
+    font-size: 2em;
+  }
 
-    [class^='fa icon-'] {
-      @extend .fa-2x;
+  .fa-exclamation-triangle::before,
+  .admonitionblock td.icon .icon-warning::before {
+    content: '⚠';
   }
 
-    .icon-note {
-      @extend .fa-thumb-tack;
+  .fa-exclamation-circle::before,
+  .admonitionblock td.icon .icon-important::before {
+    content: '❗';
   }
 
-    .icon-tip {
-      @extend .fa-lightbulb-o;
+  .fa-lightbulb-o::before,
+  .admonitionblock td.icon .icon-tip::before {
+    content: '💡';
   }
 
-    .icon-warning {
-      @extend .fa-exclamation-triangle;
+  .fa-thumb-tack::before,
+  .admonitionblock td.icon .icon-note::before {
+    content: '📌';
   }
 
-    .icon-caution {
-      @extend .fa-fire;
+  .fa-fire::before,
+  .admonitionblock td.icon .icon-caution::before {
+    content: '🔥';
   }
 
-    .icon-important {
-      @extend .fa-exclamation-circle;
+  .fa-square-o::before {
+    content: '\2610';
   }
+
+  .fa-check-square-o::before {
+    content: '\2611';
+  }
+
+  .admonitionblock td.icon {
+    width: 1%;
   }
 
   .metrics-embed {
@@ -640,12 +661,13 @@ code {
 .commit-sha,
 .ref-name,
 .pipeline-number {
-  @extend .monospace;
+  font-family: $monospace-font;
   font-size: 95%;
 }
 
 .git-revision-dropdown .dropdown-content ul li a {
-  @extend .ref-name;
+  font-family: $monospace-font;
+  font-size: 95%;
   word-break: break-all;
 }
 

app/views/doorkeeper/authorizations/new.html.haml

 %main{ :role => "main" }
-  .modal-no-backdrop.modal-doorkeepr-auth
-    .modal-content
+  .modal-dialog.modal-doorkeepr-auth
+    .modal-content.gl-shadow-none
       .modal-header
         %h3.page-title
           - link_to_client = link_to(@pre_auth.client.name, @pre_auth.redirect_uri, target: '_blank', rel: 'noopener noreferrer')

app/views/search/results/_empty.html.haml

-.search_box.gl-my-8
+.search_box.gl-my-8.gl-text-center
   .search_glyph
   %h4
     = sprite_icon('search', size: 24, css_class: 'gl-vertical-align-text-bottom')