Fix pulsing on dark backgrounds

This commit is contained in:
Madison Scott-Clary
2019-08-25 21:24:24 -07:00
parent 11c6f40ba3
commit 43c2ed54fa
13 changed files with 25 additions and 2 deletions

View File

@ -1,5 +1,6 @@
---
type: single
pulse_light: true
---
<style>

View File

@ -4,6 +4,7 @@ weight: 14
background: '#333a18'
color: '#cdc'
quote: '#efe'
pulse_light: true
---
Somewhere around 2018, a friend of mine went mad.

View File

@ -4,6 +4,7 @@ weight: 17
background: "#283a26"
color: '#cdc'
quote: '#efe'
pulse_light: true
---
On two occasions, the world has slid away from me.

View File

@ -4,6 +4,7 @@ weight: 18
background: "#082a16"
color: '#bcb'
quote: '#ded'
pulse_light: true
---
<div class="cw">Self-harm</div>

View File

@ -4,6 +4,7 @@ weight: 19
background: "#082010"
color: '#aba'
quote: '#cdc'
pulse_light: true
---
> And?

View File

@ -5,6 +5,7 @@ background: '#333a18'
color: '#cdc'
quote: '#efe'
type: single
pulse_light: true
---
Somewhere around 2014, a friend of mine went mad.

View File

@ -4,6 +4,7 @@ weight: 20
background: "#001a06"
color: '#aba'
quote: '#cdc'
pulse_light: true
---
I'm hypomanic now.

View File

@ -3,5 +3,6 @@ type: serial
background: '#1f183a'
color: '#ccd'
quote: '#eef'
pulse_light: true
back: /16
---

View File

@ -3,5 +3,6 @@ type: serial
background: '#000'
color: '#ddd'
quote: '#ddd'
pulse_light: true
back: /8
---

View File

@ -6,7 +6,7 @@ weight: 45
<div class="cw">Cognitive hazard, audio autoplay, color changes</div>
<pre>
( <a class="pulse huh" href="/aside/3">...</a> )
( <a class="pulse huh" href="/aside/3">2, 3, 5, 7, 13</a> )
O
o
.

View File

@ -3,5 +3,6 @@ type: serial
background: '#2f082a'
color: '#ccd'
quote: '#eef'
pulse_light: true
back: /38
---

View File

@ -21,6 +21,17 @@
blockquote {
color: {{.Params.quote}};
}
{{ if (isset .Params "pulse_light")}}
@keyframes flash {
from {
background-color: rgba(255, 255, 255, 0);
}
to {
background-color: rgba(255, 255, 255, 0.2);
}
}
{{ end }}
</style>
{{end}}
</head>

View File

@ -157,11 +157,13 @@ code {
background-color: rgba(128, 128, 128, 0.2);
}
}
.pulse {
.pulse, .pulse span {
animation-name: flash;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-direction: alternate;
}
.pulse {
padding: 0 3px;
}