Google Reader theme

Post plugins and custom CSS snippets here
amm
Bear Rating Trainee
Bear Rating Trainee
Posts: 2
Joined: 29 Mar 2013, 07:45

larger headline font size?

Postby amm » 29 Mar 2013, 07:55

thedave, I like this theme but I'm using a larger font for articles with something fox suggested:

div.cdmContentInner { font-size : 140% ! important; }
div.postContent { font-size : 140% ! important; }

I can't figure out how to increase article title (headline) font size in post view. I can change it in list view by mucking with some of your settings, but once I expand an article, its headline reverts to default text size. thanks for your help.

User avatar
fox
^ me reading your posts ^
Posts: 6318
Joined: 27 Aug 2005, 22:53
Location: Saint-Petersburg, Russia
Contact:

Re: Google Reader theme

Postby fox » 29 Mar 2013, 09:54

.cdm.active.Selected .cdmHeader a { font-size : 140% ! important; }

phz
Bear Rating Disaster
Bear Rating Disaster
Posts: 77
Joined: 18 Mar 2013, 18:32

Re: Google Reader theme

Postby phz » 29 Mar 2013, 14:11

A big help for inspecting classes and what CSS rules are superceding others, use e.g. the "Inspect element" function in Chrome (or similar functions in other browsers). Right-click the header itself, "Inspect element" and look at the CSS rule tree to the right.

jinnjuice
Bear Rating Trainee
Bear Rating Trainee
Posts: 1
Joined: 30 Mar 2013, 02:12

Re: Google Reader theme

Postby jinnjuice » 30 Mar 2013, 02:16

[quote="TheDave1022"]Here is v2 of my theme which adds a gray background hover effect over the row when the mouse passes over it.
Article Title gets cropped at 50% of the DIV width.
Article summary text has a max-width of 400px as it would push the text to the next line. (Testing on a 1920x1080 monitor with the default position of the Side Nav Bar width)

Waiting on the next version of ttrss as there will be an option to remove the Author. Will see if I can figure out how to get the article summary to extend all the way until it hits the date div.

[code]/* fix dijit */
:focus {
outline: none;
}
input[type="search"] {
-webkit-appearance: none;
}
.claro .dijitToolbar .dijitButton .dijitButtonNode,
.claro .dijitToolbar .dijitDropDownButton .dijitButtonNode,
.claro .dijitToolbar .dijitComboButton .dijitButtonNode,
.claro .dijitToolbar .dijitToggleButton .dijitButtonNode,
.claro .dijitToolbar .dijitComboBox .dijitButtonNode {
-moz-transition: background-color, border-color, color;
-webkit-transition-property: background-color, border-color, color;
transition: background-color, border-color, color;
}


/* some style */
body#ttrssMain,
a,
.titleWrap .title {
color: #444;
}
a:hover,
.Unread .titleWrap .title,
.Selected .titleWrap .title,
html div.cdmContent a {
color: #15c;
}
#feeds-holder,
#content-wrap,
#headlines-frame {
border: none;
}
#ttrssMain #headlines-toolbar,
#ttrssMain .dijitToolbar,
#ttrssMain .cdmHeader {
background: #fff;
border-color: transparent;
}
#ttrssMain #headlines-toolbar {
border-color: #ebebeb;
}
#ttrssMain .cdm {
margin: 5px 25px 10px 5px;
border: 1px solid #ddd !important;
box-shadow: 0 0 4px rgba(0,0,0,.1);
background: #fff !important;
}
#ttrssMain .cdm.Selected {
border-left-color: #4d90f0 !important;
background: #fff !important;
}
#ttrssMain .cdmFeedTitle {
border-color: #ebebeb;
background: #fff;
font-size: 1.1em;
font-weight: bold;
}
#headlines-frame .cdmFooter {
border-top: 1px solid #ebebeb;
background: #fafafa;
}

img.tinyFeedIcon {
display: none;
}

img.hlScorePic {
display: none;
}

div.cdmHeader span.hlFeed {
padding-top: 0em;
padding-right: 1em;
float: left;
width: 11em;
color: #555;
font-size: 100%;
white-space: nowrap;
overflow: hidden;
}


#ttrssMain #headlines-toolbar, #ttrssMain .dijitToolbar, #ttrssMain .cdmHeader {
overflow: hidden;
}

/* Set Line Background to White */
.odd.Selected, .odd.Selected td {
background: rgb(255, 255, 255) ! important;
}
.even.Selected, .odd.Selected td {
background: rgb(255, 255, 255) ! important;
}

/* Article Title Cell Width 50% */
.titleWrap .title {
color: #15c;
overflow: hidden;
max-width: 50%;
text-overflow: ellipsis;
white-space: nowrap;
display: inline-block;
padding-right: 15px;
font-size: 1.1em;
font-weight: bold;
}

/* Article Text Summary Blurb */
span.cdmExcerpt {
font-size: 12px;
overflow: hidden;
max-width: 400px;
text-overflow: ellipsis;
white-space: nowrap;
display: inline-block;
}

/* Line Hover Color */
#ttrssMain .cdmHeader:hover {
background-color:#F0F0F0;
}

[/code]

I like the feed name on the left side beside the title like in your screenshot. But all I have is the feed name and a favicon on the very right side. How can I fix it?