Merge lp:~teemperor/lightread/elementary-ui into lp:~cooperjona/lightread/quickly_trunk

Proposed by Raphael Isemann on 2013-02-18
Status: Needs review
Proposed branch: lp:~teemperor/lightread/elementary-ui
Merge into: lp:~cooperjona/lightread/quickly_trunk
Diff against target: 1530 lines (+1457/-4)
5 files modified
data/media/app/css/style_elementary.css (+1065/-0)
data/media/app/index_elementary.html (+300/-0)
debian/control (+1/-0)
lightread/LightreadWindow.py (+90/-3)
po/lightread.pot (+1/-1)
To merge this branch: bzr merge lp:~teemperor/lightread/elementary-ui
Reviewer Review Type Date Requested Status
consindo 2013-02-18 Pending
Review via email: mp+149006@code.launchpad.net

Description of the change

Added an optional use of the elementary UI as seen here http://i.imgur.com/RMNpvsu.jpg

If there is no granite-lib available on the system or the system is not elementary OS this merge will not affect lightread-behaviour in any way.

For quick questions i'm also available on #elementary-dev or #elementary on irc.freenode.net

To post a comment you must log in.
64. By Raphael Isemann on 2013-02-18

included a new style.css

Raphael Isemann (teemperor) wrote :

Credits for the style.css goes to the source in this news-article: http://www.elementaryupdate.com/2013/02/lightread-rss-app.html

65. By Raphael Isemann on 2013-02-27

added granite-gir dep

Nekhelesh Ramananthan (nik90) wrote :

Raphael all code merge proposals are done in Github. You can find it at https://github.com/stayradiated/LightRead

Unmerged revisions

65. By Raphael Isemann on 2013-02-27

added granite-gir dep

64. By Raphael Isemann on 2013-02-18

included a new style.css

63. By Raphael Isemann on 2013-02-18

added tooltips

62. By Raphael Isemann on 2013-02-18

added support for a optional Granite UI

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1=== added file 'data/media/app/css/style_elementary.css'
2--- data/media/app/css/style_elementary.css 1970-01-01 00:00:00 +0000
3+++ data/media/app/css/style_elementary.css 2013-02-27 22:46:21 +0000
4@@ -0,0 +1,1065 @@
5+button:focus {
6+ outline: none; }
7+
8+a:focus {
9+ outline: none; }
10+
11+::-webkit-scrollbar {
12+ width: 5px; }
13+
14+::-webkit-scrollbar-thumb {
15+ background: #4a90d9; }
16+
17+#articles::-webkit-scroller-thumb {
18+ border-left: 1px solid #e1e1df; }
19+
20+#articles::-webkit-scrollbar-track {
21+ border-left: 1px solid #9c9c9c; }
22+
23+#post-column::-webkit-scrollbar {
24+ width: 4px; }
25+
26+#post iframe#instapaper::-webkit-scrollbar-track {
27+ background: #f4f4f4; }
28+
29+body, html, .splitter {
30+ height: 100%;
31+ font-family: "Open Sans", "Ubuntu", "Helvetica", "Arial", sans-serif; }
32+
33+input, textarea {
34+ font-family: "Open Sans", "Ubuntu", "Helvetica", "Arial", sans-serif; }
35+
36+#app {
37+ overflow: hidden;
38+ width: 100%; }
39+ #app > .vsplitbar {
40+ width: 1px;
41+ cursor: col-resize;
42+ background: #9c9c9c; }
43+
44+#right-side > .vsplitbar {
45+ width: 1px;
46+ cursor: col-resize;
47+ background: white;
48+ border-left: 1px solid #9c9c9c;
49+ border-right: 3px solid transparent;
50+ position: relative;
51+ top: 1px; }
52+ #right-side > .vsplitbar:after {
53+ content: "";
54+ position: absolute;
55+ display: block;
56+ top: auto;
57+ bottom: 0;
58+ left: 0;
59+ right: auto;
60+ width: 4px;
61+ height: 36px;
62+ background: -webkit-linear-gradient(top, #dbdbdb 0%, #c5c5c5 100%);
63+ border-top: 1px solid #737373; }
64+
65+#feeds-column {
66+ height: 100%;
67+ width: 200px;
68+ min-width: 20px;
69+ background: #dbdbdb;
70+ box-shadow: 0 1px 0 #7c7c7c inset; }
71+ #feeds-column * {
72+ -webkit-user-select: none; }
73+ #feeds-column ul {
74+ margin: 0;
75+ padding: 0; }
76+ #feeds-column #filters {
77+ position: absolute;
78+ display: block;
79+ top: 0;
80+ bottom: auto;
81+ left: 0;
82+ right: 0;
83+ height: 76px;
84+ border-bottom: 1px dashed rgba(0, 0, 0, 0.1); }
85+ #feeds-column #feeds {
86+ position: absolute;
87+ display: block;
88+ top: 77px;
89+ bottom: 36px;
90+ left: 0;
91+ right: 0;
92+ overflow-y: auto;
93+ overflow-x: hidden;
94+ border-top: 1px dashed rgba(255, 255, 255, 0.6); }
95+ #feeds-column .empty-message {
96+ display: none;
97+ font-size: 13px;
98+ font-family: "Raleway", "Open Sans", "Ubuntu", sans-serif;
99+ text-shadow: 0 0 1px rgba(0, 0, 0, 0.01), 0 1px 0 white;
100+ margin-top: 140px;
101+ padding: 0 20px;
102+ line-height: 20px;
103+ color: #555555; }
104+
105+#articles-column {
106+ min-width: 250px;
107+ height: 100%;
108+ width: 300px;
109+ background: white;
110+ box-shadow: 0 1px 0 #7c7c7c inset; }
111+ #articles-column * {
112+ -webkit-user-select: none; }
113+ #articles-column #articles {
114+ position: absolute;
115+ display: block;
116+ top: 0;
117+ bottom: 36px;
118+ left: 0;
119+ right: 0;
120+ overflow-y: scroll;
121+ margin: 0;
122+ padding: 0; }
123+ #articles-column .bar {
124+ display: -webkit-box; }
125+
126+#post-column {
127+ min-width: 20px;
128+ height: 100%;
129+ margin-left: -5px;
130+ padding-left: 5px;
131+ background: white;
132+ box-shadow: 0 1px 0 #7c7c7c inset; }
133+ #post-column .bar.disabled #read-button,
134+ #post-column .bar.disabled #star-button,
135+ #post-column .bar.disabled #close-post-button,
136+ #post-column .bar.disabled #instapaper-button,
137+ #post-column .bar.disabled #share-button {
138+ opacity: 0.4; }
139+ #post-column #post-window {
140+ position: absolute;
141+ display: block;
142+ top: 0;
143+ bottom: 36px;
144+ left: 0;
145+ right: 0;
146+ overflow-y: auto; }
147+ #post-column #post-window.instapaper {
148+ background: #f4f4f4; }
149+ #post-column #post-window.instapaper #post {
150+ margin: 0;
151+ padding: 0;
152+ max-width: 100%; }
153+
154+.scope:after, .scope:before {
155+ content: "";
156+ position: absolute;
157+ display: block;
158+ top: auto;
159+ bottom: 35px;
160+ left: 50%;
161+ right: auto;
162+ border: solid transparent;
163+ height: 0;
164+ width: 0;
165+ position: absolute;
166+ pointer-events: none;
167+ z-index: 10; }
168+
169+.scope:after {
170+ border-bottom-color: #dbdbdb;
171+ border-width: 10px;
172+ left: 50%;
173+ margin-left: -10px; }
174+
175+.scope:before {
176+ border-bottom-color: #737373;
177+ border-width: 11px;
178+ left: 50%;
179+ margin-left: -11px; }
180+
181+#hidden {
182+ display: none; }
183+
184+.bar {
185+ position: absolute;
186+ display: block;
187+ top: auto;
188+ bottom: 0;
189+ left: 0;
190+ right: 0;
191+ height: 35px;
192+ background: -webkit-linear-gradient(top, #dbdbdb 0%, #c5c5c5 100%);
193+ border-top: 1px solid #737373;
194+ font-size: 0; }
195+ .bar div {
196+ display: inline-block; }
197+ .bar button {
198+ width: 35px;
199+ height: 35px;
200+ border: 0;
201+ line-height: 35px;
202+ vertical-align: top;
203+ background: transparent;
204+ padding: 0; }
205+
206+#refresh-button {
207+ margin: 0 2px;
208+ background-image: url(../images/sync.png);
209+ background-repeat: no-repeat;
210+ background-position: 5px -211px; }
211+
212+#mark-all-as-read-trigger {
213+ background: url(../images/btn_mark_all_read.png);
214+ margin: 0 2px;
215+ width: 36px; }
216+
217+#mark-all-as-read-popup {
218+ width: 150px;
219+ height: 32px;
220+ position: absolute;
221+ display: block;
222+ top: auto;
223+ bottom: 35px;
224+ left: 4px;
225+ right: auto;
226+ border-radius: 5px;
227+ background: rgba(0, 0, 0, 0.7);
228+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), inset 0 1px rgba(255, 255, 255, 0.3);
229+ border: 1px solid black;
230+ display: none;
231+ z-index: 11; }
232+ #mark-all-as-read-popup:after, #mark-all-as-read-popup:before {
233+ top: 100%;
234+ border: solid transparent;
235+ content: " ";
236+ height: 0;
237+ width: 0;
238+ position: absolute;
239+ pointer-events: none; }
240+ #mark-all-as-read-popup:after {
241+ border-top-color: rgba(0, 0, 0, 0.8);
242+ border-width: 8px;
243+ left: 10%;
244+ margin-left: -8px; }
245+ #mark-all-as-read-popup #mark-all-as-read-button {
246+ background: -webkit-linear-gradient(top, #3a3a3a 0%, #232323 100%);
247+ width: 138px;
248+ height: 22px;
249+ margin: 4px 5px;
250+ border-radius: 3px;
251+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), 0 1px rgba(255, 255, 255, 0.2);
252+ color: #dddddd;
253+ font-family: "Open Sans", "Ubuntu Medium", "Ubuntu", "Helvetica", "Arial", sans-serif;
254+ font-size: 13px;
255+ font-weight: 600;
256+ line-height: 22px;
257+ text-align: center;
258+ border: 1px solid #1a1a1a;
259+ cursor: default;
260+ text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4); }
261+ #mark-all-as-read-popup #mark-all-as-read-button:active {
262+ background: -webkit-linear-gradient(bottom, #3a3a3a 0%, #232323 100%); }
263+
264+#add-button {
265+ background: url(../images/btn_add.png) no-repeat 8px 8px;
266+ float: right; }
267+
268+#search-button {
269+ background: url(../images/btn_search.png);
270+ margin: 0 2px; }
271+
272+#close-post-button {
273+ background: url(../images/btn_close.png) no-repeat 8px 8px;
274+ margin: 0 2px; }
275+
276+#star-button {
277+ background: url(../images/btn_star.png) no-repeat 8px -18px;
278+ margin: 8px 2px 0;
279+ height: 18px; }
280+ #star-button.starred {
281+ background-position-y: 0; }
282+
283+#instapaper-button {
284+ background: url(../images/icon_instapaper.png) no-repeat 8px 8px;
285+ margin: 0 2px; }
286+
287+#share-button {
288+ background: url(../images/btn_share.png) no-repeat 8px 8px;
289+ margin: 0 2px; }
290+ #share-button.active {
291+ background-image: url(../images/share_spinner.gif); }
292+
293+#post iframe#instapaper {
294+ width: 100%;
295+ height: 100%;
296+ margin: 0;
297+ padding: 0;
298+ box-shadow: none;
299+ background: #f4f4f4; }
300+
301+#read-button {
302+ background: url(../images/btn_read.png) no-repeat 8px -17px;
303+ margin: 8px 2px 0;
304+ height: 17px; }
305+ #read-button.read {
306+ background-position-y: 0; }
307+
308+#settings-button {
309+ background: url(../images/btn_settings.png) no-repeat 0 0;
310+ width: 16px;
311+ height: 18px;
312+ margin: 8px 10px 0;
313+ float: right; }
314+
315+#item-count {
316+ display: block;
317+ -webkit-box-flex: 1;
318+ text-align: center;
319+ font-size: 13px;
320+ color: #4c4c4c;
321+ text-shadow: 0 1px 0 white;
322+ line-height: 33px; }
323+
324+#search-input {
325+ display: block;
326+ -webkit-box-flex: 1;
327+ -webkit-user-select: text;
328+ height: 25px;
329+ margin-top: 5px;
330+ padding: 5px 10px;
331+ font-size: 13px;
332+ box-sizing: border-box;
333+ box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 0 white;
334+ border-radius: 3px;
335+ border: 0;
336+ border: 1px solid #cccccc;
337+ color: #4c4c4c;
338+ outline: 0;
339+ line-height: 15px; }
340+ #search-input.active {
341+ background: lightblue; }
342+
343+#link-url {
344+ position: absolute;
345+ display: block;
346+ top: 0;
347+ bottom: 0;
348+ left: 193px;
349+ right: 35px;
350+ line-height: 35px;
351+ font-size: 13px;
352+ color: #4c4c4c;
353+ text-shadow: 0 1px 0 white;
354+ overflow: hidden;
355+ white-space: nowrap;
356+ text-overflow: ellipsis;
357+ text-align: right; }
358+
359+#feeds, #filters {
360+ font-size: 13px; }
361+ #feeds li, #filters li {
362+ cursor: default;
363+ text-align: left;
364+ text-shadow: 0 1px 0 white; }
365+ #feeds li.label, #filters li.label {
366+ -webkit-transition: background 0.3s;
367+ height: auto; }
368+ #feeds li.label header .icon .bit, #filters li.label header .icon .bit {
369+ display: block;
370+ background: url(../images/icon_label.png);
371+ width: 16px;
372+ height: 16px;
373+ -webkit-transition: all 0.3s; }
374+ #feeds li.label header .icon .bit:active, #filters li.label header .icon .bit:active {
375+ -webkit-transform: rotate(45deg); }
376+ #feeds li.label.expanded, #filters li.label.expanded {
377+ padding-bottom: 5px; }
378+ #feeds li.label.expanded header .icon .bit, #filters li.label.expanded header .icon .bit {
379+ -webkit-transform: rotate(90deg); }
380+ #feeds li.label.expanded header .icon .bit:active, #filters li.label.expanded header .icon .bit:active {
381+ -webkit-transform: rotate(45deg); }
382+ #feeds li.label.expanded ul, #filters li.label.expanded ul {
383+ display: block; }
384+ #feeds li.label ul li, #filters li.label ul li {
385+ padding-left: 10px; }
386+ #feeds li.feed, #feeds li.filter, #feeds li.label header, #filters li.feed, #filters li.filter, #filters li.label header {
387+ height: 20px;
388+ line-height: 20px;
389+ display: -webkit-box;
390+ border-top: 1px solid transparent;
391+ border-bottom: 1px solid transparent;
392+ -webkit-transition: background 0.15s;
393+ color: #4c4c4c; }
394+ #feeds li.feed:first-child, #feeds li.filter:first-child, #feeds li.label header:first-child, #filters li.feed:first-child, #filters li.filter:first-child, #filters li.label header:first-child {
395+ margin-top: 5px; }
396+ #feeds li.feed:hover, #feeds li.filter:hover, #feeds li.label header:hover, #filters li.feed:hover, #filters li.filter:hover, #filters li.label header:hover {
397+ background: whitesmoke; }
398+ #feeds li.feed.selected, #feeds li.filter.selected, #feeds li.label header.selected, #filters li.feed.selected, #filters li.filter.selected, #filters li.label header.selected {
399+ color: white;
400+ border-top: 1px solid #5296de;
401+ border-bottom: 1px solid #377fc9;
402+ background: -webkit-linear-gradient(top, #74b0ee 0%, #4c91da 100%);
403+ box-shadow: 0 1px 0 #91c1f3 inset, 0 -1px 0 #5b9adc inset;
404+ text-shadow: 0 1px 0 #4c4c4c; }
405+ #feeds li.feed.selected .count, #feeds li.filter.selected .count, #feeds li.label header.selected .count, #filters li.feed.selected .count, #filters li.filter.selected .count, #filters li.label header.selected .count {
406+ background: rgba(255, 255, 255, 0.8);
407+ color: #61a1e5; }
408+ #feeds li.feed.hover, #feeds li.filter.hover, #feeds li.label header.hover, #filters li.feed.hover, #filters li.filter.hover, #filters li.label header.hover {
409+ background: rgba(0, 0, 0, 0.05);
410+ border-top: 1px solid #cccccc;
411+ border-bottom: 1px solid #cccccc; }
412+ #feeds li .icon, #filters li .icon {
413+ -webkit-box-flex: 0;
414+ display: block;
415+ height: 16px;
416+ width: 16px;
417+ margin: 1px 3px 3px 11px; }
418+ #feeds li .title, #filters li .title {
419+ display: block;
420+ -webkit-box-flex: 1;
421+ overflow: hidden;
422+ white-space: nowrap;
423+ text-overflow: ellipsis;
424+ font-weight: 500;
425+ line-height: 20px; }
426+ #feeds li .count, #filters li .count {
427+ display: block;
428+ -webkit-box-flex: 0;
429+ color: white;
430+ font-weight: bold;
431+ text-shadow: none;
432+ font-size: 11px;
433+ height: 16px;
434+ line-height: 16px;
435+ padding: 0 5px;
436+ margin: 2px 5px 6px 5px;
437+ background: rgba(0, 0, 0, 0.5);
438+ border-radius: 6px; }
439+
440+#articles li {
441+ padding: 0 5px;
442+ border-top: 1px solid white;
443+ border-bottom: 1px solid #9c9c9c;
444+ font-size: 12px;
445+ overflow: hidden;
446+ cursor: default;
447+ -webkit-transition: height 150;
448+ position: relative; }
449+ #articles li:last-child {
450+ margin-bottom: 10px; }
451+ #articles li.read .title {
452+ color: #777777; }
453+ #articles li.starred .title {
454+ color: #3b3b3b;
455+ position: relative; }
456+ #articles li.starred .title:after {
457+ position: absolute;
458+ display: block;
459+ top: 5px;
460+ bottom: auto;
461+ left: 3px;
462+ right: auto;
463+ content: "";
464+ display: inline-block;
465+ width: 13px;
466+ height: 14px;
467+ background: url(../images/icon_starred_alt.png) no-repeat;
468+ opacity: 0.3; }
469+ #articles li.selected {
470+ color: white;
471+ border-top: 1px solid #5296de;
472+ border-bottom: 1px solid #377fc9;
473+ background: -webkit-linear-gradient(top, #74b0ee 0%, #4c91da 100%);
474+ box-shadow: 0 1px 0 #91c1f3 inset, 0 -1px 0 #5b9adc inset;
475+ margin: -1px auto;
476+ z-index: 1; }
477+ #articles li.selected:first-child {
478+ border-top: 0; }
479+ #articles li.selected + li {
480+ border-top: 1px solid transparent; }
481+ #articles li.selected.no-border {
482+ box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.1), 0 -1px 0 white;
483+ border-bottom: 1px solid transparent; }
484+ #articles li.selected .feed, #articles li.selected .title {
485+ color: white;
486+ text-shadow: 0 1px 0 rgba(76, 76, 76, 0.5); }
487+ #articles li.selected .time, #articles li.selected .snippet {
488+ color: rgba(255, 255, 255, 0.7);
489+ text-shadow: 0 1px 0 rgba(76, 76, 76, 0.3); }
490+ #articles li.hover:after {
491+ content: "";
492+ position: absolute;
493+ display: block;
494+ top: 1px;
495+ bottom: 2px;
496+ left: 1px;
497+ right: 1px;
498+ background: rgba(0, 0, 0, 0.05);
499+ border: 1px solid rgba(0, 0, 0, 0.2); }
500+ #articles li header {
501+ display: -webkit-box; }
502+ #articles li header .icon {
503+ padding: 4px 4px 0 2px; }
504+ #articles li header .feed {
505+ font-size: 11px;
506+ color: #777777;
507+ line-height: 25px;
508+ -webkit-box-flex: 1;
509+ display: block;
510+ overflow: hidden;
511+ white-space: nowrap;
512+ text-overflow: ellipsis; }
513+ #articles li header .time {
514+ display: block;
515+ line-height: 25px;
516+ font-size: 11px;
517+ margin-right: 2px;
518+ color: #777777; }
519+ #articles li .title {
520+ font-size: 12px;
521+ display: block;
522+ margin-top: -2px;
523+ padding: 0 0 2px 22px;
524+ font-weight: bold;
525+ color: #3b3b3b;
526+ text-shadow: 0 0 1px rgba(0, 0, 0, 0.01); }
527+ #articles li .snippet {
528+ display: block;
529+ padding: 0 0 0 22px;
530+ line-height: 16px;
531+ color: #888888;
532+ height: 34px;
533+ overflow: hidden; }
534+#articles .splitter {
535+ height: 20px;
536+ padding-left: 10px;
537+ font-size: 13px;
538+ font-weight: bold;
539+ color: #666666;
540+ line-height: 20px;
541+ background: #f3f3f3;
542+ border: 1px solid #9c9c9c;
543+ border-left: 0;
544+ border-right: 0; }
545+ #articles .splitter:first-child {
546+ border-top: 0;
547+ margin-top: 5px; }
548+#articles .splitter:first-child {
549+ border-top: 1px solid #9c9c9c; }
550+#articles .splitter + li {
551+ border-top: 1px solid transparent; }
552+#articles .splitter + li.selected {
553+ padding-top: 0; }
554+#articles li.no-border {
555+ border-bottom: 1px solid transparent; }
556+ #articles li.no-border.selected {
557+ border-bottom: 1px solid #9c9c9c; }
558+
559+#post {
560+ font-family: "Open Sans", "Ubuntu", sans-serif;
561+ font-weight: 400;
562+ font-size: 12px;
563+ line-height: 1.5;
564+ max-width: 600px;
565+ overflow: hidden;
566+ margin: 0 auto;
567+ padding: 0 25px; }
568+ #post .post-link {
569+ display: block;
570+ position: relative;
571+ margin-top: 30px;
572+ margin-bottom: 30px;
573+ border: 1px solid transparent;
574+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
575+ box-shadow: 0 1px 0 white; }
576+ #post .post-link .details {
577+ font-weight: 400;
578+ display: block;
579+ font-size: 12px;
580+ color: #666666; }
581+ #post .post-link h1.title {
582+ font-family: "Raleway", "Open Sans", "Ubuntu", sans-serif;
583+ font-weight: 200;
584+ font-size: 48px;
585+ line-height: 1;
586+ color: #4c4c4c;
587+ padding-bottom: 10px;
588+ margin: 0;
589+ line-height: 1;
590+ text-shadow: 0 0 1px rgba(0, 0, 0, 0.01);
591+ max-width: 600px; }
592+ #post .post-link:hover h1.title {
593+ text-decoration: underline; }
594+ #post strong {
595+ font-weight: bold; }
596+ #post em {
597+ font-style: italic; }
598+ #post table {
599+ max-width: 600px;
600+ width: 100%; }
601+ #post img {
602+ max-width: 100% !important;
603+ box-sizing: border-box;
604+ height: auto !important; }
605+ #post img:not(.no-border), #post iframe {
606+ /* images resize with window */
607+ padding: 4px;
608+ margin: 0 15px 15px auto;
609+ display: table;
610+ background-color: white;
611+ border: none;
612+ border-radius: 2px;
613+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); }
614+ #post p img:not(.no-border), #post p iframe {
615+ margin: 15px auto; }
616+ #post h1 {
617+ font-family: "Open Sans", "Ubuntu", sans-serif;
618+ font-weight: 700;
619+ font-size: 32px;
620+ line-height: 1.5; }
621+ #post h1 strong {
622+ font-weight: inherit; }
623+ #post h2 {
624+ font-family: "Open Sans", "Ubuntu", sans-serif;
625+ font-weight: 200;
626+ font-size: 24px;
627+ line-height: 28px;
628+ text-shadow: 0 0 1px rgba(0, 0, 0, 0.01);
629+ color: #4c4c4c; }
630+ #post h2 strong {
631+ font-weight: inherit; }
632+ #post h3 {
633+ font-size: 18px;
634+ color: #4c4c4c;
635+ text-shadow: 0 0 1px rgba(0, 0, 0, 0.01); }
636+ #post h3 strong {
637+ font-weight: inherit; }
638+ #post a {
639+ color: #08a8c5;
640+ text-decoration: none; }
641+ #post a:not(.post-link):hover {
642+ text-decoration: underline; }
643+ #post a.youtube {
644+ display: block;
645+ position: relative; }
646+ #post a.youtube:after {
647+ content: "";
648+ position: absolute;
649+ display: block;
650+ top: 50%;
651+ bottom: auto;
652+ left: 50%;
653+ right: auto;
654+ width: 77px;
655+ height: 77px;
656+ margin: -37px 0 0 -37px;
657+ z-index: 5;
658+ background: url(../images/youtube.png); }
659+ #post p, #post div, #post img {
660+ max-width: 600px; }
661+ #post a.hasImage {
662+ border-bottom: 0; }
663+ #post hr {
664+ height: 2px;
665+ border: 0;
666+ background: url(../images/hr.png); }
667+ #post blockquote {
668+ font-style: italic; }
669+
670+#modal * {
671+ -webkit-user-select: none; }
672+#modal > div {
673+ position: fixed;
674+ border-radius: 5px;
675+ background: white;
676+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
677+ z-index: 300; }
678+ #modal > div h3 {
679+ margin: 20px 0 10px;
680+ color: #4c4c4c;
681+ padding: 0 25px;
682+ font-size: 24px;
683+ font-weight: 300;
684+ font-family: "Raleway", "Open Sans", "Ubuntu", sans-serif; }
685+ #modal > div p {
686+ font-size: 13px;
687+ color: #4c4c4c;
688+ margin: 0 25px 15px;
689+ line-height: 18px; }
690+ #modal > div input {
691+ width: 250px;
692+ vertical-align: top;
693+ font-size: 13px;
694+ line-height: 20px;
695+ border-radius: 2px 0 0 2px;
696+ height: 20px;
697+ outline: none;
698+ border: 1px solid rgba(0, 0, 0, 0.2);
699+ border-right: 0;
700+ padding: 5px 10px;
701+ background: url(../images/input_bg.png);
702+ box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 0 white;
703+ color: #444444;
704+ margin-left: 25px;
705+ -webkit-user-select: text; }
706+ #modal > div input.isolated {
707+ border-radius: 2px;
708+ border: 1px solid rgba(0, 0, 0, 0.2);
709+ margin-top: 3px;
710+ margin-bottom: 3px; }
711+ #modal > div button {
712+ text-decoration: none;
713+ line-height: 27px;
714+ padding: 0 10px;
715+ height: 32px;
716+ border-radius: 2px;
717+ font-size: 13px;
718+ font-weight: bold;
719+ border: 1px solid #959595;
720+ color: #242424;
721+ font-family: "Open Sans", "Ubuntu Medium", "Ubuntu", "Helvetica", "Arial", sans-serif;
722+ margin: 0 6px 25px;
723+ background: -webkit-linear-gradient(top, white 0%, whitesmoke 100%); }
724+ #modal > div button:focus {
725+ outline: 0;
726+ background: -webkit-linear-gradient(top, white 0%, #f9f9f9 100%);
727+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); }
728+ #modal > div button:hover {
729+ background: -webkit-linear-gradient(top, white 0%, #f9f9f9 100%);
730+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); }
731+ #modal > div button:active {
732+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 1px 3px rgba(0, 0, 0, 0.1);
733+ background: -webkit-linear-gradient(bottom, white 0%, whitesmoke 100%); }
734+#modal .add {
735+ top: 40%;
736+ left: 50%;
737+ margin-top: -52px;
738+ margin-left: -190px;
739+ width: 381px;
740+ display: none; }
741+ #modal .add h3:after {
742+ width: 146px;
743+ background: url(../images/modal_header_text.png); }
744+ #modal .add button {
745+ border-radius: 0 2px 2px 0;
746+ width: 60px;
747+ padding: 0;
748+ margin: 0 25px 25px 0; }
749+ #modal .add .error {
750+ display: none;
751+ margin-top: -15px; }
752+#modal .confirm {
753+ top: 40%;
754+ left: 50%;
755+ margin-top: -52px;
756+ margin-left: -190px;
757+ width: 340px;
758+ text-align: center;
759+ display: none; }
760+ #modal .confirm h3:after {
761+ background: url(../images/text_are_you_sure.png);
762+ width: 100px; }
763+ #modal .confirm .title {
764+ font-weight: bold; }
765+ #modal .confirm button {
766+ width: 90px;
767+ padding: 0; }
768+#modal .rename {
769+ top: 40%;
770+ left: 50%;
771+ margin-top: -52px;
772+ margin-left: -190px;
773+ width: 381px;
774+ display: none; }
775+ #modal .rename h3:after {
776+ background: url(../images/text_rename_feed.png);
777+ width: 98px; }
778+ #modal .rename button {
779+ border-radius: 0 2px 2px 0;
780+ width: 60px;
781+ padding: 0;
782+ margin: 0 25px 25px 0; }
783+#modal .pocket-login, #modal .instapaper-login {
784+ top: 40%;
785+ left: 50%;
786+ margin-top: -52px;
787+ margin-left: -190px;
788+ width: 330px;
789+ display: none; }
790+ #modal .pocket-login button, #modal .instapaper-login button {
791+ margin-left: 25px;
792+ margin-top: 3px;
793+ width: 272px; }
794+
795+#overlay {
796+ position: fixed;
797+ width: 100%;
798+ height: 100%;
799+ z-index: 200;
800+ display: none;
801+ background: rgba(0, 0, 0, 0.3);
802+ top: 0;
803+ left: 0; }
804+
805+#loading {
806+ position: absolute;
807+ display: block;
808+ top: 0;
809+ bottom: 0;
810+ left: 0;
811+ right: 0;
812+ background: white;
813+ z-index: 100; }
814+ #loading * {
815+ -webkit-user-select: none; }
816+ #loading .login {
817+ position: absolute;
818+ display: block;
819+ top: 50%;
820+ bottom: auto;
821+ left: 50%;
822+ right: auto;
823+ width: 300px;
824+ margin-top: -200px;
825+ margin-left: -150px;
826+ height: 200px;
827+ text-align: center;
828+ display: none; }
829+ #loading .login h3 {
830+ text-align: center;
831+ color: #4c4c4c;
832+ text-shadow: 0 1px 0 white;
833+ font-weight: 300;
834+ font-family: "Raleway", "Open Sans", "Ubuntu", sans-serif;
835+ font-size: 22px; }
836+ #loading .login .password-wrapper,
837+ #loading .login .username-wrapper {
838+ font-size: 13px;
839+ line-height: 20px;
840+ border-radius: 2px;
841+ height: 20px;
842+ outline: none;
843+ border: 1px solid rgba(0, 0, 0, 0.2);
844+ padding: 5px 0 5px 10px;
845+ width: 290px;
846+ background: url(../images/input_bg.png);
847+ box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 0 white;
848+ margin: 10px 0; }
849+ #loading .login .password-wrapper label,
850+ #loading .login .username-wrapper label {
851+ text-align: left;
852+ display: inline-block;
853+ width: 80px;
854+ color: #333333;
855+ font-weight: 500; }
856+ #loading .login .password-wrapper input,
857+ #loading .login .username-wrapper input {
858+ color: #444444;
859+ outline: none;
860+ border: none;
861+ background: transparent;
862+ width: 200px;
863+ padding: 0;
864+ margin: 0;
865+ -webkit-user-select: text; }
866+ #loading .login .password-wrapper input[type=password],
867+ #loading .login .username-wrapper input[type=password] {
868+ font: small-caption;
869+ font-size: 16px; }
870+ #loading .login a {
871+ display: inline-block;
872+ text-decoration: none;
873+ line-height: 27px;
874+ padding: 0;
875+ margin: 0 5px;
876+ width: 100px;
877+ height: 30px;
878+ box-sizing: border-box;
879+ border-radius: 3px;
880+ font-size: 13px;
881+ font-weight: bold;
882+ font-family: "Open Sans", "Ubuntu Medium", "Ubuntu", "Helvetica", "Arial", sans-serif;
883+ border: 1px solid #959595;
884+ color: #242424;
885+ cursor: pointer;
886+ background: -webkit-linear-gradient(top, white 0%, whitesmoke 100%); }
887+ #loading .login a:focus {
888+ outline: 0;
889+ background: -webkit-linear-gradient(top, white 0%, #f9f9f9 100%);
890+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); }
891+ #loading .login a:hover {
892+ background: -webkit-linear-gradient(top, white 0%, #f9f9f9 100%);
893+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); }
894+ #loading .login a:active {
895+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 1px 3px rgba(0, 0, 0, 0.1);
896+ background: -webkit-linear-gradient(bottom, white 0%, whitesmoke 100%); }
897+ #loading .login .error {
898+ display: none;
899+ font-size: 13px;
900+ font-weight: 500;
901+ color: #2a76c6;
902+ text-shadow: 0 1px 0 white, 0 1px 2px rgba(0, 0, 0, 0.1); }
903+ #loading .progress {
904+ position: absolute;
905+ display: block;
906+ top: 50%;
907+ bottom: auto;
908+ left: 25%;
909+ right: 25%;
910+ margin-top: -40px;
911+ display: none; }
912+ #loading .progress p {
913+ text-align: center;
914+ font-size: 13px;
915+ color: #444444; }
916+ #loading .progress progress {
917+ width: 100%;
918+ -webkit-appearance: none;
919+ background-size: auto;
920+ height: 18px;
921+ border-radius: 3px;
922+ box-shadow: 0 1px 0 white, inset 0 1px 5px rgba(0, 0, 0, 0.2); }
923+ #loading .progress progress::-webkit-progress-bar {
924+ background: #ffeeee;
925+ border-radius: 3px; }
926+ #loading .progress progress::-webkit-progress-value {
927+ background: url(../images/ugly_native_progress_bar.png) 0 0;
928+ border-radius: 3px;
929+ box-shadow: 1px 0 3px rgba(0, 0, 0, 0.1);
930+ border-left: 1px solid #bf5527;
931+ border-right: 1px solid #bf5527; }
932+
933+@-webkit-keyframes move {
934+ 0% {
935+ background-position: 0 -21px; }
936+
937+ 100% {
938+ background-position: 30px -21px; } }
939+
940+#context-menu {
941+ -webkit-user-select: none;
942+ min-width: 150px;
943+ background: white;
944+ position: absolute;
945+ display: block;
946+ top: 10px;
947+ bottom: auto;
948+ left: 10px;
949+ right: auto;
950+ z-index: 100;
951+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
952+ border: 1px solid white;
953+ outline: 1px solid #ada9a5;
954+ padding: 3px 0;
955+ display: none; }
956+ #context-menu .section {
957+ display: block;
958+ background: white;
959+ border-top: 1px solid #e1e1df;
960+ height: 1px;
961+ margin: 3px 0; }
962+ #context-menu div {
963+ height: 20px;
964+ line-height: 20px;
965+ font-size: 12px;
966+ padding: 0 0 0 24px;
967+ font-weight: 400;
968+ cursor: default;
969+ position: relative;
970+ border-top: 1px solid transparent;
971+ border-bottom: 1px solid transparent; }
972+ #context-menu div:hover {
973+ color: white;
974+ border-top: 1px solid #5296de;
975+ border-bottom: 1px solid #377fc9;
976+ background: -webkit-linear-gradient(top, #74b0ee 0%, #4c91da 100%);
977+ box-shadow: 0 1px 0 #91c1f3 inset, 0 -1px 0 #5b9adc inset;
978+ text-shadow: 0 1px 0 #4c4c4c; }
979+
980+#settings {
981+ position: absolute;
982+ display: block;
983+ top: 0;
984+ bottom: auto;
985+ left: 50%;
986+ right: auto;
987+ margin: 0 0 0 -260px;
988+ width: 520px;
989+ height: 100%;
990+ overflow-y: scroll;
991+ background: #ececec;
992+ border: 1px solid #888888;
993+ border-top: 0;
994+ border-bottom: 0;
995+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
996+ z-index: 300;
997+ display: none; }
998+ #settings h2 {
999+ margin-top: 0;
1000+ text-align: center;
1001+ font-size: 15px;
1002+ height: 40px;
1003+ line-height: 40px;
1004+ border-bottom: 1px solid rgba(0, 0, 0, 0.2);
1005+ box-shadow: 0 1px 0 white;
1006+ border-radius: 5px 5px 0 0;
1007+ background: -webkit-linear-gradient(top, #fafafa 0%, #f6f6f6 100%);
1008+ color: #3b3b3b;
1009+ text-shadow: 0 1px 0 #fcfcfc; }
1010+ #settings h3 {
1011+ margin: 20px 0 10px;
1012+ color: #4c4c4c;
1013+ padding: 0 25px;
1014+ font-size: 24px;
1015+ font-weight: 300;
1016+ font-family: "Raleway", "Open Sans", "Ubuntu", sans-serif; }
1017+ #settings > div {
1018+ padding: 10px 25px; }
1019+ #settings > div:first-of-type {
1020+ padding-top: 0; }
1021+ #settings > div:not(:last-child) {
1022+ border-bottom: 1px solid #cccccc;
1023+ box-shadow: 0 1px 0 white; }
1024+ #settings select {
1025+ font-size: 13px;
1026+ margin-bottom: 10px;
1027+ padding: 5px; }
1028+ #settings select option {
1029+ font-size: 13px; }
1030+ #settings label {
1031+ font-size: 13px;
1032+ color: #4c4c4c;
1033+ display: inline-block; }
1034+ #settings label.mini {
1035+ width: 150px;
1036+ text-align: right;
1037+ margin-right: 10px; }
1038+ #settings label.mini.right {
1039+ width: 120px; }
1040+ #settings label .email {
1041+ font-weight: bold; }
1042+ #settings input[type=checkbox] {
1043+ margin-left: 165px;
1044+ margin-right: 10px; }
1045+ #settings button {
1046+ display: inline-block;
1047+ text-decoration: none;
1048+ line-height: 27px;
1049+ padding: 0 10px;
1050+ margin: 0 5px 0 79px;
1051+ height: 30px;
1052+ box-sizing: border-box;
1053+ border-radius: 3px;
1054+ font-size: 13px;
1055+ font-weight: bold;
1056+ border: 1px solid #959595;
1057+ color: #4c4c4c;
1058+ font-family: "Open Sans", "Ubuntu Medium", "Ubuntu", "Helvetica", "Arial", sans-serif;
1059+ background: -webkit-linear-gradient(top, white 0%, whitesmoke 100%); }
1060+ #settings button:focus {
1061+ outline: 0;
1062+ background: -webkit-linear-gradient(top, white 0%, #f9f9f9 100%);
1063+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); }
1064+ #settings button:hover {
1065+ background: -webkit-linear-gradient(top, white 0%, #f9f9f9 100%);
1066+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); }
1067+ #settings button:active {
1068+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 1px 3px rgba(0, 0, 0, 0.1);
1069+ background: -webkit-linear-gradient(bottom, white 0%, whitesmoke 100%); }
1070\ No newline at end of file
1071
1072=== added file 'data/media/app/index_elementary.html'
1073--- data/media/app/index_elementary.html 1970-01-01 00:00:00 +0000
1074+++ data/media/app/index_elementary.html 2013-02-27 22:46:21 +0000
1075@@ -0,0 +1,300 @@
1076+<!DOCTYPE html>
1077+<html>
1078+<head>
1079+ <title>RSS Reader</title>
1080+ <link rel="stylesheet" href="css/normalize.css">
1081+ <link rel="stylesheet" href="css/style_elementary.css">
1082+
1083+ <script src="scripts/lib/pyctrl.js"></script>
1084+ <script src="scripts/lib.js"></script>
1085+ <script src="scripts/app.js"></script>
1086+ <script src="scripts/app/storage.js"></script>
1087+ <script src="scripts/app/ui.js"></script>
1088+ <script src="scripts/app/core.js"></script>
1089+ <script src="scripts/app/keys.js"></script>
1090+</head>
1091+<body>
1092+
1093+ <section id="app" class="splitter">
1094+
1095+ <div id="feeds-column">
1096+ <ul id="filters">
1097+ <li class="all filter selected">
1098+ <img class="icon" width="16" height="16" src="images/icon_all.png">
1099+ <span class="title">All items</span>
1100+ </li>
1101+ <li class="unread filter">
1102+ <img class="icon" width="16" height="16" src="images/icon_unread.png">
1103+ <span class="title">Unread</span>
1104+ </li>
1105+ <li class="starred filter">
1106+ <img class="icon" width="16" height="16" src="images/icon_starred.png">
1107+ <span class="title">Starred</span>
1108+ </li>
1109+ </ul>
1110+ <ul id="feeds"></ul>
1111+ <p class="empty-message">You have no feeds. Click on the + button below to add some.</p>
1112+ <div class="bar">
1113+ <button id="refresh-button" title="Refresh"></button><button id="add-button" title="Add Feed"></button>
1114+ </div>
1115+ </div>
1116+
1117+ <div id="right-side" class="splitter">
1118+
1119+ <div id="articles-column">
1120+ <ul id="articles"></ul>
1121+ <div class="bar">
1122+ <button id="mark-all-as-read-trigger" title="Mark All As Read"></button>
1123+ <div id="mark-all-as-read-popup">
1124+ <div id="mark-all-as-read-button">Mark All As Read</div>
1125+ </div>
1126+ <div id="item-count"></div>
1127+ <input id="search-input" placeholder="Search 10 items">
1128+ <button id="search-button" title="Search"></button>
1129+ </div>
1130+ </div>
1131+
1132+ <div id="post-column">
1133+ <div id="post-window">
1134+ <div id="post"></div>
1135+ </div>
1136+ <div class="bar" class="disabled">
1137+ <button id="close-post-button" title="Close Post"></button>
1138+ <button id="star-button" title="Toggle Star Status"></button>
1139+ <button id="read-button" title="Toggle Read Status"></button>
1140+ <button id="instapaper-button" title="View in Instapaper Mobilizer"></button>
1141+ <button id="share-button" title="Share">
1142+ <!-- <select>
1143+ <option value="0">Share to Pocket</option>
1144+ <option value="1">Share to Instapaper</option>
1145+ </select> -->
1146+ </button>
1147+ <div id="link-url"></div><button id="settings-button" title="Settings"></button>
1148+ </div>
1149+ </div>
1150+
1151+ </div>
1152+
1153+ </section>
1154+
1155+ <div id="hidden"></div>
1156+
1157+ <div id="modal">
1158+ <div class="add">
1159+ <span class="close"></span><h3>Subscribe to a Feed</h3>
1160+ <input placeholder="Feed URL or Search Term" type="url"><button>Add</button>
1161+ <p class="error">Could not add feed...</p>
1162+ </div>
1163+ <!-- <div class="logout">
1164+ This will log you out of Lightread
1165+ <button id="reset-button">Logout</button>
1166+ </div> -->
1167+ <div class="confirm">
1168+ <span class="close"></span><h3>Are you sure?</h3>
1169+ <p>Are you sure you want to unsubscribe from: <br><span class="title"></span>?</p><button class="yes">Yes</button><button class="no">No</button>
1170+ </div>
1171+ <div class="rename">
1172+ <span class="close"></span><h3>Rename Feed</h3>
1173+ <input type="text" placeholder="Feed name..."><button>Save</button>
1174+ </div>
1175+ <div class="pocket-login">
1176+ <span class="close"></span><h3>Login to Pocket</h3>
1177+ <input class="isolated" type="text" placeholder="Username...">
1178+ <br>
1179+ <input class="isolated" type="password" placeholder="Password...">
1180+ <br>
1181+ <button>Login</button>
1182+ </div>
1183+ <div class="instapaper-login">
1184+ <span class="close"></span><h3>Login to Instapaper</h3>
1185+ <input class="isolated" type="text" placeholder="Username...">
1186+ <br>
1187+ <input class="isolated" type="password" placeholder="Password...">
1188+ <br>
1189+ <button>Login</button>
1190+ </div>
1191+ </div>
1192+ <div id="settings">
1193+ <h3>Settings</h3>
1194+ <div>
1195+ <label for="">Signed in as: <span class="email"></span></label><button id="reset-button">Sign out</button>
1196+ </div>
1197+ <div>
1198+ <label class="mini" for="sync-interval">Refresh:</label>
1199+ <select id="sync-interval">
1200+ <option value="0">Manual</option>
1201+ <option value="1">1 Minute</option>
1202+ <option value="5">5 Minutes</option>
1203+ <option value="15">15 Minutes</option>
1204+ <option value="30">30 Minutes</option>
1205+ <option value="60">1 Hour</option>
1206+ </select>
1207+ <br>
1208+ <input type="checkbox" checked id="sync-on-start"><label for="sync-on-start">Sync on start</label>
1209+ </div>
1210+ <div>
1211+ <label class="mini" for="keep-unread-items">Keep unread items:</label>
1212+ <select id="keep-unread-items">
1213+ <option value="-1" selected>Always</option>
1214+ <option value="0">Never</option>
1215+ <option value="1">1 day</option>
1216+ <option value="2">2 days</option>
1217+ <option value="3">3 days</option>
1218+ <option value="7">1 week</option>
1219+ <option value="14">2 weeks</option>
1220+ <option value="31">1 month</option>
1221+ </select>
1222+ <label class="mini right" for="max-special">Max special items:</label>
1223+ <select id="max-special">
1224+ <option value="10">10</option>
1225+ <option value="20">20</option>
1226+ <option value="30">30</option>
1227+ <option value="50" selected>50</option>
1228+ <option value="70">70</option>
1229+ <option value="100">100</option>
1230+ <option value="150">150</option>
1231+ <option value="200">200</option>
1232+ <option value="300">300</option>
1233+ <option value="400">400</option>
1234+ <option value="500">500</option>
1235+ </select>
1236+ <br>
1237+ <label class="mini" for="keep-starred-items">Keep starred items:</label>
1238+ <select id="keep-starred-items">
1239+ <option value="-1" selected>Always</option>
1240+ <option value="0">Never</option>
1241+ <option value="1">1 day</option>
1242+ <option value="2">2 days</option>
1243+ <option value="3">3 days</option>
1244+ <option value="7">1 week</option>
1245+ <option value="14">2 weeks</option>
1246+ <option value="31">1 month</option>
1247+ </select>
1248+ <label class="mini right" for="max-read">Max read items:</label>
1249+ <select id="max-read">
1250+ <option value="0">None</option>
1251+ <option value="10">10</option>
1252+ <option value="20" selected>20</option>
1253+ <option value="30">30</option>
1254+ <option value="50">50</option>
1255+ <option value="70">70</option>
1256+ <option value="100">100</option>
1257+ </select>
1258+ <br>
1259+ <label class="mini" for="keep-read-items">Keep read items:</label>
1260+ <select id="keep-read-items">
1261+ <option value="-1">Always</option>
1262+ <option value="0">Never</option>
1263+ <option value="1">1 day</option>
1264+ <option value="2">2 days</option>
1265+ <option value="3">3 days</option>
1266+ <option value="7">1 week</option>
1267+ <option value="14" selected>2 weeks</option>
1268+ <option value="31">1 month</option>
1269+ </select>
1270+ </div>
1271+ <div>
1272+ <input type="checkbox" id="show-notifications" checked><label for="show-notifications">Show notifications</label>
1273+ <input type="checkbox" id="auto-instapaperizer"><label for="auto-instapaperizer">Auto Instapaper</label>
1274+ <input type="checkbox" id="night-mode"><label for="night-mode">Night Mode</label><br>
1275+ <input type="checkbox" id="remember-last-feed" checked><label for="remember-last-feed">Remember Last Feed</label>
1276+ <input type="checkbox" id="show-indicators"><label for="show-indicators">Show in messaging menu</label>
1277+ <input type="checkbox" id="run-background" disabled><label for="show-indicators">Run in background</label>
1278+ </div>
1279+ </div>
1280+
1281+ <div id="overlay"></div>
1282+
1283+ <div id="loading">
1284+ <div class="login">
1285+ <h3>Sign in to Google Reader</h3>
1286+ <div class="username-wrapper">
1287+ <label for="username">Email</label><input tabindex="1" id="username" type="text" placeholder="example@gmail.com">
1288+ </div>
1289+ <div class="password-wrapper">
1290+ <label for="password">Password</label><input tabindex="2" id="password" type="password" placeholder="&#183;&#183;&#183;&#183;&#183;&#183;&#183;&#183;">
1291+ </div>
1292+ <a class="login-button">Sign in</a>
1293+ <a href="https://accounts.google.com/NewAccount?service=reader">Register</a>
1294+ <p class="error">Could not Sign in...</p>
1295+ </div>
1296+ <div class="progress">
1297+ <p>Downloading items...</p>
1298+ <progress min="0" value="0" max="100"></progress>
1299+ </div>
1300+ </div>
1301+
1302+ <div id="context-menu"></div>
1303+
1304+ <!--
1305+ Templates
1306+ -->
1307+
1308+ <!-- Labels -->
1309+ <script type="text/template" id="label-template">
1310+ <li class="label">
1311+ <header data-id="<%= id %>">
1312+ <span class="icon"><span class="bit"></span></span>
1313+ <span class="title"><%= title %></span>
1314+ <% if (count && count > 0) { %>
1315+ <span class="count"><%= count %></span>
1316+ <% } %>
1317+ </header>
1318+ <ul class="feeds">
1319+
1320+ <% _.each(feeds, function(feed) { %><%= feed %><% }) %>
1321+
1322+ </ul>
1323+ </li>
1324+ </script>
1325+
1326+ <!-- Feeds -->
1327+ <script type="text/template" id="feed-template">
1328+ <li class="feed" data-id="<%= id %>">
1329+ <img class="icon" width="16" height="16" src="<%= icon %>">
1330+ <span class="title"><%= title %></span>
1331+ <% if (count && count > 0) { %>
1332+ <span class="count"><%= count %></span>
1333+ <% } %>
1334+ </li>
1335+ </script>
1336+
1337+ <!-- Articles -->
1338+ <script type="text/template" id="article-template">
1339+ <li class="article <% if (read) { %>read<% } %> <% if (starred) { %>starred<% } %>" data-id="<%= id %>">
1340+ <header>
1341+ <img class="icon" width="16" height="16" src="<%= icon %>">
1342+ <span class="feed"><%= feed %></span>
1343+ <span class="time"><%= time %></span>
1344+ </header>
1345+ <span class="title"><%= title %></span>
1346+ <span class="snippet"><%= snippet %></span>
1347+ </li>
1348+ </script>
1349+
1350+ <script type="text/template" id="article-splitter-template">
1351+ <div class="splitter"><%= date %></div>
1352+ </script>
1353+
1354+ <!-- Post -->
1355+ <script type="text/template" id="post-template">
1356+ <a href="<%= link %>" class="post-link">
1357+ <span class="details">
1358+ <%= feed %> |
1359+ <% if (author !== undefined) {%><%= author %> | <% } %>
1360+ <%= time %>
1361+ </span>
1362+ <h1 class="title"><%= title %></h1>
1363+ </a>
1364+ <%= content %>
1365+ </script>
1366+
1367+ <!-- Context Menu Item -->
1368+ <script type="text/template" id="context-menu-item">
1369+ <div class="<%= className %>"><%= text %></div>
1370+ <% if (section) { %>
1371+ <span class="section"></span>
1372+ <% } %>
1373+ </script>
1374+</body>
1375+</html>
1376
1377=== modified file 'debian/control'
1378--- debian/control 2012-10-03 03:35:42 +0000
1379+++ debian/control 2013-02-27 22:46:21 +0000
1380@@ -17,6 +17,7 @@
1381 gir1.2-indicate-0.7,
1382 gir1.2-gtk-3.0,
1383 gir1.2-glib-2.0,
1384+ gir1.2-granite-1.0,
1385 gir1.2-dbusmenu-glib-0.4,
1386 gir1.2-unity-5.0,
1387 gir1.2-soup-2.4,
1388
1389=== modified file 'lightread/LightreadWindow.py'
1390--- lightread/LightreadWindow.py 2012-10-05 07:58:49 +0000
1391+++ lightread/LightreadWindow.py 2013-02-27 22:46:21 +0000
1392@@ -96,6 +96,18 @@
1393 session.add_feature(cookie_jar)
1394 session.props.max_conns_per_host = 8
1395
1396+ # elementary OS HIG support
1397+ #getting env-var and try importing granite
1398+ #if one fails, we dont use elementary ui
1399+ self.elementary_ui = False
1400+ if(os.environ["DESKTOP_SESSION"] == "pantheon"):
1401+ try:
1402+ from gi.repository import Granite
1403+ self.elementary_ui = True
1404+ print "We use the elementary ui"
1405+ except ImportError:
1406+ pass
1407+
1408
1409 self.webview = WebKit.WebView()
1410 self.scroller.add(self.webview)
1411@@ -104,7 +116,10 @@
1412 self.webviewsettings.set_property("javascript-can-open-windows-automatically", True)
1413 self.webviewsettings.set_property("enable-universal-access-from-file-uris", True)
1414 self.webviewsettings.set_property("enable-developer-extras", True)
1415- self.webview.load_uri(get_media_file('app/index.html'))
1416+ if(self.elementary_ui):
1417+ self.webview.load_uri(get_media_file('app/index_elementary.html'))
1418+ else:
1419+ self.webview.load_uri(get_media_file('app/index.html'))
1420
1421 self.webview_inspector = self.webview.get_inspector()
1422 self.webview_inspector.connect('inspect-web-view', self.inspect_webview)
1423@@ -113,7 +128,7 @@
1424 self.webview.show()
1425
1426 #Menubar
1427- self.add = self.builder.get_object("add")
1428+ self.add_btn = self.builder.get_object("add")
1429 self.refresh = self.builder.get_object("refresh")
1430 self.star = self.builder.get_object("star")
1431 self.read = self.builder.get_object("read")
1432@@ -225,12 +240,84 @@
1433 else:
1434 self.indicator.remove_indicator(urllib.unquote(feed_json['id']))
1435
1436+
1437+ #building the elementary UI
1438+ if(self.elementary_ui):
1439+ vbox1 = self.builder.get_object("vbox1")
1440+ menubar1 = self.builder.get_object("menubar1")
1441+ #no menubars
1442+ vbox1.remove(menubar1)
1443+ toolbar = Gtk.Toolbar()
1444+
1445+ #add toolbarbuttons
1446+ button_add = Gtk.ToolButton.new_from_stock(Gtk.STOCK_NEW)
1447+ toolbar.add(button_add)
1448+ button_add.set_name("add")
1449+ button_add.set_tooltip_text(self.add_btn.get_label())
1450+ button_add.connect("clicked", menuexternal, None)
1451+
1452+ button_refresh = Gtk.ToolButton.new_from_stock(Gtk.STOCK_REFRESH)
1453+ toolbar.add(button_refresh)
1454+ button_refresh.set_name("refresh")
1455+ button_refresh.set_tooltip_text(self.refresh.get_label())
1456+ button_refresh.connect("clicked", menuexternal, None)
1457+
1458+ button_star = Gtk.ToolButton.new_from_stock(Gtk.STOCK_ABOUT)
1459+ toolbar.add(button_star)
1460+ button_star.set_name("star")
1461+ button_star.set_tooltip_text(self.star.get_label())
1462+ button_star.connect("clicked", menuexternal, None)
1463+
1464+ button_read = Gtk.ToolButton.new_from_stock(Gtk.STOCK_COPY)
1465+ toolbar.add(button_read)
1466+ button_read.set_name("read")
1467+ button_read.set_tooltip_text(self.read.get_label())
1468+ button_read.connect("clicked", menuexternal, None)
1469+
1470+
1471+ button_next = Gtk.ToolButton.new_from_stock(Gtk.STOCK_GO_DOWN)
1472+ toolbar.add(button_next)
1473+ button_next.set_name("next-article")
1474+ button_next.set_tooltip_text(self.next_article.get_label())
1475+ button_next.connect("clicked", menuexternal, None)
1476+
1477+ button_previous = Gtk.ToolButton.new_from_stock(Gtk.STOCK_GO_UP)
1478+ toolbar.add(button_previous)
1479+ button_previous.set_name("prev-article")
1480+ button_previous.set_tooltip_text(self.prev_article.get_label())
1481+ button_previous.connect("clicked", menuexternal, None)
1482+
1483+ #spanner that the appmenu is on the right side
1484+ spanner = Gtk.ToolItem()
1485+ spanner.set_expand(True)
1486+ toolbar.add(spanner)
1487+
1488+ appmenu = Gtk.Menu()
1489+ #add the settings menu
1490+ self.logout.unparent()
1491+ appmenu.append(self.logout)
1492+ #add the contents of the helpmenu to the appmenu
1493+ help_menu = self.builder.get_object("helpMenu")
1494+ for i in help_menu.get_children():
1495+ i.unparent()
1496+ help_menu.remove(i)
1497+ appmenu.add(i)
1498+
1499+ button_appmenu = Granite.WidgetsAppMenu.new(appmenu)
1500+ toolbar.add(button_appmenu)
1501+
1502+
1503+ vbox1.pack_start(toolbar,False,False,0)
1504+ vbox1.remove(self.scroller)
1505+ vbox1.pack_end(self.scroller,True,True,0)
1506+ toolbar.show_all()
1507+
1508 # Connects to WebView
1509 self.webview.connect('title-changed', title_changed)
1510 self.webview.connect('navigation-requested', _navigation_requested_cb)
1511 self.webview.connect('console-message', console_message_cb)
1512
1513- self.add.connect("activate", menuexternal, None)
1514+ self.add_btn.connect("activate", menuexternal, None)
1515 self.refresh.connect("activate", menuexternal, None)
1516 self.star.connect("activate", menuexternal, None)
1517 self.read.connect("activate", menuexternal, None)
1518
1519=== modified file 'po/lightread.pot'
1520--- po/lightread.pot 2012-10-05 07:58:49 +0000
1521+++ po/lightread.pot 2013-02-27 22:46:21 +0000
1522@@ -8,7 +8,7 @@
1523 msgstr ""
1524 "Project-Id-Version: PACKAGE VERSION\n"
1525 "Report-Msgid-Bugs-To: \n"
1526-"POT-Creation-Date: 2012-10-05 20:57+1300\n"
1527+"POT-Creation-Date: 2013-02-18 12:27+0100\n"
1528 "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
1529 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
1530 "Language-Team: LANGUAGE <LL@li.org>\n"

Subscribers

People subscribed via source and target branches

to all changes: