feat: improve style

layout/layout.ejs

@@ -39,6 +39,7 @@
           <div id="reimu-hits"></div>
           <div id="reimu-pagination" class="reimu-pagination"></div>
         </div>
+        <img class="reimu-bg" src="<%- url_for('/images/reimu.png', {relative: false}) %>"/>
       </div>
     </div>
     <%- partial('_partial/after-footer') %>

source/css/_partial/header.styl

@@ -155,6 +155,7 @@ $nav-link-wrap
   background: url("../images/taichi.png") no-repeat center / 80%
   transform: rotate(0deg)
   transition: transform 1s
+  will-change: transform
   if reimu_cursor
     cursor: var(--cursor-pointer)
   else

source/css/_partial/highlight.styl

@@ -245,6 +245,10 @@ pre
   else
     cursor: pointer
   color: #fff
+  transition: .3s
+
+  &:hover
+    opacity: .7
 
 .code-lang
   margin: 5px
@@ -269,6 +273,9 @@ pre
   transform: rotate(0deg)
   color: #fff
 
+  &:hover
+    opacity: .7
+
 .code-closed .code-expand
   transform: rotate(-180deg) !important
   transition: .3s

source/css/_partial/post.styl

@@ -21,6 +21,10 @@ $post-wrap
 .post-wrapper
   border-radius: post-radius
   transition: .3s
+
+  img
+    will-change: transform
+
   @media mq-normal
     &:hover
       transform: scale(1.015)

source/css/_partial/search.styl

@@ -51,6 +51,10 @@
   else
     cursor: pointer
   padding-left: 15px
+  transition: 0.3s
+
+  &:hover
+    opacity: .8
 
 .reimu-search
   display: flex
@@ -93,7 +97,10 @@
   overflow: auto
   padding: 10px 30px
   box-sizing: border-box
-  height: calc(100% - 50px)
+  max-height: calc(100% - 50px)
+
+  @media mq-normal
+    min-height: 300px
 
   hr
     margin: 10px 0
@@ -108,6 +115,10 @@
   margin-top: 10px
   margin-left: 10px
 
+  mark
+    background: var(--red-1)
+    color: white
+
 .reimu-hit-item-link
   display: block
   text-decoration: none
@@ -136,7 +147,6 @@
 
 .reimu-pagination
   margin: 10px auto
-  background: var(--color-wrap)
   border-radius: post-radius
   text-align: center
   color: var(--grey-9)
@@ -171,3 +181,10 @@
   .disabled-item
     display: none
 
+
+.reimu-bg
+  position: absolute
+  right: 0
+  bottom: 0
+  z-index: -1
+  opacity: .5

source/css/_partial/sidebar.styl

@@ -127,6 +127,7 @@ $sidebar-state-content
   height: 25px
   font: 20px font-icon
   transition: transform .2s
+  will-change: transform
 
   &:hover
     transform: scale(1.2)
@@ -244,6 +245,7 @@ $menu-link
   transform: rotate(0deg)
   transition: transform 1s
   pointer-events: none
+  will-change: transform
 
 .sidebar-menu-link-dummy
   position: absolute