moved the marking of feeds into the news.js and call it on mouseenter, always expand the description of feeds, improved style of the news items

4 files changed, 77 insertions, 24 deletions

diff --git a/css/news.css b/css/news.css
index d33d01e90..b810e7a25 100644
--- a/css/news.css
+++ b/css/news.css
@@ -47,21 +47,67 @@ ul.controls li { float: left; }
 /* item view */
 #rightcontent { top: 3.5em !important; padding: 0 0 0 5px; }
 
-.title_read + div.body { border-bottom:2px solid #5E5E5E !important; }
-
-.accordion .title_unread, .accordion .title_read {
-    padding-left: 10px;
-    font-size: 12px;
-    border-bottom:1px solid #5E5E5E;
-    border-top:1px solid #5E5E5E;
-    border-left:1px solid #5E5E5E;
-    background: linear-gradient(to bottom, #DCDCDC 0%,#EEEEEE 80%);
-    background: -moz-linear-gradient(top, #DCDCDC 0%, #EEEEEE 80%);
-    box-shadow: -0px 0px 5px rgb(0, 0, 0);
+#rightcontent div.body { 
+    padding: 10px 15px 25px 15px;
 }
-.accordion .title_unread { font-weight:bold;}
 
-div.rightcontentmsg { padding-left: 10px; background-color: yellow; }
+#rightcontent div.body p {
+    line-height: 1.5;
+    margin: 10px 0;
+}
+
+#rightcontent div.body a {
+    color: #0000ff;
+    text-decoration: underline;
+}
+
+#rightcontent div.body ul {
+    padding-left: 15px;
+    list-style-type: disc;
+ }
+
+#rightcontent div.body ul li {
+    cursor: default;
+}
+
+#rightcontent li:active {
+    background: none;
+}
+
+
+#rightcontent div.body pre {
+    padding: 5px;
+}
+
+#rightcontent div.body pre code {
+    font-family: monospace;
+    font-size: 14px;
+}
+
+#rightcontent .title_unread h1, #rightcontent .title_read h1 {
+    padding: 5px 10px;
+    font-size: 14px;    
+    border-top: 1px solid #ddd;
+    border-bottom: 1px solid #ddd;
+    background: linear-gradient(to bottom, #eee 0%,#f1f1f1 80%);
+    background: -moz-linear-gradient(top, #eee 0%, #f1f1f1 80%);
+}
+
+#rightcontent .title_unread h1 { 
+    font-weight: bold;
+}
+
+#rightcontent .title_unread h1 a {
+    
+}
+
+#rightcontent .title_read h1 {
+    font-weight: normal;
+}
+
+#rightcontent .title_read a:hover, #rightcontent .title_unread a:hover { text-decoration: underline; }
+
+#rightcontent div.rightcontentmsg { padding-left: 10px; background-color: yellow; }
 
 
 /* dialog/menues */
diff --git a/js/news.js b/js/news.js
index 2d38ec930..5420965eb 100644
--- a/js/news.js
+++ b/js/news.js
@@ -361,6 +361,12 @@ $(document).ready(function(){
 	var updateInterval = 200000; //how often the feeds should update (in msec)
 	setInterval('News.Feed.updateAll()', updateInterval);
 
+	$('.title_unread').live('mouseenter', function(){
+		var itemId = $(this).data('id');
+        var feedId = $(this).data('feedid');
+		News.Feed.markItem(itemId, feedId);
+	});
+
 });
 
 $(document).click(function(event) {
diff --git a/js/settings.js b/js/settings.js
index 7bc1c80db..c5a7e43ce 100644
--- a/js/settings.js
+++ b/js/settings.js
@@ -75,3 +75,4 @@ $('#file_upload_start').change(function() {
 $('#importbtn').click(function() {
 	News.Settings.import(this);
 });
+
diff --git a/templates/part.items.php b/templates/part.items.php
index c1619085e..c2b9b2889 100644
--- a/templates/part.items.php
+++ b/templates/part.items.php
@@ -6,18 +6,18 @@ $itemmapper = new OC_News_ItemMapper();
 
 $items = $itemmapper->findAll($feedid);
 
-echo '<ul class="accordion">';
+echo '<ul>';
 foreach($items as $item) {
-	$title = $item->getTitle();
-	echo '<li>';
-	echo '<div data-id="' . $item->getId() . '"';
-	if ($item->isRead()) {
-		echo ' class="title_read">';
+	if($item->isRead()){
+		$readClass = "title_read";
+	} else {
+		$readClass = "title_unread";
 	}
-	else {
-		echo ' class="title_unread" onClick="News.Feed.markItem(' . $item->getId() . ',' . $feedid . ')">';
-	}
-	echo $title . '</div><div class="body">' . $item->getBody() . '</div>';
+
+	echo '<li class="news_item ' . $readClass .'" data-id="' . $item->getId() . '" data-feedid="' . $feedid . '">';
+	echo '<h1><a href="' . $item->getUrl() . '">' . $item->getTitle() . '</a></h1>';
+	echo '<div class="body">' . $item->getBody() . '</div>';
 	echo '</li>';
-}
+
+	}
 echo '</ul>';