Fix several style issues (#1190)

Author: stevenjoezhang

layout/_macro/post-collapse.swig

@@ -15,7 +15,7 @@
     <header class="post-header">
 
       <div class="post-meta">
-        <time class="post-time" itemprop="dateCreated"
+        <time itemprop="dateCreated"
               datetime="{{ moment(post.date).format() }}"
               content="{{ date(post.date, config.date_format) }}">
           {{ date(post.date, 'MM-DD') }}

layout/_partials/header/menu-item.swig

@@ -8,7 +8,7 @@
 
     {%- set menuText = __('menu.' + name) | replace('menu.', '') %}
     {%- if theme.menu_settings.icons %}
-      {%- set menuIcon = '<i class="menu-item-icon fa fa-fw fa-' + value.split('||')[1] | trim | default('question-circle') + '"></i> <br>' %}
+      {%- set menuIcon = '<i class="fa fa-fw fa-' + value.split('||')[1] | trim | default('question-circle') + '"></i>' %}
     {%- endif %}
 
     {%- set menuBadge = '' %}

layout/_partials/header/menu.swig

@@ -25,7 +25,7 @@
       <li class="menu-item menu-item-search">
         <a href="javascript:;" class="popup-trigger">
         {%- if theme.menu_settings.icons %}
-          <i class="menu-item-icon fa fa-search fa-fw"></i> <br>{#
+          <i class="fa fa-search fa-fw"></i>{#
         #}{%- endif %}{#
         #}{{ __('menu.search') }}{#
       #}</a>

source/css/_common/components/post/post-collapse.styl

@@ -95,7 +95,6 @@
     display: inline;
     font-size: $font-size-medium;
     font-weight: normal;
-    line-height: inherit;
     margin-bottom: 0;
     margin-top: 0;
 

…/_common/components/post/post-title.styl …_common/components/post/post-header.stylsource/css/_common/components/post/post-title.styl renamed to source/css/_common/components/post/post-header.styl source/css/_common/components/post/post-title.styl renamed to source/css/_common/components/post/post-header.styl

@@ -1,3 +1,7 @@
+.posts-expand .post-header {
+  font-size: $font-size-large;
+}
+
 .posts-expand .post-title {
   word-wrap();
   font-weight: $font-weight-normal;
@@ -29,7 +33,6 @@
   border-bottom: none;
   color: $black-light;
   display: inline-block;
-  line-height: 1.2;
   position: relative;
   vertical-align: top;
 
@@ -56,3 +59,51 @@
     margin-left: 5px;
   }
 }
+
+.posts-expand .post-meta {
+  color: $grey-dark;
+  font-family: $font-family-posts;
+  margin: 3px 0 60px 0;
+  text-align: center;
+
+  .post-description {
+    font-size: $font-size-small;
+    margin-top: 2px;
+  }
+
+  time {
+    border-bottom: 1px dashed $grey-dark;
+    cursor: help;
+  }
+}
+
+.post-meta .post-meta-item + .post-meta-item::before {
+  content: '|';
+  margin: 0 .5em;
+}
+
+.post-meta .post-meta-item {
+  font-size: $font-size-smallest;
+}
+
+.post-meta-divider {
+  margin: 0 .5em;
+}
+
+.post-meta-item-icon {
+  margin-right: 3px;
+
+  +tablet-mobile() {
+    display: inline-block;
+  }
+}
+
+.post-meta-item-text {
+  if (!hexo-config('post_meta.item_text')) {
+    display: none;
+  }
+
+  +tablet-mobile() {
+    display: none;
+  }
+}

source/css/_common/components/post/post-meta.styl

@@ -6,10 +6,6 @@
     font-size: $font-size-large;
   }
 
-  +mobile() {
-    font-size: $font-size-small;
-  }
-
   span.exturl .fa {
     font-size: $font-size-small;
     margin-left: 4px;
@@ -65,11 +61,10 @@
 @import 'post-eof';
 @import 'post-expand';
 @import 'post-gallery';
-@import 'post-meta';
+@import 'post-header';
 @import 'post-nav';
 @import 'post-rtl';
 @import 'post-tags';
-@import 'post-title';
 @import 'post-widgets';
 
 @import 'post-reward' if (hexo-config('reward_settings.enable'));

source/css/_common/components/post/post.styl

@@ -6,7 +6,7 @@
   margin-top: $post-eof-margin-bottom;
 }
 
-ul.popular-posts {
+.popular-posts {
   padding: 0;
 
   .popular-posts-item {

source/css/_common/components/third-party/related-posts.styl

@@ -18,7 +18,6 @@
 }
 
 .footer-inner {
-  box-sizing: border-box;
   margin: 0 auto;
   text-align: center;
   width: $content-desktop;

source/css/_common/outline/footer/footer.styl

@@ -15,7 +15,6 @@
 .github-corner {
   $scheme = hexo-config('scheme');
   $bg-color = unquote(hexo-config('android_chrome_color'));
-  $mobile-layout-economy = hexo-config('mobile_layout_economy');
 
   :hover .octo-arm {
     animation: octocat-wave 560ms ease-in-out;
@@ -47,16 +46,10 @@
     }
   }
 
-  +mobile() {
-    svg {
-      if ($scheme == 'Mist') {
+  if ($scheme == 'Mist') {
+    +mobile() {
+      svg {
         top: inherit;
-
-        if ($mobile-layout-economy) {
-          +mobile-small() {
-            margin-top: initial;
-          }
-        }
       }
     }
   }