feat(first-screen): add customize the first screen font color in _config.yml

_config.yml

@@ -2,16 +2,16 @@
 #  Your basic info
 # ---------------------------------------------------------------------------------------
 base_info:
-  # Your website title
+  # Your blog website title
   title: Keep Theme
 
-  # Your blog author name
+  # Your blog website author name
   author: Keep Team
 
-  # Your website url
+  # Your blog website url
   url: https://keep.xpoet.cn/
 
-  # Your website logo image
+  # Your blog website logo image
   # You can use local image, image external link or don’t fill
   logo: /images/logo.svg
 
@@ -54,6 +54,10 @@ style:
     # First screen description
     description: Keep writing and Keep loving.
 
+    # If you want to customize the first screen font color, you can fill in here (e.g. "#0066CC")
+    # Otherwise use the theme default font color
+    font_color:
+
     # If enable hitokoto
     # First screen description is different every time when you enter the site
     hitokoto:

source/css/layout/_partial/first-screen.styl

@@ -2,7 +2,10 @@ $first-screen-font-size = 2rem;
 $first-screen-icon-size = 1.6rem;
 
 $temp-img = hexo-config('style.first_screen.background_img');
-$first-screen-img = $temp-img ? $temp-img:'/images/bg.svg';
+$first-screen-img = $temp-img ? $temp-img : '/images/bg.svg';
+
+$temp-font-color = hexo-config('style.first_screen.font_color');
+$first-screen-font-color = $temp-font-color ? convert($temp-font-color) : var(--default-text-color);
 
 .first-screen-container {
   position: relative;
@@ -32,8 +35,7 @@ $first-screen-img = $temp-img ? $temp-img:'/images/bg.svg';
       font-size: $first-screen-font-size;
       line-height: 1.8;
       text-align: center;
-      color: var(--default-text-color);
-
+      color: $first-screen-font-color;
 
       +keep-tablet() {
         font-size: $first-screen-font-size * 0.9;