instead of a fixed column layout, fit based on minimum column size

This commit is contained in:
Andrew Dolgov 2021-03-10 16:14:42 +03:00
parent 5bc47451e1
commit fb89c3bad0
6 changed files with 244 additions and 256 deletions

View File

@ -647,49 +647,47 @@ body.ttrss_main #headlines-wrap-inner {
body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed { body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
display: none; 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"] {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { display: grid;
display: grid; grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
grid-template-columns: repeat(2, minmax(0, 1fr)); background-color: #f5f5f5;
background-color: #f5f5f5; grid-gap: 8px;
grid-gap: 8px; padding: 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 .header, body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { background: white;
background: white; border: 1px solid #ddd;
border: 1px solid #ddd; overflow: hidden;
overflow: hidden; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content {
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;
border-top-width: 0; padding: 0 4px 4px 4px;
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] {
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;
top: -8px; border-bottom-width: 1px;
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 {
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;
border-bottom-width: 0; padding: 4px;
padding: 4px; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { display: none;
display: none; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { border: 0;
border: 0; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right {
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;
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 {
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;
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"] #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"] .whiteBox, body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { grid-column: 1 / -1;
grid-column: span 2;
}
} }
body.ttrss_main #headlines-frame { body.ttrss_main #headlines-frame {
padding: 0px; padding: 0px;

View File

@ -647,49 +647,47 @@ body.ttrss_main #headlines-wrap-inner {
body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed { body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
display: none; 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"] {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { display: grid;
display: grid; grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
grid-template-columns: repeat(2, minmax(0, 1fr)); background-color: #222;
background-color: #222; grid-gap: 8px;
grid-gap: 8px; padding: 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 .header, body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { background: #333;
background: #333; border: 1px solid #222;
border: 1px solid #222; overflow: hidden;
overflow: hidden; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content {
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;
border-top-width: 0; padding: 0 4px 4px 4px;
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] {
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;
top: -8px; border-bottom-width: 1px;
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 {
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;
border-bottom-width: 0; padding: 4px;
padding: 4px; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { display: none;
display: none; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { border: 0;
border: 0; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right {
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;
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 {
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;
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"] #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"] .whiteBox, body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { grid-column: 1 / -1;
grid-column: span 2;
}
} }
body.ttrss_main #headlines-frame { body.ttrss_main #headlines-frame {
padding: 0px; padding: 0px;

View File

@ -647,49 +647,47 @@ body.ttrss_main #headlines-wrap-inner {
body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed { body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
display: none; 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"] {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { display: grid;
display: grid; grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
grid-template-columns: repeat(2, minmax(0, 1fr)); background-color: #f5f5f5;
background-color: #f5f5f5; grid-gap: 8px;
grid-gap: 8px; padding: 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 .header, body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { background: white;
background: white; border: 1px solid #ddd;
border: 1px solid #ddd; overflow: hidden;
overflow: hidden; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content {
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;
border-top-width: 0; padding: 0 4px 4px 4px;
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] {
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;
top: -8px; border-bottom-width: 1px;
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 {
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;
border-bottom-width: 0; padding: 4px;
padding: 4px; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { display: none;
display: none; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { border: 0;
border: 0; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right {
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;
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 {
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;
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"] #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"] .whiteBox, body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { grid-column: 1 / -1;
grid-column: span 2;
}
} }
body.ttrss_main #headlines-frame { body.ttrss_main #headlines-frame {
padding: 0px; padding: 0px;

View File

@ -755,57 +755,55 @@ body.ttrss_main {
display : none; display : none;
} }
@media screen and (min-width: 1500px) { #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] {
#headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { display : grid;
display : grid; grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
grid-template-columns: repeat(2, minmax(0, 1fr)); background-color: @color-panel-bg;
background-color: @color-panel-bg; grid-gap : 8px;
grid-gap : 8px; padding : 8px;
padding : 8px;
.cdm.expanded { .cdm.expanded {
.header, .content { .header, .content {
background : @default-bg; background : @default-bg;
border : 1px solid @border-default; border : 1px solid @border-default;
overflow : hidden; overflow : hidden;
} }
.content { .content {
border-top-width : 0; border-top-width : 0;
padding : 0 4px 4px 4px; padding : 0 4px 4px 4px;
} }
.header[data-is-stuck] { .header[data-is-stuck] {
top : -8px; top : -8px;
border-bottom-width: 1px; border-bottom-width: 1px;
} }
.header { .header {
border-bottom-width : 0; border-bottom-width : 0;
padding : 4px; padding : 4px;
.feed { .feed {
display : none; display : none;
}
}
.footer {
border : 0;
.right {
white-space : nowrap;
}
}
.content-inner {
word-break: break-all;
} }
} }
#headlines-spacer, .whiteBox, .feed-title { .footer {
grid-column : span 2; border : 0;
.right {
white-space : nowrap;
}
} }
.content-inner {
word-break: break-all;
}
}
#headlines-spacer, .whiteBox, .feed-title {
grid-column : 1 e("/") -1;
} }
} }

View File

@ -648,49 +648,47 @@ body.ttrss_main #headlines-wrap-inner {
body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed { body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
display: none; 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"] {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { display: grid;
display: grid; grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
grid-template-columns: repeat(2, minmax(0, 1fr)); background-color: #222;
background-color: #222; grid-gap: 8px;
grid-gap: 8px; padding: 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 .header, body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { background: #333;
background: #333; border: 1px solid #222;
border: 1px solid #222; overflow: hidden;
overflow: hidden; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content {
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;
border-top-width: 0; padding: 0 4px 4px 4px;
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] {
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;
top: -8px; border-bottom-width: 1px;
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 {
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;
border-bottom-width: 0; padding: 4px;
padding: 4px; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { display: none;
display: none; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { border: 0;
border: 0; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right {
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;
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 {
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;
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"] #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"] .whiteBox, body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { grid-column: 1 / -1;
grid-column: span 2;
}
} }
body.ttrss_main #headlines-frame { body.ttrss_main #headlines-frame {
padding: 0px; padding: 0px;

View File

@ -648,49 +648,47 @@ body.ttrss_main #headlines-wrap-inner {
body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed { body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
display: none; 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"] {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] { display: grid;
display: grid; grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
grid-template-columns: repeat(2, minmax(0, 1fr)); background-color: #222;
background-color: #222; grid-gap: 8px;
grid-gap: 8px; padding: 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 .header, body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content { background: #333;
background: #333; border: 1px solid #222;
border: 1px solid #222; overflow: hidden;
overflow: hidden; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content {
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;
border-top-width: 0; padding: 0 4px 4px 4px;
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] {
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;
top: -8px; border-bottom-width: 1px;
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 {
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;
border-bottom-width: 0; padding: 4px;
padding: 4px; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed { display: none;
display: none; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer { border: 0;
border: 0; }
} body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .right {
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;
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 {
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;
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"] #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"] .whiteBox, body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title {
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .feed-title { grid-column: 1 / -1;
grid-column: span 2;
}
} }
body.ttrss_main #headlines-frame { body.ttrss_main #headlines-frame {
padding: 0px; padding: 0px;