Permalink
Browse files

updated loading__box to loading

  • Loading branch information...
katrin-freihofner committed Apr 4, 2017
1 parent e0d39b5 commit 408dfa027e33348eed67fbb7c4eea60961118f6b
View
@@ -40,4 +40,4 @@ The Groundhog loading distractor appears in a two versions:
| class name | effect |
|------------|--------|
| `.loading__distractor` | Base class for the loading distractor |
| `.loading--small` | Small version of loading distractor for input fields and buttons |
| `.loading__distractor--small` | Small version of loading distractor for input fields and buttons |
View
@@ -4,6 +4,16 @@ $offset: 22px*3.1416; //r(-gap)*2*3.14
$duration: 1.7s;
$ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
.loading {
text-align: center;
display: inline-block;
height: 50px;
background-color: rgba(25, 25, 25, 0.65);
border-radius: 3px;
padding: 10px 28px 10px 28px;
overflow: hidden;
}
.loading__distractor {
position: relative;
display: inline-block;
@@ -16,7 +26,7 @@ $ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
animation: spin 3.4s linear infinite;
}
.loading--small {
.loading__distractor--small {
stroke: $gray-500;
}
@@ -41,15 +51,6 @@ $ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
vertical-align: middle;
}
.loading__box {
text-align: center;
display: inline-block;
height: 50px;
background-color: rgba(25, 25, 25, 0.65);
border-radius: 3px;
padding: 10px 28px 10px 28px;
overflow: hidden;
}
@keyframes spin {
@@ -1,3 +1,3 @@
<svg class="loading__distractor loading--small" width="15px" height="15px" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg"
<svg class="loading__distractor loading__distractor--small" width="15px" height="15px" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg"
<circle class="loading__path" cx="15" cy="15" r="12"></circle>
</svg>
@@ -1,4 +1,4 @@
<div class="loading__box">
<div class="loading">
<svg class="loading__distractor" width="30px" height="30px" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg">
<circle class="loading__path" cx="15" cy="15" r="12"></circle>
</svg>

0 comments on commit 408dfa0

Please sign in to comment.