Last active
February 27, 2024 03:41
-
-
Save enpitsuLin/d90409c48e1465f1eeb702ec2cc8824e to your computer and use it in GitHub Desktop.
My xLog theme
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
html { | |
--theme-color: #4f46e5; | |
} | |
html.dark { | |
--theme-color: #818cf8; | |
} | |
:root { | |
--sidebar-width: 20rem; | |
} | |
@media screen and (max-width: 1024px) { | |
.xlog-post-toc { | |
display: none !important; | |
} | |
} | |
@media (min-width: 769px) { | |
.xlog-social-platforms.hidden { | |
display: none; | |
} | |
} | |
@media (min-width: 768px) and (max-width: 1024px) { | |
:root { | |
--sidebar-width: 16rem; | |
} | |
.xlog-post-area { | |
padding-right: 2rem; | |
} | |
} | |
@media (min-width: 768px) { | |
.medium-zoom-image--opened { | |
z-index: 1001; | |
} | |
.medium-zoom-overlay { | |
z-index: 1000; | |
} | |
.xlog-post-area>div:is(.mx-auto, .max-w-screen-md) { | |
margin: 0; | |
max-width: unset; | |
} | |
.xlog-post-actions { | |
left: calc(100% + 4rem); | |
} | |
.xlog-header { | |
position: fixed; | |
left: 0; | |
height: 100vh; | |
width: var(--sidebar-width); | |
z-index: 100; | |
} | |
.xlog-header .xlog-banner+div.flex.flex-col { | |
flex-direction: column-reverse; | |
justify-content: flex-end; | |
} | |
.xlog-header>div:nth-child(2)>div:first-child { | |
display: none; | |
} | |
.xlog-header>div:nth-child(2)>div:last-child { | |
margin-top: 0.5rem; | |
margin-bottom: 2rem; | |
flex-direction: column; | |
} | |
.xlog-header>div:nth-child(2)>div:last-child>div:last-child { | |
margin-top: 1rem; | |
} | |
.xlog-header .xlog-social-platforms { | |
display: none; | |
} | |
.xlog-header .xlog-site-info { | |
flex-direction: column; | |
align-items: center | |
} | |
.xlog-site-info>span { | |
margin-bottom: 1rem; | |
} | |
.xlog-site-info>span+div { | |
margin: 0 !important; | |
width: 100%; | |
text-align: center; | |
} | |
.xlog-site-info>span+div>div.flex:first-child { | |
flex-direction: column; | |
} | |
.xlog-site-info>span+div>div.flex:first-child>* { | |
margin-bottom: 1rem; | |
} | |
.xlog-site-name+div.flex { | |
flex-direction: row-reverse; | |
margin: 0; | |
gap: 1rem; | |
} | |
.xlog-site-name+div.flex>* { | |
margin: 0 !important; | |
} | |
.xlog-site-description+div.flex.flex-col { | |
flex-direction: column; | |
} | |
.xlog-site-description { | |
order: 3; | |
} | |
.xlog-site-patron { | |
order: 2; | |
margin-top: 0.2rem !important; | |
margin-left: 0 !important; | |
} | |
.xlog-post-area { | |
margin-left: calc(1rem + var(--sidebar-width)); | |
margin-right: 20vw; | |
max-width: unset; | |
} | |
section.xlog-blockchain-info { | |
margin-left: calc(1rem + var(--sidebar-width)); | |
margin-right: 1rem; | |
max-width: unset; | |
} | |
footer { | |
position: fixed; | |
bottom: 0; | |
left: 0; | |
width: var(--sidebar-width); | |
z-index: 1000; | |
} | |
footer>div { | |
padding-top: 1rem !important; | |
padding-bottom: 1rem !important; | |
justify-content: center !important; | |
flex-direction: column-reverse; | |
align-items: center; | |
} | |
footer>div>div { | |
text-align: center; | |
margin-left: 0 !important; | |
margin-top: 0.75rem !important; | |
} | |
footer>div>div:nth-child(2) { | |
display: flex !important; | |
justify-content: center; | |
} | |
footer>div>div:nth-child(2)>* { | |
margin-right: 0.5rem !important; | |
margin-left: 0.5rem !important; | |
} | |
footer>div>button { | |
margin: 0 !important; | |
} | |
footer div[role='tooltip'] { | |
transform: translateY(65px); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
因为 2023-07-18 xlog 个人文章页样式修改了,这里暂时与官方样式保持一致,调整了文章页内的样式与原先保持一致
如果觉得原来的列表样式更好的可以反馈,我尽量复现原来的 🤡