fix nav bar

themes/butterfly/layout/includes/header/menu_item.pug

@@ -2,7 +2,7 @@ if theme.menu
   .menus_items
     each value, label in theme.menu
       if typeof value !== 'object'
-        .icat_menus_item
+        .menus_item
           - const [link, icon] = value.split('||').map(part => trim(part))
           a.site-page(href=url_for(link))
             if icon

themes/butterfly/layout/includes/header/nav.pug

@@ -10,7 +10,7 @@ nav#nav
         span.site-name=(page.title || config.title)
         span.site-name
           i.fa-solid.fa-circle-arrow-left
-          span= '  ' + _p('post.back_to_home')
+          span= '' + _p('post.back_to_home')
 
   #menus
     //- if theme.search.use

themes/butterfly/source/css/_layout/head.styl

@@ -338,7 +338,7 @@
   .menus_items
     display: inline
 
-    .icat_menus_item
+    .menus_item
       position: relative
       display: inline-block
       padding: 0 0 0 14px

themes/butterfly/source/css/style.css

@@ -383,6 +383,7 @@
   background: url(https://free.picui.cn/free/2025/08/10/689845496a283.png) no-repeat center center;
   background-size: cover;
 }
+
 #nav-right{
   flex:1 1 auto;
   justify-content: flex-end;
@@ -390,221 +391,59 @@
   display: flex;
   flex-wrap:nowrap;
 }
-/* 菜单栏居中 */
   
-#blog-info a:hover {
+/* 导航栏居中 */
-    background: var(--icat-blue);
+
-    transition: background .3s;
+#sidebar #sidebar-menus .menus_items .menus_item {
-    border-radius: 8px;
+    margin: 10px 0;
 }
-#blog-info a:hover .site-name {
+#sidebar #sidebar-menus .menus_items a.site-page {
-    color: var(--icat-blue) !important;
+    padding-left: 0;
+}
+#sidebar #sidebar-menus .menus_items .site-page {
     position: relative;
-    text-shadow: 0 0 transparent;
+    display: block;
+    padding: 6px 30px 6px 22px;
+    color: var(--font-color);
+    font-size: 1.15em;
+    border: var(--style-border-always);
+    background: var(--icat-card-bg);
+    font-size: 14px;
+    border-radius: 12px;
 }
-#blog-info a:hover .site-name:after {
+#sidebar #sidebar-menus .menus_items .site-page i:first-child {
-    position: absolute;
+    text-align: left;
+    padding-left: 10px;
+}
+
+#nav #menus {
     display: flex;
-    top: 0;
+    justify-content: center;
     width: 100%;
-    height: 100%;
-    content: "\e03a";
-    font-family: "iconfont" !important;
-    font-size: 22px;
-    line-height: 1;
-    color: var(--icat-white);
-    justify-content: center;
-    align-items: center;
-}
-@media screen and (max-width: 768px) {
-    #blog-info a:hover {
-        background: 0;
-        transition: unset;
-        border-radius: 0;
-    }
-    #blog-info a:hover .site-name {
-        color: var(--icat-blue) !important;
-        position: relative;
-        text-shadow: 2px 2px 4px rgba(0,0,0,0.15);
-    }
-    #blog-info a:hover .site-name:after {
-        display: none;
-    }
-}
-/* 主页按钮 */
-
-#nav.show {
-    display: flex;
-    justify-content: center;
-}
-#nav .site-page {
-    padding-bottom: 14px;
-}
-#page-header.not-top-img #nav {
-    display: flex;
-    justify-content: center;
-    border-bottom: 1px solid var(--icat-secondbg);
-}
-#nav-group {
-    width: 1400px;
-    display: flex;
-    align-items: center;
-    padding: 0 0.6rem;
-    margin-left: auto;
-    margin-right: auto;
-}
-/* 顶部栏宽度定义 */
-
-#nav .menus_items .menus_item .menus_item_child, #nav .menus_items .icat_menus_item .menus_item_child {
-    margin-top: 14px;
-    border: 1px solid var(--icat-secondbg);
-}
-#nav .menus_items .menus_item .menus_item_child li a, #nav .menus_items .icat_menus_item .menus_item_child li a {
-    padding: 8px 34px;
-    text-align: center;
-}
-#travellings {
-    padding: 0 14px 0 0;
-}
-
-/* PC菜单栏美化 */
-@supports not (selector(::-webkit-scrollbar)) {
-    html {
-        scrollbar-width: auto;
-        scrollbar-color: #bbb #bbb;
-    }
-}
-
-#sidebar #sidebar-menus .menus_items .menus_item_child {
-    display: -webkit-box;
-    display: -moz-box;
-    display: -webkit-flex;
-    display: -ms-flexbox;
-    display: box;
-    display: flex;
-    -webkit-box-orient: horizontal;
-    -moz-box-orient: horizontal;
-    -o-box-orient: horizontal;
-    -webkit-flex-direction: row;
-    -ms-flex-direction: row;
-    flex-direction: row;
-    -webkit-box-lines: multiple;
-    -moz-box-lines: multiple;
-    -o-box-lines: multiple;
-    -webkit-flex-wrap: wrap;
-    -ms-flex-wrap: wrap;
-    flex-wrap: wrap;
-}
-#sidebar #sidebar-menus .menus_items a.site-page, #sidebar .menus_item ul {
-    padding-left: 0;
-}
-#sidebar #sidebar-menus .menus_item_child li {
-    width: calc(50% - 8px);
-    margin: 4px;
-}
-#sidebar #sidebar-menus .menus_item_child .site-page.child {
-    display: -webkit-box;
-    display: -moz-box;
-    display: -webkit-flex;
-    display: -ms-flexbox;
-    display: box;
-    display: flex;
-    -webkit-box-orient: vertical;
-    -moz-box-orient: vertical;
-    -o-box-orient: vertical;
-    -webkit-flex-direction: column;
-    -ms-flex-direction: column;
-    flex-direction: column;
-    -webkit-box-align: center;
-    -moz-box-align: center;
-    -o-box-align: center;
-    -ms-flex-align: center;
-    -webkit-align-items: center;
-    align-items: center;
-    padding: 8px;
-    border-radius: 12px;
-    border: var(--style-border-always);
-    background: var(--icat-card-bg);
-    font-size: 14px;
-}
-#nav.hide-menu #toggle-menu {
-    padding: 0 0 0 12px;
-}
-#sidebar #sidebar-menus .icat_menus_item .site-page {
-    text-align: center;
-    margin: 4px;
-    display: -webkit-box;
-    display: -moz-box;
-    display: -webkit-flex;
-    display: -ms-flexbox;
-    display: box;
-    display: flex;
-    -webkit-box-orient: vertical;
-    -moz-box-orient: vertical;
-    -o-box-orient: vertical;
-    -webkit-flex-direction: column;
-    -ms-flex-direction: column;
-    flex-direction: column;
-    -webkit-box-align: center;
-    -moz-box-align: center;
-    -o-box-align: center;
-    -ms-flex-align: center;
-    -webkit-align-items: center;
-    align-items: center;
-    padding: 8px 0;
-    border-radius: 12px;
-    font-size: 14px;
-}
-@media screen and (max-width: 768px) {
-    #sidebar #sidebar-menus .menus_items .site-page.group > i:last-child {
-        margin-top: 4px;
-    }
-    #sidebar #sidebar-menus .menus_items .icat_menus_item .site-page i:first-child {
-        text-align: center;
-        padding-left: 0;
-    }
-}
-/* 子菜单美化 */
-
-#sidebar .open > .avatar-img img {
-    height: 100px;
-    width: 100px;
-    border-radius: 50%;
-}
-#sidebar .open > .avatar-img img {
-    border: 5px #fff solid;
-}
-#sidebar .open > .avatar-img::before {
-    bottom: 8px;
-    height: 12px;
-    width: 12px;
-}
-#sidebar .open > .avatar-img::before {
-    content: '';
     position: absolute;
-    left: 50%;
+    left: 0;
-    transform: translate(65%);
+    margin: 0;
-    background: #6bdf8f;
+    transform: translateZ(0);
-    border: 5px solid #fff;
-    border-radius: 50%;
-    transition: filter 375ms ease-in .2s,transform .3s;
-    z-index: 2;
 }
-/* 头像美化 */
+#nav #blog-info {
-
+    flex-wrap: nowrap;
-#sidebar #sidebar-menus .sidebar-site-data {
+    display: flex;
-    padding: 0;
+    align-items: center;
-    margin-left: 10px;
+    z-index: 102;
-    background: var(--icat-card-bg);
+    max-width: fit-content;
-    border-radius: 12px;
-    border: var(--style-border-always);
 }
-@media screen and (max-width: 768px) {
+@media screen and (max-width: 900px) {
-    .site-data {
+    #nav {
-        width: 94%;
+        padding: 0 15px;
+    }
+    #nav-group {
+        padding: 0 0.2rem;
+    }
+    #rightside {
+        right: -42px;
     }
 }
-/* 侧边栏的统计栏美化 */
+/* IPAD菜单栏调整 */
 
 /*https://codepen.io/poojanahelia/pen/Exabvdy*/