更多操作
Beiweidoge(留言 | 贡献) 小无编辑摘要 |
Beiweidoge(留言 | 贡献) 无编辑摘要 |
||
| (未显示同一用户的1个中间版本) | |||
| 第42行: | 第42行: | ||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
font-weight: bold; | font-weight: bold; | ||
} | } | ||
| 第97行: | 第96行: | ||
margin : 2rem 0; | margin : 2rem 0; | ||
} | } | ||
} | |||
.home-link__button { | |||
display: flex; | |||
} | } | ||
2024年12月7日 (六) 23:06的最新版本
/*首页*/
.urasaka-header {
margin : 6rem 0;
}
.urasaka-header img {
border-radius : 50%;
display : block;
margin : 10px auto;
}
.urasaka-header a {
display : block;
width : 250px;
}
.urasaka-header__title {
text-align : center;
font-size : 2rem;
}
.urasaka-header__subtitle {
text-align : center;
font-size : .75rem;
}
.urasaka-container {
display : grid;
grid-gap : 0.625rem;
grid-template-columns : 1fr 1fr 1fr;
}
.urasaka-container #edit-info {
justify-content : center;
}
.home-card__top {
background: var(--color-surface-2);
padding: 10px;
margin: 0;
display: flex;
align-items: center;
font-weight: bold;
}
/*早期写的卡片 修改by Aurora_Lemon*/
.urasaka-card {
background : var(--color-surface-1);
border-radius : 20px;
margin : .25rem 0;
box-shadow : 0 4px 8px rgba(100,100,111,0.1);/*兄弟你搞谷歌设置的样式吗 深色有灰白色的阴影*/
overflow : hidden;
display : flex;
flex-direction : column;
justify-content : space-between;
border : 1px solid var(--border-color-base);
}
.urasaka-card__padding {
padding : 1rem;
}
.urasaka-card__title {
padding : 7px 15px;
background : var(--color-surface-2);
font-size : 22px;
font-weight : bold;
}
.urasaka-card__content {
padding : 1rem;
height : 100%;
display : flex;
justify-content : space-between;
flex-direction : column;
}
/*友链*/
.urasaka-frilink {
background : var(--color-surface-1);
border-radius : 20px;
margin-top : 3rem;
box-shadow : 0 4px 8px rgba(100,100,111,0.1);
overflow : hidden;
border : 1px solid var(--border-color-base);
}
/*多平台显示支持 CSS方面 by Aurora_Lemon*/
@media (max-width: 720px) {
.urasaka-container {
grid-template-columns : 1fr;
}
.urasaka-header {
margin : 2rem 0;
}
}
.home-link__button {
display: flex;
}