style: add responsive padding to share block and fix formatting for overly long headings in post content
This commit is contained in:
@@ -92,11 +92,19 @@
|
||||
.custom-share-list {
|
||||
list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 15px; align-items: flex-start;
|
||||
}
|
||||
.cc--component-container.cc--share-block {
|
||||
padding-left: 25%;
|
||||
padding-right: 12.5%;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.custom-share-list {
|
||||
flex-direction: row; gap: 10px;
|
||||
}
|
||||
.cc--component-container.cc--share-block {
|
||||
padding-left: 8.3333333333%;
|
||||
padding-right: 8.3333333333%;
|
||||
}
|
||||
}
|
||||
.custom-share-list li a {
|
||||
display: flex; align-items: center; justify-content: center; width: 45px; height: 45px; border-radius: 50%; border: 1px solid #111; text-decoration: none; transition: all 0.2s;
|
||||
@@ -201,6 +209,22 @@
|
||||
// If it's not JSON, it might just be HTML
|
||||
parsedContainer.innerHTML = rawData;
|
||||
}
|
||||
|
||||
// Fix for long paragraphs mistakenly formatted as headings with bold tags
|
||||
var headings = parsedContainer.querySelectorAll('h1, h2, h3, h4, h5, h6');
|
||||
headings.forEach(function(h) {
|
||||
if (h.textContent.length > 100) {
|
||||
var p = document.createElement('p');
|
||||
p.innerHTML = h.innerHTML;
|
||||
var strongs = p.querySelectorAll('strong, b');
|
||||
strongs.forEach(function(s) {
|
||||
var frag = document.createDocumentFragment();
|
||||
while(s.firstChild) frag.appendChild(s.firstChild);
|
||||
s.parentNode.replaceChild(frag, s);
|
||||
});
|
||||
h.parentNode.replaceChild(p, h);
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user