_sass/jekyll-zeta.scss in jekyll-zeta-0.5.6 vs _sass/jekyll-zeta.scss in jekyll-zeta-0.6.0

@@ -1,5 +1,6 @@
+
 $color-red: #FF0000;
 $color-black: #333;
 $color-blue: #0064c1;
 $color-hove: #0064c1;
 $color-gray: #9ca3af;
@@ -12,32 +13,46 @@
 main{
   margin:  2.5em 0;
 }
 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{
   line-height: 1.6;
 }
 .w {
   margin: auto;
-  max-width: 750px;
+  max-width: 960px;
   padding: 2em ;
   word-wrap: break-word;
   background-color: white;
   // box-shadow: 0 2px 3px 0 #eee
 }
 
 code.highlighter-rouge {
   color: $color-black;
   background: $color-lightGrayBg;
-  border-radius: 3px;
+  border-radius: 5px;
   padding: 0 5px;
   margin: 5px;
 }
 
 code {
@@ -45,11 +60,11 @@
   background: $color-lightGrayBg;;
   max-height: 35rem;
 }
 
 div.highlighter-rouge code {
-  border-radius: 4px;
+  border-radius: 10px;
   display: block;
   overflow: auto;
   padding: 1rem;
 }
 
@@ -59,16 +74,32 @@
   margin: 0 auto;
 }
 
 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 {
   margin: 0
 }
@@ -90,35 +121,68 @@
   padding: 0.4em 1em ;
 }
 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';
+  // }
 }
   
 
 a {
   text-decoration: none;
   color: $color-blue;
 }
 
+
 .w > h1>a {
   color: $color-black;
 }
 
 .w > h1>a:hover {
   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;
   font-weight: 700;
   align-items: center;
@@ -168,11 +232,11 @@
 
 
 .pagebar {
   margin-top: 2rem;
   display: flex;
-  float: right;
+  // float: right;
   align-items: baseline;
 }
 
 .page_number {
   color: $color-black;
@@ -235,21 +299,34 @@
 input[type="button"]:hover{
   background-color: $color-black;
   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%;
 
 }
 
 .iconchar{
   margin-left: 10px;
-  filter:   brightness(0.3);
-  font-size: 0.7em;
+  // filter: grayscale(0.1) brightness(0.6);
+  font-size: 0.6em;
 }