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 {
margin: 0;
padding: 0;
@ -38,6 +43,10 @@ a {
font-size: 1em;
}
.icon {
font-family: "Entypo";
}
header .button, footer .button, .button.small {
width: auto;
display: inline-block;
@ -178,13 +187,13 @@ canvas {
.yellow #list li { border-bottom: 1px solid #f39c12; }
#list li:after {
content: "›";
content: "";
position: absolute;
right: 10px;
top: 0.1em;
font-weight: 100;
font-size: 3em;
font-family: "Open Sans";
font-family: "Entypo";
}
.red #list li:after { color: #c0392b; }
@ -219,19 +228,10 @@ canvas {
height: 2.5em;
}
.button.icon {
line-height: 0.52;
font-size: 2em;
.icon {
line-height: 0.4;
font-size: 3em;
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 {
@ -335,16 +335,22 @@ canvas {
}
#settings .version {
font-style: italic;
padding-top: 1em;
text-align: center;
}
#settings .icons {
text-align: center;
}
#settings .font-size {
text-align: right;
}
#settings .font-size span {
#settings .font-size > span {
float: left;
line-height: 2.4;
padding: 10px 0;
vertical-align: middle;
}
#settings .button.small {

39
index.html
View file

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

28
js/App.js
View file

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

2
manifest.webapp
View file

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