HTML5 + CSS adaptions, may cause visual breaks

lib/attachment.php

@@ -43,9 +43,9 @@ class Attachment extends AttachmentListItem
             $this->out->element('a', $this->linkAttr(), _('Download link'));
             $this->out->elementEnd('div');
 
-            $this->out->elementStart('div', 'e-content');
+            $this->out->elementStart('article', 'e-content');
             $this->showRepresentation();
-            $this->out->elementEnd('div');
+            $this->out->elementEnd('article');
             Event::handle('EndShowAttachmentLink', array($this->out, $this->attachment));
             $this->out->elementEnd('div');
         }

lib/dofollowlistitem.php

@@ -66,7 +66,7 @@ class DoFollowListItem extends NoticeListItem
     function showContent()
     {
         // FIXME: URL, image, video, audio
-        $this->out->elementStart('div', array('class' => 'e-content'));
+        $this->out->elementStart('article', array('class' => 'e-content'));
 
         if (!empty($this->notice->rendered)) {
             $html = $this->notice->rendered;

lib/inlineattachmentlist.php

@@ -35,7 +35,7 @@ class InlineAttachmentList extends AttachmentList
 {
     function showListStart()
     {
-        $this->out->element('h2', null, _('Attachments'));
+        $this->out->element('h3', null, _('Attachments'));
         parent::showListStart();
     }
 

lib/noticelistitem.php

@@ -103,9 +103,6 @@ class NoticeListItem extends Widget
         $this->showStart();
         if (Event::handle('StartShowNoticeItem', array($this))) {
             $this->showNotice();
-            $this->showNoticeAttachments();
-            $this->showNoticeInfo();
-            $this->showNoticeOptions();
             Event::handle('EndShowNoticeItem', array($this));
         }
         $this->showEnd();
@@ -114,19 +111,36 @@ class NoticeListItem extends Widget
     function showNotice()
     {
         if (Event::handle('StartShowNoticeItemNotice', array($this))) {
-            $this->showNoticeTitle();
+            $this->showNoticeHeaders();
-            $this->showAuthor();
-            $this->showAddressees();
             $this->showContent();
+            $this->showNoticeFooter();
             Event::handle('EndShowNoticeItemNotice', array($this));
         }
     }
 
+    function showNoticeHeaders()
+    {
+        $this->elementStart('section', array('class'=>'notice-headers'));
+        $this->showNoticeTitle();
+        $this->showAuthor();
+        $this->showAddressees();
+        $this->elementEnd('section');
+    }
+
+    function showNoticeFooter()
+    {
+        $this->elementStart('footer');
+        $this->showNoticeInfo();
+        $this->showNoticeAttachments();
+        $this->showNoticeOptions();
+        $this->elementEnd('footer');
+    }
+
     function showNoticeTitle()
     {
         if (Event::handle('StartShowNoticeTitle', array($this))) {
             $this->element('a', array('href' => $this->notice->getUrl(),
-                                      'class' => 'p-name metadata'),
+                                      'class' => 'notice-title'),
                            $this->notice->getTitle());
             Event::handle('EndShowNoticeTitle', array($this));
         }
@@ -134,7 +148,6 @@ class NoticeListItem extends Widget
 
     function showNoticeInfo()
     {
-        $this->out->elementStart('div', 'entry-metadata');
         if (Event::handle('StartShowNoticeInfo', array($this))) {
             $this->showNoticeLink();
             $this->showNoticeSource();
@@ -143,8 +156,6 @@ class NoticeListItem extends Widget
             $this->showRepeat();
             Event::handle('EndShowNoticeInfo', array($this));
         }
-
-        $this->out->elementEnd('div');
     }
 
     function showNoticeOptions()
@@ -276,7 +287,7 @@ class NoticeListItem extends Widget
     function showContent()
     {
         // FIXME: URL, image, video, audio
-        $this->out->elementStart('div', array('class' => 'e-content'));
+        $this->out->elementStart('article', array('class' => 'e-content'));
         if (Event::handle('StartShowNoticeContent', array($this->notice, $this->out, $this->out->getScoped()))) {
             if ($this->notice->rendered) {
                 $this->out->raw($this->notice->rendered);
@@ -288,7 +299,7 @@ class NoticeListItem extends Widget
             }
             Event::handle('EndShowNoticeContent', array($this->notice, $this->out, $this->out->getScoped()));
         }
-        $this->out->elementEnd('div');
+        $this->out->elementEnd('article');
     }
 
     function showNoticeAttachments() {

theme/base/css/display.css

@@ -662,11 +662,6 @@ address .poweredby {
     float: left;
 }
 
-#content .notice .h-entry {
-    margin: 2px 0 0 0;
-    min-height: 32px;
-}
-
 .h-card .u-url, .h-card.u-url {
     text-decoration:none;
 }
@@ -674,15 +669,6 @@ address .poweredby {
     text-decoration:underline;
 }
 
-.notice .h-entry {
-    overflow:hidden;
-    word-wrap:break-word;
-}
-
-.notice .entry-title.ov {
-overflow:visible;
-}
-
 .notice .automatic { 
 font-style:italic;
 }
@@ -715,29 +701,11 @@ font-style:italic;
     line-height: 1.2em;
 }
 
-.notice div.e-content {
+.notice .e-content {
     margin-left: 55px;
 }
 
-.entry-metadata .repeat {
+.notice-options {
-    display: block;
-}
-
-.entry-metadata .repeat .u-photo {
-float:none;
-margin-right:1px;
-position:relative;
-top:4px;
-left:0;
-}
-
-.entry-metadata {
-    clear: left;
-    float: left;
-    font-size: 0.88em;
-}
-
-.entry-metadata, .notice-options {
     margin-bottom: 7px;
     margin-top: 12px;
 }
@@ -820,7 +788,7 @@ position:static;
     max-width: 100%;
 }
 .notice.h-entry .attachments .inline-attachment > a {
-    font-size: 0.88em;
+    font-size: 0.8em;
     line-height: 16px;
     height: 16px;
 }
@@ -881,7 +849,7 @@ content: ":";
 }
 
 .threaded-replies:empty {
-    margin-bottom: 0px; 
+    display: none;
 }
 
 #content .notice .threaded-replies .notice,
@@ -897,7 +865,7 @@ content: ":";
     background: none;
 }
 
-#content .notice .threaded-replies .h-entry,
+#content .notice .threaded-replies .notice.h-entry,
 #content .notice .threaded-replies .entry-title {
     min-height: 1px;
 }
@@ -908,11 +876,7 @@ content: ":";
     top: 12px;
 }
 
-#content .notice .threaded-replies .notice .h-entry p.e-content {
+#content .threaded-replies .notice.h-entry .e-content {
-    margin-left: 32px;
-}
-
-#content .notice .threaded-replies .notice div.e-content {
     margin-left: 32px;
 }
 
@@ -1044,7 +1008,7 @@ padding-top:0;
 margin-right:0;
 }
 
-.p-name.metadata {
+.notice-title {
     display:none;
 }
 
@@ -1494,7 +1458,12 @@ width:auto;
 margin-left:0;
 }
 
-.entry-metadata .timestamp span.p-name {
+.notice > footer {
+    clear: left;
+    font-size: 0.8em;
+}
+
+.notice > footer .timestamp span.p-name {
     display: none;
 }