enhance responsive style

assets/css/common/post-entry.css

@@ -8,14 +8,18 @@
     overflow: hidden;
     display: -webkit-box;
     -webkit-box-orient: vertical;
-    -webkit-line-clamp: 3;
+    margin: var(--gap) 0 calc(var(--gap) * 2);
-    margin: 1.5em 0;
 }
 
 .first-entry .entry-header h1 {
     font-size: 34px;
     line-height: 1.3;
 }
+@media screen and (max-width: 400px) {
+    .first-entry .entry-header h1 {
+        font-size: 30px;
+    }
+}
 
 .first-entry .entry-content {
     margin: 14px 0;

assets/css/common/post-single.css

@@ -84,6 +84,7 @@
     font-weight: 500;
     color: var(--primary);
     box-shadow: var(--link-underline-shadow);
+    transition: var(--link-transition);
 }
 .post-content a:hover {
     color: var(--link-hover-color);
@@ -288,6 +289,10 @@ h6:hover .anchor {
     margin: 1rem auto;
 }
 
+.post-content video {
+    width: 100%;
+}
+
 .post-content figure.align-center {
     text-align: center;
 }
@@ -485,3 +490,13 @@ h6:hover .anchor {
 [dir="rtl"] .paginav .next {
     text-align: left;
 }
+
+.full-width {
+    left: 50%;
+    margin-left: -50vw;
+    margin-right: -50vw;
+    max-width: 100vw;
+    position: relative;
+    right: 50%;
+    width: 100vw;
+  }

data/svg.toml

@@ -244,7 +244,7 @@ gitlab = '''
 </svg>
 '''
 gmail = '''
-<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Gmail</title><path d="M24 5.457v13.909c0 .904-.732 1.636-1.636 1.636h-3.819V11.73L12 16.64l-6.545-4.91v9.273H1.636A1.636 1.636 0 0 1 0 19.366V5.457c0-2.023 2.309-3.178 3.927-1.964L5.455 4.64 12 9.548l6.545-4.91 1.528-1.145C21.69 2.28 24 3.434 24 5.457z"/></svg>
+<svg role="img" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><title>Gmail</title><path d="M24 5.457v13.909c0 .904-.732 1.636-1.636 1.636h-3.819V11.73L12 16.64l-6.545-4.91v9.273H1.636A1.636 1.636 0 0 1 0 19.366V5.457c0-2.023 2.309-3.178 3.927-1.964L5.455 4.64 12 9.548l6.545-4.91 1.528-1.145C21.69 2.28 24 3.434 24 5.457z"/></svg>
 '''
 goodreads = '''
 <svg xmlns="http://www.w3.org/2000/svg" role="img" fill="currentColor" viewBox="0 0 24 24">

layouts/shortcodes/video.html

@@ -1,5 +1,7 @@
+<figure>
 <video class="video-shortcode" preload="{{ .Get "preload" }}" controls>
   <source src="{{ .Get "src" }}" type="{{ .Get "type" }}">
   There should have been a video here but your browser does not seem
   to support it.
 </video>
+</figure>