[Theme][Github] Reeder Theme
- sleeper_service
- Bear Rating Overlord
- Posts: 884
- Joined: 30 Mar 2013, 23:50
- Location: Dallas, Texas
Re: Reeder Theme
props for hosting it on github so all I have to do is a git pull to update.
Re: Reeder Theme
I agree git is just awesome. The best versioning system out there.
I've just updated my first post with new screenshots. Some minor bugfixes and changes were made. in particular smaller font sizes, hover markup and better widescreen support.
Cheers
I've just updated my first post with new screenshots. Some minor bugfixes and changes were made. in particular smaller font sizes, hover markup and better widescreen support.
Cheers
Re: Reeder Theme
Hi, how to make alignment of images and videos in the middle
Re: Reeder Theme
very nice theme!!! thanks for your amazing work!
Re: Reeder Theme
@poster000
I'm not sure if thats a good idea. Depending on the feed, the outcome will not always be pleasant.
To align images you can add the following code into your reeder.css just before /* Replace images */. It will center the images.
@gitawego
thanks very much, glad you like it.
I'm not sure if thats a good idea. Depending on the feed, the outcome will not always be pleasant.
To align images you can add the following code into your reeder.css just before /* Replace images */. It will center the images.
Code: Select all
/* Align images */
div.postContent img,
div.cdmContent img {
display: block;
margin-left: auto;
margin-right: auto;
}
@gitawego
thanks very much, glad you like it.
-
- Bear Rating Trainee
- Posts: 1
- Joined: 06 Jun 2013, 18:48
Re: Reeder Theme
Awesome theme, but I'm partial to a white background so I hacked it up some. Hope you don't mind. Adding it here just in case anyone else was turned off by the color scheme.

edit: Fixed non-combined mode

Code: Select all
/*
Tiny Tiny RSS Reeder Theme
Author: zas
Email: [email protected]
*/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,700italic,800italic,400,600,700,800);
@import "default.css";
/************************************************************
* Global Settings
*/
{
font-family: 'Open Sans',sans-serif !important;
}
/*body,*/
div.hl.Content {
font-size: 16px !important;
}
div.cdmContentInner p {
max-width: 100% !important;
}
div.cdm.expanded div.cdmHeader a.title,
div.cdm.active div.cdmHeader a.title,
div.postTitle a{
color: #000000;
font-size: 18px !important;
}
span.hlContent {
font-size: 12px !important;
margin-right: -20px;
}
/************************************************************
* Sidebar
.dijitTree {
background-image: url(reeder_img/reeder_stripes.png);
color: #aba99d;
}
*/
#ttrssMain .dijitTreeExpando {
background-image: url(reeder_img/tree-expand.png);
position: relative;
left: +10px;
}
#ttrssMain .dijitTreeExpandoLeaf {
background-image: none;
}
#ttrssMain .dijitIconFolderOpen,
#ttrssMain .dijitFolderOpened {
background: none;
}
#ttrssMain .dijitIconFolderClosed,
#ttrssMain .dijitFolderClosed {
background: none;
}
#ttrssMain .dijitTreeRow,
#ttrssMain .dijitTreeNode .dojoDndItemBefore,
#ttrssMain .dijitTreeNode .dojoDndItemAfter {
display: block;
font-size: 12px;
line-height: 20px;
border: none;
}
#ttrssMain .dijitTreeRowHover,
#ttrssMain .dijitTreeNode .dojoDndItemBeforeHover,
#ttrssMain .dijitTreeNode .dojoDndItemAfterHover {
background-image: url(reeder_img/reeder_stripes.png);
color: #4f4e48;
}
#ttrssMain .dijitTreeRowSelected {
color: #4f4e48;
}
#ttrssMain .dijitTreeLabel {
vertical-align: text-top;
margin: 0 8px;
}
#ttrssMain .dijitTreeIsRoot > .dijitTreeRow {
border-top: 1px solid #bebcb0 !important;
color: #4f4e48;
display: block;
font-size: 14px;
padding-top: 4px !important;
padding-bottom: 4px !important;
}
#ttrssMain .dijitTreeIsRoot > .dijitTreeRowHover {
background-image: url(reeder_img/reeder_stripes.png);
color: #4f4e48;
}
#ttrssMain .dijitSplitterV,
#ttrssMain .dijitGutterV {
}
#ttrssMain .dijitSplitterVHover {
background: #759dc0;
}
#ttrssMain .dijitToolbar {
color: #4f4e48;
border: none;
padding: 6px 0 2px 4px;
}
div#headlines-toolbar,
{
background-image: url(reeder_img/reeder_bg_bright.png);
border-bottom: 1px solid #bebcb0 !important;
}
#ttrssMain div#headlines-wrap-inner,
div#headlines-frame {
}
#ttrssMain div#headlines-toolbar a,
#ttrssMain .dijitToolbar a {
color: #5a6e93 !important;
}
#ttrssMain div#headlines-toolbar a:hover,
#ttrssMain .dijitToolbar a:hover {
color: #404b5e !important;
}
#trssMain div#main-toolbar {
position: fixed;
top: 0;
left: 0;
bottom: 0;
width: 30px;
text-align: left;
}
.r {
position: relative;
right: -999px;
width:0;
}
#ttrssMain .dijitToolbar .dijitToggleButton,
#ttrssMain .dijitToolbar .dijitButton,
#ttrssMain .dijitToolbar .dijitDropDownButton,
#ttrssMain .dijitToolbar .dijitComboButton {
vertical-align: top;
}
#ttrssMain .dijitToolbar .actionChooser .dijitToggleButton,
#ttrssMain .dijitToolbar .actionChooser .dijitButton,
#ttrssMain .dijitToolbar .actionChooser .dijitDropDownButton,
#ttrssMain .dijitToolbar .actionChooser .dijitComboButton {
vertical-align: middle;
}
#ttrssMain .dijitButton .dijitButtonNode,
#ttrssMain .dijitDropDownButton .dijitButtonNode,
#ttrssMain .dijitComboButton .dijitButtonNode,
#ttrssMain .dijitToggleButton .dijitButtonNode,
#ttrssMain .dijitSelect,
#ttrssMain .dijitSelect .dijitButtonContents,
#ttrssMain .dijitTextBox,
#ttrssMain .dijitTextBox .dijitButtonNode {
border-radius: 3px !important;
padding: 3px 6px !important;
}
#ttrssMain .dijitButtonHover .dijitButtonNode,
#ttrssMain .dijitDropDownButtonHover .dijitButtonNode,
#ttrssMain .dijitToggleButtonHover .dijitButtonNode,
#ttrssMain .dijitComboButtonHover .dijitButtonNode {
border: 0 !important;
border-color: #bebcb0;
border-radius: 3px !important;
background: #bebcb0 !important;
}
#ttrssMain .dijitSelect,
#ttrssMain .dijitSelect .dijitButtonContents,
#ttrssMain .dijitTextBox,
#ttrssMain .dijitTextBox .dijitButtonNode {
padding: 1px 6px !important;
}
#ttrssMain .dijitSelect .dijitArrowButton {
background: none !important;
border: 0 !important;
padding: 0 !important;
}
#ttrssMain .dijitSelectHover .dijitArrowButton {
background: #aba99d !important;
border: 0 !important;
}
#ttrssMain .dijitSelect .dijitArrowButtonInner,
#ttrssMain .dijitComboBox .dijitArrowButtonInner,
#ttrssMain .dijitArrowButtonInner {
background: url(reeder_img/triangle_full_down.png) 50% 10%;
}
#ttrssMain .dijitSelectHover .dijitArrowButtonInner,
#ttrssMain .dijitComboBoxHover .dijitArrowButtonInner,
#ttrssMain .dijitArrowButtonInner {
background-position: 50% 50% !important;
}
#ttrssMain .dijitMenu {
border: 1px;
border-color: #bebcb0;
}
#ttrssMain .dijitMenu td.dijitMenuItemLabel {
font-size: 14px !important;
}
#ttrssMain .dijitSelectMenu .dijitMenuItemHover td,
#ttrssMain .dijitSelectMenu .dijitMenuItemSelected td,
#ttrssMain .dijitMenuItemHover,
#ttrssMain .dijitMenuItemSelected {
background-image: none !important;
}
#ttrssMain .dijitSelectMenu .dijitMenuItemHover td td.dijitMenuItemLabel,
#ttrssMain .dijitSelectMenu .dijitMenuItemSelected td td.dijitMenuItemLabel,
#ttrssMain .dijitMenuItemHover td.dijitMenuItemLabel,
#ttrssMain .dijitMenuItemSelected td.dijitMenuItemLabel {
color: #fafafa;
}
#ttrssMain .dijitSelectMenu .dijitMenuItem td,
#ttrssMain .dijitComboBoxMenu .dijitMenuItem {
border: 0 !important;
padding: 5px 6px !important;
}
#feedTree .counterNode,
#feedTree .counterNode.aux {
background-color: #f5f5f5;
color: #4f4e48;
border-color: #bebcb0;
border: 1;
line-height: 16px;
padding: 0 8px;
top: 3px;
min-width: 0;
border-radius: 3px;
}
#feeds-holder,
#content-wrap {
border-width: 0;
}
/****************************************************************************
* Groups
*/
div.cdmFeedTitle {
background: #e9e6d7;
background-image: url(reeder_img/reeder_bg_bright.png);
}
/****************************************************************************
* Posts
*/
div.cdm.expandable.Selected.active a,
div.cdm.expanded a,
div.hl.active.Selected a,
div.postReply a {
text-shadow: none !important;
}
div.cdm.expandable.Selected.active a:hover,
div.cdm.active a:hover,
div.cdm.expanded a:hover,
div.hl.active.Selected a:hover,
div.postReply a:hover {
color: #404b5e !important;
}
div.cdm.expandable,
div.cdm.expanded,
div.cdm.expanded.Unread,
div.cdm.expandable.Unread,
div#headlines-frame .hl {
border: 1px solid #bebcb0;
border-top: 1px solid #bebcb0;
position:relative;
margin-top: -1px;
}
div.cdm.expandable.Selected.active,
div.cdm.active {
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border: 1px solid #bebcb0;
margin: 6px;
position: relative;
}
div#headlines-frame .hl {
border: 1px solid #bebcb0;
}
div.cdm.expanded.Selected.active,
div.content-insert{
color: #15c;
border: 1px solid #bebcb0;
/*
-moz-box-shadow: 0px 0px 20px 3px #636260;
-webkit-box-shadow: 0px 0px 20px 3px #636260;
box-shadow: 0px 0px 20px 3px #636260;
margin: 20px;
*/
}
div#headlines-frame .hl,
div.cdmHeader {
}
div.cdmContent{
padding: 10px;
}
div.cdmFooter {
font-size: 12px !important;
padding:10px;
}
div.hl.marked.active.Selected,
div.hl.active.Selected,
div.hl:hover,
div.cdmHeader:hover {
}
div.postTitle {
margin-top: 30px;
margin-left: 10px;
margin-right: 10px;
line-height: 35px;
overflow: visible !important;
white-space: normal !important;
}
div.postHeader {
color: #ffffff;
border-top: 1px solid #bebcb0 !important;
}
div.postContent,
div.dijitContentPane{
}
/* Remove functions I don't want */
div.cdmHeader .dijitCheckBox,
div#headlines-frame .dijitCheckBox
{
width: 0 !important;
}
div.cdmHeader img[src*="images/pub_unset.svg"],
div#headlines-frame img[src*="images/pub_unset.svg"] {
width: 0 !important;
}
div.cdmHeader img[src*="images/pub_set.svg"],
div#headlines-frame img[src*="images/pub_set.svg"] {
width: 0 !important;
}
div.cdmHeader .hlScorePic,
div#headlines-frame .hlScorePic {
width: 0 !important;
}
/* Replace images */
img[src*="plugins/mobilize/but.png"] {
background: transparent url(reeder_img/mobilize.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="plugins/note/note.png"] {
background: transparent url(reeder_img/note.png) 50% !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/tag.png"] {
background: transparent url(reeder_img/tag.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/pub_set.svg"] {
background: transparent url(reeder_img/rss.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/recently_read.png"] {
background: transparent url(reeder_img/watch.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/fresh.png"] {
background: transparent url(reeder_img/flash.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/archive.png"] {
background: transparent url(reeder_img/lock.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/mark_set.svg"] {
background: transparent url(reeder_img/star_full.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/mark_unset.svg"] {
background: transparent url(reeder_img/star.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/indicator_white.gif"] {
background: transparent url(reeder_img/loader-bars.gif) 50% 100% no-repeat !important;
height: 16px !important;
position: relative;
left: -9px !important;
padding-right: 16px;
width: 0 !important;
display: inline-block;
}
img[src*="images/indicator_tiny.gif"] {
background: transparent url(reeder_img/loader-bars.gif) 50% 100% no-repeat !important;
height: 11px !important;
padding-right: 16px;
width: 0 !important;
display: inline-block;
}
/* Replace plugin images */
img[src*="plugins/mail/mail.png"] {
background: transparent url(reeder_img/mail.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="plugins/share/share.png"] {
background: transparent url(reeder_img/share.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="plugins/embed_original/button.png"] {
background: transparent url(reeder_img/embed.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="plugins/inline_readability/readability.png"],
img[src*="plugins/readability/readability.png"],
img[src*="plugins/readability_mobile/readability_mobile.png"]
{
background: transparent url(reeder_img/readability.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="plugins/evernote/evernote.png"] {
background: transparent url(reeder_img/evernote.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
/*************************************************************************************
* Loader
*/
#overlay {
background-image: url(reeder_img/tt-rss_logo.png);
background-repeat: no-repeat, repeat;
background-position: center 5%;
}
div.insensitive{
color: #4f4e48;
}
#overlay_inner {
position: absolute;
top: 50%;
left: 50%;
margin-left: -220px;
text-align: center;
background-image: url(reeder_img/reeder_stripes.png);
-moz-box-shadow: 0px 0px 30px 0px #000000;
-webkit-box-shadow: 0px 0px 30px 0px #000000;
box-shadow: 0px 0px 30px 0px #000000;
border-radius: 10px;
padding: 20px;
width: 400px;
}
#overlay_inner .dijitProgressBar {
display: inline-block;
margin-top: 20px;
}
#overlay_inner .dijitProgressBarEmpty {
border: 0;
}
#overlay_inner .dijitProgressBarTile {
border-radius: 3px;
background-color: #4f4e48;
}
#overlay_inner .dijitProgressBarFull {
border: 0;
}
edit: Fixed non-combined mode
Last edited by kachaffeous on 07 Jun 2013, 03:06, edited 1 time in total.
Re: Reeder Theme
kachaffeous wrote:Awesome theme, but I'm partial to a white background so I hacked it up some. Hope you don't mind. Adding it here just in case anyone else was turned off by the color scheme.Code: Select all
/*
Tiny Tiny RSS Reeder Theme
Author: zas
Email: [email protected]
*/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,700italic,800italic,400,600,700,800);
@import "default.css";
/************************************************************
* Global Settings
*/
{
font-family: 'Open Sans',sans-serif !important;
}
/*body,*/
div.hl.Content {
font-size: 16px !important;
}
div.cdmContentInner p {
max-width: 100% !important;
}
div.cdm.expanded div.cdmHeader a.title,
div.cdm.active div.cdmHeader a.title,
div.postTitle a{
color: #000000;
font-size: 18px !important;
}
span.hlContent {
font-size: 12px !important;
margin-right: -20px;
}
/************************************************************
* Sidebar
.dijitTree {
background-image: url(reeder_img/reeder_bg_dark.png);
background-image: url(reeder_img/reeder_stripes.png), url(reeder_img/reeder_bg_dark.png);
color: #aba99d;
}
*/
#ttrssMain .dijitTreeExpando {
background-image: url(reeder_img/tree-expand.png);
position: relative;
left: +10px;
}
#ttrssMain .dijitTreeExpandoLeaf {
background-image: none;
}
#ttrssMain .dijitIconFolderOpen,
#ttrssMain .dijitFolderOpened {
background: none;
}
#ttrssMain .dijitIconFolderClosed,
#ttrssMain .dijitFolderClosed {
background: none;
}
#ttrssMain .dijitTreeRow,
#ttrssMain .dijitTreeNode .dojoDndItemBefore,
#ttrssMain .dijitTreeNode .dojoDndItemAfter {
display: block;
font-size: 12px;
line-height: 20px;
border: none;
}
#ttrssMain .dijitTreeRowHover,
#ttrssMain .dijitTreeNode .dojoDndItemBeforeHover,
#ttrssMain .dijitTreeNode .dojoDndItemAfterHover {
background-image: url(reeder_img/reeder_stripes.png);
color: #4f4e48;
}
#ttrssMain .dijitTreeRowSelected {
color: #4f4e48;
}
#ttrssMain .dijitTreeLabel {
vertical-align: text-top;
margin: 0 8px;
}
#ttrssMain .dijitTreeIsRoot > .dijitTreeRow {
border-top: 1px solid #bebcb0 !important;
color: #4f4e48;
display: block;
font-size: 14px;
padding-top: 4px !important;
padding-bottom: 4px !important;
}
#ttrssMain .dijitTreeIsRoot > .dijitTreeRowHover {
background-image: url(reeder_img/reeder_stripes.png);
color: #4f4e48;
}
#ttrssMain .dijitSplitterV,
#ttrssMain .dijitGutterV {
}
#ttrssMain .dijitSplitterVHover {
background: #759dc0;
}
#ttrssMain .dijitToolbar {
color: #4f4e48;
border: none;
padding: 6px 0 2px 4px;
}
div#headlines-toolbar,
{
background-image: url(reeder_img/reeder_bg_bright.png);
border-bottom: 1px solid #bebcb0 !important;
}
#ttrssMain div#headlines-wrap-inner,
div#headlines-frame {
}
#ttrssMain div#headlines-toolbar a,
#ttrssMain .dijitToolbar a {
color: #5a6e93 !important;
}
#ttrssMain div#headlines-toolbar a:hover,
#ttrssMain .dijitToolbar a:hover {
color: #404b5e !important;
}
#trssMain div#main-toolbar {
position: fixed;
top: 0;
left: 0;
bottom: 0;
width: 30px;
text-align: left;
}
.r {
position: relative;
right: -999px;
width:0;
}
#ttrssMain .dijitToolbar .dijitToggleButton,
#ttrssMain .dijitToolbar .dijitButton,
#ttrssMain .dijitToolbar .dijitDropDownButton,
#ttrssMain .dijitToolbar .dijitComboButton {
vertical-align: top;
}
#ttrssMain .dijitToolbar .actionChooser .dijitToggleButton,
#ttrssMain .dijitToolbar .actionChooser .dijitButton,
#ttrssMain .dijitToolbar .actionChooser .dijitDropDownButton,
#ttrssMain .dijitToolbar .actionChooser .dijitComboButton {
vertical-align: middle;
}
#ttrssMain .dijitButton .dijitButtonNode,
#ttrssMain .dijitDropDownButton .dijitButtonNode,
#ttrssMain .dijitComboButton .dijitButtonNode,
#ttrssMain .dijitToggleButton .dijitButtonNode,
#ttrssMain .dijitSelect,
#ttrssMain .dijitSelect .dijitButtonContents,
#ttrssMain .dijitTextBox,
#ttrssMain .dijitTextBox .dijitButtonNode {
border-radius: 3px !important;
padding: 3px 6px !important;
}
#ttrssMain .dijitButtonHover .dijitButtonNode,
#ttrssMain .dijitDropDownButtonHover .dijitButtonNode,
#ttrssMain .dijitToggleButtonHover .dijitButtonNode,
#ttrssMain .dijitComboButtonHover .dijitButtonNode {
border: 0 !important;
border-color: #bebcb0;
border-radius: 3px !important;
background: #bebcb0 !important;
}
#ttrssMain .dijitSelect,
#ttrssMain .dijitSelect .dijitButtonContents,
#ttrssMain .dijitTextBox,
#ttrssMain .dijitTextBox .dijitButtonNode {
padding: 1px 6px !important;
}
#ttrssMain .dijitSelect .dijitArrowButton {
background: none !important;
border: 0 !important;
padding: 0 !important;
}
#ttrssMain .dijitSelectHover .dijitArrowButton {
background: #aba99d !important;
border: 0 !important;
}
#ttrssMain .dijitSelect .dijitArrowButtonInner,
#ttrssMain .dijitComboBox .dijitArrowButtonInner,
#ttrssMain .dijitArrowButtonInner {
background: url(reeder_img/triangle_full_down.png) 50% 10%;
}
#ttrssMain .dijitSelectHover .dijitArrowButtonInner,
#ttrssMain .dijitComboBoxHover .dijitArrowButtonInner,
#ttrssMain .dijitArrowButtonInner {
background-position: 50% 50% !important;
}
#ttrssMain .dijitMenu {
border: 1px;
border-color: #bebcb0;
}
#ttrssMain .dijitMenu td.dijitMenuItemLabel {
font-size: 14px !important;
}
#ttrssMain .dijitSelectMenu .dijitMenuItemHover td,
#ttrssMain .dijitSelectMenu .dijitMenuItemSelected td,
#ttrssMain .dijitMenuItemHover,
#ttrssMain .dijitMenuItemSelected {
background-image: none !important;
}
#ttrssMain .dijitSelectMenu .dijitMenuItemHover td td.dijitMenuItemLabel,
#ttrssMain .dijitSelectMenu .dijitMenuItemSelected td td.dijitMenuItemLabel,
#ttrssMain .dijitMenuItemHover td.dijitMenuItemLabel,
#ttrssMain .dijitMenuItemSelected td.dijitMenuItemLabel {
color: #fafafa;
}
#ttrssMain .dijitSelectMenu .dijitMenuItem td,
#ttrssMain .dijitComboBoxMenu .dijitMenuItem {
border: 0 !important;
padding: 5px 6px !important;
}
#feedTree .counterNode,
#feedTree .counterNode.aux {
background-color: #f5f5f5;
color: #4f4e48;
border-color: #bebcb0;
border: 1;
line-height: 16px;
padding: 0 8px;
top: 3px;
min-width: 0;
border-radius: 3px;
}
#feeds-holder,
#content-wrap {
border-width: 0;
}
/****************************************************************************
* Groups
*/
div.cdmFeedTitle {
background: #e9e6d7;
background-image: url(reeder_img/reeder_bg_bright.png);
}
/****************************************************************************
* Posts
*/
div.cdm.expandable.Selected.active a,
div.cdm.expanded a,
div.hl.active.Selected a,
div.postReply a {
text-shadow: none !important;
}
div.cdm.expandable.Selected.active a:hover,
div.cdm.active a:hover,
div.cdm.expanded a:hover,
div.hl.active.Selected a:hover,
div.postReply a:hover {
color: #404b5e !important;
}
div.cdm.expandable,
div.cdm.expanded,
div.cdm.expanded.Unread,
div.cdm.expandable.Unread,
div#headlines-frame .hl {
border: 1px solid #bebcb0;
border-top: 1px solid #bebcb0;
position:relative;
margin-top: -1px;
}
div.cdm.expandable.Selected.active,
div.cdm.active {
background-image: url(reeder_img/reeder_bg_dark.png);
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border: 1px solid #bebcb0;
margin: 6px;
position: relative;
}
div#headlines-frame .hl {
background-image: url(reeder_img/reeder_bg_dark.png);
border: 1px solid #bebcb0;
}
div.cdm.expanded.Selected.active,
div.content-insert{
color: #15c;
border: 1px solid #bebcb0;
/*
-moz-box-shadow: 0px 0px 20px 3px #636260;
-webkit-box-shadow: 0px 0px 20px 3px #636260;
box-shadow: 0px 0px 20px 3px #636260;
margin: 20px;
*/
}
div#headlines-frame .hl,
div.cdmHeader {
background-image: url(reeder_img/reeder_bg_dark.png);
}
div.cdmContent{
padding: 10px;
}
div.cdmFooter {
font-size: 12px !important;
padding:10px;
}
div.hl.marked.active.Selected,
div.hl.active.Selected,
div.hl:hover,
div.cdmHeader:hover {
background-image: url(reeder_img/reeder_bg_darker.png) !important;
}
div.postTitle {
margin-top: 30px;
margin-left: 10px;
margin-right: 10px;
line-height: 35px;
overflow: visible !important;
white-space: normal !important;
}
div.postHeader {
color: #ffffff;
background-image: url(reeder_img/reeder_bg_dark.png) !important;
border-top: 1px solid #bebcb0 !important;
}
div.postContent,
div.dijitContentPane{
}
/* Remove functions I don't want */
div.cdmHeader .dijitCheckBox,
div#headlines-frame .dijitCheckBox
{
width: 0 !important;
}
div.cdmHeader img[src*="images/pub_unset.svg"],
div#headlines-frame img[src*="images/pub_unset.svg"] {
width: 0 !important;
}
div.cdmHeader img[src*="images/pub_set.svg"],
div#headlines-frame img[src*="images/pub_set.svg"] {
width: 0 !important;
}
div.cdmHeader .hlScorePic,
div#headlines-frame .hlScorePic {
width: 0 !important;
}
/* Replace images */
img[src*="plugins/mobilize/but.png"] {
background: transparent url(reeder_img/mobilize.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="plugins/note/note.png"] {
background: transparent url(reeder_img/note.png) 50% !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/tag.png"] {
background: transparent url(reeder_img/tag.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/pub_set.svg"] {
background: transparent url(reeder_img/rss.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/recently_read.png"] {
background: transparent url(reeder_img/watch.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/fresh.png"] {
background: transparent url(reeder_img/flash.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/archive.png"] {
background: transparent url(reeder_img/lock.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/mark_set.svg"] {
background: transparent url(reeder_img/star_full.png) !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/mark_unset.svg"] {
background: transparent url(reeder_img/star.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="images/indicator_white.gif"] {
background: transparent url(reeder_img/loader-bars.gif) 50% 100% no-repeat !important;
height: 16px !important;
position: relative;
left: -9px !important;
padding-right: 16px;
width: 0 !important;
display: inline-block;
}
img[src*="images/indicator_tiny.gif"] {
background: transparent url(reeder_img/loader-bars.gif) 50% 100% no-repeat !important;
height: 11px !important;
padding-right: 16px;
width: 0 !important;
display: inline-block;
}
/* Replace plugin images */
img[src*="plugins/mail/mail.png"] {
background: transparent url(reeder_img/mail.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="plugins/share/share.png"] {
background: transparent url(reeder_img/share.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="plugins/embed_original/button.png"] {
background: transparent url(reeder_img/embed.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="plugins/inline_readability/readability.png"],
img[src*="plugins/readability/readability.png"],
img[src*="plugins/readability_mobile/readability_mobile.png"]
{
background: transparent url(reeder_img/readability.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
img[src*="plugins/evernote/evernote.png"] {
background: transparent url(reeder_img/evernote.png) no-repeat !important;
height: 24px !important;
padding-right: 24px;
width: 0 !important;
display: inline-block;
}
/*************************************************************************************
* Loader
*/
#overlay {
background-image: url(reeder_img/tt-rss_logo.png);
background-repeat: no-repeat, repeat;
background-position: center 5%;
}
div.insensitive{
color: #4f4e48;
}
#overlay_inner {
position: absolute;
top: 50%;
left: 50%;
margin-left: -220px;
text-align: center;
background-image: url(reeder_img/reeder_stripes.png);
-moz-box-shadow: 0px 0px 30px 0px #000000;
-webkit-box-shadow: 0px 0px 30px 0px #000000;
box-shadow: 0px 0px 30px 0px #000000;
border-radius: 10px;
padding: 20px;
width: 400px;
}
#overlay_inner .dijitProgressBar {
display: inline-block;
margin-top: 20px;
}
#overlay_inner .dijitProgressBarEmpty {
border: 0;
}
#overlay_inner .dijitProgressBarTile {
border-radius: 3px;
background-color: #4f4e48;
}
#overlay_inner .dijitProgressBarFull {
border: 0;
}
Thanks, this does make it look more like Greader, and uses less bandwith, as it's loading less pictures.
Re: Reeder Theme
Hello guys,
of course I don't mind, do as you like.
You could also fork it on Github so you don't have to post code here. Fork on Github takes up one click....
But I don't understand why so many want Greader look. It was the worst look possible, truly terrible. But I like the white though of the Reeder theme fork
of course I don't mind, do as you like.
You could also fork it on Github so you don't have to post code here. Fork on Github takes up one click....
But I don't understand why so many want Greader look. It was the worst look possible, truly terrible. But I like the white though of the Reeder theme fork

- HeikoAdams
- Bear Rating Master
- Posts: 101
- Joined: 19 Mar 2013, 00:17
Re: Reeder Theme
Hi, could you please enable word-wrapping for long titles?
Re: Reeder Theme
Hello Heiko,
hmm do you have to lastest version? My titles and feed entries wrap automatically in Combined Feed Mode and 3 Coulumn Mode.
Could you specify more clearly.
PS: Open Sans works now properly thanks to mchiron
Cheers
hmm do you have to lastest version? My titles and feed entries wrap automatically in Combined Feed Mode and 3 Coulumn Mode.
Could you specify more clearly.
PS: Open Sans works now properly thanks to mchiron
Cheers
- HeikoAdams
- Bear Rating Master
- Posts: 101
- Joined: 19 Mar 2013, 00:17
Re: Reeder Theme
Yes, I'm using the latest version and long titles are looking like this:
- Attachments
-
- (26) Tiny Tiny RSS 2013-06-15 11-50-53.png (145.24 KiB) Viewed 7621 times
Re: Reeder Theme
Hello Heiko,
I checked and on my version the word wrap is enabled, see screenshot. I'll make some test next week and will get back to you.
Cheers
I checked and on my version the word wrap is enabled, see screenshot. I'll make some test next week and will get back to you.
Cheers
Re: Reeder Theme
Hello,
I saw that my current trunk version was a bit different then the last github version. Please check if the word wrap work with that.
I also added images for facebook, twitter and google plus and integrated OpenSans font better
screenshots and desciption on the first post are updated.
Cheers
I saw that my current trunk version was a bit different then the last github version. Please check if the word wrap work with that.
I also added images for facebook, twitter and google plus and integrated OpenSans font better
screenshots and desciption on the first post are updated.
Cheers
- HeikoAdams
- Bear Rating Master
- Posts: 101
- Joined: 19 Mar 2013, 00:17
Re: Reeder Theme
I did some investigations on that problem and it looks like
breaks word-wrapping. If I change the white-space rule to "normal" word-wrapping works fine.
Code: Select all
span.titleWrap {
white-space: nowrap;
}
breaks word-wrapping. If I change the white-space rule to "normal" word-wrapping works fine.
Re: Reeder Theme
Could someone help me out with why this is happening in Firefox. Any way I can fix this? 



Return to “Themes and plugins”
Who is online
Users browsing this forum: No registered users and 2 guests