xaymar/com.xaymar.www
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Don't always embed Disqus

Browse Source
This commit is contained in:
Michael Fabian 'Xaymar' Dirks
2022-10-28 22:31:04 +02:00
parent bd969ed638
commit 7950584977
3 changed files with 77 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
_includes/comments.liquid
+30 -11
View File
@@ -11,19 +11,38 @@
{% assign disqus_id = site.xaymar.comments.disqus.identifier %}
<div id="disqus_thread"></div>
<script>
var disqus_config = function () {
this.page.url = "{{ disqus_url }}/";
this.page.identifier = "{{ disqus_page_url }}/";
};
(function() { // DON'T EDIT BELOW THIS LINE
var d = document, s = d.createElement('script');
s.defer = true;
s.src = 'https://{{ disqus_id }}.disqus.com/embed.js';
s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
})();
function load_disqus_comments() {
var disqus_config = function () {
this.page.url = "{{ disqus_url }}/";
this.page.identifier = "{{ disqus_page_url }}/";
};
document.querySelector(".comments > .content > .privacy").style.display = "none";
var d = document, s = d.createElement('script');
s.defer = true;
s.src = 'https://{{ disqus_id }}.disqus.com/embed.js';
s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
}
</script>
<noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
<div class="privacy">
<button class="once">Allow embedded Disqus widget once</button>
<button class="always">Always allow embedded Disqus Widget</button>
</div>
<script>
document.querySelector(".comments > .content > .privacy > .once").addEventListener("click", (ev) => {
load_disqus_comments();
});
document.querySelector(".comments > .content > .privacy > .always").addEventListener("click", (ev) => {
document.cookie = "allow_disqus_embed=true";
load_disqus_comments();
});
if (document.cookie.indexOf("allow_disqus_embed") !== -1) {
load_disqus_comments();
}
</script>
{% endif %}
</div>
</div>
_sass/_base.scss
+19
View File
@@ -43,6 +43,10 @@ $theme-breadcrumbs-link-color-active: hsl($theme-hue, 100%, 85%);
$theme-footer-background: hsl($theme-hue, 33%, 10.0%);
$theme-footer-color: hsl($theme-hue, 0%, 80%);
$theme-code-background: hsl($theme-hue, 50%, 5%);
$theme-button-background: hsl($theme-hue, 100%, 30.0%);
$theme-button-background-active: hsl($theme-hue, 100%, 50%);
$theme-button-color: hsl($theme-hue, 0%, 85%);
$theme-button-color-active: hsl($theme-hue, 100%, 85%);
* {
box-sizing: border-box;
@@ -73,6 +77,21 @@ a.active {
text-decoration: inherit;
}
button {
background: $theme-button-background;
color: $theme-button-color;
border: 0;
cursor: pointer;
}
button.focus,
button.active,
button.visited {
background: $theme-button-background-active;
color: $theme-button-color-active;
border: 0;
}
@import "_header.scss";
@import "_content.scss";
@import "_footer.scss";
_sass/_comments.scss
+28
View File
@@ -26,3 +26,31 @@
padding: 1rem 1rem;
display: flow-root;
}
.comments > .content > .privacy {
margin: 0px;
padding: 0px;
width: 100%;
font-weight: bold;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
column-gap: .5rem;
}
.comments > .content > .privacy > button {
display: block;
padding: .5rem;
font-size: 1.5rem;
background: $theme-button-background;
color: $theme-button-color;
border: 0;
}
.comments > .content > .privacy > button {
display: block;
padding: .5rem;
font-size: 1.5rem;
font-variant: small-caps;
font-weight: bold;
}