diff --git a/themes/compact.css b/themes/compact.css index ddaf8c4de..858bdb8f5 100644 --- a/themes/compact.css +++ b/themes/compact.css @@ -647,49 +647,47 @@ body.ttrss_main #headlines-wrap-inner { body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed { display: none; } -@media screen and (min-width: 1500px) { - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { - display: grid; - grid-template-columns: repeat(2, minmax(0, 1fr)); - background-color: #f5f5f5; - grid-gap: 8px; - padding: 8px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { - background: white; - border: 1px solid #ddd; - overflow: hidden; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { - border-top-width: 0; - padding: 0 4px 4px 4px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header[data-is-stuck] { - top: -8px; - border-bottom-width: 1px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header { - border-bottom-width: 0; - padding: 4px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { - display: none; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { - border: 0; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right { - white-space: nowrap; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content-inner { - word-break: break-all; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] #headlines-spacer, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .whiteBox, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { - grid-column: span 2; - } +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(600px, 1fr)); + background-color: #f5f5f5; + grid-gap: 8px; + padding: 8px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { + background: white; + border: 1px solid #ddd; + overflow: hidden; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { + border-top-width: 0; + padding: 0 4px 4px 4px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header[data-is-stuck] { + top: -8px; + border-bottom-width: 1px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header { + border-bottom-width: 0; + padding: 4px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { + display: none; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { + border: 0; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right { + white-space: nowrap; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content-inner { + word-break: break-all; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] #headlines-spacer, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .whiteBox, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { + grid-column: 1 / -1; } body.ttrss_main #headlines-frame { padding: 0px; diff --git a/themes/compact_night.css b/themes/compact_night.css index 54dcb9b04..a13b2f6cd 100644 --- a/themes/compact_night.css +++ b/themes/compact_night.css @@ -647,49 +647,47 @@ body.ttrss_main #headlines-wrap-inner { body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed { display: none; } -@media screen and (min-width: 1500px) { - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { - display: grid; - grid-template-columns: repeat(2, minmax(0, 1fr)); - background-color: #222; - grid-gap: 8px; - padding: 8px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { - background: #333; - border: 1px solid #222; - overflow: hidden; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { - border-top-width: 0; - padding: 0 4px 4px 4px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header[data-is-stuck] { - top: -8px; - border-bottom-width: 1px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header { - border-bottom-width: 0; - padding: 4px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { - display: none; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { - border: 0; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right { - white-space: nowrap; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content-inner { - word-break: break-all; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] #headlines-spacer, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .whiteBox, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { - grid-column: span 2; - } +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(600px, 1fr)); + background-color: #222; + grid-gap: 8px; + padding: 8px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { + background: #333; + border: 1px solid #222; + overflow: hidden; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { + border-top-width: 0; + padding: 0 4px 4px 4px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header[data-is-stuck] { + top: -8px; + border-bottom-width: 1px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header { + border-bottom-width: 0; + padding: 4px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { + display: none; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { + border: 0; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right { + white-space: nowrap; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content-inner { + word-break: break-all; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] #headlines-spacer, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .whiteBox, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { + grid-column: 1 / -1; } body.ttrss_main #headlines-frame { padding: 0px; diff --git a/themes/light.css b/themes/light.css index 4b2baa286..46dc8e987 100644 --- a/themes/light.css +++ b/themes/light.css @@ -647,49 +647,47 @@ body.ttrss_main #headlines-wrap-inner { body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed { display: none; } -@media screen and (min-width: 1500px) { - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { - display: grid; - grid-template-columns: repeat(2, minmax(0, 1fr)); - background-color: #f5f5f5; - grid-gap: 8px; - padding: 8px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { - background: white; - border: 1px solid #ddd; - overflow: hidden; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { - border-top-width: 0; - padding: 0 4px 4px 4px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header[data-is-stuck] { - top: -8px; - border-bottom-width: 1px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header { - border-bottom-width: 0; - padding: 4px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { - display: none; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { - border: 0; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right { - white-space: nowrap; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content-inner { - word-break: break-all; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] #headlines-spacer, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .whiteBox, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { - grid-column: span 2; - } +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(600px, 1fr)); + background-color: #f5f5f5; + grid-gap: 8px; + padding: 8px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { + background: white; + border: 1px solid #ddd; + overflow: hidden; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { + border-top-width: 0; + padding: 0 4px 4px 4px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header[data-is-stuck] { + top: -8px; + border-bottom-width: 1px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header { + border-bottom-width: 0; + padding: 4px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { + display: none; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { + border: 0; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right { + white-space: nowrap; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content-inner { + word-break: break-all; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] #headlines-spacer, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .whiteBox, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { + grid-column: 1 / -1; } body.ttrss_main #headlines-frame { padding: 0px; diff --git a/themes/light/tt-rss.less b/themes/light/tt-rss.less index 38593a8a5..033694b44 100644 --- a/themes/light/tt-rss.less +++ b/themes/light/tt-rss.less @@ -755,57 +755,55 @@ body.ttrss_main { display : none; } - @media screen and (min-width: 1500px) { - #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { - display : grid; - grid-template-columns: repeat(2, minmax(0, 1fr)); - background-color: @color-panel-bg; - grid-gap : 8px; - padding : 8px; + #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { + display : grid; + grid-template-columns: repeat(auto-fit, minmax(600px, 1fr)); + background-color: @color-panel-bg; + grid-gap : 8px; + padding : 8px; - .cdm.expanded { + .cdm.expanded { - .header, .content { - background : @default-bg; - border : 1px solid @border-default; - overflow : hidden; - } + .header, .content { + background : @default-bg; + border : 1px solid @border-default; + overflow : hidden; + } - .content { - border-top-width : 0; - padding : 0 4px 4px 4px; - } + .content { + border-top-width : 0; + padding : 0 4px 4px 4px; + } - .header[data-is-stuck] { - top : -8px; - border-bottom-width: 1px; - } + .header[data-is-stuck] { + top : -8px; + border-bottom-width: 1px; + } - .header { - border-bottom-width : 0; - padding : 4px; + .header { + border-bottom-width : 0; + padding : 4px; - .feed { - display : none; - } - } - - .footer { - border : 0; - - .right { - white-space : nowrap; - } - } - - .content-inner { - word-break: break-all; + .feed { + display : none; } } - #headlines-spacer, .whiteBox, .feed-title { - grid-column : span 2; + .footer { + border : 0; + + .right { + white-space : nowrap; + } } + + .content-inner { + word-break: break-all; + } + } + + #headlines-spacer, .whiteBox, .feed-title { + grid-column : 1 e("/") -1; } } diff --git a/themes/night.css b/themes/night.css index 59cde9826..4b76c0289 100644 --- a/themes/night.css +++ b/themes/night.css @@ -648,49 +648,47 @@ body.ttrss_main #headlines-wrap-inner { body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed { display: none; } -@media screen and (min-width: 1500px) { - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { - display: grid; - grid-template-columns: repeat(2, minmax(0, 1fr)); - background-color: #222; - grid-gap: 8px; - padding: 8px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { - background: #333; - border: 1px solid #222; - overflow: hidden; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { - border-top-width: 0; - padding: 0 4px 4px 4px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header[data-is-stuck] { - top: -8px; - border-bottom-width: 1px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header { - border-bottom-width: 0; - padding: 4px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { - display: none; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { - border: 0; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right { - white-space: nowrap; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content-inner { - word-break: break-all; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] #headlines-spacer, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .whiteBox, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { - grid-column: span 2; - } +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(600px, 1fr)); + background-color: #222; + grid-gap: 8px; + padding: 8px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { + background: #333; + border: 1px solid #222; + overflow: hidden; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { + border-top-width: 0; + padding: 0 4px 4px 4px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header[data-is-stuck] { + top: -8px; + border-bottom-width: 1px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header { + border-bottom-width: 0; + padding: 4px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { + display: none; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { + border: 0; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right { + white-space: nowrap; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content-inner { + word-break: break-all; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] #headlines-spacer, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .whiteBox, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { + grid-column: 1 / -1; } body.ttrss_main #headlines-frame { padding: 0px; diff --git a/themes/night_blue.css b/themes/night_blue.css index dd3308cb0..fdbd3a4b8 100644 --- a/themes/night_blue.css +++ b/themes/night_blue.css @@ -648,49 +648,47 @@ body.ttrss_main #headlines-wrap-inner { body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed { display: none; } -@media screen and (min-width: 1500px) { - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { - display: grid; - grid-template-columns: repeat(2, minmax(0, 1fr)); - background-color: #222; - grid-gap: 8px; - padding: 8px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { - background: #333; - border: 1px solid #222; - overflow: hidden; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { - border-top-width: 0; - padding: 0 4px 4px 4px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header[data-is-stuck] { - top: -8px; - border-bottom-width: 1px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header { - border-bottom-width: 0; - padding: 4px; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { - display: none; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { - border: 0; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right { - white-space: nowrap; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content-inner { - word-break: break-all; - } - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] #headlines-spacer, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .whiteBox, - body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { - grid-column: span 2; - } +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(600px, 1fr)); + background-color: #222; + grid-gap: 8px; + padding: 8px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { + background: #333; + border: 1px solid #222; + overflow: hidden; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { + border-top-width: 0; + padding: 0 4px 4px 4px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header[data-is-stuck] { + top: -8px; + border-bottom-width: 1px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header { + border-bottom-width: 0; + padding: 4px; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { + display: none; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { + border: 0; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right { + white-space: nowrap; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content-inner { + word-break: break-all; +} +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] #headlines-spacer, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .whiteBox, +body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { + grid-column: 1 / -1; } body.ttrss_main #headlines-frame { padding: 0px;