mirror of
https://github.com/by-jp/www.byjp.me.git
synced 2025-08-10 19:05:41 +01:00
Fix colour of clap button
This commit is contained in:
parent
2535d1114a
commit
cc05b550c8
2 changed files with 27 additions and 26 deletions
|
@ -79,14 +79,15 @@ const forEveryClapButton = (fn, sameAction = '') => {
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
let toCheck = []
|
let toCheck = []
|
||||||
forEveryClapButton((btn) => {
|
forEveryClapButton((btn) => {
|
||||||
|
btn.addEventListener("click", performClap)
|
||||||
|
|
||||||
const action = btn.parentElement.action
|
const action = btn.parentElement.action
|
||||||
const lastClappedTo = localStorage.getItem(clapKey(action));
|
const lastClappedTo = localStorage.getItem(clapKey(action));
|
||||||
toCheck.push(action)
|
|
||||||
if (lastClappedTo) {
|
if (lastClappedTo) {
|
||||||
btn.parentElement.classList.add('clapped')
|
btn.parentElement.classList.add('clapped')
|
||||||
setClapCount(btn, lastClappedTo)
|
setClapCount(btn, lastClappedTo)
|
||||||
}
|
}
|
||||||
btn.addEventListener("click", performClap)
|
toCheck.push(action)
|
||||||
})
|
})
|
||||||
|
|
||||||
toCheck.forEach((action) => {
|
toCheck.forEach((action) => {
|
||||||
|
|
|
@ -617,7 +617,7 @@ a[href^="#fn:"] {
|
||||||
|
|
||||||
form.claps {
|
form.claps {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
&.clapped {
|
&.clapped button {
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -874,29 +874,6 @@ mark {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.small-post-list {
|
|
||||||
position: relative;
|
|
||||||
text-align: left;
|
|
||||||
margin: 1em 1.5em;
|
|
||||||
list-style: none;
|
|
||||||
|
|
||||||
@media #{$media-size-phone} {
|
|
||||||
font-size: 1rem;
|
|
||||||
padding: 0;
|
|
||||||
width: fit-content;
|
|
||||||
max-width: calc(100% - 2em);
|
|
||||||
margin-inline: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
li > svg {
|
|
||||||
color: var(--accent);
|
|
||||||
position: absolute;
|
|
||||||
left: -1.5em;
|
|
||||||
margin-top: 0.25em;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.homepage {
|
.homepage {
|
||||||
.content {
|
.content {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -995,6 +972,29 @@ mark {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.small-post-list {
|
||||||
|
position: relative;
|
||||||
|
text-align: left;
|
||||||
|
margin: 1em 1.5em;
|
||||||
|
list-style: none;
|
||||||
|
|
||||||
|
@media #{$media-size-phone} {
|
||||||
|
font-size: 1rem;
|
||||||
|
padding: 0;
|
||||||
|
width: fit-content;
|
||||||
|
max-width: calc(100% - 2em);
|
||||||
|
margin-inline: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
li > svg {
|
||||||
|
color: var(--accent);
|
||||||
|
position: absolute;
|
||||||
|
left: -1.5em;
|
||||||
|
margin-top: 0.25em;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.embed iframe {
|
.embed iframe {
|
||||||
border-radius:12px;
|
border-radius:12px;
|
||||||
width:100%;
|
width:100%;
|
||||||
|
|
Loading…
Reference in a new issue