Skip to content

Commit 791d973

Browse files
HKAI-BotHKAI-Bot
committed
feat:优化前端展示
去掉侧边栏的emoji；优化链接展示样式
1 parent cddb293 commit 791d973

File tree

6 files changed

+255
-46
lines changed

6 files changed

+255
-46
lines changed

‎docs/00-欢迎/_category_.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
label: '👋 欢迎'
1+
label: '欢迎'
22
position: 1
33
collapsible: false
44
link: null # 分类标题不可点击

‎docs/00-欢迎/intro.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ title: 欢迎来到 Memene # <--- 大标题
88
:::
99

1010

11-
## Memene是什么？
11+
## Memene 是什么？
1212
![Memene 品牌图](/img/Gemini_Generated_Image_ggt75zggt75zggt7.png)
1313

1414
Memene 是连接人、创作者与 AI Agent 的智能内容网络。

‎docs/01-快速开始/_category_.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
label: '🚀 快速开始'
1+
label: '快速开始'
22
position: 2
33
collapsible: false
44
link: null # 分类标题不可点击

‎docs/02-核心功能/_category_.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
label: '💎 核心功能'
1+
label: '核心功能'
22
position: 3
33
collapsible: false
44
link: null # 分类标题不可点击

‎docs/03-社群&联系我们/_category_.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
label: '☎️ 联系我们'
1+
label: '联系我们'
22
position: 4
33
collapsible: false
44
link: null # 分类标题不可点击

‎src/css/custom.css‎

Lines changed: 250 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -785,6 +785,37 @@ div[class^="docItemContainer"] {
785785
color: #E11F00;
786786
}
787787

788+
/* 导航栏链接样式：更新日志、官网主页 */
789+
.navbar__item .navbar__link,
790+
.navbar__items--right .navbar__link,
791+
.navbar__link[href*="changelog"],
792+
.navbar__link[href*="memene.cn"] {
793+
color: rgb(44, 62, 80) !important;
794+
cursor: pointer !important;
795+
display: inline-block !important;
796+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
797+
font-size: 14.4px !important;
798+
font-weight: 500 !important;
799+
height: 22.4px !important;
800+
line-height: 22.4px !important;
801+
text-decoration: none !important;
802+
text-decoration-color: rgb(44, 62, 80) !important;
803+
text-decoration-line: none !important;
804+
text-decoration-style: solid !important;
805+
text-decoration-thickness: auto !important;
806+
white-space: nowrap !important;
807+
text-wrap: nowrap !important;
808+
}
809+
810+
/* 导航栏链接悬停状态 */
811+
.navbar__item .navbar__link:hover,
812+
.navbar__items--right .navbar__link:hover,
813+
.navbar__link[href*="changelog"]:hover,
814+
.navbar__link[href*="memene.cn"]:hover {
815+
color: #E11F00 !important;
816+
text-decoration: none !important;
817+
}
818+
788819
/* Logo 占位符：35.2x35.2 */
789820
.navbar__brand .navbar__logo {
790821
display: block !important;
@@ -1349,7 +1380,11 @@ nav.pagination-nav {
13491380
}
13501381

13511382
.theme-doc-markdown h2 {
1352-
display: block !important;
1383+
display: flex !important; /* 改为 flex 以便调整锚点链接位置 */
1384+
flex-direction: row-reverse !important; /* 反转顺序，让锚点链接在前面 */
1385+
justify-content: flex-end !important; /* 内容靠右对齐 */
1386+
align-items: center !important;
1387+
flex-wrap: nowrap !important; /* 防止换行 */
13531388
font-size: 26.4px !important;
13541389
font-weight: 600 !important;
13551390
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
@@ -1447,7 +1482,11 @@ nav.pagination-nav {
14471482
}
14481483

14491484
.theme-doc-markdown h2 {
1450-
display: block !important;
1485+
display: flex !important; /* 改为 flex 以便调整锚点链接位置 */
1486+
flex-direction: row-reverse !important; /* 反转顺序，让锚点链接在前面 */
1487+
justify-content: flex-end !important; /* 内容靠右对齐 */
1488+
align-items: center !important;
1489+
flex-wrap: nowrap !important; /* 防止换行 */
14511490
font-size: 26.4px !important;
14521491
font-weight: 600 !important;
14531492
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
@@ -1634,66 +1673,104 @@ a[class*="pagination-nav__link"]:hover,
16341673
display: none !important;
16351674
}
16361675

1637-
/* 5. 页面标题样式：纯净蓝色文字 */
1676+
/* 5. 页面标题样式：红色文字 */
16381677
.pagination-nav__label {
1639-
color: #2C46F1 !important; /* 亮蓝色 */
1678+
color: #E11F00 !important; /* 红色 */
16401679
font-size: 16px !important;
16411680
font-weight: 500 !important;
16421681
line-height: 1.5 !important;
16431682
transition: color 0.2s ease !important;
16441683
text-decoration: none !important;
16451684
}
16461685

1647-
/* 悬停时文字稍微变深，可选择性添加下划线 */
1686+
/* 悬停时文字变为深红色 */
16481687
.pagination-nav__link:hover .pagination-nav__label {
1649-
color: #1a35d1 !important;
1688+
color: #C31900 !important; /* 深红色 */
16501689
text-decoration: none !important; /* 不显示下划线，保持纯净 */
16511690
}
16521691

1653-
/* 悬停时箭头也一起变色 */
1654-
.pagination-nav__link--prev:hover::before,
1655-
.pagination-nav__link--next:hover::after {
1656-
color: #1a35d1 !important;
1692+
/* 6. 移除 Docusaurus 默认在链接外层添加的引号和箭头 */
1693+
/* 针对链接外层的所有伪元素 */
1694+
.pagination-nav__link::before,
1695+
.pagination-nav__link::after,
1696+
.pagination-nav__link--prev::after,
1697+
.pagination-nav__link--next::before {
1698+
content: none !important;
1699+
display: none !important;
16571700
}
16581701

1659-
/* 7. 布局对齐修正：确保下一页靠右显示 */
1660-
/* 下一篇容器始终右对齐 */
1661-
.pagination-nav__item--next,
1662-
.pagination-nav__item.pagination-nav__item--next {
1663-
text-align: right !important;
1664-
justify-content: flex-end !important;
1665-
display: flex !important;
1666-
margin-left: auto !important; /* 关键：自动推到右侧 */
1667-
flex-grow: 0 !important; /* 不要撑满空间 */
1702+
/* 7. 转发图标样式：与文档内链接保持一致 */
1703+
/* 上一篇：左侧添加转发图标（向左） */
1704+
.pagination-nav__link--prev::before {
1705+
content: "" !important;
1706+
display: inline-block !important;
1707+
width: 14px !important;
1708+
height: 14px !important;
1709+
margin-right: 6px !important; /* 图标和文字的间距 */
1710+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E11F00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='15 18 9 12 15 6'/%3E%3C/svg%3E") !important;
1711+
background-size: contain !important;
1712+
background-repeat: no-repeat !important;
1713+
background-position: center !important;
1714+
transition: transform 0.2s ease !important;
1715+
flex-shrink: 0 !important;
16681716
}
16691717

1670-
/* 上一篇容器左对齐 */
1671-
.pagination-nav__item--prev,
1672-
.pagination-nav__item.pagination-nav__item--prev {
1673-
margin-right: auto !important;
1674-
margin-left: 0 !important;
1675-
flex-grow: 0 !important;
1718+
/* 下一篇：右侧添加转发图标（向右） */
1719+
.pagination-nav__link--next::after {
1720+
content: "" !important;
1721+
display: inline-block !important;
1722+
width: 14px !important;
1723+
height: 14px !important;
1724+
margin-left: 6px !important; /* 图标和文字的间距 */
1725+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E11F00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
1726+
background-size: contain !important;
1727+
background-repeat: no-repeat !important;
1728+
background-position: center !important;
1729+
transition: transform 0.2s ease !important;
1730+
flex-shrink: 0 !important;
16761731
}
16771732

1678-
/* 当只有"下一篇"时（是第一个也是唯一的子元素），确保右对齐 */
1679-
.pagination-nav__item--next:first-child,
1680-
.pagination-nav__item--next:only-child,
1681-
.pagination-nav > .pagination-nav__item--next:first-child {
1682-
margin-left: auto !important;
1733+
/* 悬停时图标移动效果 */
1734+
.pagination-nav__link--prev:hover::before {
1735+
transform: translateX(-2px) !important; /* 向左移动 */
16831736
}
16841737

1685-
/* 针对 Docusaurus 直接放链接的结构 */
1686-
.pagination-nav > .pagination-nav__link--next:first-child,
1687-
.pagination-nav > .pagination-nav__link--next:only-child,
1688-
.pagination-nav > a.pagination-nav__link--next:first-child {
1689-
margin-left: auto !important;
1738+
.pagination-nav__link--next:hover::after {
1739+
transform: translateX(2px) !important; /* 向右移动 */
1740+
}
1741+
1742+
/* 8. 隐藏 Docusaurus 默认的引号（«»）和箭头（< >） */
1743+
/* 隐藏标签层级的所有默认伪元素 */
1744+
.pagination-nav__label::before,
1745+
.pagination-nav__label::after,
1746+
.pagination-nav__link--prev .pagination-nav__label::before,
1747+
.pagination-nav__link--next .pagination-nav__label::after,
1748+
.pagination-nav__item--prev::before,
1749+
.pagination-nav__item--prev::after,
1750+
.pagination-nav__item--next::before,
1751+
.pagination-nav__item--next::after,
1752+
.pagination-nav__item::before,
1753+
.pagination-nav__item::after {
1754+
content: none !important;
1755+
display: none !important;
1756+
visibility: hidden !important;
1757+
width: 0 !important;
1758+
height: 0 !important;
1759+
font-size: 0 !important;
1760+
}
1761+
1762+
/* 确保链接层级也没有默认内容 */
1763+
.pagination-nav__link--prev > *:not(.pagination-nav__label)::before,
1764+
.pagination-nav__link--next > *:not(.pagination-nav__label)::after {
1765+
content: none !important;
1766+
display: none !important;
16901767
}
16911768

1692-
/* 当只有下一篇链接时，让父容器右对齐（现代浏览器） */
1693-
.pagination-nav:has(.pagination-nav__link--next:only-child),
1694-
.pagination-nav:has(.pagination-nav__item--next:only-child),
1695-
.pagination-nav:has(> :first-child.pagination-nav__item--next) {
1769+
/* 9. 布局对齐修正：确保下一页靠右显示 */
1770+
.pagination-nav__item--next {
1771+
text-align: right !important;
16961772
justify-content: flex-end !important;
1773+
display: flex !important;
16971774
}
16981775
/* ============================================================
16991776
🚑 紧急修复：图片与正文重叠问题
@@ -1712,11 +1789,143 @@ a[class*="pagination-nav__link"]:hover,
17121789
margin: 32px 0 !important;
17131790
}
17141791

1715-
/* 3. 给底部/* 3. 给底部导航栏加一个更强的“安全距离” */
1792+
/* 3. 给底部/* 3. 给底部导航栏加一个更强的"安全距离" */
17161793
nav.pagination-nav {
17171794
position: relative !important; /* 确保它遵循文档流 */
17181795
clear: both !important; /* 清除浮动干扰 */
17191796
margin-top: 48px !important; /* 强行推开距离 */
17201797
z-index: 10 !important; /* 确保层级正确 */
17211798
}
1722-
/* 注意：此样式会被上方的统一样式覆盖，如需调整请修改上方的统一样式 */
1799+
/* 注意：此样式会被上方的统一样式覆盖，如需调整请修改上方的统一样式 */
1800+
1801+
/* ============================================================
1802+
标题锚点链接（#）移到标题前面
1803+
============================================================ */
1804+
1805+
/* 使用 flexbox 反转顺序 - 确保所有子元素都被正确处理 */
1806+
.theme-doc-markdown h2,
1807+
.theme-doc-markdown h3,
1808+
.theme-doc-markdown h4 {
1809+
position: relative !important;
1810+
display: flex !important;
1811+
flex-direction: row-reverse !important; /* 反转顺序，让锚点链接在前面 */
1812+
justify-content: flex-end !important; /* 内容靠右对齐 */
1813+
align-items: center !important;
1814+
flex-wrap: nowrap !important; /* 防止换行 */
1815+
}
1816+
1817+
/* 包装标题文本，使其成为 flex 子元素 */
1818+
.theme-doc-markdown h2 > *:not(.hash-link):not(a),
1819+
.theme-doc-markdown h3 > *:not(.hash-link):not(a),
1820+
.theme-doc-markdown h4 > *:not(.hash-link):not(a) {
1821+
order: 1 !important; /* 文本内容在后面 */
1822+
}
1823+
1824+
/* 锚点链接（#）移到前面 */
1825+
.theme-doc-markdown h2 .hash-link,
1826+
.theme-doc-markdown h2 a.anchor,
1827+
.theme-doc-markdown h2 a[href^="#"]:not([href="#"]),
1828+
.theme-doc-markdown h3 .hash-link,
1829+
.theme-doc-markdown h3 a.anchor,
1830+
.theme-doc-markdown h3 a[href^="#"]:not([href="#"]),
1831+
.theme-doc-markdown h4 .hash-link,
1832+
.theme-doc-markdown h4 a.anchor,
1833+
.theme-doc-markdown h4 a[href^="#"]:not([href="#"]) {
1834+
order: -1 !important; /* 锚点链接在最前面 */
1835+
margin-right: 8px !important; /* 锚点链接和文字之间的间距 */
1836+
margin-left: 0 !important;
1837+
flex-shrink: 0 !important; /* 防止锚点链接被压缩 */
1838+
display: inline-block !important;
1839+
}
1840+
1841+
/* 锚点链接（#）移到前面 */
1842+
.theme-doc-markdown h2 .hash-link,
1843+
.theme-doc-markdown h2 a.anchor,
1844+
.theme-doc-markdown h2 a[href^="#"]:not([href="#"]),
1845+
.theme-doc-markdown h3 .hash-link,
1846+
.theme-doc-markdown h3 a.anchor,
1847+
.theme-doc-markdown h3 a[href^="#"]:not([href="#"]),
1848+
.theme-doc-markdown h4 .hash-link,
1849+
.theme-doc-markdown h4 a.anchor,
1850+
.theme-doc-markdown h4 a[href^="#"]:not([href="#"]) {
1851+
order: -1 !important; /* 锚点链接在最前面 */
1852+
margin-right: 8px !important; /* 锚点链接和文字之间的间距 */
1853+
margin-left: 0 !important;
1854+
flex-shrink: 0 !important; /* 防止锚点链接被压缩 */
1855+
display: inline-block !important;
1856+
}
1857+
1858+
/* 确保标题悬浮时，flex 布局和 order 属性仍然生效 */
1859+
.theme-doc-markdown h2:hover,
1860+
.theme-doc-markdown h3:hover,
1861+
.theme-doc-markdown h4:hover {
1862+
display: flex !important;
1863+
flex-direction: row-reverse !important;
1864+
justify-content: flex-end !important;
1865+
align-items: center !important;
1866+
flex-wrap: nowrap !important;
1867+
}
1868+
1869+
/* 确保悬浮时锚点链接仍然在前面 */
1870+
.theme-doc-markdown h2:hover .hash-link,
1871+
.theme-doc-markdown h2:hover a.anchor,
1872+
.theme-doc-markdown h2:hover a[href^="#"]:not([href="#"]),
1873+
.theme-doc-markdown h3:hover .hash-link,
1874+
.theme-doc-markdown h3:hover a.anchor,
1875+
.theme-doc-markdown h3:hover a[href^="#"]:not([href="#"]),
1876+
.theme-doc-markdown h4:hover .hash-link,
1877+
.theme-doc-markdown h4:hover a.anchor,
1878+
.theme-doc-markdown h4:hover a[href^="#"]:not([href="#"]) {
1879+
order: -1 !important;
1880+
margin-right: 8px !important;
1881+
margin-left: 0 !important;
1882+
flex-shrink: 0 !important;
1883+
display: inline-block !important;
1884+
}
1885+
/* ============================================================
1886+
文档内部链接样式：红色文字 + 转发图标
1887+
============================================================ */
1888+
1889+
/* 文档中的内部链接（带 # 的链接，但不是标题的锚点链接） */
1890+
.theme-doc-markdown p a[href^="#"],
1891+
.theme-doc-markdown li a[href^="#"],
1892+
.theme-doc-markdown a[href^="#"]:not(.hash-link):not(.anchor) {
1893+
color: #E11F00 !important; /* 红色文字 */
1894+
text-decoration: none !important;
1895+
transition: all 0.2s ease !important;
1896+
position: relative !important;
1897+
display: inline-flex !important;
1898+
align-items: center !important;
1899+
}
1900+
1901+
/* 添加转发图标（小箭头） */
1902+
.theme-doc-markdown p a[href^="#"]::after,
1903+
.theme-doc-markdown li a[href^="#"]::after,
1904+
.theme-doc-markdown a[href^="#"]:not(.hash-link):not(.anchor)::after {
1905+
content: "" !important;
1906+
display: inline-block !important;
1907+
width: 12px !important;
1908+
height: 12px !important;
1909+
margin-left: 4px !important;
1910+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E11F00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
1911+
background-size: contain !important;
1912+
background-repeat: no-repeat !important;
1913+
background-position: center !important;
1914+
transition: transform 0.2s ease !important;
1915+
flex-shrink: 0 !important;
1916+
}
1917+
1918+
/* 悬停效果 */
1919+
.theme-doc-markdown p a[href^="#"]:hover,
1920+
.theme-doc-markdown li a[href^="#"]:hover,
1921+
.theme-doc-markdown a[href^="#"]:not(.hash-link):not(.anchor):hover {
1922+
color: #C31900 !important; /* 更深的红色 */
1923+
text-decoration: none !important;
1924+
}
1925+
1926+
/* 悬停时图标向右移动 */
1927+
.theme-doc-markdown p a[href^="#"]:hover::after,
1928+
.theme-doc-markdown li a[href^="#"]:hover::after,
1929+
.theme-doc-markdown a[href^="#"]:not(.hash-link):not(.anchor):hover::after {
1930+
transform: translateX(2px) !important;
1931+
}

0 commit comments

Comments
 (0)