release v3.4.3

chore(release): v3.4.3

README.md

@@ -70,6 +70,12 @@ Or update to latest master branch:
 
 ```sh
 $ cd themes/keep
+$ git pull
+```
+
+_If you modified theme source code:_
+
+```sh
 $ git add .
 $ git stash
 $ git pull

README_zh-CN.md

@@ -70,6 +70,12 @@ $ npm update hexo-theme-keep
 
 ```sh
 $ cd themes/keep
+$ git pull
+```
+
+_如果你修改了主题源码：_
+
+```sh
 $ git add .
 $ git stash
 $ git pull

_config.yml

@@ -5,6 +5,8 @@ base_info:
   title: Keep Theme
   author: Keep Team
   url: https://keep.xpoet.cn/
+  # Logo image (You can use local image, image external link or don’t fill)
+  logo_img:
 
 
 # ---------------------------------------------------------------------------------------
@@ -234,4 +236,4 @@ footer:
 # ---------------------------------------------------------------------------------------
 # Keep version (Please don't modify)
 # ---------------------------------------------------------------------------------------
-version: 3.4.2
+version: 3.4.3

layout/_partial/header.ejs

@@ -2,8 +2,13 @@
 
     <div class="header-content<%- (theme.style.first_screen.enable === true && is_home() && !page.prev) ? ' has-first-screen' : '' %>">
         <div class="left">
+            <% if (theme.base_info.hasOwnProperty('logo_img') && theme.base_info.logo_img) { %>
+                <a class="logo-image" href="/">
+                    <%- image_tag(theme.base_info.logo_img) %>
+                </a>
+            <% } %>
             <a class="logo-title" href="/">
-                <%= theme.base_info.title || config.title || 'Keep theme' %>
+                <%= theme.base_info.title || config.title || 'Keep Theme' %>
             </a>
         </div>
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-keep",
-  "version": "3.4.2",
+  "version": "3.4.3",
   "private": false,
   "description": "A simple and elegant theme for Hexo.",
   "scripts": {

source/css/common/animated.styl

@@ -36,7 +36,7 @@ transition-t(property, delay, duration, function) {
 
 .fade-in-down-animation {
   animation-fill-mode: both;
-  animation-duration: 0.8s;
+  animation-duration: 1s;
   animation-name: fade-in-down;
 }
 
@@ -44,7 +44,7 @@ transition-t(property, delay, duration, function) {
 @keyframes fade-in-down {
   0% {
     opacity: 0;
-    transform: translateY(-20px);
+    transform: translateY(-50px);
   }
 
   100% {

source/css/common/variables.styl

@@ -6,8 +6,8 @@
 // ========================================================================================
 // layout
 // ========================================================================================
-$header-height = 68px;                                           // header height
-$header-shrink-height = 50px;                                    // header shrink height
+$header-height = 70px;                                           // header height
+$header-shrink-height = $header-height * 0.72;                   // header shrink height
 $scroll-progress-bar-height = 2px;                               // scroll progress bar height
 $main-content-width = 80%;                                       // main content width (PC)
 $main-content-width-tablet = 86%;                                // main content width (tablet)

source/css/layout/_partial/header.styl

@@ -1,6 +1,7 @@
 $logo-title-font-size = 2rem;
 $pc-search-icon-font-size = 1.5rem;
 $menu-bar-line-height = 2.5px;
+$logo-image-box-width = 46px;
 
 .header-wrapper {
   width: 100%;
@@ -44,8 +45,33 @@ $menu-bar-line-height = 2.5px;
       transition-t("transform", "0", "0.2", "linear");
 
       .header-shrink & {
-        transform: scale(0.8);
+        transform: scale(0.72);
         transform-origin: left;
+      }
+
+
+      if (hexo-config('base_info.logo_img') && hexo-config('base_info.logo_img') != '') {
+        .logo-image {
+          width: $logo-image-box-width;
+          height: $logo-image-box-width;
+          margin-right: 8px;
+
+
+          +keep-tablet() {
+            width: $logo-image-box-width * 0.9;
+            height: $logo-image-box-width * 0.9;
+          }
+
+          +keep-mobile() {
+            width: $logo-image-box-width * 0.8;
+            height: $logo-image-box-width * 0.8;
+          }
+
+          img {
+            border-radius: 6px;
+            width: 100%;
+          }
+        }
 
       }
 
@@ -64,6 +90,7 @@ $menu-bar-line-height = 2.5px;
           font-size: $logo-title-font-size * 0.8;
         }
       }
+
     }