diff options
Diffstat (limited to 'themes/night.css')
| -rw-r--r-- | themes/night.css | 140 |
1 files changed, 16 insertions, 124 deletions
diff --git a/themes/night.css b/themes/night.css index aef5309a0..4021c7d10 100644 --- a/themes/night.css +++ b/themes/night.css @@ -927,12 +927,10 @@ body.ttrss_main i.icon-no-feed { body.ttrss_main .dijitTreeRow.UpdatesDisabled .dijitTreeLabel { opacity: 0.5; } -body.ttrss_main #floatingTitle.marked i.marked-pic, body.ttrss_main .cdm.marked .left i.marked-pic, body.ttrss_main .hl.marked .left i.marked-pic { color: #ffc069; } -body.ttrss_main #floatingTitle.published i.pub-pic, body.ttrss_main .cdm.published .left i.pub-pic, body.ttrss_main .hl.published .left i.pub-pic { color: #ff7c4b; @@ -1126,6 +1124,10 @@ video::-webkit-media-controls-overlay-play-button { .cdm i.material-icons { color: #777; } +.cdm .header { + position: sticky; + top: 0; +} .cdm .header, .cdm .footer { display: flex; @@ -1138,6 +1140,9 @@ video::-webkit-media-controls-overlay-play-button { margin: 0px 4px; vertical-align: middle; } +.cdm .header-sticky-guard { + height: 0; +} .cdm .header { align-items: center; } @@ -1170,6 +1175,14 @@ video::-webkit-media-controls-overlay-play-button { .cdm .header input { margin: 0px 4px; } +.cdm .header[stuck] { + box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1); + border: 0 solid #222; + border-bottom-width: 1px; + background: #333 ! important; + opacity: 0.9; + backdrop-filter: blur(6px); +} .cdm .footer { height: 30px; padding-left: 5px; @@ -1217,7 +1230,7 @@ video::-webkit-media-controls-overlay-play-button { margin-top: 0px; margin-bottom: 0px; } -div.cdm.expanded div.header { +div.cdm.expanded .header:not([stuck]) { background: transparent ! important; } div.cdm.expanded div.header a.title { @@ -1288,115 +1301,6 @@ div.cdm.vgrlf .feed { display: inline-block; padding: 1px 4px 1px 4px; } -#main:not(.expandable) div#floatingTitle .collapse { - display: none; -} -div#floatingTitle { - position: absolute; - z-index: 5; - top: 0px; - right: 0px; - left: 0px; - border: 0px solid #222; - border-bottom-width: 1px; - background: white; - color: #ccc; - display: flex; - flex-direction: row; - flex-wrap: nowrap; - box-shadow: 0px 1px 1px -1px rgba(0, 0, 0, 0.1); - align-items: center; -} -div#floatingTitle > * { - white-space: nowrap; - padding: 4px; -} -div#floatingTitle .left, -div#floatingTitle .right { - display: flex; - align-items: center; -} -div#floatingTitle .left i.material-icons, -div#floatingTitle .right i.material-icons { - margin-left: 2px; - font-size: 21px; - padding: 2px; - user-select: none; -} -div#floatingTitle .left i.icon-anchor, -div#floatingTitle .right i.icon-anchor { - margin-left: 0px; - margin-right: 1px; - padding: 0px; - color: #ccc; - cursor: pointer; -} -div#floatingTitle .excerpt { - display: none; -} -div#floatingTitle .collapse i.material-icons { - color: #b87d2c; - cursor: pointer; -} -div#floatingTitle span.author { - color: #ccc; - font-size: 11px; - font-weight: normal; -} -div#floatingTitle a.title { - font-size: 16px; - color: #999; - transition: color 0.2s, background 0.2s; - font-weight: 600; - text-rendering: optimizelegibility; - font-family: "Segoe WP Semibold", "Segoe UI Semibold", "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif; -} -div#floatingTitle div.feed { - padding-right: 10px; - color: #ccc; - font-weight: normal; - font-style: italic; - font-size: 11px; - white-space: nowrap; -} -div#floatingTitle div.feed a { - border-radius: 4px; - display: inline-block; - padding: 1px 4px 1px 4px; -} -div#floatingTitle span.updated { - padding-right: 10px; - white-space: nowrap; - color: #ccc; - font-size: 11px; -} -div#floatingTitle div.feed a { - color: #ccc; -} -div#floatingTitle span.titleWrap { - width: 100%; - white-space: normal; -} -div#floatingTitle .feed-title > * { - display: table-cell; - vertical-align: middle; -} -div#floatingTitle .feed-title a.title { - width: 100%; -} -div#floatingTitle .feed-title a.catchup { - text-align: right; - color: #ccc; - padding-right: 10px; - font-size: 11px; - white-space: nowrap; -} -div#floatingTitle .feed-title a.catchup:hover { - color: #b87d2c; -} -div#floatingTitle.Unread a.title { - color: black; -} .cdm.expandable { background-color: #222; border: 0px solid #222; @@ -2002,18 +1906,6 @@ body.flat.ttrss_main #feeds-holder #feedTree .dijitTreeRowSelected .dijitTreeLab body.flat.ttrss_main #feeds-holder #feedTree i.icon.icon-inbox { color: #999999; } -body.flat.ttrss_main #floatingTitle { - background-color: #333; -} -body.flat.ttrss_main #floatingTitle .feed a { - color: #e6e6e6; -} -body.flat.ttrss_main #floatingTitle i.material-icons { - opacity: 0.7; -} -body.flat.ttrss_main div#floatingTitle.Unread a.title { - color: #e6e6e6; -} body.flat.ttrss_main #headlines-frame .hl:not(.active):not(.Selected):not(.Unread), body.flat.ttrss_main #headlines-frame .cdm.expandable:not(.active):not(.Selected):not(.Unread) { background: #333; |