merged fritx/blog changes

fritx · Sep 14, 2022 · cf950de · cf950de
1 parent 64866dc
commit cf950de
Show file tree

Hide file tree

Showing 10 changed files with 339 additions and 103 deletions.
diff --git a/blog/index.html b/blog/index.html
@@ -6,39 +6,67 @@
   <!-- responsive -->
   <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
 
-  <title>Fritx's Blog</title>
+  <title>Fritx' Blog</title>
 
   <!-- favicon -->
   <link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
 
+  <!-- url fixing -->
+  <script>
+  // 1. remove extraneous index.html, index.htm
+  // 2. ensure trailing slash
+  if (location.pathname.slice(-1) !== '/') {
+    location.href = location.origin + location.pathname.replace(/\/index\.html?$/, '') +
+      '/' + location.search + location.hash;
+  }
+  </script>
+
   <!-- import vendor styles -->
+  <link rel="stylesheet" href="vendor/zenburn.css">
   <link rel="stylesheet" href="vendor/blog.css">
 </head>
 <body>
 
-<!-- fill the img in shared links -->
-<img class="img-holder" src="p/avatar.jpg">
-
-<div class="contents">
+<a target="_blank" href="https://github.com/fritx/silent">
+  <img class="fork-me" src="vendor/fork.png">
+</a>
 
-  <!-- sidebar -->
+<!-- settle contents -->
+<div class="contents" id="contents">
   <div class="sidebar">
     <div class="sidebar-inner">
       <div class="sidebar-page" id="sidebar-page"></div>
     </div>
   </div>
 
-  <!-- main -->
   <div class="main" id="main">
     <div class="main-inner">
       <div class="main-page" id="main-page"></div>
+
+      <!-- disqus container -->
+      <div id="disqus_thread"></div>
     </div>
   </div>
 </div>
 
+<!-- fill the img in shared links -->
+<img class="img-holder" id="img-holder" src="p/avatar.jpg">
+
 <!-- import vendor scripts -->
 <script src="vendor/jquery-1.11.1.min.js"></script>
 <script src="vendor/marked-0.3.2.min.js"></script>
+<script src="vendor/highlight.pack.js"></script>
 <script src="vendor/blog.js"></script>
+
+<!-- import baidu stats -->
+<!-- <script>
+var _hmt = _hmt || [];
+(function() {
+  var hm = document.createElement("script");
+  hm.src = "//hm.baidu.com/hm.js?xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx";
+  var s = document.getElementsByTagName("script")[0];
+  s.parentNode.insertBefore(hm, s);
+})();
+</script> -->
 </body>
 </html>
diff --git a/blog/p/aboutme.md b/blog/p/aboutme.md
@@ -4,17 +4,17 @@
 
 <img alt="avatar" src="avatar.jpg" width="240">
 
-> Life is short, I use JS.
+> Life is short, I use JS
 
-## Major
+## Skills
 
-- Node.js/JavaScript Programming
-- Website Design (CSS/HTML)
-
-## College Studying In
-
-CS College in WYU, China
+- Node.js / JavaScript Programming
+- Website Design (CSS / HTML)
 
 ## On Github
 
 [@fritx](https://github.com/fritx)
+
+## Blog powered by
+
+An Entire Static Blog Framework: [silent](https://github.com/fritx/silent)
diff --git a/blog/p/projects/index.md → blog/p/projects.md b/blog/p/projects/index.md → blog/p/projects.md
@@ -1,13 +1,13 @@
 # Projects that I work in
 
-## [silent](silent/index.md)
+## [silent](projects/silent/)
 
 > Be a silent, static blog
 
-## [great](great.md)
+## [great](projects/great.md)
 
 > Another task runner with js
 
-## [kid.js](kid.js.md)
+## [kid.js](projects/kid.js.md)
 
 > Another Browser-side Module Loader.
diff --git a/blog/p/sidebar.md b/blog/p/sidebar.md
@@ -1,6 +1,6 @@
-# [Fritx's Blog](..)
+# [Fritx' Blog](..)
 
-> Life is short, I use JS.
+> Life is short, I use JS
 
-- [Projects](projects/index.md)
+- [Projects](projects.md)
 - [About Me](aboutme.md)
diff --git a/blog/vendor/blog.css b/blog/vendor/blog.css
@@ -3,13 +3,19 @@ html, body {
   padding: 0;
   line-height: 1.5;
   font-size: 106%;
-  /* font-family: "Microsoft Yahei", sans-serif; */
-  font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
+  /*font-family: "Microsoft YaHei", sans-serif;*/
+  /*font-family: "Helvetica neue",Helvetica,Tahoma,"lantinghei sc","Microsoft Yahei", sans-serif;*/
+  font-family: "Helvetica neue", "Microsoft Yahei", sans-serif;
   word-break: break-word;
   /* word-break: break-all; */
   background-color: #fff;
 }
 
+hr {
+  border: none;
+  border-bottom: dashed 2px #D3DCE6; /* element-ui gray */
+}
+
 img {
   border: 0;
   max-width: 100%;
@@ -18,35 +24,33 @@ img {
 ul, ol {
   padding-left: 30px;
 }
-a {
-  color: rgb(0, 0, 238);
-}
 
-/* learnt from github */
-pre, code {
-  font-family: Consolas, "Liberation Mono", Courier, monospace, sans-serif;
-  background-color: #f7f7f7;
-  border-radius: 3px;
+code, kbd, pre, samp { /* normalize.css */
+  font-family: monospace, monospace;
+  font-size: 1em;
 }
+
+/* 隐藏局部滚动条 样式兼容问题 */
+pre code::-webkit-scrollbar, table::-webkit-scrollbar{display:none;}
+
 pre {
-  font-size: 60%;
-  line-height: 160%;
-  padding: 16px;
-  margin: 0;
-  overflow: auto;
-  word-break: normal;
-  word-wrap: normal;
+  word-break: break-all;
 }
 code {
-  padding: 2px 5px;
-  margin: 0 2px;
+  /* .hljs zenburn */
+  background: #3f3f3f;
+  color: #dcdcdc;
+  font-size: 80%;
+  -webkit-border-radius: 6px; /* 同scroller圆角 */
+  border-radius: 6px;
 }
-pre > code {
-  border: none;
-  background-color: inherit;
-  padding: 0;
-  margin: 0;
+pre code, pre code.hljs {
+  display: block;
+  overflow-x: auto;
+  padding: 0.6em 1em;
 }
+
+/* learnt from github */
 table {
   font-size: 80%;
   width: 100%;
@@ -75,10 +79,13 @@ blockquote {
   padding: 0 15px;
   color: #777;
 }
+a {
+  color: #4078c0;
+}
 
 .sidebar {
   color: #fff;
-  background-color: #2a2a2a;
+  background-color: #336699;
 }
 .sidebar-inner {
   padding: 2% 5%;
@@ -90,7 +97,7 @@ blockquote {
   text-decoration: none;
 }
 .sidebar blockquote {
-  color: #999;
+  color: #bbb;
 }
 
 .main-inner {
@@ -99,20 +106,54 @@ blockquote {
 .main-page {
   padding-bottom: 3%;
 }
+.main-page img {
+  /*-webkit-box-shadow: 0 0 6px rgba(0,0,0, .6);
+  -moz-box-shadow: 0 0 6px rgba(0,0,0, .6);
+  -ms-box-shadow: 0 0 6px rgba(0,0,0, .6);
+  -o-box-shadow: 0 0 6px rgba(0,0,0, .6);
+  box-shadow: 0 0 6px rgba(0,0,0, .6);*/
+}
 
 .img-holder {
   position: absolute;
   top: -9999px;
   left: -9999px;
 }
 
+.fork-me {
+  position: absolute;
+  right: 0;
+  top: 0;
+  z-index: 9999;
+}
+
+/* 实现trello的 超链接效果 自动识别github issues */
+.known-service-link {
+  font-size: 90%;
+  color: #444;
+  background: #D6DADC;
+  border-radius: 3px;
+  padding: 0 4px;
+}
+.known-service-icon {
+  width: 14px;
+  height: 14px;
+  margin-right: 3px;
+  vertical-align: middle;
+}
+
+/* 暂时感觉这类标签应该inline-block展示 */
+code,
+.known-service-link {
+  display: inline-block;
+  margin: 2px;
+  padding: 0 4px;
+}
+
 @media (min-width: 640px) {
   ul, ol {
     padding-left: 40px;
   }
-  pre {
-    font-size: 80%;
-  }
   table {
     font-size: 100%;
   }
@@ -125,6 +166,10 @@ blockquote {
     padding-left: 10%;
     padding-right: 10%;
   }
+
+  .fork-me {
+    position: fixed;
+  }
 }
 
 @media (min-width: 990px) {