DEV: add btn-default classes to buttons using default styling (#31039)

All of these buttons use our default grey background styling, but aren't carrying the `btn-default` class, which makes them easier to target in themes. This PR adds the class.
2025-02-24 05:13:10 +08:00 · 2025-01-28 15:40:34 -05:00 · 2025-01-28 15:40:34 -05:00 · f6c5eca485
commit f6c5eca485
parent dcac09ed32
25 changed files with 37 additions and 35 deletions
--- a/app/assets/javascripts/admin/addon/components/admin-config-areas/emojis-list.gjs
+++ b/app/assets/javascripts/admin/addon/components/admin-config-areas/emojis-list.gjs
@ -78,7 +78,7 @@ export default class AdminConfigAreasEmojisList extends Component {
                  <DButton
                    @action={{fn this.adminEmojis.destroyEmoji emoji}}
                    @label="admin.emoji.delete"
-                    class="btn-small d-admin-row__controls-delete"
+                    class="btn-default btn-small d-admin-row__controls-delete"
                  />
                </td>
              </tr>
--- a/app/assets/javascripts/admin/addon/components/admin-flag-item.gjs
+++ b/app/assets/javascripts/admin/addon/components/admin-flag-item.gjs
@ -147,7 +147,7 @@ export default class AdminFlagItem extends Component {
        <div class="d-admin-row__controls-options">

          <DButton
-            class="btn-small admin-flag-item__edit"
+            class="btn-default btn-small admin-flag-item__edit"
            @action={{this.edit}}
            @label="admin.config_areas.flags.edit"
            @disabled={{not this.canEdit}}
@ -160,6 +160,7 @@ export default class AdminFlagItem extends Component {
              @title={{i18n "admin.config_areas.flags.more_options.title"}}
              @icon="ellipsis-vertical"
              @onRegisterApi={{this.onRegisterApi}}
+              @class="btn-default"
            >
              <:content>
                <DropdownMenu as |dropdown|>
--- a/app/assets/javascripts/admin/addon/components/admin-notice.gjs
+++ b/app/assets/javascripts/admin/addon/components/admin-notice.gjs
@ -27,6 +27,7 @@ export default class AdminNotice extends Component {
        <DButton
          @action={{this.dismiss}}
          @label="admin.dashboard.dismiss_notice"
+          class="btn-default"
        />
      {{/if}}
    </div>
--- a/app/assets/javascripts/admin/addon/components/admin-plugins-list-item.gjs
+++ b/app/assets/javascripts/admin/addon/components/admin-plugins-list-item.gjs
@ -142,7 +142,7 @@ export default class AdminPluginsListItem extends Component {
          {{#if this.showPluginSettingsButton}}
            {{#if @plugin.useNewShowRoute}}
              <LinkTo
-                class="btn btn-text btn-small"
+                class="btn btn-default btn-text btn-small"
                @route="adminPlugins.show"
                @model={{@plugin}}
                @disabled={{this.disablePluginSettingsButton}}
@ -153,7 +153,7 @@ export default class AdminPluginsListItem extends Component {
              </LinkTo>
            {{else}}
              <LinkTo
-                class="btn btn-text btn-small"
+                class="btn btn-default btn-text btn-small"
                @route="adminSiteSettingsCategory"
                @model={{@plugin.settingCategoryName}}
                @query={{hash filter=(concat "plugin:" @plugin.name)}}
--- a/app/assets/javascripts/admin/addon/components/admin-user-field-item.gjs
+++ b/app/assets/javascripts/admin/addon/components/admin-user-field-item.gjs
@ -82,7 +82,7 @@ export default class AdminUserFieldItem extends Component {
      <td class="d-admin-row__controls">
        <div class="d-admin-row__controls-options">
          <DButton
-            class="btn-small admin-user_field-item__edit"
+            class="btn-default btn-small admin-user_field-item__edit"
            @action={{this.edit}}
            @label="admin.user_fields.edit"
          />
--- a/app/assets/javascripts/admin/addon/components/api-key-item.gjs
+++ b/app/assets/javascripts/admin/addon/components/api-key-item.gjs
@ -97,13 +97,14 @@ export default class ApiKeysList extends Component {
            @action={{this.edit}}
            @label="admin.api_keys.edit"
            @title="admin.api.show_details"
-            class="btn-small"
+            class="btn-default btn-small"
          />
          <DMenu
            @identifier="api_key-menu"
            @title={{i18n "admin.config_areas.user_fields.more_options.title"}}
            @icon="ellipsis-vertical"
            @onRegisterApi={{this.onRegisterApi}}
+            @class="btn-default"
          >
            <:content>
              <DropdownMenu as |dropdown|>
--- a/app/assets/javascripts/admin/addon/components/dashboard-period-selector.gjs
+++ b/app/assets/javascripts/admin/addon/components/dashboard-period-selector.gjs
@ -33,7 +33,7 @@ export default class DashboardPeriodSelector extends Component {
        @icon="gear"
        @action={{this.openCustomDateRangeModal}}
        @title="admin.dashboard.custom_date_range"
-        class="custom-date-range-button"
+        class="btn-default custom-date-range-button"
      />
    </div>
  </template>
--- a/app/assets/javascripts/admin/addon/components/embeddable-host.gjs
+++ b/app/assets/javascripts/admin/addon/components/embeddable-host.gjs
@ -61,7 +61,7 @@ export default class EmbeddableHost extends Component {
      <td class="d-admin-row__controls">
        <div class="d-admin-row__controls-options">
          <DButton
-            class="btn-small admin-embeddable-host-item__edit"
+            class="btn-default btn-small admin-embeddable-host-item__edit"
            @route="adminEmbedding.edit"
            @routeModels={{this.host}}
            @label="admin.embedding.edit"
--- a/app/assets/javascripts/admin/addon/components/emoji-value-list.hbs
+++ b/app/assets/javascripts/admin/addon/components/emoji-value-list.hbs
@ -6,7 +6,7 @@
          @action={{fn this.removeValue data}}
          @icon="xmark"
          @disabled={{not data.isEditable}}
-          class="remove-value-btn btn-small"
+          class="btn-default remove-value-btn btn-small"
        />

        <div
@ -29,12 +29,12 @@
          <DButton
            @action={{fn this.shift -1 index}}
            @icon="arrow-up"
-            class="shift-up-value-btn btn-small"
+            class="btn-default shift-up-value-btn btn-small"
          />
          <DButton
            @action={{fn this.shift 1 index}}
            @icon="arrow-down"
-            class="shift-down-value-btn btn-small"
+            class="btn-default shift-down-value-btn btn-small"
          />
        {{/if}}
      </li>
--- a/app/assets/javascripts/admin/addon/components/ip-lookup.gjs
+++ b/app/assets/javascripts/admin/addon/components/ip-lookup.gjs
@ -161,6 +161,7 @@ export default class IpLookup extends Component {
      @modalForMobile={{true}}
      @onRegisterApi={{this.onRegisterApi}}
      @isLoading={{this.loading}}
+      @class="btn-default"
    >
      <:content>
        <div class="location-box">
--- a/app/assets/javascripts/admin/addon/components/secret-value-list.hbs
+++ b/app/assets/javascripts/admin/addon/components/secret-value-list.hbs
@ -5,7 +5,7 @@
        <DButton
          @action={{fn this.removeValue value}}
          @icon="xmark"
-          class="remove-value-btn btn-small"
+          class="btn-default remove-value-btn btn-small"
        />
        <Input
          @value={{value.key}}
--- a/app/assets/javascripts/admin/addon/components/simple-list.hbs
+++ b/app/assets/javascripts/admin/addon/components/simple-list.hbs
@ -5,7 +5,7 @@
        <DButton
          @action={{fn this.removeValue value}}
          @icon="xmark"
-          class="remove-value-btn btn-small"
+          class="btn-default remove-value-btn btn-small"
        />

        <Input
@ -19,12 +19,12 @@
          <DButton
            @action={{fn this.shift -1 index}}
            @icon="arrow-up"
-            class="shift-up-value-btn btn-small"
+            class="btn-default shift-up-value-btn btn-small"
          />
          <DButton
            @action={{fn this.shift 1 index}}
            @icon="arrow-down"
-            class="shift-down-value-btn btn-small"
+            class="btn-default shift-down-value-btn btn-small"
          />
        {{/if}}
      </div>
--- a/app/assets/javascripts/admin/addon/components/site-settings/file-types-list.gjs
+++ b/app/assets/javascripts/admin/addon/components/site-settings/file-types-list.gjs
@ -114,7 +114,7 @@ export default class FileTypesList extends Component {
        "admin.site_settings.file_types_list.add_types_title"
        types=IMAGE_TYPES_STRING
      }}
-      class="btn file-types-list__button image"
+      class="btn btn-small btn-default file-types-list__button image"
    />
    <DButton
      @action={{fn this.insertDefaultTypes "video"}}
@ -123,7 +123,7 @@ export default class FileTypesList extends Component {
        "admin.site_settings.file_types_list.add_types_title"
        types=VIDEO_TYPES_STRING
      }}
-      class="btn file-types-list__button video"
+      class="btn btn-small btn-default file-types-list__button video"
    />
    <DButton
      @action={{fn this.insertDefaultTypes "audio"}}
@ -132,7 +132,7 @@ export default class FileTypesList extends Component {
        "admin.site_settings.file_types_list.add_types_title audio"
        types=AUDIO_TYPES_STRING
      }}
-      class="btn file-types-list__button"
+      class="btn btn-small btn-default file-types-list__button"
    />
    <DButton
      @action={{fn this.insertDefaultTypes "document"}}
@ -141,7 +141,7 @@ export default class FileTypesList extends Component {
        "admin.site_settings.file_types_list.add_types_title"
        types=DOCUMENT_TYPES_STRING
      }}
-      class="btn file-types-list__button document"
+      class="btn btn-small btn-default file-types-list__button document"
    />
  </template>
 }
--- a/app/assets/javascripts/admin/addon/components/value-list.hbs
+++ b/app/assets/javascripts/admin/addon/components/value-list.hbs
@ -5,7 +5,7 @@
        <DButton
          @action={{fn this.removeValue value}}
          @icon="xmark"
-          class="remove-value-btn btn-small"
+          class="btn-default remove-value-btn btn-small"
        />

        <Input
@ -19,12 +19,12 @@
          <DButton
            @action={{fn this.shift -1 index}}
            @icon="arrow-up"
-            class="shift-up-value-btn btn-small"
+            class="btn-default shift-up-value-btn btn-small"
          />
          <DButton
            @action={{fn this.shift 1 index}}
            @icon="arrow-down"
-            class="shift-down-value-btn btn-small"
+            class="btn-default shift-down-value-btn btn-small"
          />
        {{/if}}
      </div>
--- a/app/assets/javascripts/admin/addon/components/webhook-item.gjs
+++ b/app/assets/javascripts/admin/addon/components/webhook-item.gjs
@ -55,7 +55,7 @@ export default class WebhookItem extends Component {
            @action={{this.edit}}
            @label="admin.web_hooks.edit"
            @title="admin.web_hooks.edit"
-            class="btn-small"
+            class="btn-default btn-small"
          />
          <DMenu
            @identifier="webhook-menu"
--- a/app/assets/javascripts/admin/addon/templates/backups-index.hbs
+++ b/app/assets/javascripts/admin/addon/templates/backups-index.hbs
@ -65,7 +65,7 @@
              @identifier="backup-item-menu"
              @title={{i18n "more_options"}}
              @icon="ellipsis-vertical"
-              class="btn-small"
+              class="btn-default btn-small"
            >
              <:content>
                <DropdownMenu as |dropdown|>
--- a/app/assets/javascripts/admin/addon/templates/permalinks-index.hbs
+++ b/app/assets/javascripts/admin/addon/templates/permalinks-index.hbs
@ -67,7 +67,7 @@
              <td class="d-admin-row__controls">
                <div class="d-admin-row__controls-options">
                  <DButton
-                    class="btn-small admin-permalink-item__edit"
+                    class="btn-default btn-small admin-permalink-item__edit"
                    @route="adminPermalinks.edit"
                    @routeModels={{pl}}
                    @label="admin.config_areas.permalinks.edit"
--- a/app/assets/javascripts/admin/addon/templates/watched-words-action.hbs
+++ b/app/assets/javascripts/admin/addon/templates/watched-words-action.hbs
@ -20,7 +20,7 @@
    @label="admin.watched_words.test.button_label"
    @icon="far-eye"
    @action={{this.test}}
-    class="watched-word-test"
+    class="btn-default watched-word-test"
  />

  <DButton
--- a/app/assets/javascripts/discourse/app/components/badge-card.gjs
+++ b/app/assets/javascripts/discourse/app/components/badge-card.gjs
@ -108,7 +108,7 @@ export default class BadgeCard extends Component {
          <DButton
            @icon="star"
            @action={{@onFavoriteClick}}
-            class="favorite-btn"
+            class="btn-default favorite-btn"
          />
        {{else}}
          <DButton
@ -120,7 +120,7 @@ export default class BadgeCard extends Component {
              "badges.favorite_max_reached"
            }}
            @disabled={{not @canFavoriteMoreBadges}}
-            class="favorite-btn"
+            class="btn-default favorite-btn"
          />
        {{/if}}
      {{/if}}
--- a/app/assets/javascripts/discourse/app/components/edit-category-tags.hbs
+++ b/app/assets/javascripts/discourse/app/components/edit-category-tags.hbs
@ -79,7 +79,7 @@
      @label="category.required_tag_group.add"
      @action={{this.addRequiredTagGroup}}
      @icon="plus"
-      class="add-required-tag-group"
+      class="btn-default add-required-tag-group"
    />
  </section>
 </section>
--- a/app/assets/javascripts/discourse/app/components/username-preference.gjs
+++ b/app/assets/javascripts/discourse/app/components/username-preference.gjs
@ -149,7 +149,7 @@ export default class UsernamePreference extends Component {
            @action={{this.toggleEditing}}
            @icon="pencil"
            @title="user.username.edit"
-            class="btn-small username-preference__edit-username"
+            class="btn-default btn-small username-preference__edit-username"
          />
        {{/if}}
      </div>
--- a/app/assets/javascripts/discourse/app/templates/preferences/security.hbs
+++ b/app/assets/javascripts/discourse/app/templates/preferences/security.hbs
@ -34,7 +34,7 @@
          @action={{this.manage2FA}}
          @icon="lock"
          @label="user.second_factor.enable"
-          class="btn-second-factor"
+          class="btn-default btn-second-factor"
        />
      </div>
    </div>
--- a/app/assets/stylesheets/common/admin/settings.scss
+++ b/app/assets/stylesheets/common/admin/settings.scss
@ -165,8 +165,5 @@
  .file-types-list__button {
    margin-top: 0.5em;
    margin-bottom: 0.2em;
-    background: var(--primary-medium);
-    color: var(--secondary);
-    font-size: var(--font-down-2);
  }
 }
--- a/plugins/chat/admin/assets/javascripts/admin/components/admin-chat-incoming-webhooks-list.gjs
+++ b/plugins/chat/admin/assets/javascripts/admin/components/admin-chat-incoming-webhooks-list.gjs
@ -90,7 +90,7 @@ export default class AdminChatIncomingWebhooksList extends Component {
                <LinkTo
                  @route="adminPlugins.show.discourse-chat-incoming-webhooks.edit"
                  @model={{webhook.id}}
-                  class="btn btn-small admin-chat-incoming-webhooks-edit"
+                  class="btn btn-default btn-small admin-chat-incoming-webhooks-edit"
                >{{i18n "chat.incoming_webhooks.edit"}}</LinkTo>

                <DButton
--- a/plugins/chat/assets/javascripts/discourse/components/browse-channels.gjs
+++ b/plugins/chat/assets/javascripts/discourse/components/browse-channels.gjs
@ -117,6 +117,7 @@ export default class BrowseChannels extends Component {
                <DButton
                  @action={{this.showChatNewMessageModal}}
                  @label="chat.empty_state.direct_message_cta"
+                  class="btn-default"
                />
              </div>
            </list.EmptyState>