got rid entirely of the square-spin loader
parent
f5c9e0d2f5
commit
47f13fc45c
|
@ -0,0 +1,2 @@
|
|||
@()
|
||||
<div class="spinner"><svg viewBox="0 0 40 40"><circle cx=20 cy=20 r=18 fill="none"></circle></svg></div>
|
|
@ -3,7 +3,7 @@
|
|||
<form class="insight-refresh" method="post" action="@routes.Insight.refresh(u.username)">
|
||||
<button data-icon="E" class="button text">@action</button>
|
||||
<div class="crunching none">
|
||||
<span class="square-spin"></span>
|
||||
@base.spinner()
|
||||
<br />
|
||||
<strong>Now crunching data just for you!</strong>
|
||||
<br />
|
||||
|
|
|
@ -58,7 +58,7 @@ description = s"${trans.tournamentHomeDescription()}").some) {
|
|||
}
|
||||
<h1>@trans.tournaments()</h1>
|
||||
<div id="tournament_schedule">
|
||||
<span class="square-spin"></span>
|
||||
@base.spinner()
|
||||
</div>
|
||||
<div id="tournament_list">
|
||||
<table class="slist finished">
|
||||
|
|
|
@ -758,8 +758,6 @@ lichess.numberFormat = (function() {
|
|||
}, 10);
|
||||
});
|
||||
|
||||
var powerTipLoader = '<div class="square-wrap"><div class="square-spin"></div></div>';
|
||||
|
||||
lichess.userPowertip = function($els, placement) {
|
||||
$els.removeClass('ulpt').powerTip({
|
||||
intentPollInterval: 200,
|
||||
|
@ -778,7 +776,7 @@ lichess.numberFormat = (function() {
|
|||
}
|
||||
});
|
||||
}
|
||||
}).data('powertip', powerTipLoader);
|
||||
}).data('powertip', lichess.spinnerHtml);
|
||||
};
|
||||
|
||||
function gamePowertip($els, placement) {
|
||||
|
@ -801,7 +799,7 @@ lichess.numberFormat = (function() {
|
|||
}
|
||||
});
|
||||
}
|
||||
}).data('powertip', powerTipLoader);
|
||||
}).data('powertip', lichess.spinnerHtml);
|
||||
}
|
||||
|
||||
function updatePowertips() {
|
||||
|
|
|
@ -345,30 +345,6 @@ div.content_box .loader:after {
|
|||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.square-spin {
|
||||
display: inline-block;
|
||||
-webkit-animation-fill-mode: both;
|
||||
animation-fill-mode: both;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
background: #c0c0c0;
|
||||
border: 1px solid #aaa;
|
||||
-webkit-animation: square-spin 3s 0s cubic-bezier(.09, .57, .49, .9) infinite;
|
||||
animation: square-spin 3s 0s cubic-bezier(.09, .57, .49, .9) infinite;
|
||||
}
|
||||
@-webkit-keyframes square-spin {
|
||||
25% { -webkit-transform: perspective(100px) rotateX(180deg) rotateY(0); }
|
||||
50% { -webkit-transform: perspective(100px) rotateX(180deg) rotateY(180deg); }
|
||||
75% { -webkit-transform: perspective(100px) rotateX(0) rotateY(180deg); }
|
||||
100% { -webkit-transform: perspective(100px) rotateX(0) rotateY(0); }
|
||||
}
|
||||
|
||||
@keyframes square-spin {
|
||||
25% { transform: perspective(100px) rotateX(180deg) rotateY(0); }
|
||||
50% { transform: perspective(100px) rotateX(180deg) rotateY(180deg); }
|
||||
75% { transform: perspective(100px) rotateX(0) rotateY(180deg); }
|
||||
100% { transform: perspective(100px) rotateX(0) rotateY(0); }
|
||||
}
|
||||
.spinner {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
|
@ -491,14 +467,10 @@ div.content_box .loader:after {
|
|||
display: block;
|
||||
padding: 15px 15px;
|
||||
}
|
||||
#powerTip .square-wrap,
|
||||
#miniGame .square-wrap {
|
||||
text-align: center;
|
||||
#powerTip .spinner {
|
||||
margin: 20px auto;
|
||||
}
|
||||
#powerTip .square-spin {
|
||||
margin: 23px auto 20px auto;
|
||||
}
|
||||
#miniGame .square-spin {
|
||||
#miniGame .spinner {
|
||||
margin: 82px auto 0 auto;
|
||||
}
|
||||
.clearfix::after {
|
||||
|
|
|
@ -570,10 +570,6 @@ body.dark div.eval_gauge tick {
|
|||
body.dark div.side_box .game_infos .variant-link {
|
||||
border-color: #8c8c8c;
|
||||
}
|
||||
body.dark .square-spin {
|
||||
background: #666;
|
||||
border-color: #aaa;
|
||||
}
|
||||
body.dark input.cmn-toggle-round + label {
|
||||
background-color: #888;
|
||||
}
|
||||
|
|
|
@ -1,12 +1,13 @@
|
|||
#insight .square-in {
|
||||
#insight .spinner {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 280px;
|
||||
left: 380px;
|
||||
-webkit-transform: scale(5);
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
top: 238px;
|
||||
left: 342px;
|
||||
opacity: 0.7;
|
||||
}
|
||||
#insight .loading .square-in {
|
||||
#insight .loading .spinner {
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
|
|
@ -567,10 +567,10 @@ ol.scheduled_tournaments li.marathon {
|
|||
min-height: 400px;
|
||||
position: relative;
|
||||
}
|
||||
#tournament_schedule .square-spin {
|
||||
position: absolute;
|
||||
top: 190px;
|
||||
left: 50%;
|
||||
#tournament_schedule .spinner {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
padding-top: 120px;
|
||||
opacity: 0.7;
|
||||
}
|
||||
#tournament_schedule .schedule {
|
||||
|
|
|
@ -213,6 +213,6 @@ module.exports = function(ctrl) {
|
|||
makeChart(el, ctrl.vm.answer);
|
||||
}
|
||||
}),
|
||||
m('div.square-in', m('div.square-spin')),
|
||||
m.trust(lichess.spinnerHtml)
|
||||
];
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue