jekyll-zeta 0.5.6 → 0.7.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: e3e18c79d7f6a4a82ac492749e4567e623e87e145af68ff336eeb13f7fb68c56
-  data.tar.gz: 02a1c8e61af4ee72a2464a5682dd0e3b37597881d57ae0a551388e0428354f44
+  metadata.gz: 876e7942584b994072aeaa3fc358c3b47fff1c0bac8eac64ef2953c46e290c48
+  data.tar.gz: 1db22eb75758adfe1782f9caa3f0dc05ccb09555867c6845ce4b614256f83ade
 SHA512:
-  metadata.gz: 0bdf2172c53fede25f1acb3753ec6e1aa78d95a0db878e939b6888dc80acaf9198ce9084e44506bc570fcf90e10bf5bc664f8388677d89a080826f72bfb5b757
-  data.tar.gz: 50996cb0d65c8c48477d949976d639197f2bc16b3fd63cec540458fd8de51042d3241220650e309288049df4267390f99a07a1661c9079c0edba9a3b8ecff83e
+  metadata.gz: 9c2503c2fd75b2ca75292e846d83cd195d449d68313a4e8ea940c005060f655da359cc5096bb507922e3887a36698411aac17affcd0ea04dcc6e5f122531e302
+  data.tar.gz: ee2d481bd243157e9ae83e2914919dec871d45a92a2f9da52834784831ba2fdbf0d27368e58d084307a81d6216eed81bd3003b6d648da63e42994d08ffc5b58c

data/_includes/heatmap.html

@@ -0,0 +1,47 @@
+{%- if include.collection -%}
+  {%- assign posts = include.collection -%}  
+{%- else -%}
+  {%- assign posts = site.posts -%}
+{%- endif -%}
+
+{%- assign jsstr='' -%}
+{%- for post in posts limit: include.limit -%}
+
+
+
+{%- capture url -%}
+{{ post.url | relative_url }}
+{%- endcapture -%}
+
+{%- capture postdate -%}
+{{ post.date | date: '%Y-%m-%d' }}
+{%- endcapture -%}
+
+
+{%- capture jsstr -%}
+
+{{ jsstr | append: url  | append:"\x01" | append: post.title | append:"\x01" | append: postdate   | append:"\n" }} 
+{%- endcapture -%}
+{%- endfor -%}
+<div>
+<span class="heatmap-title">{{ heatMapTitle | site.theme_config.heatMapTitle }}</span>
+<div class='heatmap' id="heatmap">
+  
+
+</div>
+</div>
+<script >
+  (function(){
+    var _GALLPOSTSTR = "{{jsstr}}";
+    {%- assign MothStr = site.theme_config.heatMapMonth  -%}
+    {%- assign HeatMapShowWeek = site.theme_config.heatMapShowWeek  -%}
+
+    {%- assign HeatMapType = site.theme_config.heatMapType  -%}
+    
+
+    var _HeatMapType = "{{ HeatMapType | default:'1' }}"
+    var _MonthStr =  '{{ MothnStr | default: "Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec" }}'
+    var _showWeek =  '{{ HeatMapShowWeek | default: "Mon Wed Fri" }}';
+    {% include heatmap.js %}
+  })()
+</script>

data/_includes/heatmap.js

@@ -0,0 +1,152 @@
+;(function(){
+
+var Map = {}
+var  arr1 = _GALLPOSTSTR.split("\n")
+arr1.forEach(element => {
+  var post = element.split('\x01')
+
+  var url = post[0]
+  var title = post[1]
+  var date = post[2]
+  if (date && title && url) {
+    var arrDatePost = Map[date]
+  if (!arrDatePost ) {
+    arrDatePost = []
+    Map[date] = arrDatePost;
+  }
+  arrDatePost.push({title,url})
+  }
+  
+});
+ 
+
+var Father = document.getElementById("heatmap");
+
+const Frag = document.createDocumentFragment();
+
+const monthEle = document.createElement("div");
+monthEle.className = "heatmap-month";
+Frag.appendChild(monthEle);
+const monthStr = _MonthStr.split(" ");
+
+var dateEnd = new Date();
+
+{%- comment -%}
+if(_HeatMapType == '1'){
+  dateEnd = new Date()
+}else if(_HeatMapType == '2'){
+  
+  let chooseddate = ''
+  for (const key in Map) {
+    if (Object.prototype.hasOwnProperty.call(Map, key)) {
+      const element = Map[key];
+      if(element){
+        if(key && key > chooseddate){
+          chooseddate = key
+        }
+      }
+    }
+  }
+
+  dateEnd = new Date(chooseddate)
+  console.log(chooseddate,dateEnd,typeof chooseddate)
+
+}else{
+  dateEnd = new Date()
+}
+
+{% endcomment %}
+
+var nowM = dateEnd.getMonth();
+var nowWeek = dateEnd.getDay();
+var  endStamp = dateEnd.getTime()
+
+for (var i = 0; i < monthStr.length; i++) {
+  var m = document.createElement("span");
+  m.className = "heatmap-month-cell";
+  m.innerHTML = `${monthStr[(i + nowM + 1) % 12]}`;
+  monthEle.appendChild(m);
+}
+
+const weekEle = document.createElement("div");
+weekEle.className = "heatmap-week";
+const WeekStr = _showWeek.split(" ");
+
+for (var i = 0; i < WeekStr.length; i++) {
+  var m = document.createElement("div");
+  m.className = "heatmap-week-cell";
+  m.innerHTML = `<span>${WeekStr[i]}</span>`;
+  weekEle.appendChild(m);
+}
+
+Frag.appendChild(weekEle);
+
+const dayEle = document.createElement("div");
+
+dayEle.className = "heatmap-day";
+
+const ColumnsCount = 53;
+const RowCount = 7;
+
+var  firstDateDayDiff = (ColumnsCount - 1) * RowCount + nowWeek;
+
+
+console.log(nowWeek, firstDateDayDiff);
+
+for (let c = 0; c < ColumnsCount; c++) {
+  for (let r = 0; r < RowCount; r++) {
+    if (r > nowWeek && c == ColumnsCount - 1) {
+      break
+    }
+    const i = c * RowCount + r ;
+    const date = new Date(endStamp - (firstDateDayDiff - i) * 3600000 * 24);
+    const month = date.getMonth() + 1
+    let dateStr = `${date.getFullYear()}-${month < 10 ? '0' + month : month}-${date.getDate() < 10 ? '0' + date.getDate() :  date.getDate() }`
+
+    var m = document.createElement("span");
+    const arrPostInOneDay = Map[dateStr]
+    m.classList = `heatmap-day-cell ${!arrPostInOneDay ? 'hm-check-no':arrPostInOneDay.length > 1 ? 'hm-check2' : 'hm-check' }`  
+    
+
+    if (arrPostInOneDay ) {
+      var isDirectly = arrPostInOneDay.length == 1
+      var tip = document.createElement("div");
+
+      if (isDirectly) {
+        var lnk = document.createElement('a');
+        lnk.href = arrPostInOneDay[0].url
+        m.appendChild(lnk)
+      }
+
+      tip.className = "hm-tip";
+      var desc = ''
+      arrPostInOneDay.forEach(element => {
+
+        var lnk = document.createElement('a');
+        lnk.className = 'hm-tiplink'
+        lnk.href = element.url
+        tip.appendChild(lnk)
+
+        var t = document.createElement('span')
+        t.className = 'hm-date'
+        t.innerText = dateStr.substring(5);
+        lnk.appendChild(t);
+
+        
+        var t2 = document.createElement('span')
+        t2.className = 'hm-title'
+        t2.innerText = element.title
+        lnk.appendChild(t2);
+
+      });
+      m.appendChild(tip);
+      
+    }
+    dayEle.appendChild(m);
+  }
+}
+
+
+Frag.appendChild(dayEle);
+Father.append(Frag);
+})()

data/_includes/home.html

@@ -1,9 +1,16 @@
+
+
+ 
+{%- include heatmap.html -%}
+ 
+
 {%- assign titlelen = page.title.size -%}
 {%- if titlelen > 0 -%}
 <h2>{{ page.title }}</h2>
 {%- endif -%}
 {%-assign nextPage = site.paginate_path | replace: ':num', '2' -%}
 
+
 {%
   include post_list.html
     limit=site.paginate
@@ -12,4 +19,4 @@
     show_more_url= nextPage 
 -%}
 
-{{ content }}
+{{ content }}

data/_layouts/about.html

@@ -0,0 +1,15 @@
+---
+layout: default
+---
+
+
+{%- if page.heatmap -%}
+{%- include heatmap.html -%}
+{%- endif -%}
+
+{%- assign titlelen = page.title.size -%}
+{%- if titlelen > 0 -%}
+<!-- <h2>{{ page.title }}</h2> -->
+{%- endif -%}
+
+{{ content }}

data/_layouts/archive.html

@@ -1,9 +1,14 @@
 ---
 layout: default
 ---
+
+
+{%- if page.heatmap -%}
+{%- include heatmap.html -%}
+{%- endif -%}
 {%- assign titlelen = page.title.size -%}
 {%- if titlelen > 0 -%}
-<h2>{{ page.title }}</h2>
+<!-- <h2>{{ page.title }}</h2> -->
 {%- endif -%}
 
 {%-assign posts = site.posts-%}

data/_layouts/heatmap.html

@@ -0,0 +1,6 @@
+---
+layout: default
+---
+<link rel="stylesheet" href="{{ "/assets/css/main.css" | relative_url }}" />
+<br/><br/><br/>
+{%- include heatmap.html -%}

data/_layouts/tags.html

@@ -5,7 +5,7 @@ layout: default
 <div class="post">
 {%- assign titlelen = page.title.size -%}
 {%- if titlelen > 0 -%}
-<h2>{{ page.title }}</h2>
+<!-- <h2>{{ page.title }}</h2> -->
 {%- endif -%}
 <article>
     {%- comment -%}

data/_sass/jekyll-zeta.scss

@@ -1,3 +1,4 @@
+
 $color-red: #FF0000;
 $color-black: #333;
 $color-blue: #0064c1;
@@ -5,6 +6,15 @@ $color-hove: #0064c1;
 $color-gray: #9ca3af;
 $color-lightGray: #9ca3af;
 $color-lightGrayBg: #F0f2f4;
+$heatFont:Georgia,"Nimbus Roman No9 L","Songti SC",STSong,"AR PL New Sung","AR PL SungtiL GB",NSimSun,SimSun,"TW\-Sung","WenQuanYi Bitmap Song","AR PL UMing CN","AR PL UMing HK","AR PL UMing TW","AR PL UMing TW MBE",sans-serif;
+
+$dbgBorder:none;//ssolid 1px red;
+$hmbloksizeW:12px;
+$hmbloksizeH:15.2px;
+$dayGap:1px;
+$hmdaywidth: $dayGap * 52 + $hmbloksizeW * 53;
+$hmmonthWidth:40px;
+$hmmwidth: $hmmonthWidth + $hmdaywidth;
 li {
   padding: 0.2rem;
 }
@@ -14,10 +24,24 @@ main{
 }
 body{
   font-family: monospace;
-  font-size: 1.1rem;
+  font-size: 1.15rem;
   // background-color: #fafafa;
   margin: 0;
 
+  // &::before{
+  //   content: "";
+  //   position: fixed;
+  //   left: 0;
+  //   right: 0;
+  //   top: 0;
+  //   bottom: 0;
+ 
+  //   // background-image: url(../image/bg-2.png)  ;
+  //   // background-color: #fffef8   ;//#fffef9;
+  //   z-index: -1;
+  //   // filter: grayscale(0.8);
+  //   // opacity: 0.9;
+  // }
 }
 
 article{
@@ -25,7 +49,7 @@ article{
 }
 .w {
   margin: auto;
-  max-width: 750px;
+  max-width: 960px;
   padding: 2em ;
   word-wrap: break-word;
   background-color: white;
@@ -35,7 +59,7 @@ article{
 code.highlighter-rouge {
   color: $color-black;
   background: $color-lightGrayBg;
-  border-radius: 3px;
+  border-radius: 5px;
   padding: 0 5px;
   margin: 5px;
 }
@@ -47,7 +71,7 @@ code {
 }
 
 div.highlighter-rouge code {
-  border-radius: 4px;
+  border-radius: 10px;
   display: block;
   overflow: auto;
   padding: 1rem;
@@ -61,12 +85,28 @@ img {
 
 blockquote {
   font-style: italic;
-  border-left: 5px solid #dfe2e5;
+  border-left: 5px solid $color-lightGray;
   color: #999;
+  // padding: 2rem 0.25rem .25rem 0.25rem;
   padding: 15px;
   margin: 3em 0;
   background-color: $color-lightGrayBg;
 
+  
+  // &::before{
+  //   content: "";
+  //   display: block;
+  //   background: url(../image/quote.svg) no-repeat 50% 50%;
+  //   width: 27px;
+  //   height: 20px;
+  //   position: absolute;
+  //   z-index: 1;
+
+  //   margin-left: -10px;
+  //   margin-top: -24px;
+  //   opacity: 0.1;
+    
+  // }
 }
 
 blockquote p {
@@ -92,15 +132,31 @@ td {
 tr:nth-child(even){
   background-color: #f5f5f5;
 }
- 
+
+// hr {
+//   margin-top: 2rem;
+//   margin-bottom: 2rem;
+  
+
+//   border: 0;
+//   padding: 3px;
+
+//   background: repeating-linear-gradient(135deg, #000 0px, #000 1px, transparent 1px, transparent 5px);
+// }
 
 hr{
-  border: none;
   margin: 2rem 0;
   border:none;
   text-align: center;
   color: $color-gray;
   border-bottom: $color-lightGray dashed 1px;
+  
+
+  // &:before { content: '/////' }
+  // &:after { content:  '/////' }
+  // &[data-content] {
+  //   content: 'xxxxxx';
+  // }
 }
   
 
@@ -109,6 +165,7 @@ a {
   color: $color-blue;
 }
 
+
 .w > h1>a {
   color: $color-black;
 }
@@ -117,6 +174,22 @@ a {
   color: $color-black;
 }
 
+ 
+
+nav{
+ /* 关键样式 */
+ background-color: transparent;
+ background-image: radial-gradient(transparent 1px, #ffffff 1px);
+ background-size: 4px 4px;
+ backdrop-filter: saturate(50%) blur(10px);
+ /* 这个只是固定在页面上面 */
+ position: sticky;
+ top: 0px;
+
+ align-content: center;
+ z-index: 1000;
+}
+ 
 .navul {
   padding: 0;
   display: flex;
@@ -170,7 +243,7 @@ time {
 .pagebar {
   margin-top: 2rem;
   display: flex;
-  float: right;
+  // float: right;
   align-items: baseline;
 }
 
@@ -237,12 +310,25 @@ input[type="button"]:hover{
   color: white;
 }
 
-
+  
 pre{
   white-space: pre-wrap; /* 保留空白字符，但是允许自动换行 */
   overflow-wrap: break-word; /* 在单词内允许换行 */
 }
 
+pre>code{
+  background-color: #1e131eff;
+  color: #e7e7b1;
+  box-shadow: 0px 0px 8px   #000;
+}
+
+pre>code::before {
+  content: url('../image/dots.svg');
+  display: block;  
+  margin-top:-1rem;
+}
+ 
+
 img{
   max-width: 80%;
 
@@ -250,6 +336,170 @@ img{
 
 .iconchar{
   margin-left: 10px;
-  filter:   brightness(0.3);
-  font-size: 0.7em;
+  // filter: grayscale(0.1) brightness(0.6);
+  font-size: 0.6em;
 }
+
+.heatmap{
+  display: grid;
+  grid-template-rows: auto 1fr;
+  grid-template-columns: $hmmonthWidth 1fr;
+  width: $hmmwidth;
+  border: $dbgBorder;
+}
+
+.heatmap-title{
+  color: $color-black;
+  font-size: 1.2rem;
+}
+ 
+ 
+.heatmap-month{
+  
+  grid-column-start: 2;
+  grid-column-end: 3;
+
+  display: grid;
+  grid-template-columns:repeat(12,1fr);
+
+  width: $hmdaywidth;
+  border: $dbgBorder;
+  
+}
+
+ 
+.heatmap-month-cell{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  font-family:  $heatFont;
+  font-size: 0.8rem;
+
+  border: $dbgBorder;
+  height: 12px;
+
+  padding: 0.2em 0;
+  
+}
+
+
+.heatmap-week{
+  
+  grid-row-start: 2;
+  grid-row-end: 3;
+  display: grid;
+  // grid-template-rows:repeat(4,1fr);
+  
+
+  grid-auto-flow: row;
+
+  height: $hmbloksizeW * 7
+}
+ 
+
+.heatmap-week-cell{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding-right: 10px;
+  font-size: 0.8rem;
+  font-family:  $heatFont
+}
+
+.heatmap-day{
+
+  display: grid;
+  grid-template-columns: repeat(53,1fr);
+  grid-template-rows: repeat(7,1fr);
+  grid-auto-flow: column;
+  gap: $dayGap;
+  width: $hmdaywidth;
+}
+
+.heatmap-day-cell{
+
+  border-radius: 2px;
+  // height: 20px;
+  width: $hmbloksizeW;
+  height: $hmbloksizeH;
+}
+
+.heatmap-day-cell a{
+  height: 100%;
+  width: 100%;
+  display: block;
+  white-space: nowrap;
+  overflow:hidden;
+}
+
+.hm-check{
+  background-color: #40c463bb;
+  position: relative;
+  cursor: pointer;
+}
+
+.hm-check2{
+  background-color: #40c463ff;
+  position: relative;
+}
+
+.hm-check-no{
+  background-color: #edebf0;
+}
+
+.heatmap-day-cell:hover{
+  transform: scale(1.3);
+  z-index: 999;
+}
+
+.heatmap-day-cell:hover .hm-tip{
+  display: block;
+}
+
+.hm-tip{
+  position: absolute; /* 让子元素浮动 */
+  bottom: 100%;
+  left: 50%;
+  transform: translateX(-50%);
+  background-color: rgba(0, 0, 0, 0.8);
+  color: white;
+  padding: 10px;
+  border-radius: 5px;
+  z-index: 999;
+
+  width: auto;
+  font-size: 0.8rem;
+  display: none;
+}
+
+.hm-date{
+  color: #fff;
+  text-align: center;
+
+  padding: 0;
+}
+
+.hm-title{
+  color: #fff;
+  white-space: nowrap;
+  overflow:hidden;
+  text-overflow: ellipsis;
+  text-align: left;
+  padding-left:0.5rem;
+
+  max-width: 600px;
+  
+}
+
+.hm-tiplink{
+  padding: 0.2rem 0;
+}
+
+.red{
+  background-color: #ee5500;
+}
+
+.border{
+  border:solid 1px red;
+}

data/assets/css/main.scss

@@ -1,4 +1,4 @@
 ---
 ---
  
-@import  "jekyll-zeta";
+@import  "jekyll-zeta" 

data/assets/image/dots.svg

@@ -0,0 +1,5 @@
+<svg width="50" height="14" xmlns="http://www.w3.org/2000/svg">
+      <circle cx="8" cy="8" r="6" fill="#ff5f56" />
+      <circle cx="24" cy="8" r="6" fill="#ffbd2e" />
+      <circle cx="40" cy="8" r="6" fill="#27c93f" />
+</svg>

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-zeta
 version: !ruby/object:Gem::Version
-  version: 0.5.6
+  version: 0.7.0
 platform: ruby
 authors:
 - vitock
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2023-12-22 00:00:00.000000000 Z
+date: 2024-11-22 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -68,14 +68,18 @@ files:
 - _includes/encrypted.html
 - _includes/goat_counter.html
 - _includes/head.html
+- _includes/heatmap.html
+- _includes/heatmap.js
 - _includes/home.html
 - _includes/main.css
 - _includes/menu_item.html
 - _includes/navbar.html
 - _includes/paginate.html
 - _includes/post_list.html
+- _layouts/about.html
 - _layouts/archive.html
 - _layouts/default.html
+- _layouts/heatmap.html
 - _layouts/home.html
 - _layouts/page.html
 - _layouts/paginate.html
@@ -84,6 +88,8 @@ files:
 - _layouts/tags.html
 - _sass/jekyll-zeta.scss
 - assets/css/main.scss
+- assets/image/dots.png
+- assets/image/dots.svg
 - assets/image/lock.svg
 - assets/js/mouse_coords.js
 - index.html
@@ -106,7 +112,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.3.26
+rubygems_version: 3.3.27
 signing_key: 
 specification_version: 4
 summary: A clean fast, minimalist Jekyll theme.