Rework the use of @extend due to memory usage from libsass compiler

!29187 (merged) attempted to upgrade the sass gem to use libsass v3.6.4, but this turns out to cause huge memory usage due to generating gigantic selectors that might have been introduced with recent changes in @extend:

1. https://github.com/sass/libsass/issues/3125#issuecomment-787395225
2. https://github.com/sass/libsass/issues/3033#issuecomment-552110356

The maintainer said:

...the way you are using @extend will not be supported in future releases of any Sass.

Is there a way to avoid or rework the use of @extend to avoid this?

For more context, I think this is the deprecated change in @extend:

1. https://sass-lang.com/documentation/breaking-changes/extend-compound
2. https://github.com/sass/sass/issues/1599

app/assets/stylesheets/framework/dropdowns.scss:  @extend .dropdown-toggle;

Original list

$ git grep @extend
app/assets/stylesheets/bootstrap_migration.scss:  @extend .dropdown-divider;
app/assets/stylesheets/bootstrap_migration.scss:    @extend .border-0;
app/assets/stylesheets/bootstrap_migration.scss:    @extend .border-0;
app/assets/stylesheets/components/avatar.scss:  @extend %avatar-circle;
app/assets/stylesheets/components/avatar.scss:  @extend %avatar-circle;
app/assets/stylesheets/framework/buttons.scss:  @extend %disabled;
app/assets/stylesheets/framework/buttons.scss:    @extend %disabled;
app/assets/stylesheets/framework/common.scss:  @extend .light-well;
app/assets/stylesheets/framework/common.scss:  @extend .light;
app/assets/stylesheets/framework/common.scss:  @extend .card.card-body;
app/assets/stylesheets/framework/dropdowns.scss:  @extend .dropdown-toggle;
app/assets/stylesheets/framework/filters.scss:    @extend .form-control:hover;
app/assets/stylesheets/framework/gfm.scss:  @extend .commit-sha;
app/assets/stylesheets/framework/modal.scss:  @extend .modal-dialog;
app/assets/stylesheets/framework/page_header.scss:    @extend .avatar-inline;
app/assets/stylesheets/framework/responsive_tables.scss:  @extend .gl-responsive-table-row-layout;
app/assets/stylesheets/framework/typography.scss:    @extend .table;
app/assets/stylesheets/framework/typography.scss:    @extend .table-bordered;
app/assets/stylesheets/framework/typography.scss:    @extend .with-attachment-icon;
app/assets/stylesheets/framework/typography.scss:      @extend .fa-2x;
app/assets/stylesheets/framework/typography.scss:      @extend .fa-thumb-tack;
app/assets/stylesheets/framework/typography.scss:      @extend .fa-lightbulb-o;
app/assets/stylesheets/framework/typography.scss:      @extend .fa-exclamation-triangle;
app/assets/stylesheets/framework/typography.scss:      @extend .fa-fire;
app/assets/stylesheets/framework/typography.scss:      @extend .fa-exclamation-circle;
app/assets/stylesheets/framework/typography.scss:  @extend .monospace;
app/assets/stylesheets/framework/typography.scss:  @extend .ref-name;
app/assets/stylesheets/page_bundles/_pipeline_mixins.scss:      @extend .mini-pipeline-graph-dropdown-item:hover;
app/assets/stylesheets/page_bundles/pipeline.scss:      @extend .build-content:hover;
app/assets/stylesheets/pages/commits.scss:  @extend %commit-description-base;
app/assets/stylesheets/pages/commits.scss:    @extend %commit-description-base;
app/assets/stylesheets/pages/editor.scss:    @extend .monospace;
app/assets/stylesheets/pages/groups.scss:      @extend .dropdown-menu-right;
app/assets/stylesheets/pages/help.scss:    @extend .badge.badge-pill;
app/assets/stylesheets/pages/issuable.scss:    @extend a:hover;
app/assets/stylesheets/pages/login.scss:    @extend .btn-block;
app/assets/stylesheets/pages/merge_requests.scss:    @extend .ref-name;
app/assets/stylesheets/pages/note_form.scss:  @extend .col-lg-4;
app/assets/stylesheets/pages/notifications.scss:    @extend .dropdown-menu-right;
app/assets/stylesheets/pages/projects.scss:    @extend .dropdown-menu-right;
app/assets/stylesheets/pages/projects.scss:    @extend .monospace;
app/assets/stylesheets/pages/search.scss:    @extend .form-control;
app/assets/stylesheets/pages/search.scss:      @extend .form-control:focus;