Tối ưu hóa
MỞ RỘNG KHUNG CONTENT:
/* docs/.vitepress/theme/global.css */
@media (min-width: 1440px) {
.VPSidebar {
padding-left: 20px !important;
width: 240px !important;
}
.VPNavBar .title {
padding-left: 10px !important;
width: 230px !important;
}
.VPContent.has-sidebar {
padding-left: 250px !important;
padding-right: 5vw !important;
}
.VPNavBar .curtain {
width: 100% !important;
}
.VPNavBar .content {
padding-left: 0px !important;
padding-right: 0px !important;
}
}
@media (min-width: 960px) {
.VPDoc {
padding: 32px 0 0 !important;
}
.VPNavBar .content {
padding-left: 0px !important;
padding-right: 0px !important;
}
}
.VPNavBar {
padding-right: 20px !important;
}
.VPNavBar .container {
margin: unset;
max-width: unset;
}
.VPDoc.has-aside .content-container {
max-width: 100% !important;
}
.aside {
max-width: 200px !important;
padding-left: 0 !important;
}
SỬA ĐỔI KIỂU GIỜ:
/* docs/.vitepress/theme/global.css */
.vp-doc hr {
margin: 16px 0;
border: none !important;
}
.vp-doc hr::before {
content: '';
display: block;
height: 30px;
background: url(https://images.bddxg.top/blog/logo.webp) repeat-x;
background-size: contain;
}
Hình nền thay đổi theo chủ đề
/* 应用在首页index.md内和关于页about.md内 */
.Layout:has(.VPHome) {
background: url('https://images.bddxg.top/blog/202402152108494.webp')
no-repeat;
background-size: cover;
background-attachment: fixed;
user-select: none;
transition: 0.5s ease-in-out;
}
.dark .Layout:has(.VPHome) {
background: url('https://images.bddxg.top/blog/202402152017530.webp')
no-repeat;
background-size: cover;
background-attachment: fixed;
user-select: none;
transition: 0.5s ease-in-out;
}
Màu văn bản cho thư mục ở mọi cấp độ
/* docs/.vitepress/theme/global.css */
.vp-doc h1,
.vp-doc h2,
.vp-doc h3,
.vp-doc h4,
.vp-doc h5,
.vp-doc h6,
.vp-doc .header-anchor:before {
color: unset !important;
background: linear-gradient(to right, #6fbef7, #ba89ff);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
width: max-content;
}
Chỉnh sửa màu phông chữ chế độ ban đêm
/* docs/.vitepress/theme/global.css */
:root {
--vp-c-text-dark-1: rgba(255, 255, 197, 0.86);
--vp-c-text-dark-2: rgba(207, 216, 231, 0.6);
--vp-c-text-dark-3: rgba(207, 216, 231, 0.38);
}
Văn bản thanh bên vượt quá mức ẩn
/* docs/.vitepress/theme/global.css */
.VPSidebarItem .VPLink p {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
max-width: 200px;
}
Văn bản tiêu đề của nút chuyển trang vượt quá mức ẩn
/* docs/.vitepress/theme/global.css */
.VPDocFooter .pager .title {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
Sửa đổi kiểu in đậm văn b ản
/* docs/.vitepress/theme/global.css */
.vp-doc strong {
font-size: 18px;
font-weight: bolder !important;
color: #54adef;
padding: 0 4px;
}
Sửa đổi kiểu tham chiếuvitepress 1.0.0-rc.4
/* docs/.vitepress/theme/global.css */
.vp-doc blockquote {
border-left: 4px solid #6fbef7;
border-radius: 4px;
background-color: var(--vp-badge-tip-bg);
}
Sửa đổi kiểu mã nội tuyếnvitepress 1.0.0-rc.4
/* docs/.vitepress/theme/global.css */
li > code,
table code,
p code {
word-break: break-word;
color: var(--vp-c-red) !important;
font-weight: bold;
border: #6fbef7 2px dotted;
background-color: transparent !important;
}
Sửa đổi kiểu siêu liên kết văn bảnvitepress 1.0.0-rc.4
/* docs/.vitepress/theme/global.css */
.vp-doc a {
text-decoration: underline;
}
Chỉnh sửa màu phông chữ chế độ ban đêm
/* docs/.vitepress/theme/global.css */
:root {
--vp-c-text-dark-1: rgba(255, 255, 197, 0.86);
--vp-c-text-dark-2: rgba(207, 216, 231, 0.6);
--vp-c-text-dark-3: rgba(207, 216, 231, 0.38);
}
Màu văn bản cho thư mục ở mọi cấp độvitepress 1.0.0-rc.4
/* docs/.vitepress/theme/global.css */
.vp-doc h1,
.vp-doc h2,
.vp-doc h3,
.vp-doc h4,
.vp-doc h5,
.vp-doc h6,
.vp-doc .header-anchor:before {
color: unset !important;
background: linear-gradient(to right, #6fbef7, #ba89ff);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
width: max-content;
}