big interface overhaul, new logo

1 files changed, 194 insertions, 253 deletions

diff --git a/tt-rss.css b/tt-rss.css
index 37518b3d1..40d959d7d 100644
--- a/tt-rss.css
+++ b/tt-rss.css
@@ -6,217 +6,239 @@ body {
 	font-family : sans-serif;
 }
 
-h1 {
-	font-size : 16pt;	
-}
-
-h2 {
-	font-size : 14pt;
-	font-color : bold;
-	border-width : 0px 0px 1px 0px;
-	border-style : solid;
-	border-color : #e0e0e0;
-}
-
-hr {
-	border-width : 0px 0px 1px 0px;
-	border-style : dashed;
-	border-color : #e0e0e0;
-}
-
-a {
-	color : black;
-	text-decoration : none;
-}
+/* common styles */
 
-a:hover {
-	color : #5050aa;
+table.main td.header {
+	padding : 10px 10px 10px 50px;
+	height : 90px;
+	font-size : 24pt;
+	font-weight : bold;	
+	background-image : url("images/vgrad_light_rev2.png");
+	background-position : top left;
+	background-repeat : repeat-x;
 }
 
-table.postTable a {
-	color : #5050aa;
+table.main td.mainToolbar {
+	border-width : 0px 0px 0px 0px;
+	border-style : solid;
+	border-color : #c0c0c0;
+	padding : 10px 25px 10px 10px;
 }
 
-table.postTable a:hover {
-	color : black;
+table.main td.feeds {
+	width : 300px;
+	height : 100%;
+	border-width : 1px 0px 0px 0px;
+	border-style : solid;
+	border-color : #c0c0c0;
+	padding : 5px;
 }
 
-td.headlinesToolbar {
+table.main td.headlinesToolbarBox {
 	padding : 10px;
-}
-
-table.headlinesList td.title, table.headlinesHeader td.title {
-	font-weight : bold;
-	font-size : large;
-	border-width : 0px 0px 1px 0px;
-	border-color : #d0d0d0;
+	border-width : 0px 0px 1px 1px;
 	border-style : solid;
-	text-align : right;
-	padding-bottom : 3px;
+	border-color : #c0c0c0;
+	background-image : url("images/vgrad_light.png");
+	background-position : bottom left;
+	background-repeat : repeat-x;
 }
 
-table.headlinesList td.feedLastUpdateNotice {
-	font-size : x-small;
-	border-width : 0px 0px 1px 0px;
-	border-color : #d0d0d0;
+table.main td.footer {
+	border-width : 1px 0px 0px 0px;
 	border-style : solid;
-	text-align : left;
-	padding-bottom : 3px;
-	color : #a0a0a0;
+	border-color : #c0c0c0;
+	padding : 10px;
+	text-align : center;
+	font-size : x-small;
+	background-image : url("images/vgrad_light_rev2.png");
+	background-position : top left;
+	background-repeat : repeat-x;
+	color : gray;
 }
 
-table.headlinesList td.headlineUpdated {
-	width : 200px;
+table.main td.footer a {
+	color : gray;
 }
 
-input {
-	border : 1px solid #a0a0a0;
+table.main td.footer a:hover {
+	color : #5050aa;
 }
 
-table.main td.toolbar {
-	height : 40px;
-	background-color : #f0f0f0;
-	padding-right : 10px;
-	padding-left : 10px;
-	font-size : small;
+table.main td.headlines {
+	height : 25%;
+	border-width : 0px 0px 1px 1px;
+	border-style : solid;
+	border-color : #c0c0c0;
 }
 
-#notify {
-	font-weight : bold;
-	border : 1px solid #c0c0c0;
-	font-size : small;
-	display : none;
-	background : white;
-	-moz-border-radius : 5px;
-	padding : 2px 5px 2px 5px;
-	width : 300px;
+table.main td.content {
+	height : 100%;
+	background-image : url("images/vgrad_light_rev.png");
+	background-position : top left;
+	background-repeat : repeat-x;
+	border-width : 0px 0px 0px 1px;
+	border-style : solid;
+	border-color : #c0c0c0;
 }
 
-table.feedsList td {
-	font-size : x-small;
+table.main td.prefContent {
+	height : 100%;
+	background-image : url("images/vgrad_light_rev.png");
+	background-position : top left;
+	background-repeat : repeat-x;
+	border-width : 1px 0px 0px 0px;
+	border-style : solid;
+	border-color : #c0c0c0;
+	padding : 20px;
 }
 
-table.main td.header {
-	font-size : 21pt;
-	background-color : #f0f0f0;
-	background-image : url("images/header.png");
+div.postReply {
+	background-image : url("images/vgrad_light_rev.png");
 	background-position : top left;
 	background-repeat : repeat-x;
-	height : 50px;
-	padding-left : 80px;
-	padding-top : 30px;
-	font-weight : bold;
-	color : black;
+	height : 100%;
+	padding : 10px;
 }
 
-table.main td.feeds {
-	width : 300px;
-	border-width : 1px 1px 0px 0px;
-	border-color : #c0c0c0;
-	border-style : solid;
+div.postReply div.postHeader {
+	background : white;
+	border : 1px solid #c0c0c0;
 	padding : 5px;
 }
 
-div.headlineToolbar {
-	border-width : 1px 0px 0px 0px;
-	border-color : #c0c0c0;
-	border-style : solid;
+div.postReply div.postContent {
 	padding : 10px;
 }
 
-td.articleToolbar {
-	border-width : 0px 0px 1px 0px;
-	border-color : #c0c0c0;
-	border-style : solid;
-	padding : 10px;
-	background : #f0f0f0;
+div.postReply div.postIcon {
+	float : right;
+	border : 0px;
+	margin : 10px;
 }
-table.main td.headlines {
-	height : 25%;
-	border-width : 1px 0px 0px 0px;
-	border-color : #c0c0c0;
-	border-style : solid;
-	font-size : small;
+
+ul.feedList {
+	list-style-type : none;
+	margin : 0px;
+	padding : 10px;	
 }
 
-table.main td.prefContent {
-	padding : 10px;
-	border-width : 1px 0px 0px 0px;
-	border-color : #c0c0c0;
-	border-style : solid;
+ul.feedList li {
+	margin : 2px;
+}
+
+ul.feedList li.oddSelected, ul.feedList li.evenSelected,
+	li.oddUnreadSelected, li.evenUnreadSelected {
+	background-color : white;
+} 
+
+li.oddSelected a, li.evenSelected a,
+	li.oddUnreadSelected a, li.evenUnreadSelected a {
+	color : #5050aa;
+} 
 
+ul.feedList img {
+	margin : 0px 3px 0px 0px;
+	width : 16px;
+	height : 16px;
 }
 
-table.main td.headlinesToolbarBox {
-	padding : 0px;
-	height : 20px;
-	border-width : 1px 0px 0px 0px;
-	border-color : #c0c0c0;
-	border-style : solid;
+h1 {
+	font-size : 16pt;	
 }
 
-table.main td.content {
-	padding : 0px;
-	border-width : 1px 0px 0px 0px;
-	border-color : #c0c0c0;
+h2 {
+	font-size : 14pt;
+	font-color : bold;
+	border-width : 0px 0px 1px 0px;
 	border-style : solid;
+	border-color : #e0e0e0;
 }
 
-table.main td.notify {
-	height : 40px;
-	border-width : 1px 0px 0px 0px;
-	border-color : #c0c0c0;
-	border-style : solid;
-	font-size : x-small;
-	text-align : center;
-	color : gray;
-	background-color : #f0f0f0;
-	background-image : url("images/header_rev.png");
-	background-position : top left;
-	background-repeat : repeat-x;
+hr {
+	border-width : 0px 0px 1px 0px;
+	border-style : dashed;
+	border-color : #e0e0e0;
+}
 
+a {
+	color : black;
+	text-decoration : none;
 }
 
-.evenGrayed {
-	background-color : #f0f0f0;
-	color : #909090;
+a:hover {
+	color : #5050aa;
 }
 
-.oddGrayed {
-	color : #909090;
+#piggie {
+	width : 400;
+	height : 400;
+	left : 50;
+	background-color : white;
+	display : none;
+	z-index : 3;
+	background-image : url("http://madoka.spb.ru/stuff/fox/piggie.png");
+	background-position : center center;
+	background-repeat : no-repeat;
+	position : absolute;
+	border : 1px solid pink;	
+	margin-left : auto;
+	margin-right : auto;
+	-moz-border-radius : 10px;
+	opacity : 0.8;
 }
 
-.even {
-	background-color : #f0f0f0;
+#iedit_title, #iedit_link, #iedit_regexp, #iedit_descr {
+	width : 100%;
+	padding-left : 2px;
 }
 
-.evenUnread {
-	background-color : #f0f0f0;
+#notify {
 	font-weight : bold;
+	font-size : small;
+	display : none;
+	width : 350px;
+	color : gray;
 }
 
-.oddUnread {
-	font-weight : bold;
+div.expPane {
+	margin : 15px;
 }
 
-.invisible {
-	display : none;
+iframe.feedsFrame {
+	width : 100%;
+	height : 90%;
+	border-width : 0px;
+	margin : 0px;
+	padding : 0px;
 }
 
-table.prefAddFeed td {
-	padding : 2px;
+iframe.contentFrame, iframe.headlinesFrame {
+	width : 100%;
+	border-width : 0px;
+	padding : 0px;
+	margin : 0px;
+	height : 100%;
 }
 
-table.prefAddFeed input {
-	width : 250px;
+.button {
+	border : 1px solid #d0d0d0;
+	background-image : url("images/button.png");
+	background-position : top;
+	background-repeat : repeat-x;
+	background-color : white;
+	color : black;	
 }
 
-table.prefFeedList tr.title td, table.prefFilterList tr.title td,
-	table.headlinesList tr.title td {
-	font-weight : bold;
-	border-width : 0px 0px 1px 0px;
-	border-color : #f0f0f0;
-	border-style : solid;
+.button:hover {
+	background : white;
+	text-decoration : none;
+	color : black;
+}
+
+a.button {
+	padding : 2px 5px 2px 5px;
+	font-size : small;
 }
 
 .evenUnreadSelected, .evenSelectedUnread {
@@ -251,132 +273,51 @@ table.prefFeedList tr.title td, table.prefFilterList tr.title td,
 	color : #909090;
 }
 
-.button {
-	border : 1px solid #d0d0d0;
-	background-image : url("images/button.png");
-	background-position : top;
-	background-repeat : repeat-x;
-	background-color : white;
-	color : black;	
-}
-
-/* .button:hover {
-	background : white;
-	text-decoration : none;
-	color : black;
-} */
-
-a.button {
-	padding : 2px 5px 2px 5px;
-}
-
-
-.buttonWarn {
-	border : 1px solid #d0d0d0;
-	background-image : url("images/button.png");
-	background-position : top;
-	background-repeat : repeat-x;
-	background-color : white;
-	color : black;	
-	padding : 2px 5px 2px 5px;
-	font-size : small;
-}
-
-.buttonWarn:hover {
-	background : #fff0f0;
-	text-decoration : none;
-	color : black;
-}
-
-td.headlineUpdateMark {
-	width : 25px;
-	text-align : center;
-}
-
-div.errorBox {
-	border : 1px solid #c0c0c0;
-	padding : 20px;
-	margin : 20px;
-	background : #f0f0f0;
-}
-
-tr.titleTop, tr.titleBottom, tr.titleTopBottom {
-	background : #f0f0f0;
-}
-
-td.titleIcon {
-	border-width : 0px 0px 1px 0px;
-	border-color : #d0d0d0;
-	border-style : solid;
+.evenGrayed {
+	background-color : #f0f0f0;
+	color : #909090;
 }
 
-tr.titleTop td {
-	padding : 5px 10px 0px 10px;
+.oddGrayed {
+	color : #909090;
 }
 
-tr.titleBottom td {
-	padding : 3px 10px 5px 10px;
-	border-width : 0px 0px 1px 0px;
-	border-color : #d0d0d0;
-	border-style : solid;
+.even {
+	background-color : #f0f0f0;
 }
 
-tr.titleTopBottom td {
-	padding : 3px 10px 5px 10px;
-	border-width : 1px 0px 1px 0px;
-	border-color : #d0d0d0;
-	border-style : solid;
+.evenUnread {
+	background-color : #f0f0f0;
+	font-weight : bold;
 }
 
-td.post {
-	padding : 20px;
+.oddUnread {
+	font-weight : bold;
 }
 
-#piggie {
-	width : 400;
-	height : 400;
-	left : 50;
-	background-color : white;
+.invisible {
 	display : none;
-	z-index : 3;
-	background-image : url("http://madoka.spb.ru/stuff/fox/piggie.png");
-	background-position : center center;
-	background-repeat : no-repeat;
-	position : absolute;
-	border : 1px solid pink;	
-	margin-left : auto;
-	margin-right : auto;
-	-moz-border-radius : 10px;
-	opacity : 0.8;
 }
 
-img.feedIcon {
-	margin : 3px;
-	border : 1px solid #c0c0c0;
+input {
+	border : 1px solid #a0a0a0;
 }
 
-#iedit_title, #iedit_link, #iedit_regexp, #iedit_descr {
-	width : 100%;
-	padding-left : 2px;
-}
+/* preferences */
 
-div.expPane {
-	margin : 15px;
+table.prefAddFeed td {
+	padding : 2px;
 }
 
-iframe.feedsFrame {
-	width : 100%;
-	height : 90%;
-	border-width : 0px;
-	margin : 0px;
-	padding : 0px;
+table.prefAddFeed input {
+	width : 250px;
 }
 
-iframe.contentFrame, iframe.headlinesFrame {
-	width : 100%;
-	border-width : 0px;
-	padding : 0px;
-	margin : 0px;
-	height : 100%;
+table.prefFeedList tr.title td, table.prefFilterList tr.title td,
+	table.headlinesList tr.title td {
+	font-weight : bold;
+	border-width : 0px 0px 1px 0px;
+	border-color : #f0f0f0;
+	border-style : solid;
 }