diff --git a/src/renderer/components/ft-list-channel/ft-list-channel.scss b/src/renderer/components/ft-list-channel/ft-list-channel.scss index 9ceb653420faa..4fa0fe962cfaa 100644 --- a/src/renderer/components/ft-list-channel/ft-list-channel.scss +++ b/src/renderer/components/ft-list-channel/ft-list-channel.scss @@ -1,5 +1,44 @@ @use '../../scss-partials/_ft-list-item'; +.ft-list-channel { + &.grid { + align-items: center; + text-align: center; + + .infoAndSubscribe { + flex-flow: column wrap; + align-items: center; + + .info { + margin-block-end: 12px; + + .infoLine { + text-align: center; + } + } + } + } + + &.list { + .infoAndSubscribe { + flex-flow: row wrap; + justify-content: center; + + .channelSubscribeButton { + margin-block: auto; + margin-inline: 7px; + } + } + } +} + +.infoAndSubscribe { + display: flex; + flex-flow: row wrap; + justify-content: center; + inline-size: 100%; +} + .handle { color: inherit; text-decoration: none; diff --git a/src/renderer/scss-partials/_ft-list-item.scss b/src/renderer/scss-partials/_ft-list-item.scss index 624d210933c88..1fda317db6d21 100644 --- a/src/renderer/scss-partials/_ft-list-item.scss +++ b/src/renderer/scss-partials/_ft-list-item.scss @@ -386,45 +386,6 @@ $watched-transition-duration: 0.5s; } } -.ft-list-channel { - .infoAndSubscribe { - display: flex; - flex-flow: row wrap; - justify-content: center; - inline-size: 100%; - } - - &.grid { - align-items: center; - text-align: center; - - .infoAndSubscribe { - flex-flow: column wrap; - align-items: center; - - .info { - margin-block-end: 12px; - - .infoLine { - text-align: center; - } - } - } - } - - &.list { - .infoAndSubscribe { - flex-flow: row wrap; - justify-content: center; - - .channelSubscribeButton { - margin-block: auto; - margin-inline: 7px; - } - } - } -} - .videoWatched, .live, .upcoming {