-
Notifications
You must be signed in to change notification settings - Fork 4
/
styles.css
98 lines (86 loc) · 2.84 KB
/
styles.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
d-article {
font-weight: 300;
}
.distill-site-nav {
animation:backgroundtransition 100s;
-moz-animation:backgroundtransition 100s infinite; /* Firefox */
-webkit-animation:backgroundtransition 100s infinite; /* Safari and Chrome */
}
@-moz-keyframes backgroundtransition /* Firefox */ {
0% {background: #B71C1C;} /* red */
10% {background: #311b92;} /* deep purlple */
20% {background: #0D47A1;} /* blue */
30% {background: #004D40;} /* teal */
40% {background: #212121;} /* grey */
50% {background: #1A237E;} /* indigo */
60% {background: #33691E;} /* ligth green */
70% {background: #006064;} /* cyan */
80% {background: #827717;} /* lime */
90% {background: #263238;} /* blue gray*/
100% {background: #B71C1C;} /* red */
}
@-webkit-keyframes backgroundtransition /* Safari and Chrome */ {
0% {background: #B71C1C;} /* red */
10% {background: #311b92;} /* deep purlple */
20% {background: #0D47A1;} /* blue */
30% {background: #004D40;} /* teal */
40% {background: #212121;} /* grey */
50% {background: #1A237E;} /* indigo */
60% {background: #33691E;} /* ligth green */
70% {background: #006064;} /* cyan */
80% {background: #827717;} /* lime */
90% {background: #263238;} /* blue gray*/
100% {background: #B71C1C;} /* red */
}
/* https://codepen.io/sdthornton/pen/wBZdXq */
.distill-site-header {
box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}
/* thunder animation */
/* from http://jsrocks.org/ */
.fab:hover, .fa:hover, .fas:hover {
animation-name: thunder;
animation-duration: 1s;
animation-fill-mode: both;
animation-iteration-count: infinite;
-webkit-animation-name: thunder;
-webkit-animation-duration: 1s;
-webkit-animation-fill-mode: both;
-webkit-animation-iteration-count: infinite;
transition: all 150ms ease 0s;
}
@keyframes thunder{
0%, 20%, 40%, 60%, 80%, 100% {
transform: rotate3d(0, 0, 1, -5deg);
}
10%, 30%, 50%, 70%, 90% {
transform: rotate3d(0, 0, 1, 5deg);
}
}
@-webkit-keyframes thunder{
0%, 20%, 40%, 60%, 80%, 100% {
transform: rotate3d(0, 0, 1, -5deg);
}
10%, 30%, 50%, 70%, 90% {
transform: rotate3d(0, 0, 1, 5deg);
}
}
/* subscribe button */
.sbt {
color: black;
background-color: #e7e7e7;
border: 2px solid #e7e7e7;
text-align: center;
text-decoration: none;
display: inline-block;
border-radius: 2px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
padding: 0px;
}
#distill-search {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
font-size: 0.8em;
}
d-article iframe {
border: none;
}