tweak visual for headlines

cdm.css

@@ -49,6 +49,11 @@ div.cdmContent a {
 	color : #4684ff;
 }
 
+div.cdm.expanded div.cdmHeader {
+	margin-right : 4px;
+	margin-left : 4px;
+}
+
 div.cdmContent a:hover {
 	color : black;
 }
@@ -70,53 +75,78 @@ div.cdmFooter {
 	clear : both;
 }
 
-div.cdm {
-	border-width : 0px 1px 1px 0px;
-	border-collapse : collapse;
-	border-color : #c0c0c0;
-	border-style : solid;
-	background : #fafafa;
+div.cdm.expanded {
+	margin-top : 4px;
+	margin-bottom : 4px;
 }
 
 div.cdm.expandable {
-	background : #f0f0f0;
+	background-color : #f0f0f0;
+	border-width : 0px 0px 1px 0px;
+	border-color : #c0c0c0;
+	border-style : solid;
 }
 
-div.cdm.expanded, div.cdm.expandable {
-	margin : 4px 4px 0px 4px;
-	border-width : 1px;
-	border-color : #c0c0c0;
-	box-shadow : 0px 0px 3px #ccc;
+div.cdm.expandable > hr {
+	display : none;
 }
 
-div.cdm.expanded div.cdmHeader {
-	background : #e0e0e0;
+div.cdm.expanded > hr {
+	margin-top : 0px;
+	margin-bottom : 0px;
 }
 
 div.cdm.Unread {
 	background : white;
 }
 
-div.cdm.Unread div.cdmHeader {
-	background : #ecf4ff;
-}
-
 div.cdm.active {
 	border-color : #88b0f0;
 	background : white ! important;
-	box-shadow : 0px 0px 3px #4684ff;
 }
 
-div.cdm.active div.cdmHeader {
-	background : #ecf4ff;
+div.cdm.expandable div.cdmHeader a.title {
+	font-weight : bold;
+	color : gray;
+}
+
+div.cdm.expandable.Unread div.cdmHeader a.title {
+	color : black;
 }
 
-div.cdm.active div.cdmHeader a.title {
+div.cdm.expandable.active div.cdmHeader a.title {
 	color : #4684ff;
 }
 
+div.cdm.expanded div.cdmHeader {
+	background : transparent ! important;
+}
+
+div.cdm.expanded div.cdmHeader a.title {
+	font-size : 14px;
+	color : gray;
+	font-weight : bold;
+}
+
+
+div.cdm.expanded.active div.cdmHeader a.title {
+	color : #4684ff;
+}
+
+div.cdm.expanded.Unread div.cdmHeader a.title {
+	color : black;
+}
+
+div.cdm.expanded div.cdmContent {
+	color : gray;
+}
+
+div.cdm.expanded.Unread div.cdmContent {
+	color : black;
+}
+
 div.cdm.active div.cdmContent {
-	background : white;
+	color : black;
 }
 
 span.cdmExcerpt {
@@ -145,6 +175,7 @@ div.cdmFeedTitle a.title {
 	font-style : italic;
 	font-weight : bold;
 }
+
 div.cdmFeedTitle a {
 	color : gray;
 }
@@ -175,10 +206,6 @@ div.cdmContentInner p {
 	max-width : 650px;
 }
 
-.Unread div.cdmHeader {
-	font-weight : bold;
-}
-
 div.cdmContentInner iframe {
 	min-width : 50%;
 }
@@ -189,8 +216,4 @@ div.cdmHeader span.author {
 	font-weight : normal;
 }
 
-div.cdm.expanded div.cdmHeader a.title, div.cdm.active div.cdmHeader a.title {
-	font-size : 13px;
-}
-
 

classes/feeds.php

@@ -720,7 +720,7 @@ class Feeds extends Handler_Protected {
 					$reply['content'] .= "</div>";
 					$reply['content'] .= "</div>";
 
-					$reply['content'] .= "</div>";
+					$reply['content'] .= "</div><hr/>";
 
 					$reply['content'] .= "</div>";
 

include/functions.php

@@ -3398,7 +3398,7 @@
 			$maxtags = min(5, count($tags));
 
 			for ($i = 0; $i < $maxtags; $i++) {
-				$tags_str .= "<a href=\"#\" onclick=\"viewfeed('".$tags[$i]."'\")>" . $tags[$i] . "</a>, ";
+				$tags_str .= "<a class=\"tag\" href=\"#\" onclick=\"viewfeed('".$tags[$i]."'\")>" . $tags[$i] . "</a>, ";
 			}
 
 			$tags_str = mb_substr($tags_str, 0, mb_strlen($tags_str)-2);

tt-rss.css

@@ -113,8 +113,9 @@ h3 {
 
 hr {
 	border-width : 0px 0px 1px 0px;
-	border-style : dashed;
-	border-color : #e0e0e0;
+	border-style : solid;
+	border-color : #c0c0c0;
+	max-width : 90%;
 }
 
 a {
@@ -185,8 +186,17 @@ a:hover {
 	border-color : #ff0000;
 }
 
-.hl.Unread div.hlTitle {
+.hl div.hlTitle a {
 	font-weight : bold;
+	color : gray;
+}
+
+.hl.Unread div.hlTitle a {
+	color : black;
+}
+
+.hl.active div.hlTitle a {
+	color : #4684ff;
 }
 
 .hl.Grayed {
@@ -198,7 +208,7 @@ a:hover {
 }
 
 .hl {
-	border-width : 0px 1px 1px 0px;
+	border-width : 0px 0px 1px 0px;
 	border-style : solid;
 	border-color : #c0c0c0;
 }
@@ -1012,10 +1022,6 @@ div.hl.active {
 	border-color : #88b0f0;
 }
 
-div.hl.active a.title {
-	color : #4684ff;
-}
-
 #selected_prompt {
 	margin-right : 25px;
 }