Move spinner to base css
This commit is contained in:
@@ -59,3 +59,34 @@ span.caret {
|
|||||||
.markdown {
|
.markdown {
|
||||||
height: 200px;
|
height: 200px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.spinner {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
background-color: #333;
|
||||||
|
|
||||||
|
margin: 100px auto;
|
||||||
|
-webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
|
||||||
|
animation: sk-rotateplane 1.2s infinite ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes sk-rotateplane {
|
||||||
|
0% { -webkit-transform: perspective(120px) }
|
||||||
|
50% { -webkit-transform: perspective(120px) rotateY(180deg) }
|
||||||
|
100% { -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg) }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes sk-rotateplane {
|
||||||
|
0% {
|
||||||
|
transform: perspective(120px) rotateX(0deg) rotateY(0deg);
|
||||||
|
-webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
|
||||||
|
-webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
|
||||||
|
-webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@@ -120,34 +120,3 @@ tr.highlight {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.spinner {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
background-color: #333;
|
|
||||||
|
|
||||||
margin: 100px auto;
|
|
||||||
-webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
|
|
||||||
animation: sk-rotateplane 1.2s infinite ease-in-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
@-webkit-keyframes sk-rotateplane {
|
|
||||||
0% { -webkit-transform: perspective(120px) }
|
|
||||||
50% { -webkit-transform: perspective(120px) rotateY(180deg) }
|
|
||||||
100% { -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg) }
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes sk-rotateplane {
|
|
||||||
0% {
|
|
||||||
transform: perspective(120px) rotateX(0deg) rotateY(0deg);
|
|
||||||
-webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
|
|
||||||
-webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
|
|
||||||
-webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
Reference in New Issue
Block a user