mirror of
https://github.com/pulsar-edit/pulsar.git
synced 2024-09-11 11:15:24 +03:00
Use loading octicon in command panel
This removes the SVG spinner which had been incorrectly rendering since the bootstrap upgrade due to box sizing issues.
This commit is contained in:
parent
b56f4a129f
commit
15cf475d04
@ -12,7 +12,8 @@ module.exports =
|
||||
class CommandPanelView extends View
|
||||
@content: ->
|
||||
@div class: 'command-panel tool-panel', =>
|
||||
@div class: 'loading is-loading', outlet: 'loadingMessage', 'Searching...'
|
||||
@div class: 'loading is-loading', outlet: 'loadingMessage', =>
|
||||
@span 'Searching...'
|
||||
@div class: 'header', outlet: 'previewHeader', =>
|
||||
@button outlet: 'collapseAll', class: 'btn btn-mini pull-right', 'Collapse All'
|
||||
@button outlet: 'expandAll', class: 'btn btn-mini pull-right', 'Expand All'
|
||||
|
@ -3,17 +3,28 @@
|
||||
padding: 0;
|
||||
|
||||
.is-loading {
|
||||
display: block;
|
||||
margin: 0 auto 10px auto;
|
||||
width: 100px;
|
||||
background-color: #111111;
|
||||
background-size: auto;
|
||||
background-position: 5px 5px;
|
||||
padding: 5px 5px 10px 30px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid rgba(255,255,255,0.1);
|
||||
border-top: 1px solid rgba(0,0,0,1);
|
||||
border-left: 1px solid rgba(0,0,0,1);
|
||||
margin-bottom: 10px;
|
||||
text-align: center;
|
||||
|
||||
span {
|
||||
padding: 5px 10px 5px 10px;
|
||||
background-color: #111111;
|
||||
text-align: center;
|
||||
border-radius: 3px;
|
||||
border: 1px solid rgba(255,255,255,0.1);
|
||||
border-top: 1px solid rgba(0,0,0,1);
|
||||
border-left: 1px solid rgba(0,0,0,1);
|
||||
|
||||
&:before {
|
||||
font-family: 'Octicons Regular';
|
||||
font-size: 14px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin-right: 5px;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
content: '\f09e';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.preview-count {
|
||||
|
@ -1,30 +0,0 @@
|
||||
<?xml version='1.0' standalone='no'?>
|
||||
<!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'>
|
||||
<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='20px' height='20px'>
|
||||
<g>
|
||||
<circle cx='10' cy='2' r='2' style='opacity:0;fill:#fff'>
|
||||
<animate attributeType='CSS' attributeName='opacity' from='1' to='0' dur='0.8s' repeatCount='indefinite' begin='0s' />
|
||||
</circle>
|
||||
<circle cx='15.6569' cy='4.3431' r='2' style='opacity:0;fill:#fff'>
|
||||
<animate attributeType='CSS' attributeName='opacity' from='1' to='0' dur='0.8s' repeatCount='indefinite' begin='0.1s' />
|
||||
</circle>
|
||||
<circle cx='18' cy='10' r='2' style='opacity:0;fill:#fff'>
|
||||
<animate attributeType='CSS' attributeName='opacity' from='1' to='0' dur='0.8s' repeatCount='indefinite' begin='0.2s' />
|
||||
</circle>
|
||||
<circle cx='15.6569' cy='15.6569' r='2' style='opacity:0;fill:#fff'>
|
||||
<animate attributeType='CSS' attributeName='opacity' from='1' to='0' dur='0.8s' repeatCount='indefinite' begin='0.3s' />
|
||||
</circle>
|
||||
<circle cx='10' cy='18' r='2' style='opacity:0;fill:#fff'>
|
||||
<animate attributeType='CSS' attributeName='opacity' from='1' to='0' dur='0.8s' repeatCount='indefinite' begin='0.4s' />
|
||||
</circle>
|
||||
<circle cx='4.3431' cy='15.6569' r='2' style='opacity:0;fill:#fff'>
|
||||
<animate attributeType='CSS' attributeName='opacity' from='1' to='0' dur='0.8s' repeatCount='indefinite' begin='0.5s' />
|
||||
</circle>
|
||||
<circle cx='2' cy='10' r='2' style='opacity:0;fill:#fff'>
|
||||
<animate attributeType='CSS' attributeName='opacity' from='1' to='0' dur='0.8s' repeatCount='indefinite' begin='0.6s' />
|
||||
</circle>
|
||||
<circle cx='4.3431' cy='4.3431' r='2' style='opacity:0;fill:#fff'>
|
||||
<animate attributeType='CSS' attributeName='opacity' from='1' to='0' dur='0.8s' repeatCount='indefinite' begin='0.7s' />
|
||||
</circle>
|
||||
</g>
|
||||
</svg>
|
Before Width: | Height: | Size: 1.8 KiB |
@ -72,15 +72,3 @@ html, body {
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.is-loading {
|
||||
background-image: url(images/spinner.svg);
|
||||
background-repeat: no-repeat;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
opacity: 0.5;
|
||||
background-size: contain;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
padding-left: 19px;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user