feat: update ui

Change-Id: Id114e880835bfd6d9a526670a132cf160089549f
getgridea · May 16, 2022 · 4a81644 · 4a81644
1 parent 39b5256
commit 4a81644
Show file tree

Hide file tree

Showing 16 changed files with 2,178 additions and 2,320 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -64,6 +64,7 @@ module.exports = {
     'import/no-extraneous-dependencies': 0,
     'global-require': 0,
     'no-continue': 0,
+    'linebreak-style': 0,
   },
   parserOptions: {
     parser: '@typescript-eslint/parser',

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "gridea",
-  "version": "0.9.2",
+  "version": "0.9.3",
   "private": true,
   "description": "A static blog writing client. You can use it to record your life, mood, knowledge, notes and ideas...",
   "keywords": [
@@ -34,7 +34,7 @@
     "fs-extra": "^7.0.1",
     "gray-matter": "^4.0.1",
     "hpagent": "^1.0.0",
-    "isomorphic-git": "^1.17.1",
+    "isomorphic-git": "1.17.1",
     "junk": "^3.1.0",
     "less": "^3.9.0",
     "lowdb": "^1.0.0",
@@ -51,7 +51,7 @@
     "markdown-it-sup": "^1.0.0",
     "markdown-it-toc-and-anchor": "^4.2.0",
     "moment": "^2.24.0",
-    "monaco-markdown": "^0.0.12",
+    "monaco-markdown": "^0.0.6",
     "node-ssh": "^6.0.0",
     "normalize-path": "^3.0.0",
     "prismjs": "^1.16.0",

diff --git a/public/default-files/themes/fly/templates/includes/head.ejs b/public/default-files/themes/fly/templates/includes/head.ejs
@@ -1,37 +1,37 @@
-
-<meta charset="utf-8" >
-
-<title><%= siteTitle %></title>
-<meta name="description" content="<%= themeConfig.siteDescription %>">
-
-<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css">
-
-<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
-<link rel="shortcut icon" href="<%= themeConfig.domain %>/favicon.ico?v=<%= site.utils.now %>">
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.10.0/katex.min.css">
-<link rel="stylesheet" href="<%= themeConfig.domain %>/styles/main.css">
-
-<% if (typeof commentSetting !== 'undefined' && commentSetting.showComment) { %>
-  <% if (commentSetting.commentPlatform === 'gitalk') { %>
-    <link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css" />
-  <% } %>
-
-  <% if (commentSetting.commentPlatform === 'disqus') { %>
-    <link rel="stylesheet" href="https://unpkg.com/disqusjs@1.1/dist/disqusjs.css" />
-  <% } %>
-<% } %>
-
-<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
-<script src="https://cdn.bootcss.com/highlight.js/9.12.0/highlight.min.js"></script>
-
-<% if (site.customConfig.ga) { %>
-<script async src="https://www.googletagmanager.com/gtag/js?id=<%= site.customConfig.ga %>"></script>
-<script>
-  window.dataLayer = window.dataLayer || [];
-  function gtag(){dataLayer.push(arguments);}
-  gtag('js', new Date());
-
-  gtag('config', '<%= site.customConfig.ga %>');
-</script>
-<% } %>
+
+<meta charset="utf-8" >
+
+<title><%= siteTitle %></title>
+<meta name="description" content="<%= themeConfig.siteDescription %>">
+
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css">
+
+<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
+<link rel="shortcut icon" href="<%= themeConfig.domain %>/favicon.ico?v=<%= site.utils.now %>">
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.10.0/katex.min.css">
+<link rel="stylesheet" href="<%= themeConfig.domain %>/styles/main.css">
+
+<% if (typeof commentSetting !== 'undefined' && commentSetting.showComment) { %>
+  <% if (commentSetting.commentPlatform === 'gitalk') { %>
+    <link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css" />
+  <% } %>
+
+  <% if (commentSetting.commentPlatform === 'disqus') { %>
+    <link rel="stylesheet" href="https://unpkg.com/disqusjs@1.1/dist/disqusjs.css" />
+  <% } %>
+<% } %>
+
+<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
+<script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.5.1/build/highlight.min.js"></script>
+
+<% if (site.customConfig.ga) { %>
+<script async src="https://www.googletagmanager.com/gtag/js?id=<%= site.customConfig.ga %>"></script>
+<script>
+  window.dataLayer = window.dataLayer || [];
+  function gtag(){dataLayer.push(arguments);}
+  gtag('js', new Date());
+
+  gtag('config', '<%= site.customConfig.ga %>');
+</script>
+<% } %>
diff --git a/public/default-files/themes/fly/templates/post.ejs b/public/default-files/themes/fly/templates/post.ejs
@@ -31,7 +31,7 @@
               </span>
             <% } %>
           </div>
-          <div class="post-content">
+          <div class="post-content" v-pre>
             <%- post.content %>
           </div>
         </div>

diff --git a/public/default-files/themes/notes/templates/post.ejs b/public/default-files/themes/notes/templates/post.ejs
@@ -4,7 +4,7 @@
     <meta name="description" content="<%- post.description %>" />
     <meta name="keywords" content="<%- post.tags.map(tag => tag.name).join(',') %>" />
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.10.0/katex.min.css">
-    <script src="https://cdn.bootcss.com/highlight.js/9.12.0/highlight.min.js"></script>
+    <script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.5.1/build/highlight.min.js"></script>
   </head>
   <body>
     <div class="main">
@@ -32,7 +32,7 @@
               <img class="post-feature-image" src="<%= post.feature %>" alt="">
             <% } %>
             <div class="post-content-wrapper">
-              <div class="post-content">
+              <div class="post-content" v-pre>
                 <%- post.content %>
               </div>
               <div class="toc-container">

diff --git a/public/default-files/themes/paper/templates/_blocks/head.ejs b/public/default-files/themes/paper/templates/_blocks/head.ejs
@@ -1,36 +1,36 @@
-<meta charset="utf-8" >
-
-<title><%= siteTitle %></title>
-<meta name="description" content="<%= themeConfig.siteDescription %>">
-
-<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
-<link rel="shortcut icon" href="<%= themeConfig.domain %>/favicon.ico?v=<%= site.utils.now %>">
-
-<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
-<link rel="stylesheet" href="https://unpkg.com/papercss@1.6.1/dist/paper.min.css" />
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.10.0/katex.min.css">
-<link rel="stylesheet" href="<%= themeConfig.domain %>/styles/main.css">
-
-<% if (typeof commentSetting !== 'undefined' && commentSetting.showComment) { %>
-  <% if (commentSetting.commentPlatform === 'gitalk') { %>
-    <link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css" />
-  <% } %>
-
-  <% if (commentSetting.commentPlatform === 'disqus') { %>
-    <link rel="stylesheet" href="https://unpkg.com/disqusjs@1.1/dist/disqusjs.css" />
-  <% } %>
-<% } %>
-<script src="https://cdn.bootcss.com/highlight.js/9.12.0/highlight.min.js"></script>
-
-
-<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
-<% if (site.customConfig.ga) { %>
-<script async src="https://www.googletagmanager.com/gtag/js?id=<%= site.customConfig.ga %>"></script>
-<script>
-  window.dataLayer = window.dataLayer || [];
-  function gtag(){dataLayer.push(arguments);}
-  gtag('js', new Date());
-
-  gtag('config', '<%= site.customConfig.ga %>');
-</script>
-<% } %>
+<meta charset="utf-8" >
+
+<title><%= siteTitle %></title>
+<meta name="description" content="<%= themeConfig.siteDescription %>">
+
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
+<link rel="shortcut icon" href="<%= themeConfig.domain %>/favicon.ico?v=<%= site.utils.now %>">
+
+<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
+<link rel="stylesheet" href="https://unpkg.com/papercss@1.6.1/dist/paper.min.css" />
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.10.0/katex.min.css">
+<link rel="stylesheet" href="<%= themeConfig.domain %>/styles/main.css">
+
+<% if (typeof commentSetting !== 'undefined' && commentSetting.showComment) { %>
+  <% if (commentSetting.commentPlatform === 'gitalk') { %>
+    <link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css" />
+  <% } %>
+
+  <% if (commentSetting.commentPlatform === 'disqus') { %>
+    <link rel="stylesheet" href="https://unpkg.com/disqusjs@1.1/dist/disqusjs.css" />
+  <% } %>
+<% } %>
+<script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.5.1/build/highlight.min.js"></script>
+
+
+<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
+<% if (site.customConfig.ga) { %>
+<script async src="https://www.googletagmanager.com/gtag/js?id=<%= site.customConfig.ga %>"></script>
+<script>
+  window.dataLayer = window.dataLayer || [];
+  function gtag(){dataLayer.push(arguments);}
+  gtag('js', new Date());
+
+  gtag('config', '<%= site.customConfig.ga %>');
+</script>
+<% } %>
diff --git a/public/default-files/themes/paper/templates/post.ejs b/public/default-files/themes/paper/templates/post.ejs
@@ -22,7 +22,7 @@
             <% if (post.feature) { %>
               <img src="<%= post.feature %>" alt="<%= post.title %>">
             <% } %>
-            <div class="post-content">
+            <div class="post-content" v-pre>
               <%- post.content %>
             </div>
           </article>

diff --git a/public/default-files/themes/simple/templates/_blocks/scripts.ejs b/public/default-files/themes/simple/templates/_blocks/scripts.ejs
@@ -13,7 +13,7 @@ var app = new Vue({
 </script>
 
 <% if (site.customConfig.renderCode) { %>
-  <script src="https://cdn.bootcss.com/highlight.js/9.12.0/highlight.min.js"></script>
+  <script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.5.1/build/highlight.min.js"></script>
   <script>
     hljs.initHighlightingOnLoad()
   </script>

diff --git a/src/assets/styles/custom.less b/src/assets/styles/custom.less
@@ -13,7 +13,7 @@
 
 .ant-table-thead > tr > th {
   background: #ffffff;
-  color: #434343b0;
+  color: #1b1b18b0;
   font-weight: normal;
 }
 
@@ -52,6 +52,9 @@
     margin-left: 8px;
     outline: none;
     transition: all 0.3s;
+    display: flex;
+    justify-content: center;
+    align-items: center;
     i {
       font-weight: bold;
     }
@@ -156,14 +159,14 @@
     padding: 4px 8px;
     margin-bottom: 8px;
     color: #b1b1b1;
-    border-radius: 2px;
+    border-radius: 6px;
     transition: all 0.3s;
     &:hover {
       background: #efefef;
     }
   }
   .ant-tabs-tab-active {
-    color: #434343;
+    color: #1b1b18;
   }
 }
 
@@ -206,6 +209,9 @@
   background: #f3f7f9;
   margin: 12px;
   font-size: 14px;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
 }
 
 .ant-modal-close {
@@ -228,7 +234,7 @@
 .ant-menu-inline .ant-menu-item, .ant-menu-inline .ant-menu-submenu-title {
   width: 90%;
   margin-left: 5%;
-  border-radius: 8px;
+  border-radius: 6px;
   color: #666;
 }
 

diff --git a/src/assets/styles/var.less b/src/assets/styles/var.less
@@ -1,15 +1,15 @@
-@primary-color: #555;
-@primary-bg: #f7f6f6;
-@danger-color: #fa5252;
-
-@border-radius-base : 2px;
-@link-color: #1a5ccf;
-@border-color: #e8e8e88a;
-
-@btn-default-border: #eaeaea;
-
-@label-color: #555;
-
-@font-family: PingFang SC,-apple-system,SF UI Text,Lucida Grande,STheiti,Microsoft YaHei,sans-serif;
-
+@primary-color: #1b1b18;
+@primary-bg: #f7f6f6;
+@danger-color: #fa5252;
+
+@border-radius-base : 6px;
+@link-color: #1a5ccf;
+@border-color: #e8e8e88a;
+
+@btn-default-border: #eaeaea;
+
+@label-color: #1b1b18;
+
+@font-family: PingFang SC,-apple-system,SF UI Text,Lucida Grande,STheiti,Microsoft YaHei,sans-serif;
+
 @input-hover-border-color: #999;
diff --git a/src/components/Main.vue b/src/components/Main.vue
@@ -373,6 +373,12 @@ export default class App extends Vue {
 
 /deep/ .ant-menu-item {
   padding-left: 16px !important;
+  transition: all 0.3s;
+  cursor: default;
+
+  &:hover {
+    background-color: #fff;
+  }
 }
 
 /deep/ .ant-menu-vertical .ant-menu-item:after, .ant-menu-vertical-left .ant-menu-item:after, .ant-menu-vertical-right .ant-menu-item:after, .ant-menu-inline .ant-menu-item:after {