User:Selfice/sandbox/首页/styles.css:修订间差异
无编辑摘要 |
无编辑摘要 |
||
(未显示同一用户的64个中间版本) | |||
第1行: | 第1行: | ||
.base_block { | .base_block { | ||
padding: | padding: 15px; | ||
margin: 0.8em auto; | margin: 0.8em auto; | ||
background-color: rgba(255, 255, 255, 0.1); | background-color: rgba(255, 255, 255, 0.1); | ||
第7行: | 第7行: | ||
.base_block_main{ | .base_block_main{ | ||
max-width: 1600px; | max-width: 1600px; | ||
} | |||
.base_100_img{ | |||
margin:0; | |||
padding:3px; | |||
} | |||
.base_100_img span img{ | |||
width: 100%; | |||
height: 100%; | |||
object-fit: contain; | |||
max-height: 108px; | |||
} | |||
@media (max-width: 1500px) { | |||
.welcome_title{ | |||
font-size: 32px; | |||
} | |||
} | |||
@media (min-width: 1500px) { | |||
.welcome_title{ | |||
font-size: 36px; | |||
} | |||
} | } | ||
.flex_block{ | .flex_block{ | ||
第14行: | 第34行: | ||
} | } | ||
.welcome_title{ | .welcome_title{ | ||
font-weight: bold; | font-weight: bold; | ||
text-align:center; | |||
} | } | ||
.sidebar_block{ | .sidebar_block{ | ||
min-width:300px; | min-width:300px; | ||
margin: | margin:2px; | ||
flex-grow: 1; | flex-grow: 1; | ||
padding: 0.6em; | |||
flex: 1 1 33%; | |||
} | |||
.statisticians_block{ | |||
display: flex; | |||
flex-wrap: nowrap; | |||
justify-content: space-between; | |||
gap: 10px; | |||
} | |||
.statisticians_left{ | |||
flex: 1 1 0; | |||
display: flex; | |||
} | |||
.statisticians_right{ | |||
flex: 1 1 0; | |||
float: right; | |||
text-align: right; | |||
} | |||
.title_h2{ | |||
font-size: 1.5em; | |||
border-left: 8px solid var(--twitch-purple); | |||
padding-left: 5px; | |||
font-weight: 900; | |||
} | |||
.title_h2_neuro{ | |||
font-size: 1.5em; | |||
border-left: 8px solid #e3c3ad; | |||
padding-left: 5px; | |||
font-weight: 900; | |||
} | |||
.title_h2_evil{ | |||
font-size: 1.5em; | |||
border-left: 8px solid #b30239; | |||
padding-left: 5px; | |||
font-weight: 900; | |||
} | |||
.style_button{ | |||
width: 100%; | |||
background-color: var(--twitch-purple); | |||
color: #fff; | |||
transition: all 0.2s ease; | |||
} | |||
.style_button:hover{ | |||
background-color: var(--twitch-purple-2); | |||
} | |||
.style_button a{ | |||
width: 100%; | |||
padding: 3px; | |||
color: #fff; | |||
display: flex; | |||
justify-content: center; | |||
font-size: 16px; | |||
} | |||
.sidebar_block_img{ | |||
padding: 0; | padding: 0; | ||
flex: 1 1 | } | ||
.sidebar_block_img .item-img div .mw-halign-center span img{ | |||
width: 100%; | |||
height: 100%; | |||
object-fit: contain; | |||
} | |||
@media (max-width: 1669px) { | |||
.sidebar_block_img{ | |||
flex: 1 1 100%; | |||
} | |||
} | |||
@media (max-width: 800px) { | |||
.sidebar_block_img{ | |||
flex: auto; | |||
} | |||
} | |||
@media (min-width: 1669px) { | |||
.sidebar_block_img{ | |||
flex: 1 1 33%; | |||
} | |||
} | |||
.img_button{ | |||
height: 80px; | |||
color: white; | |||
font-weight: bold; | |||
font-size: 32px; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
transition:background-color 0.2s ease-out, color 0.3s ease-out; | |||
cursor:pointer; | |||
margin:3px; | |||
} | |||
.img_button:hover{ | |||
border: 3px solid #000; | |||
} | |||
.neuro_button_lock{ | |||
background-color: #e3baad; | |||
border: 3px solid #e3baad; | |||
} | |||
.evil_button_lock{ | |||
background-color: #b30256; | |||
border: 3px solid #b30256; | |||
} | |||
.neuro_button_lock:hover{ | |||
background-color: #e3c3ad; | |||
color:#000; | |||
} | |||
.evil_button_lock:hover{ | |||
background-color: #B30239; | |||
color:#000; | |||
} | |||
.neuro_button{ | |||
background-color: #e3c3ad; | |||
border: 3px solid #e3c3ad; | |||
} | |||
.evil_button{ | |||
background-color: #B30239; | |||
border: 3px solid #B30239; | |||
} | |||
.synopsis{ | |||
overflow: hidden; /* 隐藏超出部分 */ | |||
text-overflow: ellipsis; /* 使用省略号表示超出部分 */ | |||
word-break: break-all; /* 保证文本不会因没有空格而长单词不换行 */ | |||
} | |||
.page_button{ | |||
display: flex; | |||
justify-content: center; | |||
} | |||
.page_button a{ | |||
background-color: #eeccdd; | |||
width: 100%; | |||
display: flex; | |||
justify-content: center; | |||
height: 100px; | |||
align-items: center; | |||
font-size: 24px; | |||
color: white; | |||
padding-left: 0; | |||
transition:all 0.2s ease-out; | |||
} | |||
.page_button a:hover{ | |||
text-decoration: none; | |||
padding-left: 50%; | |||
color: darkcyan; | |||
background-color: #debccd; | |||
} | |||
#t-collapsible-toggle-all{ | |||
display:none; | |||
} | } |