Page 1 of 1

[Theme] Google Now Theme

Posted: 08 Jul 2014, 20:30
by cktt
Hi there!
Here is my personalized theme inspired on Google Now Cards.
It's only using Personalized CSS, there is no need download or edit files.
It's based on Iván Barcia's "Now Cards Web" Theme.

Below you can see an example

Code: Select all

a {
color : #e74c3c;
        text-decoration : none;
}
a:hover {
text-decoration:underline;
        color : #ed7669;
}
a:visited {
text-decoration:none;
color: #d07488;
}

html, body#ttrssMain, body#ttrssPrefs, #main {
width: 98%;
height: 97%;
        border: 0;
        padding: 0;
        margin: 0;
}

body#ttrssMain, body#ttrssPrefs, body#ttrssLogin, body {
background : #eeeeee;
color : #5f5f5f;
        margin : 25px;
        padding : 0px;
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 13px;
}

div.postReply div.postHeader {
background: #ffffff;
color: #5f5f5f;
font-size: 14px;
height: 45px;
border: solid 1px #eeeeee;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-goog-ms-border-radius: 5px;
padding: 5px 10px 5px 10px;
margin: 10px 0px 10px 0px;
box-shadow: 0px 4px 2px  rgba(204, 204, 204, 0.8);
}

#toolbar {
background : #eeeeee;
border: solid 1px #eeeeee;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-goog-ms-border-radius: 5px;
padding: 0px;
margin: 0px 0px 15px 0px;
box-shadow: 0px 4px 2px  rgba(204, 204, 204, 0.8);
}

#main-toolbar > * {
background: #ffffff;
color: #5f5f5f;
font-size: 0.8rem;
        white-space : nowrap;
        display : table-cell;
}

#overlay {
background : #eeeeee;
        left : 0;
        top : 0;
        height : 100%;
        width : 100%;
        z-index : 100;
        position : absolute;
}

#feeds-holder {
background: #ffffff;
color: #5f5f5f;
border: solid 1px #eeeeee;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-goog-ms-border-radius: 5px;
padding: 0px 20px 0px 0px;
margin: 0px 0px 5px 0px;
box-shadow: 0px 4px 2px  rgba(204, 204, 204, 0.8);
        overflow : hidden;
}

#content-wrap {
        padding : 0px;
        border-width : 0px;
margin : 0px 20px 0px 20px;
background: #eeeeee;
}

#content-insert {
background: #ffffff;
color: #5f5f5f;
font-size: 14px;
border: solid 1px #eeeeee;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-goog-ms-border-radius: 5px;
margin: 0px 0px 10px 0px;
padding: 0px 10px 10px 10px;
box-shadow: 0px 4px 2px  rgba(204, 204, 204, 0.8);
}

#headlines-frame {
border: solid 1px #eeeeee;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-goog-ms-border-radius: 5px;
padding: 0px 20px 0px 0px;
margin: 0px 0px 10px 0px;
box-shadow: 0px 4px 2px  rgba(204, 204, 204, 0.8);
}

div.postContent p {
max-width : 100%;
   -webkit-hyphens: auto;
   -moz-hyphens: auto;
   hyphens: auto;
}

Re: [Theme] Google Now Theme

Posted: 08 Jul 2014, 20:46
by fox
I wrapped your stuff in [ code ] ... [ /code ] blocks.

Re: [Theme] Google Now Theme

Posted: 08 Jul 2014, 21:20
by cktt
Thanks Fox!
Stupid me :D

Re: [Theme] Google Now Theme

Posted: 09 Jul 2014, 05:00
by JanneM
This looks really good. Clean and uncluttered, and the frames makes the posts visually more coherent. Thanks for this!

Re: [Theme] Google Now Theme

Posted: 17 Aug 2014, 08:15
by Cthulhux
I like the font. Still could need a "night mode" version as I have on Android. :D