diff --git a/src/git.js b/src/git.js index 74412e53..944df9f3 100644 --- a/src/git.js +++ b/src/git.js @@ -694,6 +694,11 @@ GitEngine.prototype.dispatch = function(command, callback) { command.set('status', 'processing'); this[command.get('method') + 'Starter'](); + // TODO (get rid of) + for (var i = 0; i < 3; i++) { + this.animationQueue.add(new Animation({closure: function() { console.log(Math.random()); }})); + } + this.animationQueue.start(); }; diff --git a/src/index.html b/src/index.html index 03379eff..cc2890c8 100644 --- a/src/index.html +++ b/src/index.html @@ -47,8 +47,11 @@
> > > <%= rawStr %> - - + + + + +
diff --git a/src/style/main.css b/src/style/main.css index 836cd52c..4358f041 100644 --- a/src/style/main.css +++ b/src/style/main.css @@ -8,11 +8,9 @@ html, body { background: -ms-radial-gradient(center, ellipse cover, #0066cc 0%,#000000 90%); background: radial-gradient(center, ellipse cover, #0066cc 0%,#000000 90%); -webkit-perspective:600px; - font-family: 'Lato', Times, 'Times New Roman', serif; - font-size: 36px; - font-weight: 200; - letter-spacing: -0.02em; - + + font-family: Monaco, Courier, font-monospace; + font-size: 1.4em; color: #eee; } @@ -25,6 +23,14 @@ html, body { transition: background 700ms cubic-bezier(0.260, 0.860, 0.440, 0.985); } +.transitionOpacity { + -webkit-transition: opacity 1700ms cubic-bezier(0.260, 0.860, 0.440, 0.985); + -moz-transition: opacity 1700ms cubic-bezier(0.260, 0.860, 0.440, 0.985); + -ms-transition: opacity 1700ms cubic-bezier(0.260, 0.860, 0.440, 0.985); + -o-transition: opacity 1700ms cubic-bezier(0.260, 0.860, 0.440, 0.985); + transition: opacity 1700ms cubic-bezier(0.260, 0.860, 0.440, 0.985); +} + #controls { position: absolute; top: 0px; @@ -45,6 +51,22 @@ p.commandLine, p.commandLineResult { background-color: black; } +p.commandLine span.icons { + float: right; + margin-right: 5px; +} + +p.commandLine span.icons i { + opacity: 0; +} + +p.commandLine.inqueue span.icons i.icon-check-empty, +p.commandLine.error span.icons i.icon-exclamation-sign, +p.commandLine.processing span.icons i.icon-retweet, +p.commandLine.finished span.icons i.icon-check { + opacity: 1; +} + p.commandLine.error { background-color: red; }