diff --git a/desktop/desktop.scss b/desktop/desktop.scss index e69de29..cc9cb44 100644 --- a/desktop/desktop.scss +++ b/desktop/desktop.scss @@ -0,0 +1,65 @@ +.bulk-select-enabled { + .topic-list-header .topic-list-data.default { + position: sticky; + top: 10em; + } + .topic-author-avatar-data { + display: none; + } + + .bulk-select.topic-list-data { + grid-area: avatar; + margin-left: -0.5em; + padding: 0; + margin-top: 2.5em; + + @media screen and (max-width: 576px) { + margin-top: 0; + label { + padding-block: 0.345em; + } + } + + input { + transform: scale(1.5); + } + } +} + +.topic-list-header { + tr { + border: none; + } + + .topic-list-data { + padding: 0; + + &:not(.default) { + display: none; + } + + &.default { + position: absolute; + right: 0; + .bulk-select, + span:not(.bulk-select-topics, .d-button-label) { + display: none; + } + } + } + + .bulk-select-topics { + position: absolute; + right: -1em; + @media screen and (max-width: 1048px) { + right: 0; + } + + background: var(--secondary); + border-radius: 0 0 0 var(--d-border-radius); + padding: 1em; + button { + white-space: nowrap; + } + } +} diff --git a/javascripts/discourse/api-initializers/reposition-bulk-select.js b/javascripts/discourse/api-initializers/reposition-bulk-select.js new file mode 100644 index 0000000..ce98994 --- /dev/null +++ b/javascripts/discourse/api-initializers/reposition-bulk-select.js @@ -0,0 +1,7 @@ +import { apiInitializer } from "discourse/lib/api"; + +export default apiInitializer("0.8.0", (api) => { + api.registerValueTransformer("bulk-select-in-nav-controls", () => { + return true; + }); +}); diff --git a/scss/topic-cards.scss b/scss/topic-cards.scss index 6e9f343..93e4502 100644 --- a/scss/topic-cards.scss +++ b/scss/topic-cards.scss @@ -34,7 +34,7 @@ $extra-large: 1280px; .bulk-select-enabled .topic-list-item { grid-template-areas: - "bulk-select avatar author status status . activity" + "avatar author status status . activity" ". topic-title topic-title topic-title likes-replies likes-replies category"; .bulk-select { grid-area: bulk-select; @@ -50,7 +50,7 @@ $extra-large: 1280px; grid-template-columns: 44px min-content min-content auto min-content min-content min-content; grid-template-rows: 22px minmax(22px, auto); grid-template-areas: - "bulk-select avatar author status status . activity" + "avatar author status status . activity" ". topic-title topic-title topic-title . . likes-replies" ". topic-title topic-title topic-title . . category"; } @@ -58,7 +58,7 @@ $extra-large: 1280px; grid-template-columns: 25px auto repeat(6, 1fr); grid-template-rows: auto auto auto; grid-template-areas: - "bulk-select category-status category-status . . . . activity" + "avatar category-status category-status . . . . activity" "topic-title topic-title topic-title topic-title topic-title topic-title topic-title topic-title" "avatar author . . . . . likes-replies"; } @@ -355,10 +355,6 @@ body.user-messages-page .topic-list-item { } } -.topic-list-header { - display: none; -} - .topic-list-item { background: var(--d-content-background); box-shadow: 0px 0px 12px 1px var(--topic-card-shadow);