diff --git a/javascripts/discourse/components/card/topic-activity-column.gjs b/javascripts/discourse/components/card/topic-activity-column.gjs index 7c7207a..7eb20d7 100644 --- a/javascripts/discourse/components/card/topic-activity-column.gjs +++ b/javascripts/discourse/components/card/topic-activity-column.gjs @@ -1,6 +1,5 @@ import Component from "@glimmer/component"; import concatClass from "discourse/helpers/concat-class"; -import icon from "discourse/helpers/d-icon"; import formatDate from "discourse/helpers/format-date"; export default class TopicActivityColumn extends Component { diff --git a/javascripts/discourse/components/card/topic-status-column.gjs b/javascripts/discourse/components/card/topic-status-column.gjs index d81b3f5..d9c5ed3 100644 --- a/javascripts/discourse/components/card/topic-status-column.gjs +++ b/javascripts/discourse/components/card/topic-status-column.gjs @@ -30,7 +30,9 @@ export default class TopicStatusColumn extends Component { {{#if this.badge}} {{icon this.badge.icon - }}

{{i18n (themePrefix this.badge.text)}}

+ }}

{{i18n + (themePrefix this.badge.text) + }}

{{/if}} } diff --git a/scss/topic-cards.scss b/scss/topic-cards.scss index f975597..2a5f30f 100644 --- a/scss/topic-cards.scss +++ b/scss/topic-cards.scss @@ -22,12 +22,12 @@ flex-direction: column; gap: 1.25em; - @include breakpoint(medium) { + @include viewport.until(lg) { gap: 0.5em; padding: 0 0.5em; } - @include breakpoint(mobile-extra-large) { + @include viewport.until(sm) { gap: 0; padding: 0; } @@ -90,6 +90,12 @@ grid-template-areas: "bulk-select creator title title title status" "bulk-select category category activity likes-replies likes-replies"; + + @include viewport.until(sm) { + grid-template-areas: + "bulk-select creator title title title status" + "bulk-select . category likes-replies activity . "; + } } @include viewport.until(sm) { @@ -98,14 +104,6 @@ "bulk-select creator title title title status" "bulk-select . category activity activity . "; } - - &.has-replies { - @include viewport.until(sm) { - grid-template-areas: - "bulk-select creator title title title status" - "bulk-select . category likes-replies activity . "; - } - } } &:hover { @@ -204,7 +202,7 @@ oklch(from var(--category-badge-color) 45% calc(c * 0.5) h) ); - @include breakpoint(tablet) { + @include viewport.until(md) { padding: 0.25em 0.5rem; font-size: var(--font-down-2); } @@ -308,6 +306,7 @@ align-items: center; padding: 0.2em 0.5rem; font-size: var(--font-down-2); + @include viewport.from(lg) { font-size: var(--font-down-3); } @@ -340,6 +339,7 @@ svg { color: var(--status-color); + @include viewport.from(lg) { font-size: var(--font-down-1); } @@ -461,7 +461,6 @@ .topic-status-data { display: none; } - grid-template-areas: "creator title title title dropdown" ". category activity activity ."; @@ -529,6 +528,7 @@ grid-template-areas: "creator title title title dropdown" "category category activity metadata . "; + @include viewport.until(sm) { grid-template-areas: "metadata metadata metadata metadata dropdown" @@ -653,6 +653,10 @@ body.user-messages-page { grid-template-columns: auto auto; grid-template-rows: auto auto; + &.has-replies { + grid-template-areas: "title activity" "posters ."; + } + &:hover { .discourse-no-touch & { background-color: var(--primary-low); diff --git a/spec/system/horizon_high_level_spec.rb b/spec/system/horizon_high_level_spec.rb index 5592295..6b0a96a 100644 --- a/spec/system/horizon_high_level_spec.rb +++ b/spec/system/horizon_high_level_spec.rb @@ -36,9 +36,7 @@ describe "Horizon theme | High level", type: :system do expect(topic_item.all("td").map { |el| el["class"] }).to eq( [ "main-link topic-list-data", - "topic-status-data", "topic-category-data", - "topic-likes-replies-data", "topic-creator-data", "topic-activity-data", ], @@ -50,7 +48,7 @@ describe "Horizon theme | High level", type: :system do # Can change site colors from the sidebar palette, which are remembered # across page reloads. - marigold_palette = ColorScheme.find_by(name: "Marigold") + marigold_palette = theme.color_schemes.find_by(name: "Marigold") palette_selector.open_palette_menu palette_selector.click_palette_menu_item(marigold_palette.name) expect(palette_selector).to have_no_palette_menu diff --git a/spec/system/page_objects/components/user_color_palette_selector.rb b/spec/system/page_objects/components/user_color_palette_selector.rb index 7d569c5..6d96bb4 100644 --- a/spec/system/page_objects/components/user_color_palette_selector.rb +++ b/spec/system/page_objects/components/user_color_palette_selector.rb @@ -26,7 +26,9 @@ module PageObjects end def has_selected_palette?(palette) - has_css?(".user-color-palette-selector[data-selected-color-palette-id='#{palette.id}']") + has_css?( + ".user-color-palette-selector-trigger[data-selected-color-palette-id=\"#{palette.id}\"]", + ) end def has_loaded_css? diff --git a/spec/system/user_color_palette_selector_spec.rb b/spec/system/user_color_palette_selector_spec.rb index 2731034..5cceaa1 100644 --- a/spec/system/user_color_palette_selector_spec.rb +++ b/spec/system/user_color_palette_selector_spec.rb @@ -6,7 +6,7 @@ describe "Horizon theme | User color palette selector", type: :system do let(:set_theme_as_default) { true } let!(:theme) do horizon_theme = upload_theme(set_theme_as_default: set_theme_as_default) - ColorScheme.where(theme_id: horizon_theme.id).update_all(user_selectable: true) + horizon_theme.color_schemes.update_all(user_selectable: true) horizon_theme end fab!(:current_user) { Fabricate(:user) } @@ -16,8 +16,8 @@ describe "Horizon theme | User color palette selector", type: :system do let(:interface_color_selector) do PageObjects::Components::InterfaceColorSelector.new(".sidebar-footer-actions") end - let(:marigold_palette) { ColorScheme.find_by(name: "Marigold") } - let(:marigold_palette_dark) { ColorScheme.find_by(name: "Marigold Dark") } + let(:marigold_palette) { theme.color_schemes.find_by(name: "Marigold") } + let(:marigold_palette_dark) { theme.color_schemes.find_by(name: "Marigold Dark") } before { SiteSetting.interface_color_selector = "sidebar_footer" }