Fix page list style

lib/views/widget/page_list.html

@@ -8,25 +8,28 @@
 {% endif %}
 
 <li class="page-list-li">
-  <img src="{{ page.revision.author|picture }}" class="picture picture-rounded">
+  <div class="picture-outer">
+    <img src="{{ page.revision.author|picture }}" class="picture picture-rounded">
+  </div>
+  <div class="page-link-outer">
+    <a class="page-list-link" href="{{ page.path }}"
+      data-path="{{ page.path }}"
+      data-short-path="{{ page.path|path2name }}">{{ page.path }}</a>
 
-  <a class="page-list-link" href="{{ page.path }}"
-    data-path="{{ page.path }}"
-    data-short-path="{{ page.path|path2name }}">{{ page.path }}</a>
+    <span class="page-list-meta">
+      {% if page.isPortal() %}
+        <span class="label label-info">PORTAL</span>
+      {% endif  %}
 
-  <span class="page-list-meta">
-    {% if page.isPortal() %}
-      <span class="label label-info">PORTAL</span>
-    {% endif  %}
+      {% if page.commentCount > 0 %}
+        <i class="fa fa-comment"></i>{{ page.commentCount }}
+      {% endif  %}
 
-    {% if page.commentCount > 0 %}
-      <i class="fa fa-comment"></i>{{ page.commentCount }}
-    {% endif  %}
-
-    {% if !page.isPublic() %}
-      <i class="fa fa-lock"></i>
-    {% endif %}
-  </span>
+      {% if !page.isPublic() %}
+        <i class="fa fa-lock"></i>
+      {% endif %}
+    </span>
+  </div>
 </li>
 {% endfor %}
 </ul>

resource/css/_page_list.scss

@@ -29,18 +29,26 @@
       list-style: none;
       line-height: 1.8em;
 
-      .picture {
-        width: 16px;
-        height: 16px;
-        margin-right: 4px;
+      .picture-outer {
+        float: left;
+
+        .picture {
+          width: 16px;
+          height: 16px;
+          margin-right: 4px;
+        }
       }
 
-      .page-list-link {
-        font-size: 1.1em;
-        color: #666;
+      .page-link-outer {
+        padding-left: 20px;
+
+        .page-list-link {
+          font-size: 1.1em;
+          color: #666;
 
-        strong {
-          color: #333;
+          strong {
+            color: #333;
+          }
         }
       }
     }