mirror/pcottle.learnGitBranching
1
0
Fork 0
mirror of https://github.com/pcottle/learnGitBranching.git synced 2025-06-28 00:40:07 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

sweet github icons now

Browse source
This commit is contained in:
Peter Cottle 2012-09-15 21:09:47 -07:00
parent 591cae5fa6
commit 27af3df489
3 changed files with 37 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/git.js
View file

@ -694,6 +694,11 @@ GitEngine.prototype.dispatch = function(command, callback) {
command.set('status', 'processing'); command.set('status', 'processing');
this[command.get('method') + 'Starter'](); 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(); this.animationQueue.start();
}; };

7
src/index.html
View file

@ -47,8 +47,11 @@
<p class="commandLine transitionBackground <%= status %>"> <p class="commandLine transitionBackground <%= status %>">
<span class="arrows">&gt; &gt; &gt;</span> <span class="arrows">&gt; &gt; &gt;</span>
<%= rawStr %> <%= rawStr %>
<span class="icons"> <span class="icons transitionOpacity">
<i class="icon-exclamation-sign"></i>
<i class="icon-check-empty"></i>
<i class="icon-retweet"></i>
<i class="icon-check"></i>
</span> </span>
</p> </p>

30
src/style/main.css
View file

@ -8,11 +8,9 @@ html, body {
background: -ms-radial-gradient(center, ellipse cover, #0066cc 0%,#000000 90%); background: -ms-radial-gradient(center, ellipse cover, #0066cc 0%,#000000 90%);
background: radial-gradient(center, ellipse cover, #0066cc 0%,#000000 90%); background: radial-gradient(center, ellipse cover, #0066cc 0%,#000000 90%);
-webkit-perspective:600px; -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; color: #eee;
} }
@ -25,6 +23,14 @@ html, body {
transition: background 700ms cubic-bezier(0.260, 0.860, 0.440, 0.985); 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 { #controls {
position: absolute; position: absolute;
top: 0px; top: 0px;
@ -45,6 +51,22 @@ p.commandLine, p.commandLineResult {
background-color: black; 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 { p.commandLine.error {
background-color: red; background-color: red;
} }