fix(link): fix long words and URLs style bug

assets/css/_core/_base.scss

@@ -30,6 +30,7 @@ body {
   line-height: 1.5rem;
   background-color: $global-background-color;
   color: $global-font-color;
+  overflow-wrap: break-word;
 
   &::before {
     content: "";
@@ -59,6 +60,7 @@ body {
 a {
   color: $global-link-color;
   text-decoration: none;
+  word-break: break-all;
   transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease;
 
   &:hover {

assets/css/_page/_index.scss

@@ -1,17 +1,17 @@
-@import "_home";
-@import "_404";
-
 .page {
   position: relative;
   width: 100%;
   max-width: 980px;
   margin: 0 auto;
   padding-top: 6rem;
-
-  @import "_post";
-  @import "_posts";
 }
 
+@import "_home";
+@import "_404";
+
+@import "_post";
+@import "_posts";
+
 .archive {
   .post-title {
     text-align: right;

assets/css/_page/_post.scss

@@ -1,11 +1,12 @@
 /** Post **/
-.post-title {
+.post {
-  margin: 0 !important;
+  .post-title {
+    margin: 0;
     font-size: 1.8rem;
     line-height: 3rem;
-}
+  }
 
-.post-meta {
+  .post-meta {
     font-size: .88rem;
     color: $global-font-secondary-color;
 
@@ -36,9 +37,9 @@
     .author {
       font-size: 1.05rem;
     }
-}
+  }
 
-.post-featured-image {
+  .post-featured-image {
     padding-top: .6rem;
 
     img {
@@ -48,11 +49,11 @@
       margin: 0 auto;
       overflow: hidden;
     }
-}
+  }
 
-@import "../_partial/_post/toc";
+  @import "../_partial/_post/toc";
 
-.post-content {
+  .post-content {
     .post-dummy-target:target {
       display: inline-block;
       position: relative;
@@ -369,8 +370,8 @@
     .float-right {
       float: right;
     }
+  }
+
+  @import "../_partial/_post/footer";
+  @import "../_partial/_post/comment";
 }
-
-@import "../_partial/_post/footer";
-
-@import "../_partial/_post/comment";

assets/css/_page/_posts.scss

@@ -9,7 +9,7 @@
   }
 }
 
-.post {
+.summary {
   padding-top: 1rem;
   padding-bottom: .8rem;
   color: $global-font-color;
@@ -36,7 +36,7 @@
     }
   }
 
-  .post-list-title {
+  .post-title {
     font-size: 1.6rem;
   }
 
@@ -60,14 +60,19 @@
   }
 
   .post-content {
+    display: -moz-box;
     display: -webkit-box;
+    -moz-box-orient: vertical;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3;
     margin-top: .3rem;
     width: 100%;
-    max-height: 10rem;
+    overflow: hidden;
     text-overflow: ellipsis;
-    -webkit-box-orient: vertical;
+    overflow-wrap: break-word;
-    -webkit-line-clamp: 2;
+  }
 
+  h1,
   h2,
   h3,
   h4,
@@ -75,16 +80,21 @@
   h6,
   p {
     font-size: 1rem;
-      margin: 0;
+    display: inline;
-      padding: .2rem 0;
+
-      overflow: hidden;
+    &::after {
-      overflow-wrap: break-word;
+      content: "\A";
-      text-overflow: ellipsis;
+      white-space: pre;
+    }
   }
 
-    a {
+  h1,
-      word-break: break-all;
+  h2,
-    }
+  h3,
+  h4,
+  h5,
+  h6 {
+    line-height: 2;
   }
 
   .post-footer {

assets/css/_page/_tags.scss

@@ -5,7 +5,7 @@
     display: inline-block;
     position: relative;
     margin: 5px 10px;
-    word-wrap: break-word;
+    overflow-wrap: break-word;
     transition-duration: .3s;
     transition-property: transform;
     transition-timing-function: ease-out;

assets/css/_partial/_post/_toc.scss

@@ -5,7 +5,7 @@
   margin-left: 1000px;
   padding: 0 .8rem;
   border-left: 1px solid $global-border-color;
-  word-wrap: break-word;
+  overflow-wrap: break-word;
   box-sizing: border-box;
   top: 12rem;
 

layouts/_default/summary.html

@@ -1,4 +1,4 @@
-<article class="post" itemscope itemtype="http://schema.org/Article">
+<article class="post summary" itemscope itemtype="http://schema.org/Article">
     {{- /* Featured image */ -}}
     {{- with .Params.featured_image -}}
         <div class="post-featured-image-preview">
@@ -8,7 +8,7 @@
     {{- end -}}
 
     {{- /* Title */ -}}
-    <h1 class="post-title post-list-title" itemprop="name headline">
+    <h1 class="post-title" itemprop="name headline">
         <a href="{{ .Permalink }}">{{ .Title }}</a>
     </h1>
 

layouts/index.html

@@ -1,7 +1,7 @@
 {{- define "content" -}}
     {{- /* Home mode [post] */ -}}
     {{- if eq .Site.Params.home_mode "post" -}}
-        <div class="page">
+        <div class="page home">
             {{- /* Profile */ -}}
             {{- partial "home/profile.html" . -}}
 

layouts/posts/single.html

@@ -1,7 +1,7 @@
 {{- define "title" }}{{ .Title }} | {{ .Site.Title }}{{ end -}}
 
 {{- define "content" -}}
-    <article class="page">
+    <article class="page post">
         {{- /* Title */ -}}
         <h1 class="post-title animated flipInX">{{ .Title }}</h1>