jeena/FeedMonkey
Archived
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

added icons font

Browse source
This commit is contained in:
Jeena 2013-09-15 03:21:16 +02:00
parent c172710b6a
commit 61fdc2ff43
5 changed files with 61 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
css/entypo.woff Normal file
View file

Binary file not shown.

40
css/screen.css
View file

@ -1,3 +1,8 @@
@font-face {
font-family: Entypo;
src: url(entypo.woff);
}
html, body { html, body {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -38,6 +43,10 @@ a {
font-size: 1em; font-size: 1em;
} }
.icon {
font-family: "Entypo";
}
header .button, footer .button, .button.small { header .button, footer .button, .button.small {
width: auto; width: auto;
display: inline-block; display: inline-block;
@ -178,13 +187,13 @@ canvas {
.yellow #list li { border-bottom: 1px solid #f39c12; } .yellow #list li { border-bottom: 1px solid #f39c12; }
#list li:after { #list li:after {
content: "›"; content: "";
position: absolute; position: absolute;
right: 10px; right: 10px;
top: 0.1em; top: 0.1em;
font-weight: 100; font-weight: 100;
font-size: 3em; font-size: 3em;
font-family: "Open Sans"; font-family: "Entypo";
} }
.red #list li:after { color: #c0392b; } .red #list li:after { color: #c0392b; }
@ -219,19 +228,10 @@ canvas {
height: 2.5em; height: 2.5em;
} }
.button.icon { .icon {
line-height: 0.52; line-height: 0.4;
font-size: 2em; font-size: 3em;
vertical-align: bottom; vertical-align: bottom;
padding-top: 0.35em;
}
.button.icon2 {
line-height: 1.05;
}
.button.icon.previous, .button.icon.next {
padding-top: 0.5em;
} }
#full h1 { #full h1 {
@ -335,16 +335,22 @@ canvas {
} }
#settings .version { #settings .version {
font-style: italic; padding-top: 1em;
text-align: center;
}
#settings .icons {
text-align: center;
} }
#settings .font-size { #settings .font-size {
text-align: right; text-align: right;
} }
#settings .font-size span { #settings .font-size > span {
float: left; float: left;
line-height: 2.4; padding: 10px 0;
vertical-align: middle;
} }
#settings .button.small { #settings .button.small {

39
index.html
View file

@ -21,31 +21,32 @@
<ul></ul> <ul></ul>
</article> </article>
<footer class="bar"> <footer class="bar">
<a class="button icon" href="#reload">↻</a> <a class="button icon" href="#reload">&#128260;</a>
<a class="button icon" href="#all-read" id="all-read">●</a> <a class="button icon" href="#all-read" id="all-read">&#128229;</a>
<a class="button icon" href="#settings">⚙</a> <a class="button icon" href="#settings">&#9881;</a>
<canvas width="40" height="40"></canvas> <canvas width="40" height="40"></canvas>
</footer> </footer>
</section> </section>
<section id="settings"> <section id="settings">
<header class="bar"> <header class="bar">
<a class="button icon2" href="#list">☰</a> <a class="button icon" href="#list">&#57349;</a>
</header> </header>
<article> <article>
<ul> <ul>
<li><a href="#logout" class="button">Log out</a></li> <li><a href="#logout" class="button"><span class="icon">&#59201;</span> Log out</a></li>
<li><a href="#reset-info" class="button">View those info bubbles again</a></li> <li><a href="#reset-info" class="button"><span class="icon">&#59160;</span> View those info bubbles again</a></li>
<li class="font-size"> <li class="font-size">
<span>Font size:</span> <span><span class="icon">&#128269;</span> <small>A</small><big>A</big>:</span>
<a class="button small" href="#font-smaller">-</a> <a class="button small" href="#font-smaller"><span class="icon">&#11015;</span></a>
<a class="button small" href="#font-bigger">+</a> <a class="button small" href="#font-bigger"><span class="icon">&#11014;</span></a>
</li> </li>
<li><a href="#color-white" class="color-white button">White colors</a></li> <li><a href="#color-white" class="color-white button"><span class="icon">&#59290;</span> White</a></li>
<li><a href="#color-blue" class="color-blue button">Blue colors</a></li> <li><a href="#color-blue" class="color-blue button"><span class="icon">&#59290;</span> Blue</a></li>
<li><a href="#color-yellow" class="color-yellow button">Yellow colors</a></li> <li><a href="#color-yellow" class="color-yellow button"><span class="icon">&#59290;</span> Yellow</a></li>
<li><a href="#color-red" class="color-red button">Red colors (default)</a></li> <li><a href="#color-red" class="color-red button"><span class="icon">&#59290;</span> Red (default)</a></li>
<li class="version">You're running version <em id="version"></em></li> <li class="version"><span class="icon">&#59141;</span> You're running version <em id="version"></em></li>
<li class="icons"><span class="icon">&#128325;</span> Icons by <a href="http://www.entypo.com/">Entypo</a></li>
</ul> </ul>
</article> </article>
</section> </section>
@ -80,9 +81,9 @@
<section id="full"> <section id="full">
<header class="bar"> <header class="bar">
<a class="button icon2" href="#list">☰</a> <a class="button icon" href="#list">&#57349;</a>
<a id="setunread" class="button icon" href="#unread">○</a> <a id="setunread" class="button icon" href="#unread">&#128229;</a>
<a id="setstarred" class="button icon" href="#starred">☆</a> <a id="setstarred" class="button icon" href="#starred">&#9734;</a>
<canvas width="40" height="40"></canvas> <canvas width="40" height="40"></canvas>
</header> </header>
<article> <article>
@ -97,8 +98,8 @@
</div> </div>
</article> </article>
<footer class="bar"> <footer class="bar">
<a class="button previous icon" href="#previous">⇤</a> <a class="button previous icon" href="#previous">&larr;</a>
<a class="button next icon" href="#next">⇥</a> <a class="button next icon" href="#next">&rarr;</a>
</footer> </footer>
</section> </section>

28
js/App.js
View file

@ -130,7 +130,7 @@ App.prototype.setColor = function(color) {
App.prototype.reload = function() { App.prototype.reload = function() {
this.unread_articles = []; this.unread_articles = [];
$("#all-read").innerHTML = "●"; $("#all-read").innerHTML = "&#128229;";
this.ttrss.getUnreadFeeds(this.gotUnreadFeeds.bind(this)); this.ttrss.getUnreadFeeds(this.gotUnreadFeeds.bind(this));
}; };
@ -201,6 +201,12 @@ App.prototype.updateList = function() {
} }
}, this); }, this);
if(unread > 0) {
$("#all-read").innerHTML = "&#128229;";
} else {
$("#all-read").innerHTML = "&#128228;";
}
this.updatePieChart(); this.updatePieChart();
}; };
@ -265,15 +271,15 @@ App.prototype.showFull = function(article, slide_back) {
$(page_id + " .article").innerHTML = article.content; $(page_id + " .article").innerHTML = article.content;
if(article.set_unread) { if(article.set_unread) {
$("#setunread").innerHTML = "●"; $("#setunread").innerHTML = "&#128228;";
} else { } else {
$("#setunread").innerHTML = "○"; $("#setunread").innerHTML = "&#128229;";
} }
if(article.marked) { if(article.marked) {
$("#setstarred").innerHTML = "★"; $("#setstarred").innerHTML = "&#9733;";
} else { } else {
$("#setstarred").innerHTML = "☆"; $("#setstarred").innerHTML = "&#9734;";
} }
}; };
@ -321,12 +327,12 @@ App.prototype.setCurrentUnread = function() {
this.updateList(); this.updateList();
this.ttrss.setArticleUnread(article.id); this.ttrss.setArticleUnread(article.id);
$("#setunread").innerHTML = "●"; $("#setunread").innerHTML = "&#128228;";
}; };
App.prototype.toggleAllRead = function() { App.prototype.toggleAllRead = function() {
if($("#all-read").innerHTML == "●") { // set all read if($("#all-read").innerHTML == "📥") { // set all read
var ids = []; var ids = [];
for (var i = 0; i < this.unread_articles.length; i++) { for (var i = 0; i < this.unread_articles.length; i++) {
@ -335,7 +341,7 @@ App.prototype.toggleAllRead = function() {
article.set_unread = false; article.set_unread = false;
ids.push(article.id); ids.push(article.id);
} }
$("#all-read").innerHTML = "○"; $("#all-read").innerHTML = "&#128228;";
this.updateList(); this.updateList();
@ -350,7 +356,7 @@ App.prototype.toggleAllRead = function() {
article.set_unread = false; article.set_unread = false;
ids.push(article.id); ids.push(article.id);
} }
$("#all-read").innerHTML = "●"; $("#all-read").innerHTML = "&#128229;";
this.updateList(); this.updateList();
this.ttrss.setArticleUnread(ids.join(",")); this.ttrss.setArticleUnread(ids.join(","));
@ -366,13 +372,13 @@ App.prototype.toggleStarred = function() {
article.marked = true; article.marked = true;
this.updateList(); this.updateList();
this.ttrss.setArticleStarred(article.id); this.ttrss.setArticleStarred(article.id);
$("#setstarred").innerHTML = "★"; $("#setstarred").innerHTML = "&#9733;";
} }
else { else {
article.marked = false; article.marked = false;
this.updateList(); this.updateList();
this.ttrss.setArticleUnStarred(article.id); this.ttrss.setArticleUnStarred(article.id);
$("#setstarred").innerHTML = "☆"; $("#setstarred").innerHTML = "&#9734;";
} }
}; };

2
manifest.webapp
View file

@ -19,5 +19,5 @@
} }
}, },
"installs_allowed_from": ["*"], "installs_allowed_from": ["*"],
"version": "0.2.2" "version": "0.3.0"
} }