From 75e7a86e62284c92185824b126e0efc99cda9a4d Mon Sep 17 00:00:00 2001 From: Stas Vilchik Date: Thu, 27 Feb 2014 16:59:38 +0100 Subject: [PATCH] New spinner --- .../src/main/webapp/images/loading-new.gif | Bin 0 -> 3048 bytes .../src/main/webapp/stylesheets/icons.css | 70 ++++++++++++++++++ .../src/main/webapp/stylesheets/icons.less | 53 +++++++++++++ .../src/main/webapp/stylesheets/mixins.less | 9 +++ .../src/main/webapp/stylesheets/navigator.css | 6 +- .../webapp/stylesheets/navigator/base.css | 4 +- .../webapp/stylesheets/navigator/base.less | 4 +- .../webapp/stylesheets/navigator/filters.css | 2 +- .../webapp/stylesheets/navigator/filters.less | 2 +- .../main/webapp/stylesheets/quality-gates.css | 6 +- .../main/webapp/stylesheets/select-list.css | 2 +- .../src/main/webapp/stylesheets/style.css | 2 +- 12 files changed, 146 insertions(+), 14 deletions(-) create mode 100644 sonar-server/src/main/webapp/images/loading-new.gif diff --git a/sonar-server/src/main/webapp/images/loading-new.gif b/sonar-server/src/main/webapp/images/loading-new.gif new file mode 100644 index 0000000000000000000000000000000000000000..60834b831faf6ac58a843ffd23afca430e6ec0bc GIT binary patch literal 3048 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 JHZ=t7{tuwzBlQ3P literal 0 HcmV?d00001 diff --git a/sonar-server/src/main/webapp/stylesheets/icons.css b/sonar-server/src/main/webapp/stylesheets/icons.css index b868274b59c..381d0eee212 100644 --- a/sonar-server/src/main/webapp/stylesheets/icons.css +++ b/sonar-server/src/main/webapp/stylesheets/icons.css @@ -174,3 +174,73 @@ top: -0.1em; content: "\f00c"; } +/* + * Spinner + */ +.spinner { + position: relative; + vertical-align: middle; + width: 16px; + height: 16px; + border: 2px solid #0cf; + border-radius: 50%; + -webkit-animation: spin 0.75s infinite linear; + animation: spin 0.75s infinite linear; +} +.spinner:before, +.spinner:after { + left: -2px; + top: -2px; + display: none; + position: absolute; + content: ''; + width: inherit; + height: inherit; + border: inherit; + border-radius: inherit; +} +.spinner, +.spinner:before, +.spinner:after { + display: inline-block; + -moz-box-sizing: border-box; + box-sizing: border-box; + border-color: transparent; + border-top-color: #4b9fd5; + -webkit-animation-duration: 1.2s; + animation-duration: 1.2s; +} +.spinner:before { + -webkit-transform: rotate(120deg); + -ms-transform: rotate(120deg); + transform: rotate(120deg); +} +.spinner:after { + -webkit-transform: rotate(240deg); + -ms-transform: rotate(240deg); + transform: rotate(240deg); +} +@-webkit-keyframes spin { + from { + -webkit-transform: rotate(0deg); + -ms-transform: rotate(0deg); + transform: rotate(0deg); + } + to { + -webkit-transform: rotate(360deg); + -ms-transform: rotate(360deg); + transform: rotate(360deg); + } +} +@keyframes spin { + from { + -webkit-transform: rotate(0deg); + -ms-transform: rotate(0deg); + transform: rotate(0deg); + } + to { + -webkit-transform: rotate(360deg); + -ms-transform: rotate(360deg); + transform: rotate(360deg); + } +} diff --git a/sonar-server/src/main/webapp/stylesheets/icons.less b/sonar-server/src/main/webapp/stylesheets/icons.less index 3c630b96618..8606d9b1b3a 100644 --- a/sonar-server/src/main/webapp/stylesheets/icons.less +++ b/sonar-server/src/main/webapp/stylesheets/icons.less @@ -1,4 +1,5 @@ @import "variables"; +@import "mixins"; @font-face { font-family: 'sonar'; @@ -181,3 +182,55 @@ top: -0.1em; content: "\f00c"; } + + +/* + * Spinner + */ + +.spinner { + position: relative; + vertical-align: middle; + .square(16px); + border: 2px solid #0cf; + border-radius: 50%; + .animation(spin 0.75s infinite linear); +} + +.spinner:before, +.spinner:after { + left: -2px; + top: -2px; + display: none; + position: absolute; + content: ''; + width: inherit; + height: inherit; + border: inherit; + border-radius: inherit; +} + +.spinner, +.spinner:before, +.spinner:after { + display: inline-block; + .box-sizing(border-box); + border-color: transparent; + border-top-color: @blue; + .animation-duration(1.2s); +} +.spinner:before { + .rotate(120deg); +} +.spinner:after { + .rotate(240deg); +} + +@-webkit-keyframes spin { + from { .rotate(0deg); } + to { .rotate(360deg); } +} +@keyframes spin { + from { .rotate(0deg); } + to { .rotate(360deg); } +} diff --git a/sonar-server/src/main/webapp/stylesheets/mixins.less b/sonar-server/src/main/webapp/stylesheets/mixins.less index fc56b89ba17..808128ca0f0 100644 --- a/sonar-server/src/main/webapp/stylesheets/mixins.less +++ b/sonar-server/src/main/webapp/stylesheets/mixins.less @@ -69,6 +69,15 @@ box-sizing: @boxmodel; } +.animation(@animation) { + -webkit-animation: @animation; + animation: @animation; +} +.animation-duration(@duration) { + -webkit-animation-duration: @duration; + animation-duration: @duration; +} + .horizontal-gradient(@startColor: #555, @endColor: #333) { background-color: @endColor; background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+ diff --git a/sonar-server/src/main/webapp/stylesheets/navigator.css b/sonar-server/src/main/webapp/stylesheets/navigator.css index c7cf3231b8e..6d5b8d91065 100644 --- a/sonar-server/src/main/webapp/stylesheets/navigator.css +++ b/sonar-server/src/main/webapp/stylesheets/navigator.css @@ -103,7 +103,7 @@ bottom: 0; left: 0; right: 0; - background: #ffffff url(../images/loading.gif) no-repeat 4px 4px; + background: #ffffff url(../images/loading-new.gif) no-repeat 4px 4px; } .navigator-fetching#tab-issue-rule { position: relative; @@ -256,7 +256,7 @@ overflow: auto; } .navigator-details.loading { - background: #ffffff url("../images/loading.gif") no-repeat 4px 2px; + background: #ffffff url("../images/loading-new.gif") no-repeat 4px 2px; } .navigator-details .code-issue-name { border-bottom: none; @@ -605,7 +605,7 @@ display: block; width: 16px; height: 16px; - background: #ffffff url(../images/loading.gif) no-repeat center center; + background: #ffffff url(../images/loading-new.gif) no-repeat center center; } .navigator-filter-load-more { display: none; diff --git a/sonar-server/src/main/webapp/stylesheets/navigator/base.css b/sonar-server/src/main/webapp/stylesheets/navigator/base.css index a7e8f306461..bd73dd63bd2 100644 --- a/sonar-server/src/main/webapp/stylesheets/navigator/base.css +++ b/sonar-server/src/main/webapp/stylesheets/navigator/base.css @@ -103,7 +103,7 @@ bottom: 0; left: 0; right: 0; - background: #ffffff url(../images/loading.gif) no-repeat 4px 4px; + background: #ffffff url(../images/loading-new.gif) no-repeat 4px 4px; } .navigator-fetching#tab-issue-rule { position: relative; @@ -256,7 +256,7 @@ overflow: auto; } .navigator-details.loading { - background: #ffffff url("../images/loading.gif") no-repeat 4px 2px; + background: #ffffff url("../images/loading-new.gif") no-repeat 4px 2px; } .navigator-details .code-issue-name { border-bottom: none; diff --git a/sonar-server/src/main/webapp/stylesheets/navigator/base.less b/sonar-server/src/main/webapp/stylesheets/navigator/base.less index e53cb36e612..e09b0bbab73 100644 --- a/sonar-server/src/main/webapp/stylesheets/navigator/base.less +++ b/sonar-server/src/main/webapp/stylesheets/navigator/base.less @@ -102,7 +102,7 @@ position: absolute; z-index: 3; top: 0; bottom: 0; left: 0; right: 0; - background: #fff url(../images/loading.gif) no-repeat 4px 4px; + background: #fff url(../images/loading-new.gif) no-repeat 4px 4px; } &#tab-issue-rule { @@ -305,7 +305,7 @@ overflow: auto; &.loading { - background: @white url("../images/loading.gif") no-repeat 4px 2px; + background: @white url("../images/loading-new.gif") no-repeat 4px 2px; } .code-issue-name { diff --git a/sonar-server/src/main/webapp/stylesheets/navigator/filters.css b/sonar-server/src/main/webapp/stylesheets/navigator/filters.css index 42b5011b59d..7728a52f57e 100644 --- a/sonar-server/src/main/webapp/stylesheets/navigator/filters.css +++ b/sonar-server/src/main/webapp/stylesheets/navigator/filters.css @@ -255,7 +255,7 @@ display: block; width: 16px; height: 16px; - background: #ffffff url(../images/loading.gif) no-repeat center center; + background: #ffffff url(../images/loading-new.gif) no-repeat center center; } .navigator-filter-load-more { display: none; diff --git a/sonar-server/src/main/webapp/stylesheets/navigator/filters.less b/sonar-server/src/main/webapp/stylesheets/navigator/filters.less index 3239afba3cf..828150bffe4 100644 --- a/sonar-server/src/main/webapp/stylesheets/navigator/filters.less +++ b/sonar-server/src/main/webapp/stylesheets/navigator/filters.less @@ -248,7 +248,7 @@ top: 6px; right: -21px; display: block; .square(16px); - background: #fff url(../images/loading.gif) no-repeat center center; + background: #fff url(../images/loading-new.gif) no-repeat center center; } } diff --git a/sonar-server/src/main/webapp/stylesheets/quality-gates.css b/sonar-server/src/main/webapp/stylesheets/quality-gates.css index 9dbfa1ec4e6..1d66ef7baf8 100644 --- a/sonar-server/src/main/webapp/stylesheets/quality-gates.css +++ b/sonar-server/src/main/webapp/stylesheets/quality-gates.css @@ -103,7 +103,7 @@ bottom: 0; left: 0; right: 0; - background: #ffffff url(../images/loading.gif) no-repeat 4px 4px; + background: #ffffff url(../images/loading-new.gif) no-repeat 4px 4px; } .navigator-fetching#tab-issue-rule { position: relative; @@ -256,7 +256,7 @@ overflow: auto; } .navigator-details.loading { - background: #ffffff url("../images/loading.gif") no-repeat 4px 2px; + background: #ffffff url("../images/loading-new.gif") no-repeat 4px 2px; } .navigator-details .code-issue-name { border-bottom: none; @@ -378,7 +378,7 @@ bottom: 0; left: 0; right: 0; - background: #ffffff url(../images/loading.gif) no-repeat 4px 4px; + background: #ffffff url(../images/loading-new.gif) no-repeat 4px 4px; } .quality-gate-page-loader#tab-issue-rule { position: relative; diff --git a/sonar-server/src/main/webapp/stylesheets/select-list.css b/sonar-server/src/main/webapp/stylesheets/select-list.css index 19b2b8c8263..bcd51b14f36 100644 --- a/sonar-server/src/main/webapp/stylesheets/select-list.css +++ b/sonar-server/src/main/webapp/stylesheets/select-list.css @@ -53,7 +53,7 @@ } .select-list-list > li.progress { - background: url(../images/loading.gif) no-repeat 10px 5px; + background: url(../images/loading-new.gif) no-repeat 10px 5px; } .select-list-list > li.progress .select-list-list-checkbox { diff --git a/sonar-server/src/main/webapp/stylesheets/style.css b/sonar-server/src/main/webapp/stylesheets/style.css index 4b96a84cce7..8777fa050b8 100644 --- a/sonar-server/src/main/webapp/stylesheets/style.css +++ b/sonar-server/src/main/webapp/stylesheets/style.css @@ -62,7 +62,7 @@ a { } .loading { - background: url("../images/loading.gif") no-repeat 4px 2px; + background: url("../images/loading-new.gif") no-repeat 4px 2px; color: #444; padding: 3px 25px; } -- 2.39.5