update loader
This commit is contained in:
parent
0033ff4a5c
commit
896d778dee
21
static/images/keyboard_icon_CMedit.svg
Normal file
21
static/images/keyboard_icon_CMedit.svg
Normal file
@ -0,0 +1,21 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 21.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 292.7 119.8" style="enable-background:new 0 0 292.7 119.8;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#FBBC05;}
|
||||
</style>
|
||||
<g>
|
||||
<polyline class="st0" points="131,92 131,65.9 124.7,65.9 124.7,30.4 110.2,30.4 110.2,92 "/>
|
||||
<polyline class="st0" points="155.9,92 155.9,65.9 149.7,65.9 149.7,30.4 141.4,30.4 141.4,65.9 135.1,65.9 135.1,92 "/>
|
||||
<polyline class="st0" points="255.8,92 255.8,65.9 249.6,65.9 249.6,30.4 241.3,30.4 241.3,65.9 235,65.9 235,92 "/>
|
||||
<polyline class="st0" points="180.9,92 180.9,65.9 180.9,30.4 174.6,30.4 166.3,30.4 166.3,65.9 160.1,65.9 160.1,92 "/>
|
||||
<polyline class="st0" points="205.9,92 205.9,65.9 199.6,65.9 199.6,30.4 185.1,30.4 185.1,92 "/>
|
||||
<polyline class="st0" points="230.8,92 230.8,65.9 224.6,65.9 224.6,30.4 216.3,30.4 216.3,65.9 210,65.9 210,92 "/>
|
||||
<polyline class="st0" points="280.8,92 280.8,65.9 280.8,30.4 274.5,30.4 266.2,30.4 266.2,65.9 260,65.9 260,92 "/>
|
||||
<polyline class="st0" points="81.1,92 81.1,65.9 74.9,65.9 74.9,30.4 66.6,30.4 66.6,65.9 60.3,65.9 60.3,92 "/>
|
||||
<polyline class="st0" points="31.2,92 31.2,65.9 24.9,65.9 24.9,30.4 10.4,30.4 10.4,92 "/>
|
||||
<polyline class="st0" points="56.1,92 56.1,65.9 49.9,65.9 49.9,30.4 41.6,30.4 41.6,65.9 35.3,65.9 35.3,92 "/>
|
||||
<polyline class="st0" points="106.1,92 106.1,65.9 106.1,30.4 99.8,30.4 91.5,30.4 91.5,65.9 85.3,65.9 85.3,92 "/>
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 1.6 KiB |
@ -48,7 +48,8 @@ export default class Loader extends EventEmitter{
|
||||
|
||||
Buffer.on('load', () => {
|
||||
this.loaded = true
|
||||
fillText.innerHTML = '<div id="piano"></div> <div id="play">Press any key to play</div></br><div id="germanPlay"> Drücken Sie eine beliebige Taste, um zu spielen.</div>'
|
||||
loader.classList.add("loaded")
|
||||
fillText.innerHTML = '<div id="piano">'
|
||||
})
|
||||
|
||||
Buffer.on('progress', (prog) => {
|
||||
|
@ -91,8 +91,8 @@ $topMargin: 35px;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
$loaderWidth: 500px;
|
||||
$loaderHeight: 120px;
|
||||
$loaderWidth: 398px;
|
||||
$loaderHeight: 118px;
|
||||
|
||||
#loader {
|
||||
position: relative;
|
||||
@ -125,7 +125,6 @@ $topMargin: 35px;
|
||||
width: $loaderWidth;
|
||||
height: 100%;
|
||||
color: $orange;
|
||||
line-height: 88px;
|
||||
$imgWidth: 40px;
|
||||
$margin : 52px;
|
||||
|
||||
@ -148,13 +147,13 @@ $topMargin: 35px;
|
||||
/*display: inline-block;*/
|
||||
}
|
||||
#piano {
|
||||
left: $margin;
|
||||
width: $imgWidth;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image : url(../images/keyboard_icon.svg);
|
||||
background-image : url(../images/keyboard_icon_CMedit.svg);
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@ -164,6 +163,24 @@ $topMargin: 35px;
|
||||
text-align: center;
|
||||
font-weight: normal;
|
||||
}
|
||||
&.loaded {
|
||||
margin-top: $topMargin;
|
||||
border: none;
|
||||
width: 400px;
|
||||
height: 120px;
|
||||
background-color: transparent;
|
||||
|
||||
#loaderText {
|
||||
background-color: transparent;
|
||||
}
|
||||
#fillText {
|
||||
background-color: transparent;
|
||||
}
|
||||
#fill {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user