调整官网样式

2023-03-30 09:58:35 +08:00
parent 0e315b00c9
commit 07da864c09
4 changed files with 213 additions and 57 deletions
@@ -1,24 +1,25 @@
-// .home-wrapper .banner .banner-conent .hero h1{
-//   font-size 2.8rem!important
-// }
-// // 文档中适配
-// table
-//   width auto
-// .page >*:not(.footer),.card-box
-//   box-shadow: none!important
+.home-wrapper .banner .banner-conent .hero h1{
+  font-size 2.8rem!important
+}

-// .page
-//   @media (min-width $contentWidth + 80)
-//     padding-top $navbarHeight!important
-// .home-wrapper .banner .banner-conent
-//   padding 0 2.9rem
-//   box-sizing border-box
-// .home-wrapper .banner .slide-banner .slide-banner-wrapper .slide-item a
-//   h2
-//     margin-top 2rem
-//     font-size 1.2rem!important
-//   p
-//     padding 0 1rem
+// 文档中适配
+table
+  width auto
+.page >*:not(.footer),.card-box
+  box-shadow: none!important
+
+.page
+  @media (min-width $contentWidth + 80)
+    padding-top $navbarHeight!important
+.home-wrapper .banner .banner-conent
+  padding 0 2.9rem
+  box-sizing border-box
+.home-wrapper .banner .slide-banner .slide-banner-wrapper .slide-item a
+  h2
+    margin-top 2rem
+    font-size 1.2rem!important
+  p
+    padding 0 1rem

 // 评论区颜色重置
 .gt-container
@@ -0,0 +1,93 @@
+// .home-wrapper .banner .banner-conent .hero h1{
+//   font-size 2.8rem!important
+// }
+// // 文档中适配
+// table
+//   width auto
+// .page >*:not(.footer),.card-box
+//   box-shadow: none!important
+
+// .page
+//   @media (min-width $contentWidth + 80)
+//     padding-top $navbarHeight!important
+// .home-wrapper .banner .banner-conent
+//   padding 0 2.9rem
+//   box-sizing border-box
+// .home-wrapper .banner .slide-banner .slide-banner-wrapper .slide-item a
+//   h2
+//     margin-top 2rem
+//     font-size 1.2rem!important
+//   p
+//     padding 0 1rem
+
+// 评论区颜色重置
+.gt-container
+  .gt-ico-tip
+    &::after
+      content: '。( Win + . ) or ( ⌃ + ⌘ + ␣ ) open Emoji'
+      color: #999
+  .gt-meta
+    border-color var(--borderColor)!important
+  .gt-comments-null
+    color var(--textColor)
+    opacity .5
+  .gt-header-textarea
+    color var(--textColor)
+    background rgba(180,180,180,0.1)!important
+  .gt-btn
+    border-color $accentColor!important
+    background-color $accentColor!important
+  .gt-btn-preview
+    background-color rgba(255,255,255,0)!important
+    color $accentColor!important
+  a
+    color $accentColor!important
+  .gt-svg svg
+    fill $accentColor!important
+  .gt-comment-content,.gt-comment-admin .gt-comment-content
+    background-color rgba(150,150,150,0.1)!important
+    &:hover
+      box-shadow 0 0 25px rgba(150,150,150,.5)!important
+    .gt-comment-body
+      color var(--textColor)!important
+
+
+// qq徽章
+.qq
+  position: relative;
+.qq::after
+  content: "可撩";
+  background: $accentColor;
+  color:#fff;
+  padding: 0 5px;
+  border-radius: 10px;
+  font-size:12px;
+  position: absolute;
+  top: -4px;
+  right: -35px;
+  transform:scale(0.85);
+
+// demo模块图标颜色
+body .vuepress-plugin-demo-block__wrapper
+  &,.vuepress-plugin-demo-block__display
+    border-color rgba(160,160,160,.3)
+  .vuepress-plugin-demo-block__footer:hover
+    .vuepress-plugin-demo-block__expand::before
+      border-top-color: $accentColor !important;
+      border-bottom-color: $accentColor !important;
+    svg
+      fill: $accentColor !important;
+
+
+// 全文搜索框
+.suggestions
+  overflow: auto
+  max-height: calc(100vh - 6rem)
+  @media (max-width: 719px) {
+    width: 90vw;
+    min-width: 90vw!important;
+    margin-right: -20px;
+  }
+  .highlight
+    color: $accentColor
+    font-weight: bold
@@ -4,9 +4,9 @@
 //***vdoing主题-变量***//

 // // 颜色
-
+$nprogressColor = #4274F4
 // $bannerTextColor = #fff // 首页banner区(博客标题)文本颜色
-// $accentColor = #11A8CD
+$accentColor = #4274F4
 // $arrowBgColor = #ccc
 // $badgeTipColor = #42b983
 // $badgeWarningColor = darken(#ffe564, 35%)
@@ -23,40 +23,40 @@
 // $lineNumbersWrapperWidth = 2.5rem

 // 浅色模式
-// .theme-mode-light
-//   --bodyBg: rgba(255,255,255,1)
-//   --mainBg: rgba(255,255,255,1)
-//   --sidebarBg: rgba(255,255,255,.8)
-//   --blurBg: rgba(255,255,255,.9)
-//   // --textColor: #004050
-//   --textLightenColor: #0085AD
-//   --borderColor: rgba(0,0,0,.15)
-//   --codeBg: #f6f6f6
-//   --codeColor: #525252
-//   codeThemeLight()
+.theme-mode-light
+  --bodyBg: #f4f4f4
+  --mainBg: #fff
+  --sidebarBg: #fff
+  --blurBg: #fff
+  // --textColor: #004050
+  --textLightenColor: #4274F4
+  --borderColor: rgba(0,0,0,.15)
+  --codeBg: #282C34
+  --codeColor: #fff
+  codeThemeDark()

-// // 深色模式
-// .theme-mode-dark
-//   --bodyBg: rgba(30,30,34,1)
-//   --mainBg: rgba(30,30,34,1)
-//   --sidebarBg: rgba(30,30,34,.8)
-//   --blurBg: rgba(30,30,34,.8)
-//   --textColor: rgb(140,140,150)
-//   --textLightenColor: #0085AD
-//   --borderColor: #2C2C3A
-//   --codeBg: #252526
-//   --codeColor: #fff
-//   codeThemeDark()
+// 深色模式
+.theme-mode-dark
+  --bodyBg: #22272E
+  --mainBg: #22272E
+  --sidebarBg: #22272E
+  --blurBg: #22272E
+  --textColor: #ADBAC7
+  --textLightenColor: #4274F4
+  --borderColor: #2C2C3A
+  --codeBg: #282C34
+  --codeColor: #fff
+  codeThemeDark()

-// // 阅读模式
-// .theme-mode-read
-//   --bodyBg: rgba(245,245,213,1)
-//   --mainBg: rgba(245,245,213,1)
-//   --sidebarBg: rgba(245,245,213,.8)
-//   --blurBg: rgba(245,245,213,.9)
-//   --textColor: #004050
-//   --textLightenColor: #0085AD
-//   --borderColor: rgba(0,0,0,.15)
-//   --codeBg: #282c34
-//   --codeColor: #fff
-//   codeThemeDark()
+// 阅读模式
+.theme-mode-read
+  --bodyBg: rgba(245,245,213,1)
+  --mainBg: rgba(245,245,213,1)
+  --sidebarBg: rgba(245,245,213,.8)
+  --blurBg: rgba(245,245,213,.9)
+  --textColor: #004050
+  --textLightenColor: #4274F4
+  --borderColor: rgba(0,0,0,.15)
+  --codeBg: #282C34
+  --codeColor: #fff
+  codeThemeDark()
@@ -0,0 +1,62 @@
+
+// 原主题变量已弃用，以下是vdoing使用的变量，你可以在这个文件内修改它们。
+
+//***vdoing主题-变量***//
+
+// // 颜色
+
+// $bannerTextColor = #fff // 首页banner区(博客标题)文本颜色
+// $accentColor = #11A8CD
+// $arrowBgColor = #ccc
+// $badgeTipColor = #42b983
+// $badgeWarningColor = darken(#ffe564, 35%)
+// $badgeErrorColor = #DA5961
+
+// // 布局
+// $navbarHeight = 3.6rem
+// $sidebarWidth = 18rem
+// $contentWidth = 860px
+// $homePageWidth = 1100px
+// $rightMenuWidth = 230px // 右侧菜单
+
+// // 代码块
+// $lineNumbersWrapperWidth = 2.5rem
+
+// 浅色模式
+// .theme-mode-light
+//   --bodyBg: rgba(255,255,255,1)
+//   --mainBg: rgba(255,255,255,1)
+//   --sidebarBg: rgba(255,255,255,.8)
+//   --blurBg: rgba(255,255,255,.9)
+//   // --textColor: #004050
+//   --textLightenColor: #0085AD
+//   --borderColor: rgba(0,0,0,.15)
+//   --codeBg: #f6f6f6
+//   --codeColor: #525252
+//   codeThemeLight()
+
+// // 深色模式
+// .theme-mode-dark
+//   --bodyBg: rgba(30,30,34,1)
+//   --mainBg: rgba(30,30,34,1)
+//   --sidebarBg: rgba(30,30,34,.8)
+//   --blurBg: rgba(30,30,34,.8)
+//   --textColor: rgb(140,140,150)
+//   --textLightenColor: #0085AD
+//   --borderColor: #2C2C3A
+//   --codeBg: #252526
+//   --codeColor: #fff
+//   codeThemeDark()
+
+// // 阅读模式
+// .theme-mode-read
+//   --bodyBg: rgba(245,245,213,1)
+//   --mainBg: rgba(245,245,213,1)
+//   --sidebarBg: rgba(245,245,213,.8)
+//   --blurBg: rgba(245,245,213,.9)
+//   --textColor: #004050
+//   --textLightenColor: #0085AD
+//   --borderColor: rgba(0,0,0,.15)
+//   --codeBg: #282c34
+//   --codeColor: #fff
+//   codeThemeDark()