1
0
mirror of https://tt-rss.org/git/tt-rss.git synced 2024-06-28 12:10:52 +02:00
ttrss/themes/compact.css
Michael Kuhn 1ff52bff81 themes: Fix incorrect blur and opacity interaction
Chrome sometimes seems to have problems when using a blur
backdrop-filter in combination with opacity. On Linux, this often
results in the blur being completely ignored. This also seems to apply
to other systems, though. See the following issue for more details:
https://bugs.chromium.org/p/chromium/issues/detail?id=1129838

Making the background opaque using rgba seems to fix the problem.
2022-01-05 20:42:21 +01:00

2115 lines
51 KiB
CSS

@import "../lib/flat-ttrss/flat_combined.css";
body.ttrss_main,
body.ttrss_prefs,
#main {
position: absolute;
width: 100%;
height: 100%;
border: 0;
padding: 0;
margin: 0;
}
body.ttrss_main {
background: white;
color: #555;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
overflow: hidden;
/*ul.compact {
list-style-type : none;
margin : 0;
padding : 0;
li {
margin : 0;
padding : 0;
}
}*/
}
body.ttrss_main :focus {
outline: none;
}
body.ttrss_main .post {
padding: 0;
font-size: 13px;
}
body.ttrss_main .post .header {
padding: 5px;
color: #555;
border: 0 solid #ddd;
border-bottom-width: 1px;
background: #f5f5f5;
}
body.ttrss_main .post .header .left,
body.ttrss_main .post .header .right {
display: flex;
align-items: center;
}
body.ttrss_main .post .header .row {
display: flex;
margin-bottom: 4px;
flex-wrap: nowrap;
align-items: center;
justify-content: space-between;
}
body.ttrss_main .post .header .comments {
flex-grow: 2;
}
body.ttrss_main .post .header .date {
white-space: nowrap;
}
body.ttrss_main .post .header img,
body.ttrss_main .post .header i.material-icons {
margin: 0px 4px;
vertical-align: middle;
color: #777;
}
body.ttrss_main .post .header .title {
flex-grow: 2;
font-size: 15px;
font-weight: 600;
text-rendering: optimizelegibility;
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
body.ttrss_main .post div.content {
padding: 10px;
font-size: 16px;
}
body.ttrss_main .post div.content img,
body.ttrss_main .post div.content video {
border-width: 0px;
max-width: 98%;
height: auto;
}
body.ttrss_main .post div.content div.embed-responsive {
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
}
body.ttrss_main .post div.content div.embed-responsive iframe {
border: 0;
bottom: 0;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
body.ttrss_main .inline-player {
display: flex;
align-items: center;
}
body.ttrss_main .inline-player audio {
margin-right: 8px;
}
body.ttrss_main .article-note {
background-color: #fff7d5;
margin: 5px;
border: 1px solid #e7d796;
color: #9a8c59;
display: flex;
align-items: center;
}
body.ttrss_main .article-note > * {
padding: 5px;
}
body.ttrss_main .article-note.editable {
cursor: pointer;
}
body.ttrss_main h1 {
font-size: 18px;
font-weight: 600;
text-rendering: optimizelegibility;
}
body.ttrss_main h2 {
font-size: 16px;
font-weight: 600;
text-rendering: optimizelegibility;
}
body.ttrss_main h3 {
font-size: 16px;
font-weight: 600;
text-rendering: optimizelegibility;
}
body.ttrss_main h4 {
font-size: 14px;
font-weight: 600;
text-rendering: optimizelegibility;
}
body.ttrss_main a {
color: #257aa7;
text-decoration: none;
}
body.ttrss_main a:hover {
color: #133d54;
text-decoration: underline;
}
body.ttrss_main #notify.visible {
opacity: 100;
}
body.ttrss_main #notify {
bottom: 20px;
right: 20px;
min-width: 200px;
max-width: 350px;
border-width: 1px;
border-style: solid;
position: fixed;
font-size: 14px;
z-index: 99;
display: flex;
opacity: 0;
align-items: center;
padding: 10px;
transition: opacity 0.2s linear;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);
}
body.ttrss_main #notify img {
vertical-align: middle;
}
body.ttrss_main #notify .msg {
flex-grow: 2;
padding: 0 10px;
line-height: 20px;
}
body.ttrss_main #notify .icon-close {
cursor: pointer;
}
body.ttrss_main .notify {
border-color: #d7c47a;
background-color: #fff7d5;
}
body.ttrss_main .notify.notify_progress {
border-color: #d7c47a;
background-color: #fff7d5;
}
body.ttrss_main .notify.notify_progress img {
width: 18px;
height: 18px;
filter: saturate(0);
}
body.ttrss_main .notify.notify_info {
border-color: #257aa7;
background-color: #d5ebf6;
}
body.ttrss_main .notify.notify_info i.icon-notify {
color: #257aa7;
}
body.ttrss_main .notify.notify_error {
background-color: #c00;
border-color: #900;
color: white;
}
body.ttrss_main .notify.notify_error i.icon-notify,
body.ttrss_main .notify.notify_error i.icon-close {
color: white;
}
body.ttrss_main .action-chooser .action-button .dijitButtonText {
vertical-align: unset;
}
body.ttrss_main .action-chooser .action-button .dijitArrowButtonInner {
display: none;
}
body.ttrss_main .hl {
border: 0px solid #ddd;
border-bottom-width: 1px;
transition: color 0.2s, background 0.2s;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
background: #f5f5f5;
align-items: center;
user-select: none;
}
body.ttrss_main .hl > * {
white-space: nowrap;
padding: 4px;
}
body.ttrss_main .hl img {
vertical-align: middle;
}
body.ttrss_main .hl .left,
body.ttrss_main .hl .right {
display: flex;
align-items: center;
}
body.ttrss_main .hl .left img,
body.ttrss_main .hl .right img {
margin: 0 4px;
}
body.ttrss_main .hl .left i.material-icons,
body.ttrss_main .hl .right i.material-icons {
margin-left: 2px;
padding: 2px;
transition: color 0.2s linear;
user-select: none;
font-size: 21px;
}
body.ttrss_main .hl .left input {
margin: 0 4px;
}
body.ttrss_main .hl .right {
text-align: right;
}
body.ttrss_main .hl .right i.material-icons {
color: #777;
}
body.ttrss_main .hl .title {
cursor: pointer;
flex-grow: 2;
overflow: hidden;
text-overflow: ellipsis;
}
body.ttrss_main .hl .author {
white-space: nowrap;
color: #555;
font-size: 11px;
font-weight: normal;
}
body.ttrss_main .hl .feed a {
border-radius: 4px;
display: inline-block;
padding: 1px 4px;
font-size: 11px;
font-style: italic;
font-weight: normal;
color: #555;
}
body.ttrss_main .hl .feed a:hover {
color: #257aa7;
}
body.ttrss_main .hl .updated {
color: #555;
text-align: right;
font-size: 11px;
padding-left: 10px;
}
body.ttrss_main .hl .updated div {
display: inline-block;
}
body.ttrss_main .hl div.title a {
font-weight: 600;
text-rendering: optimizelegibility;
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #555;
}
body.ttrss_main .hl a.title.high,
body.ttrss_main .hl span.hl-content.high .preview {
color: #00aa00;
}
body.ttrss_main .hl.vgrlf .feed {
display: none;
}
body.ttrss_main .hl.Unread {
background: white;
}
body.ttrss_main .hl.Unread .title a {
color: black;
}
body.ttrss_main .hl.active .title a {
color: #257aa7;
/* text-shadow : 1px 1px 2px #fff; */
}
body.ttrss_main .hl.active {
background: #257aa7 ! important;
}
body.ttrss_main .hl.active,
body.ttrss_main .hl.Selected {
color: white;
background: #3f728e;
}
body.ttrss_main .hl.active a,
body.ttrss_main .hl.Selected a,
body.ttrss_main .hl.active .feed a,
body.ttrss_main .hl.Selected .feed a,
body.ttrss_main .hl.active .hl-content a.title,
body.ttrss_main .hl.Selected .hl-content a.title,
body.ttrss_main .hl.active span,
body.ttrss_main .hl.Selected span {
color: white;
}
body.ttrss_main #content-insert blockquote,
body.ttrss_main #headlines-frame blockquote,
body.ttrss_main .dijitContentPane blockquote {
margin: 5px 0px 5px 0px;
color: #555;
padding-left: 10px;
border: 0px solid #ccc;
border-left-width: 4px;
}
body.ttrss_main #content-insert code,
body.ttrss_main #headlines-frame code,
body.ttrss_main .dijitContentPane code {
color: #009900;
font-family: monospace;
}
body.ttrss_main #content-insert pre,
body.ttrss_main #headlines-frame pre,
body.ttrss_main .dijitContentPane pre {
margin: 5px 0px 5px 0px;
padding: 10px;
color: #555;
font-family: monospace;
font-size: 12px;
border: 0px solid #ccc;
background: #f5f5f5;
display: block;
max-width: 98%;
overflow: auto;
white-space: pre-wrap;
}
body.ttrss_main div.prefHelp {
color: #555;
padding: 5px;
}
body.ttrss_main span.preview {
color: #999;
font-weight: normal;
font-size: 12px;
padding-left: 4px;
}
body.ttrss_main .label {
display: inline-block;
vertical-align: middle;
background-color: #fff7d5;
font-size: 9px;
color: #555;
font-weight: normal;
margin-left: 2px;
padding: 2px 4px;
white-space: nowrap;
}
body.ttrss_main i.marked-pic,
body.ttrss_main i.pub-pic {
cursor: pointer;
color: #ccc;
}
body.ttrss_main #overlay {
background: white;
left: 0;
top: 0;
height: 100%;
width: 100%;
z-index: 100;
position: absolute;
}
body.ttrss_main #overlay_inner {
font-weight: bold;
margin: 1em;
}
body.ttrss_main div.whiteBox {
margin-left: 1px;
text-align: center;
padding: 1em 1em 0px 1em;
font-size: 11px;
border: 0px solid #ddd;
border-bottom-width: 1px;
}
body.ttrss_main .dijitDialog header,
body.ttrss_main .dijitDialog .dlgSec,
body.ttrss_main .dijitDialog .dlgSecHoriz {
font-size: 16px;
font-weight: 600;
color: #555;
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
body.ttrss_main .dijitDialog section,
body.ttrss_main .dijitDialog .dlgSecCont {
margin: 10px 20px;
}
body.ttrss_main .dijitDialog header.horizontal + section,
body.ttrss_main .dijitDialog section.horizontal,
body.ttrss_main .dijitDialog .dlgSecHoriz + .dlgSecCont {
margin: 10px 0;
}
body.ttrss_main .dijitDialog section.narrow {
margin: 0;
}
body.ttrss_main .dijitDialog section fieldset > label,
body.ttrss_main .dijitDialog div.dlgSecCont fieldset > label,
body.ttrss_main .dijitDialog div.dlgSecSimple fieldset > label {
font-weight: bold;
margin-right: 10px;
display: inline-block;
min-width: 140px;
text-align: right;
}
body.ttrss_main .dijitDialog section fieldset > label.checkbox,
body.ttrss_main .dijitDialog div.dlgSecCont fieldset > label.checkbox,
body.ttrss_main .dijitDialog div.dlgSecSimple fieldset > label.checkbox {
font-weight: normal;
display: inline;
}
body.ttrss_main .dijitDialog section fieldset > label.inline,
body.ttrss_main .dijitDialog div.dlgSecCont fieldset > label.inline,
body.ttrss_main .dijitDialog div.dlgSecSimple fieldset > label.inline {
display: inline;
}
body.ttrss_main .dijitDialog section fieldset,
body.ttrss_main .dijitDialog div.dlgSecCont fieldset,
body.ttrss_main .dijitDialog div.dlgSecSimple fieldset {
border-width: 0px;
padding: 5px 0px;
}
body.ttrss_main .dijitDialog section fieldset.narrow,
body.ttrss_main .dijitDialog div.dlgSecCont fieldset.narrow,
body.ttrss_main .dijitDialog div.dlgSecSimple fieldset.narrow {
padding: 2px 0px;
}
body.ttrss_main .dijitDialog section fieldset.align-right,
body.ttrss_main .dijitDialog div.dlgSecCont fieldset.align-right,
body.ttrss_main .dijitDialog div.dlgSecSimple fieldset.align-right {
text-align: right;
}
body.ttrss_main .dijitDialog footer,
body.ttrss_main .dijitDialog .dlgButtons {
margin-top: 5px;
text-align: right;
}
body.ttrss_main .dijitDialog footer.text-center {
text-align: center;
}
body.ttrss_main .dijitDialog textarea#tags_str {
height: 100px;
font-size: 12px;
width: 98%;
}
body.ttrss_main i.icon-label {
color: #fff7d5;
}
body.ttrss_main div#cmdline {
position: absolute;
left: 5px;
bottom: 5px;
font-size: 11px;
color: #555;
font-weight: bold;
background-color: white;
border: 1px solid #257aa7;
padding: 3px 5px 3px 5px;
z-index: 5;
}
body.ttrss_main .exception-contents h3 {
color: red;
}
body.ttrss_main .exception-contents textarea {
width: 99%;
height: 200px;
font-size: 11px;
}
body.ttrss_main #headlines-wrap-inner,
body.ttrss_main #content-wrap {
padding: 0;
border: 0;
margin: 0;
}
body.ttrss_main #feeds-holder {
padding: 0;
border: 0 solid #ddd;
overflow: hidden;
background: #f5f5f5;
box-shadow: inset -1px 0px 2px -1px rgba(0, 0, 0, 0.1);
-webkit-overflow-scrolling: touch;
}
body.ttrss_main #feeds-holder #feedTree {
height: 100%;
overflow-x: hidden;
text-rendering: optimizelegibility;
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow {
border: 1px solid transparent;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow.Is_Feed .loadingNode {
left: -2px;
height: 14px;
width: 14px;
position: relative;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow.Is_Cat .loadingNode {
height: 11px;
width: 18px;
margin-left: 4px;
position: relative;
top: 2px;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .counterNode {
order: 2;
font-weight: bold;
display: none;
font-size: 9px;
text-align: center;
border: 1px solid #2a89bc;
color: white;
background: #2a89bc;
border-radius: 4px;
line-height: 14px;
margin-right: 8px;
min-width: 23px;
height: 14px;
flex-shrink: 0;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .counterNode.aux,
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .counterNode.marked {
background: #f5f5f5;
color: #6f6f6f;
border-color: #dcdcdc;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .counterNode.marked {
border-color: #257aa7;
background: #ffffff;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow[data-feed-id="-3"][data-is-cat="false"] .counterNode.unread {
background-color: #3ea447;
border-color: #307f37;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .dijitTreeContent {
display: flex;
align-items: center;
flex-grow: 2;
min-width: 0;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .dijitTreeLabel {
cursor: pointer;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
position: relative;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .dijitTreeLabel.Unread {
font-weight: bold;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow.Error .dijitTreeLabel {
color: red;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow.dijitTreeRowSelected {
box-shadow: -1px 0px 2px -1px rgba(0, 0, 0, 0.1);
border-color: #ddd transparent;
background: white;
color: #555;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .dijitIcon.feed-icon {
margin-right: 2px;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow i.icon.icon-inbox {
color: #888888;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow i.icon.icon-archive {
color: #cf7800;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow i.icon.icon-star {
position: relative;
color: #ffc069;
font-size: 21px;
left: -2px;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow i.icon.icon-rss_feed {
color: #ff7c4b;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow i.icon.icon-whatshot {
color: #69C671;
}
body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow i.icon.icon-restore {
font-weight: bold;
color: #257aa7;
}
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
padding: 8px;
grid-gap: 8px;
background-color: #f5f5f5;
}
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] > * {
/* 2 = because #headlines-spacer is the actual last child
only if odd to deal with 1) single article and 2) not break any previous rows;
1 = spacer;
this is outside of .cdm selector because of #headlines-spacer etc
.grid-span-row is manually expanded RROWs
*/
}
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] > *.grid-span-row,
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] > *:nth-last-child(2):nth-child(odd),
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] > *:nth-last-child(1) {
grid-column: 1 / -1;
}
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header,
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[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:not([data-headlines-count="0"])[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:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .content .content-inner a {
word-break: break-all;
}
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[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:not([data-headlines-count="0"])[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:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .icon-grid-span {
display: inline;
}
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .header .feed {
display: none;
}
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer {
border: 0;
padding: 4px;
}
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .left,
body.ttrss_main #headlines-frame:not([data-headlines-count="0"])[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:not([data-headlines-count="0"])[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .cdm.expanded .footer .left {
overflow: hidden;
text-overflow: ellipsis;
}
body.ttrss_main #headlines-frame {
padding: 0;
border: 0;
margin-top: 0;
-webkit-overflow-scrolling: touch;
-webkit-transform: translateZ(0);
transform: translateZ(0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed,
body.ttrss_main #headlines-frame[data-is-vfeed="false"] .hl .feed,
body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .icon-feed,
body.ttrss_main #headlines-frame[data-is-vfeed="false"] .hl .icon-feed {
display: none;
}
body.ttrss_main #headlines-frame[data-auto-catchup="true"] #headlines-spacer {
height: 100vh;
}
body.ttrss_main #headlines-frame .dijitCheckBox {
margin-right: 4px;
}
body.ttrss_main #headlines-frame[data-is-wide-screen="true"] .title {
overflow: visible;
white-space: normal;
}
body.ttrss_main #headlines-frame[data-is-wide-screen="true"] .hl .feed {
display: none;
}
body.ttrss_main #headlines-frame #headlines-spacer {
margin-left: 1px;
text-align: center;
color: #555;
font-size: 11px;
}
body.ttrss_main #headlines-frame #headlines-spacer a,
body.ttrss_main #headlines-frame #headlines-spacer span {
color: #555;
padding: 10px;
display: block;
}
body.ttrss_main #headlines-frame #headlines-spacer a:hover {
color: #257aa7;
}
body.ttrss_main #headlines-frame .feed-title {
border: 0px solid #257aa7;
border-bottom-width: 1px;
padding: 5px 8px;
}
body.ttrss_main #headlines-frame .feed-title a.title {
color: #555;
font-weight: bold;
}
body.ttrss_main #headlines-frame .feed-title a {
color: #555;
}
body.ttrss_main #headlines-frame .feed-title a:hover {
color: #257aa7;
}
body.ttrss_main #headlines-frame span.hlMenuAttach {
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
}
body.ttrss_main #toolbar-frame_splitter {
display: none;
}
body.ttrss_main #toolbar-frame {
padding: 0;
margin: 0;
border: 0;
white-space: nowrap;
font-size: 13px;
}
body.ttrss_main #toolbar-frame #toolbar {
background: white;
border: 0 solid #ddd;
border-bottom-width: 1px;
padding-left: 4px;
height: 32px;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
color: #555;
font-size: 13px;
align-items: center;
}
body.ttrss_main #toolbar-frame #toolbar .dijitSelect,
body.ttrss_main #toolbar-frame #toolbar .dijitDropDownButton .dijitButtonNode,
body.ttrss_main #toolbar-frame #toolbar .dijitComboButton .dijitButtonNode {
border: 0;
}
body.ttrss_main #toolbar-frame #toolbar i.net-alert,
body.ttrss_main #toolbar-frame #toolbar .left i.icon-error {
color: red;
}
body.ttrss_main #toolbar-frame #toolbar i.log-alert {
color: #ddba1c;
cursor: pointer;
}
body.ttrss_main #toolbar-frame #toolbar i {
margin: 0 4px;
}
body.ttrss_main #toolbar-frame #toolbar #toolbar-headlines {
font-size: 13px;
background: transparent;
padding-right: 4px;
flex-grow: 2;
display: flex;
}
body.ttrss_main #toolbar-frame #toolbar #toolbar-headlines .left {
flex-grow: 2;
display: flex;
align-items: center;
}
body.ttrss_main #toolbar-frame #toolbar #toolbar-headlines .left .feed_title,
body.ttrss_main #toolbar-frame #toolbar #toolbar-headlines .left .cancel_search {
margin-left: 4px;
}
@media (max-width: 768px) {
body.ttrss_main #toolbar-frame #toolbar #toolbar-headlines .left .feed_title,
body.ttrss_main #toolbar-frame #toolbar #toolbar-headlines .left i.icon-syndicate {
display: none;
}
}
body.ttrss_main #toolbar-frame #toolbar #toolbar-headlines .right {
display: flex;
align-items: center;
}
body.ttrss_main #toolbar-frame #toolbar #updates-available {
color: #69C671;
padding-right: 4px;
}
body.ttrss_main #toolbar-frame #toolbar #selected_prompt {
font-style: italic;
text-align: right;
margin-right: 4px;
color: #257aa7;
}
@media (max-width: 768px) {
body.ttrss_main #toolbar-frame #toolbar #selected_prompt {
display: none;
}
}
@media (max-width: 576px) {
body.ttrss_main #toolbar-frame #toolbar .select-articles-dropdown,
body.ttrss_main #toolbar-frame #toolbar .catchup-button {
display: none;
}
}
body.ttrss_main #header {
text-align: right;
color: #555;
padding: 5px 5px 0 0px;
position: absolute;
border: 0;
margin: 0;
right: 0;
top: 0;
z-index: 5;
}
body.ttrss_main #header i.net-alert,
body.ttrss_main #header .left i.icon-error {
color: red;
}
body.ttrss_main #header i.log-alert {
color: #ddba1c;
cursor: pointer;
}
body.ttrss_main #header #updates-available {
color: #69C671;
padding-right: 4px;
}
body.ttrss_main #header i {
margin: 0 4px;
}
body.ttrss_main #content-insert {
padding: 0;
border: 0;
line-height: 1.5;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
body.ttrss_main img.feed-icon,
body.ttrss_main img.icon {
width: 16px;
height: 16px;
line-height: 16px;
vertical-align: middle;
display: inline-block;
}
body.ttrss_main ul#filterDlg_Matches,
body.ttrss_main ul#filterDlg_Actions {
list-style-type: none;
margin: 0;
padding: 0;
}
body.ttrss_main ul#filterDlg_Matches li,
body.ttrss_main ul#filterDlg_Actions li {
cursor: pointer;
}
body.ttrss_main ul#filterDlg_Matches li .dijitCheckBox,
body.ttrss_main ul#filterDlg_Actions li .dijitCheckBox {
margin-right: 4px;
}
body.ttrss_main ul.hotkeys-help li {
display: flex;
}
body.ttrss_main ul.hotkeys-help li.desc {
flex-grow: 2;
}
body.ttrss_main ul.hotkeys-help .hk {
color: #257aa7;
width: 100px;
}
body.ttrss_main ul.hotkeys-help h3 {
margin: 8px 0px;
}
body.ttrss_main select.attachments {
display: block;
margin-top: 10px;
max-width: 120px;
}
body.ttrss_main #filterDlg_feeds select {
height: 150px;
width: 410px;
}
body.ttrss_main span.highlight {
background-color: #ffff00;
color: #cc90cc;
}
body.ttrss_main #feedEditDlg img.feedIcon {
border: 1px solid #ccc;
padding: 5px;
margin: 5px;
max-width: 20px;
max-height: 20px;
height: auto;
width: auto;
}
body.ttrss_main .dijitTooltipContents {
background: #1c5c7d;
color: #f5f5f5;
}
body.ttrss_main .dijitTooltipRight .dijitTooltipConnector {
border-right-color: #1c5c7d;
}
body.ttrss_main .dijitTooltipLeft .dijitTooltipConnector {
border-left-color: #1c5c7d;
}
body.ttrss_main .dijitTooltipBelow .dijitTooltipConnector {
border-bottom-color: #1c5c7d;
}
body.ttrss_main .dijitTooltipAbove .dijitTooltipConnector {
border-top-color: #1c5c7d;
}
/*body.ttrss_main .dijitDialog {
h1:first-of-type,
h2:first-of-type,
h3:first-of-type,
h4:first-of-type {
margin-top: 0px;
}
}*/
body.ttrss_main[view-mode="marked"] #feeds-holder #feedTree .dijitTreeRow.Has_Marked .dijitTreeLabel {
color: #257aa7;
}
body.ttrss_main[view-mode="marked"] #feeds-holder #feedTree .dijitTreeRow.Has_Marked .counterNode.marked {
display: inline-block;
}
body.ttrss_main[view-mode="marked"][hide-read-feeds="true"][hide-read-shows-special="true"] #feeds-holder #feedTree .dijitTreeRow:not(.AlwaysVisible):not(.Special):not(.Has_Marked) {
display: none;
}
body.ttrss_main[view-mode="marked"][hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.AlwaysVisible):not(.Has_Marked) {
display: none;
}
body.ttrss_main:not([view-mode="marked"]) #feeds-holder #feedTree .dijitTreeRow.Unread .counterNode.unread {
display: inline-block;
}
body.ttrss_main:not([view-mode="marked"]) #feeds-holder #feedTree .dijitTreeRow.Has_Aux:not(.Unread) .counterNode.aux {
display: inline-block;
}
body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="true"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible):not(.Special) {
display: none;
}
body.ttrss_main:not([view-mode="marked"])[hide-read-feeds="true"][hide-read-shows-special="false"] #feeds-holder #feedTree .dijitTreeRow:not(.Unread):not(.AlwaysVisible) {
display: none;
}
body.ttrss_main {
/*.score-neutral i.icon-score {
opacity : 0.5;
}*/
}
body.ttrss_main #toolbar-headlines i.icon-syndicate {
color: #ff7c4b;
margin-right: 8px;
border: 1px solid #ff7c4b;
border-radius: 4px;
}
body.ttrss_main #toolbar-headlines #feed_current_unread {
margin-left: 8px;
font-weight: bold;
text-align: center;
border: 1px solid #2a89bc;
color: white;
background: #2a89bc;
border-radius: 4px;
min-width: 23px;
}
body.ttrss_main i.icon-no-feed {
opacity: 0.2;
}
body.ttrss_main .dijitTreeRow.UpdatesDisabled .dijitTreeLabel {
opacity: 0.5;
}
body.ttrss_main .cdm.marked .left i.marked-pic,
body.ttrss_main .hl.marked .left i.marked-pic {
color: #ffc069;
}
body.ttrss_main .cdm.published .left i.pub-pic,
body.ttrss_main .hl.published .left i.pub-pic {
color: #ff7c4b;
}
body.ttrss_main .score-high i.icon-score {
color: #69C671;
}
body.ttrss_main .score-low i.icon-score {
color: #500;
}
body.ttrss_main i.icon-score,
body.ttrss_main i.icon-grid-span {
cursor: pointer;
color: #777;
}
body.ttrss_main .icon-grid-span {
display: none;
}
body.ttrss_main .icon-feed {
cursor: pointer;
}
body.ttrss_main .panel {
border: 1px solid #ddd;
background: #f5f5f5;
padding: 4px;
}
body.ttrss_main .dijitDialog .panel {
background: white;
}
body.ttrss_main .panel-scrollable {
overflow: auto;
height: 200px;
}
body.ttrss_main .panel-scrollable-400px {
overflow: auto;
height: 400px;
}
body.ttrss_main ul.list li {
padding: 2px;
}
body.ttrss_main ul.list {
padding: 4px;
}
body.ttrss_main ul.list-unstyled {
list-style-type: none;
}
body.ttrss_main .text-center {
text-align: center;
}
body.ttrss_main .text-right {
text-align: right;
}
body.ttrss_main .text-left {
text-align: left;
}
body.ttrss_main .dijitDialog .filter-results-list .preview {
margin: 8px;
}
body.ttrss_main .dijitDialog .filter-results-list .title {
font-weight: bold;
}
body.ttrss_main .dijitDialog #feed_add_spinner {
position: relative;
top: 5px;
width: 18px;
height: 18px;
}
body.ttrss_main .icon-three-dots {
width: 18px;
height: 18px;
vertical-align: middle;
}
body.ttrss_main,
body.ttrss_utility {
/*div.autocomplete {
position : absolute;
width : 250px;
background-color : @default-bg;
border :1px solid @border-default;
margin : 0px;
padding : 0px;
ul {
list-style-type : none;
margin : 0px;
padding : 0px;
}
ul li.selected {
background-color : darken(@default-bg, 10%);
}
ul li {
list-style-type : none;
display : block;
margin : 0;
padding : 2px;
cursor : pointer;
}
}*/
}
body.ttrss_main .alert,
body.ttrss_utility .alert {
padding: 8px 35px 8px 14px;
margin-bottom: 10px;
background-color: #fcf8e3;
border: 1px solid #fbeed5;
border-radius: 4px;
}
body.ttrss_main .alert .close,
body.ttrss_utility .alert .close {
position: relative;
top: -2px;
right: -21px;
line-height: 20px;
cursor: pointer;
}
body.ttrss_main .pull-right,
body.ttrss_utility .pull-right {
float: right;
}
body.ttrss_main .pull-left,
body.ttrss_utility .pull-left {
float: left;
}
body.ttrss_main .pre-wrap,
body.ttrss_utility .pre-wrap {
white-space: pre-wrap;
}
body.ttrss_main .text-error,
body.ttrss_utility .text-error {
color: #b94a48;
}
body.ttrss_main .text-info,
body.ttrss_utility .text-info {
color: #3a87ad;
}
body.ttrss_main .text-success,
body.ttrss_utility .text-success {
color: #468847;
}
body.ttrss_main .text-warning,
body.ttrss_utility .text-warning {
color: #a47e3c;
}
body.ttrss_main .text-muted,
body.ttrss_utility .text-muted {
color: #555;
}
body.ttrss_main .text-small,
body.ttrss_utility .text-small,
body.ttrss_main .small,
body.ttrss_utility .small {
font-size: 11px;
}
body.ttrss_main .alert,
body.ttrss_utility .alert,
body.ttrss_main .alert h4,
body.ttrss_utility .alert h4 {
color: #c09853;
}
body.ttrss_main .alert h4,
body.ttrss_utility .alert h4 {
margin: 0;
}
body.ttrss_main .alert-success,
body.ttrss_utility .alert-success {
color: #468847;
background-color: #dff0d8;
border-color: #d6e9c6;
}
body.ttrss_main .alert-success h4,
body.ttrss_utility .alert-success h4 {
color: #468847;
}
body.ttrss_main .alert-danger,
body.ttrss_utility .alert-danger,
body.ttrss_main .alert-error,
body.ttrss_utility .alert-error {
color: #b94a48;
background-color: #f2dede;
border-color: #eed3d7;
}
body.ttrss_main .alert-danger h4,
body.ttrss_utility .alert-danger h4,
body.ttrss_main .alert-error h4,
body.ttrss_utility .alert-error h4 {
color: #b94a48;
}
body.ttrss_main .alert-info,
body.ttrss_utility .alert-info {
color: #3a87ad;
background-color: #d9edf7;
border-color: #bce8f1;
}
body.ttrss_main .alert-info h4,
body.ttrss_utility .alert-info h4 {
color: #3a87ad;
}
body.ttrss_main hr,
body.ttrss_utility hr {
border: 0px solid #ccc;
border-bottom-width: 1px;
}
::selection {
background: #257aa7;
color: white;
}
::-webkit-scrollbar {
width: 4px;
}
::-webkit-scrollbar-thumb {
background-color: #257aa7;
}
::-webkit-scrollbar-track {
background-color: #eee;
}
/*video::-webkit-media-controls-overlay-play-button {
display: none;
}*/
.cdm {
/*i.material-icons {
color : @color-icon;
}*/
}
.cdm .header,
.cdm .footer {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
}
.cdm .header img,
.cdm .footer img,
.cdm .footer i.material-icons {
margin: 0 4px;
vertical-align: middle;
}
.cdm .header-sticky-guard {
height: 0;
}
.cdm .header {
position: sticky;
top: 0;
z-index: 3;
align-items: center;
}
.cdm .header > * {
padding: 4px;
white-space: nowrap;
}
.cdm .header .left,
.cdm .header .right {
display: flex;
align-items: center;
}
.cdm .header .left i.material-icons,
.cdm .header .right i.material-icons {
margin-left: 2px;
padding: 2px;
transition: color 0.2s linear;
user-select: none;
font-size: 21px;
}
.cdm .header .titleWrap {
flex-grow: 2;
width: 0;
}
.cdm .header .updated {
color: #555;
font-weight: normal;
font-size: 11px;
white-space: nowrap;
}
.cdm .header input {
margin: 0px 4px;
}
.cdm .header .feed {
font-weight: normal;
font-style: italic;
font-size: 11px;
display: inline-block;
max-width: 25%;
overflow: hidden;
text-overflow: ellipsis;
border-radius: 4px;
padding: 1px 4px;
margin-right: 4px;
color: #555;
}
.cdm .header .author {
white-space: nowrap;
color: #555;
font-size: 11px;
font-weight: normal;
}
.cdm .footer {
height: 30px;
padding-left: 5px;
font-weight: normal;
color: #555;
clear: both;
align-items: center;
}
.cdm .footer i.material-icons {
color: #777;
}
.cdm .footer .left,
.cdm .footer .right {
display: flex;
align-items: center;
}
.cdm .footer .left {
flex-grow: 2;
}
.cdm .footer .left > * {
margin-right: 4px;
}
.cdm .footer .right > * {
margin-left: 4px;
}
.cdm .content-inner {
margin: 10px;
line-height: 1.5;
font-size: 16px;
}
.cdm .content-inner iframe {
max-width: 98%;
width: auto;
height: auto;
}
.cdm .content-inner img,
.cdm .content-inner video {
border-width: 0px;
max-width: 98%;
width: auto;
height: auto;
}
.cdm.expanded .collapse,
.cdm.expanded .excerpt {
display: none;
}
.cdm.expanded .titleWrap {
white-space: normal;
}
.cdm.expanded .footer {
border: 0px solid #ddd;
border-bottom-width: 1px;
}
.cdm.expanded > hr {
margin-top: 0;
margin-bottom: 0;
}
.cdm.expanded .header a.title {
font-size: 16px;
color: #999;
font-weight: 600;
transition: color 0.2s, background 0.2s;
text-rendering: optimizelegibility;
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.cdm.expanded.active .content,
.cdm.expanded.Unread .content {
color: black;
}
.cdm.expanded.active .header .title {
color: #257aa7;
}
.cdm.expanded.Unread .header .title {
color: black;
}
.cdm.expanded .content {
color: #555;
}
.cdm.vgrlf .feed {
display: none;
}
.cdm .feed-title {
border: 0px solid #257aa7;
border-bottom-width: 1px;
padding: 5px 3px 5px 5px;
}
.cdm .feed-title a.title {
color: #555;
font-weight: bold;
}
.cdm .feed-title a {
color: #555;
}
.cdm .feed-title a:hover {
color: #257aa7;
}
.cdm .content-inner .embed-responsive {
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
}
.cdm .content-inner .embed-responsive iframe {
border: 0;
bottom: 0;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.cdm.expandable {
background-color: #f5f5f5;
border: 0px solid #ddd;
border-bottom-width: 1px;
}
.cdm.expandable > hr {
display: none;
}
.cdm.expandable div.header span.titleWrap {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.cdm.expandable .excerpt {
white-space: nowrap;
font-size: 11px;
color: #999;
font-weight: normal;
cursor: pointer;
}
.cdm.expandable:not(.active) {
user-select: none;
}
.cdm.expandable.Unread {
background: white;
}
.cdm.expandable.Selected:not(.active) {
background: #3f728e;
}
.cdm.expandable.Selected:not(.active) a,
.cdm.expandable.Selected:not(.active) .header a.title,
.cdm.expandable.Selected:not(.active) span {
color: white;
}
.cdm.expandable.active {
background: white ! important;
}
.cdm.expandable.active div.header span.titleWrap {
white-space: normal;
}
.cdm.expandable .header a.title {
font-weight: 600;
color: #555;
font-size: 14px;
transition: color 0.2s, background 0.2s;
text-rendering: optimizelegibility;
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.cdm.expandable.Unread div.header a.title {
color: black;
}
.cdm.expandable.active .collapse i.material-icons {
color: #257aa7;
cursor: pointer;
}
.cdm.expandable.active .excerpt {
display: none;
}
.cdm.expandable.active div.header a.title {
color: #257aa7;
font-size: 16px;
font-weight: 600;
text-rendering: optimizelegibility;
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.cdm.expandable:not(.active) {
cursor: pointer;
}
.cdm.expandable:not(.active) .content,
.cdm.expandable:not(.active) .collapse {
display: none;
}
.cdm.expandable.active .header[data-is-stuck],
.cdm.expanded .header[data-is-stuck] {
box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
border: 0 solid #ddd;
border-bottom-width: 1px;
background: rgba(255, 255, 255, 0.9) ! important;
backdrop-filter: blur(6px);
}
body.ttrss_prefs {
background-color: #f5f5f5;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
}
body.ttrss_prefs h1,
body.ttrss_prefs h2,
body.ttrss_prefs h3,
body.ttrss_prefs h4 {
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 600;
color: #555;
}
body.ttrss_prefs .dijitContentPane > h1:first-of-type,
body.ttrss_prefs .dijitContentPane > h2:first-of-type,
body.ttrss_prefs .dijitContentPane > h3:first-of-type {
margin-top: 0;
}
body.ttrss_prefs #footer,
body.ttrss_prefs #header {
padding: 8px;
font-size: 13px;
}
body.ttrss_prefs #header {
float: right;
}
body.ttrss_prefs #footer_splitter {
display: none;
}
body.ttrss_prefs #footer {
background-color: #f5f5f5;
font-size: 13px;
border: 0px;
text-align: center;
}
body.ttrss_prefs #header img {
vertical-align: middle;
cursor: pointer;
}
body.ttrss_prefs .dijitTree#filterTree .dijitTreeIcon,
body.ttrss_prefs .dijitTree#labelTree .dijitTreeIcon,
body.ttrss_prefs .dijitTree#filterTree .dijitTreeIcon {
display: none;
}
body.ttrss_prefs .dijitAccordionTitle i.material-icons {
top: -1px;
position: relative;
}
body.ttrss_prefs .dijitAccordionTitleSelected i.material-icons {
color: white;
}
body.ttrss_prefs #feedsTab {
background: #f5f5f5;
}
body.ttrss_prefs #feedTree .dijitTreeContent {
display: inline-flex;
margin-left: 4px;
}
body.ttrss_prefs .dijitDialog #pref-profiles-list .dijitInlineEditBoxDisplayMode {
padding: 0px;
}
body.ttrss_prefs #pref_feeds_errors_btn {
color: red;
}
body.ttrss_prefs .user-css-editor {
height: 300px;
width: 575px;
}
body.ttrss_prefs fieldset.prefs {
min-height: 30px;
display: flex;
flex-direction: row;
align-items: center;
}
body.ttrss_prefs fieldset.prefs label:first-of-type {
min-width: 300px;
}
body.ttrss_prefs fieldset.prefs .help-text {
display: inline-block;
margin-left: 10px;
}
body.ttrss_prefs fieldset.prefs .help-text-bottom {
margin-top: 10px;
}
body.ttrss_prefs table th {
text-align: left;
}
body.ttrss_prefs table td.checkbox {
text-align: center;
width: 32px;
}
body.ttrss_prefs ul.prefs-plugin-list {
margin: 0;
padding: 0;
}
body.ttrss_prefs ul.prefs-plugin-list li {
display: flex;
align-items: center;
border-bottom: #ddd 1px solid;
line-height: 30px;
}
body.ttrss_prefs ul.prefs-plugin-list li.text-center {
border: 0;
display: block;
}
body.ttrss_prefs ul.prefs-plugin-list li > * {
padding: 8px;
}
body.ttrss_prefs ul.prefs-plugin-list li label.checkbox {
display: flex;
align-items: center;
cursor: pointer;
}
body.ttrss_prefs ul.prefs-plugin-list li label.checkbox.system {
cursor: auto;
}
body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
min-width: 300px;
flex-grow: 2;
display: inline-block;
text-align: right;
font-weight: bold;
margin-right: 20px;
}
@media (max-width: 992px) {
body.ttrss_prefs ul.prefs-plugin-list li label.checkbox .name {
min-width: 200px ! important;
}
body.ttrss_prefs ul.prefs-plugin-list li .version {
display: none;
}
}
body.ttrss_prefs ul.prefs-plugin-list li .actions {
flex-grow: 2;
text-align: right;
}
body.ttrss_prefs ul.prefs-plugin-list li .version {
min-width: 200px;
text-align: right;
}
body.ttrss_prefs .plugin-installer-list li,
body.ttrss_prefs .plugin-updater-list li {
border-bottom: #ddd 1px solid;
}
body.ttrss_prefs .plugin-installer-list li > *,
body.ttrss_prefs .plugin-updater-list li > * {
padding: 8px 4px;
}
body.ttrss_prefs .plugin-installer-list li > pre,
body.ttrss_prefs .plugin-updater-list li > pre {
margin: 0;
}
body.ttrss_prefs .plugin-installer-list li h3,
body.ttrss_prefs .plugin-updater-list li h3 {
margin: 0;
}
body.ttrss_prefs .plugin-installer-list li.text-center,
body.ttrss_prefs .plugin-updater-list li.text-center {
border: 0;
}
body.ttrss_prefs .plugin-installer-list .plugin-installed > *,
body.ttrss_prefs .plugin-updater-list .plugin-installed > * {
opacity: 0.5;
}
body.ttrss_prefs .users-list td,
body.ttrss_prefs .event-log td,
body.ttrss_prefs .users-list th,
body.ttrss_prefs .event-log th {
cursor: pointer;
padding: 8px;
border-bottom: #ddd 1px solid;
}
body.ttrss_prefs .event-log tr td,
body.ttrss_prefs .event-log tr th {
vertical-align: top;
}
body.ttrss_prefs .event-log tr .errno {
font-style: italic;
font-weight: bold;
white-space: nowrap;
}
body.ttrss_prefs .event-log tr .errstr {
word-break: break-all;
white-space: pre-wrap;
width: 30%;
}
body.ttrss_prefs .event-log tr .filename {
word-break: break-all;
width: 20%;
}
body.ttrss_prefs .event-log tr .filename,
body.ttrss_prefs .event-log tr .login,
body.ttrss_prefs .event-log tr .timestamp {
color: #555;
}
body.ttrss_prefs hr {
border-color: #ddd;
max-width: 100%;
}
body.ttrss_prefs .phpinfo table {
border-collapse: collapse;
}
body.ttrss_prefs .phpinfo td.e,
body.ttrss_prefs .phpinfo td.v {
border: 1px solid #ccc;
}
body.ttrss_prefs .phpinfo td.e {
font-weight: bold;
}
body.ttrss_prefs .phpinfo td.v {
font-family: monospace;
word-break: break-all;
}
body.ttrss_prefs #filterNewRuleDlg .dijitValidationTextAreaError,
body.ttrss_main #filterNewRuleDlg .dijitValidationTextAreaError {
background: #ffc0c0;
}
body.ttrss_prefs #filterNewRuleDlg .dijitValidationTextArea:not(.dijitValidationTextAreaError),
body.ttrss_main #filterNewRuleDlg .dijitValidationTextArea:not(.dijitValidationTextAreaError) {
background: #c0ffc0;
}
body.ttrss_prefs fieldset,
body.ttrss_utility fieldset {
border-width: 0px;
padding: 5px 0px;
}
body.ttrss_prefs fieldset.narrow,
body.ttrss_utility fieldset.narrow {
padding: 2px 0px;
}
body.ttrss_prefs fieldset.align-right,
body.ttrss_utility fieldset.align-right {
text-align: right;
}
body.ttrss_prefs fieldset > label:first-of-type,
body.ttrss_utility fieldset > label:first-of-type {
min-width: 140px;
margin-right: 20px;
display: inline-block;
text-align: right;
font-weight: bold;
}
body.ttrss_prefs fieldset > label.checkbox,
body.ttrss_utility fieldset > label.checkbox {
display: inline;
font-weight: normal;
}
body.ttrss_utility.sanity_failed {
background: #900;
}
body.ttrss_utility {
background: #f5f5f5;
color: #555;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
margin: 4em;
}
body.ttrss_utility .content {
background: white;
border: 1px solid #ddd;
padding: 20px;
box-shadow: 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
}
body.ttrss_utility .content h2:first-of-type {
margin-top: 0;
}
body.ttrss_utility .content h2,
body.ttrss_utility .content h3,
body.ttrss_utility .content h4 {
color: #257aa7;
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
body.ttrss_utility .content h2 {
font-size: 18px;
}
body.ttrss_utility .content h3 {
font-size: 16px;
}
body.ttrss_utility a {
color: #257aa7;
text-decoration: none;
}
body.ttrss_utility a:hover,
body.ttrss_utility a:focus {
color: #133d54;
text-decoration: underline;
}
body.ttrss_utility h1 {
color: gray;
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 18px;
margin: 10px 0 0 0;
}
body.ttrss_utility .footer {
text-align: center;
padding-top: 10px;
}
body.ttrss_utility .footer a {
color: gray;
}
body.ttrss_utility .footer a:hover {
color: #257aa7;
}
body.ttrss_utility form {
margin: 0;
}
body.ttrss_utility.otp .content fieldset > label {
display: inline;
}
body.ttrss_utility.ttrss_login {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
position: absolute;
display: flex;
align-items: center;
justify-content: center;
}
body.ttrss_utility.ttrss_login .container {
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
body.ttrss_utility.ttrss_login .container .content {
padding: 40px;
}
body.ttrss_utility.installer,
body.ttrss_utility.feed_debugger {
margin: 2em;
}
body.ttrss_utility.installer pre,
body.ttrss_utility.feed_debugger pre {
white-space: pre-wrap;
}
body.ttrss_utility.share_popup {
margin: 0;
padding: 0;
background: white;
}
body.ttrss_utility.share_popup .content {
padding: 15px;
border-width: 0;
box-shadow: none;
}
.flat {
/*#feedTree {
.dijitTreeContent .dijitInline {
vertical-align : baseline;
}
}*/
}
.flat li {
padding: 2px;
}
.flat .dijitButton i.material-icons {
position: relative;
top: -1px;
}
.flat .tabLabel > i.material-icons {
position: relative;
top: -1px;
}
.flat #filterDlg_Matches .filterRule {
color: green;
word-break: break-all;
}
.flat #filterDlg_Matches .filterRule .field,
.flat #filterDlg_Matches .filterRule .feed {
word-break: break-word;
font-style: italic;
}
.flat #filterTree .filterRules li.inverse,
.flat #filterDlg_Matches span.filterRule.inverse {
color: red;
}
.flat .dijitToolbar {
font-size: 13px;
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
padding: 0;
}
.flat .dijitToolbar .dijitTextBox .dijitInputContainer .dijitInputInner {
line-height: 10px;
}
.flat .dijitToolbar .dijitTextBox .dijitInputContainer .dijitPlaceHolder {
line-height: 15px;
margin-left: 0;
}
.flat .dijitToolbar label {
position: relative;
top: 2px;
}
.flat .dijitAccordionContainer {
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);
}
.flat .dijitCheckBox.dijitCheckBoxChecked {
background-color: #69C671;
border-color: #45b74f;
}
.flat .dijitMenu .dijitMenuItem .dijitMenuItemLabel {
padding: 4px 8px;
font-size: 13px;
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.flat .dijitMenu .dijitMenuItem.dijitDisabled:not(.dijitMenuItemSelected) .dijitMenuItemLabel {
color: #2e99d1;
}
.flat .dijitMenu .dijitMenuItem td {
padding: 0;
}
.flat .dijitCheckBox {
margin: 1px;
}
.flat .dijitCheckBox:before {
font-family: "flat-icon";
content: "\f00c";
color: white;
}
.flat .dijitTab,
.flat .dijitAccordionTitle {
font-family: system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.flat .dijitTab i.material-icons,
.flat .dijitAccordionInnerContainer:not(.dijitSelected) i.material-icons {
color: #257aa7;
}
.flat .dijitTree {
/*.dijitTreeRow .dijitTreeExpando {
position : relative;
top : -2px;
}*/
}
.flat .dijitTree .dijitTreeRowFlex {
display: flex;
flex-direction: row;
align-items: center;
}
.flat .dijitTree .dijitTreeRowFlex .dijitTreeIcon {
font-size: inherit;
height: auto;
}
.flat .dijitTree .dijitTreeRowFlex .dijitTreeExpando {
height: auto;
line-height: 0;
}
.flat .dijitTree .dijitFolderClosed,
.flat .dijitTree .dijitFolderOpened {
display: none;
}
.flat .dijitTree .dijitTreeRowSelected .filterRules li {
color: white;
}
.flat .dijitTree .dijitTreeRowSelected .dijitTreeExpando {
color: #257aa7;
}
.flat .dijitTree .dijitTreeNode .dijitTreeRow.dijitTreeRowSelected {
color: white;
}
.flat .dijitTree .labelParam {
float: right;
margin-right: 16px;
}
.flat .dijitTree .dijitTreeRow.filterDisabled {
opacity: 0.5;
}
.flat .dijitTree .dijitTreeRow.filterDisabled .filterRules {
filter: saturate(0%);
}
.flat .dijitTree .feedParam {
float: right;
}
.flat .dijitTree .filterRules {
font-size: 12px;
line-height: normal;
white-space: normal;
margin-left: 28px;
}
.flat .dijitTree .filterRules li {
color: green;
}
.flat .dijitTree .dijitTreeContainer {
max-width: 100%;
}
.flat .dijitTree .dijitTreeRow {
overflow: hidden;
-moz-user-select: none;
user-select: none;
text-overflow: ellipsis;
}
.flat label.dijitButton {
border: 1px solid #ccc;
padding: 6px;
border-radius: 4px;
cursor: pointer;
position: relative;
top: 1px;
}
.flat label.dijitButton:hover {
background-color: #f5f5f5;
}
.flat .dijitTree .dijitTreeNode .dijitTreeRow {
padding: 4px 0px 4px;
border-width: 1px;
color: #555;
}
.flat .dijitDialog {
width: 600px;
}
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url(../vendor/mervick/material-design-icons/fonts/MaterialIcons-Regular.eot);
/* For IE6-8 */
src: local('Material Icons'), local('MaterialIcons-Regular'), url(../vendor/mervick/material-design-icons/fonts/MaterialIcons-Regular.woff2) format('woff2'), url(../vendor/mervick/material-design-icons/fonts/MaterialIcons-Regular.woff) format('woff'), url(../vendor/mervick/material-design-icons/fonts/MaterialIcons-Regular.ttf) format('truetype');
}
.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 18px;
/* Preferred icon size */
display: inline-block;
line-height: 1;
text-transform: none;
letter-spacing: normal;
word-wrap: normal;
white-space: nowrap;
direction: ltr;
vertical-align: middle;
/* Support for all WebKit browsers. */
-webkit-font-smoothing: antialiased;
/* Support for Safari and Chrome. */
text-rendering: optimizeLegibility;
/* Support for Firefox. */
-moz-osx-font-smoothing: grayscale;
/* Support for IE. */
font-feature-settings: 'liga';
}
.flat .dijitDialog .dijitDialogPaneContent {
background: #f5f5f5;
}
.flat .dijitTab:not(.dijitTabChecked) {
background: #f5f5f5;
}
.flat .dijitCheckBox {
background: #ccc;
}
body.ttrss_zoom {
max-width: 900px;
margin: 2em auto;
}
body.ttrss_zoom div.post {
border: 1px solid #ddd;
background: white;
box-shadow: 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
}
body.ttrss_zoom div.post .attachments {
display: none;
}
body.ttrss_zoom div.post div.header {
padding-bottom: 8px;
border: 0 solid #ddd;
border-bottom-width: 1px;
background: white;
font-size: 13px;
color: #555;
}
body.ttrss_zoom div.post div.header .row {
display: flex;
margin-bottom: 4px;
flex-wrap: nowrap;
align-items: center;
justify-content: space-between;
}
body.ttrss_zoom div.post div.header .row h1 {
margin-top: 0;
margin-bottom: 8px;
}
body.ttrss_zoom div.post .content {
font-size: 15px;
line-height: 1.5;
border-width: 0;
padding: 0;
padding-top: 8px;
}
body.ttrss_zoom div.post .content img,
body.ttrss_zoom div.post .content video {
max-width: 760px;
height: auto;
}
body.ttrss_zoom div.post .content blockquote {
margin: 5px 0px 5px 0px;
color: #555;
padding-left: 8px;
border: 0px solid #ddd;
border-left-width: 4px;
}
body.ttrss_zoom div.post .content code {
color: #009900;
font-family: monospace;
font-size: 12px;
}
body.ttrss_zoom div.post .content pre {
padding: 8px;
color: #555;
font-family: monospace;
font-size: 12px;
border: 0px solid #ccc;
background: #f5f5f5;
display: block;
max-width: 98%;
overflow: auto;
white-space: pre-wrap;
}
/* rules specific to compact.css */
body.ttrss_main.ttrss_index.flat #feedTree.dijitTree .dijitTreeLabel {
font-size: 13px ! important;
}
body.ttrss_main.ttrss_index.flat .dijitMenu .dijitMenuItemLabel,
body.ttrss_main.ttrss_index.flat .content-inner,
body.ttrss_main.ttrss_index.flat #content-insert,
body.ttrss_main.ttrss_index.flat .cdm .content,
body.ttrss_main.ttrss_index.flat .post .content {
font-size: 12px ! important;
}
body.ttrss_main.ttrss_index.flat div[id*=RROW] i.material-icons {
font-size: 18px;
}
body.ttrss_main.ttrss_index.flat .hl,
body.ttrss_main.ttrss_index.flat .post .header .title,
body.ttrss_main.ttrss_index.flat .cdm .title {
font-size: 13px ! important;
}