mirror of
https://git.tt-rss.org/git/tt-rss.git
synced 2025-12-13 03:15:56 +00:00
small stuck header fixes in grid mode
This commit is contained in:
@@ -20,10 +20,10 @@ const Headlines = {
|
||||
const header = entry.target.nextElementSibling;
|
||||
|
||||
if (entry.intersectionRatio == 0) {
|
||||
header.setAttribute("stuck", "1");
|
||||
header.setAttribute("data-is-stuck", "true");
|
||||
|
||||
} else if (entry.intersectionRatio == 1) {
|
||||
header.removeAttribute("stuck");
|
||||
header.removeAttribute("data-is-stuck");
|
||||
}
|
||||
|
||||
//console.log(entry.target, header, entry.intersectionRatio);
|
||||
|
||||
@@ -655,9 +655,6 @@ body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
|
||||
grid-gap: 8px;
|
||||
padding: 8px;
|
||||
}
|
||||
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .header[stuck] {
|
||||
top: -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;
|
||||
@@ -668,6 +665,10 @@ body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
|
||||
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;
|
||||
@@ -1468,8 +1469,8 @@ div.cdm.expandable:not(.active) .content,
|
||||
div.cdm.expandable:not(.active) .collapse {
|
||||
display: none;
|
||||
}
|
||||
div.cdm.expandable.active .header[stuck],
|
||||
div.cdm.expanded .header[stuck] {
|
||||
div.cdm.expandable.active .header[data-is-stuck],
|
||||
div.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;
|
||||
|
||||
@@ -655,9 +655,6 @@ body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
|
||||
grid-gap: 8px;
|
||||
padding: 8px;
|
||||
}
|
||||
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .header[stuck] {
|
||||
top: -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;
|
||||
@@ -668,6 +665,10 @@ body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
|
||||
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;
|
||||
@@ -1468,8 +1469,8 @@ div.cdm.expandable:not(.active) .content,
|
||||
div.cdm.expandable:not(.active) .collapse {
|
||||
display: none;
|
||||
}
|
||||
div.cdm.expandable.active .header[stuck],
|
||||
div.cdm.expanded .header[stuck] {
|
||||
div.cdm.expandable.active .header[data-is-stuck],
|
||||
div.cdm.expanded .header[data-is-stuck] {
|
||||
box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
|
||||
border: 0 solid #222;
|
||||
border-bottom-width: 1px;
|
||||
|
||||
@@ -655,9 +655,6 @@ body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
|
||||
grid-gap: 8px;
|
||||
padding: 8px;
|
||||
}
|
||||
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .header[stuck] {
|
||||
top: -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;
|
||||
@@ -668,6 +665,10 @@ body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
|
||||
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;
|
||||
@@ -1468,8 +1469,8 @@ div.cdm.expandable:not(.active) .content,
|
||||
div.cdm.expandable:not(.active) .collapse {
|
||||
display: none;
|
||||
}
|
||||
div.cdm.expandable.active .header[stuck],
|
||||
div.cdm.expanded .header[stuck] {
|
||||
div.cdm.expandable.active .header[data-is-stuck],
|
||||
div.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;
|
||||
|
||||
@@ -323,7 +323,7 @@ div.cdm.expandable:not(.active) {
|
||||
div.cdm {
|
||||
&.expandable.active,
|
||||
&.expanded {
|
||||
.header[stuck] {
|
||||
.header[data-is-stuck] {
|
||||
box-shadow : 0 1px 1px -1px rgba(0,0,0,0.1);
|
||||
border: 0 solid @border-default;
|
||||
border-bottom-width: 1px;
|
||||
|
||||
@@ -763,10 +763,6 @@ body.ttrss_main {
|
||||
grid-gap : 8px;
|
||||
padding : 8px;
|
||||
|
||||
.header[stuck] {
|
||||
top : -8px;
|
||||
}
|
||||
|
||||
.cdm.expanded {
|
||||
|
||||
.header, .content {
|
||||
@@ -780,6 +776,11 @@ body.ttrss_main {
|
||||
padding : 0 4px 4px 4px;
|
||||
}
|
||||
|
||||
.header[data-is-stuck] {
|
||||
top : -8px;
|
||||
border-bottom-width: 1px;
|
||||
}
|
||||
|
||||
.header {
|
||||
border-bottom-width : 0;
|
||||
padding : 4px;
|
||||
|
||||
@@ -656,9 +656,6 @@ body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
|
||||
grid-gap: 8px;
|
||||
padding: 8px;
|
||||
}
|
||||
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .header[stuck] {
|
||||
top: -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;
|
||||
@@ -669,6 +666,10 @@ body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
|
||||
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;
|
||||
@@ -1469,8 +1470,8 @@ div.cdm.expandable:not(.active) .content,
|
||||
div.cdm.expandable:not(.active) .collapse {
|
||||
display: none;
|
||||
}
|
||||
div.cdm.expandable.active .header[stuck],
|
||||
div.cdm.expanded .header[stuck] {
|
||||
div.cdm.expandable.active .header[data-is-stuck],
|
||||
div.cdm.expanded .header[data-is-stuck] {
|
||||
box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
|
||||
border: 0 solid #222;
|
||||
border-bottom-width: 1px;
|
||||
|
||||
@@ -656,9 +656,6 @@ body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
|
||||
grid-gap: 8px;
|
||||
padding: 8px;
|
||||
}
|
||||
body.ttrss_main #headlines-frame[data-is-cdm="true"][data-is-cdm-expanded="true"][data-enable-grid="true"] .header[stuck] {
|
||||
top: -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;
|
||||
@@ -669,6 +666,10 @@ body.ttrss_main #headlines-frame[data-is-vfeed="false"] .header .feed {
|
||||
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;
|
||||
@@ -1469,8 +1470,8 @@ div.cdm.expandable:not(.active) .content,
|
||||
div.cdm.expandable:not(.active) .collapse {
|
||||
display: none;
|
||||
}
|
||||
div.cdm.expandable.active .header[stuck],
|
||||
div.cdm.expanded .header[stuck] {
|
||||
div.cdm.expandable.active .header[data-is-stuck],
|
||||
div.cdm.expanded .header[data-is-stuck] {
|
||||
box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
|
||||
border: 0 solid #222;
|
||||
border-bottom-width: 1px;
|
||||
|
||||
Reference in New Issue
Block a user