philipp/website-risg
1
0
Fork 0
Code Issues 4 Pull Requests Actions Packages Projects Releases Wiki Activity

[BUGFIX] tiny sticky issues

Browse Source
This commit is contained in:
Marie Birner 2024-02-19 22:13:47 +01:00
parent fb90c5c259
commit 5bb8b63390
2 changed files with 7 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
templates/app.js
View File

@ -76,7 +76,7 @@ window.addEventListener('scroll', function() {
}) })
function apply_stickies() { function apply_stickies() {
var _$stickies = [].slice.call(document.querySelectorAll('.sticky')) var _$stickies = [].slice.call(document.querySelectorAll('details[open] .sticky'))
_$stickies.forEach(function(_$sticky) { _$stickies.forEach(function(_$sticky) {
if (CSS.supports && CSS.supports('position', 'sticky')) { if (CSS.supports && CSS.supports('position', 'sticky')) {
apply_sticky_class(_$sticky) apply_sticky_class(_$sticky)

11
templates/style.css
View File

@ -76,15 +76,16 @@ summary h5 {
flex-grow: 1; flex-grow: 1;
} }
summary.js-is-sticky { details[open] summary.js-is-sticky {
padding: 1.5rem 0; padding: 1.5rem 0;
background: linear-gradient(0deg, transparent 0%, var(--pico-background-color) 30%); background: linear-gradient(0deg, transparent 0%, var(--pico-background-color) 30%);
top: -1px;
} }
summary.js-is-sticky h2, details[open] summary.js-is-sticky h2,
summary.js-is-sticky h3, details[open] summary.js-is-sticky h3,
summary.js-is-sticky h4, details[open] summary.js-is-sticky h4,
summary.js-is-sticky h5 { details[open] summary.js-is-sticky h5 {
max-width: 100%; max-width: 100%;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;