틀:정보상자/styles.css: 두 판 사이의 차이
식물 vs 좀비 위키
편집 요약 없음 |
편집 요약 없음 |
||
| 61번째 줄: | 61번째 줄: | ||
width: 100%; | width: 100%; | ||
min-height: 58px; | min-height: 58px; | ||
padding: 0.72rem | padding: 0.72rem 2.1rem 0.68rem; | ||
border: 1px solid #765b45; | border: 1px solid #765b45; | ||
border-radius: 0; | border-radius: 0; | ||
| 81번째 줄: | 81번째 줄: | ||
line-height: 1.28; | line-height: 1.28; | ||
text-align: center; | text-align: center; | ||
overflow: hidden; | |||
overflow-wrap: anywhere; | overflow-wrap: anywhere; | ||
word-break: keep-all; | word-break: keep-all; | ||
| 89번째 줄: | 90번째 줄: | ||
position: absolute; | position: absolute; | ||
z-index: 2; | z-index: 2; | ||
top: | top: -1px; | ||
bottom: -1px; | |||
width: 21px; | |||
background: #e8ddc9; | |||
content: ""; | content: ""; | ||
} | } | ||
| 100번째 줄: | 99번째 줄: | ||
.infobox__title::before { | .infobox__title::before { | ||
left: -1px; | left: -1px; | ||
clip-path: polygon(0 0, 100% 50%, 0 100%); | |||
} | } | ||
.infobox__title::after { | .infobox__title::after { | ||
right: -1px; | right: -1px; | ||
clip-path: polygon(100% 0, 0 50%, 100% 100%); | |||
} | } | ||
| 279번째 줄: | 278번째 줄: | ||
width: 35%; | width: 35%; | ||
padding-right: 1rem; | padding-right: 1rem; | ||
padding-left: 0. | padding-left: 0.78rem; | ||
border: 1px solid #ae9272; | border: 1px solid #ae9272; | ||
border-right: 0; | border-right: 0; | ||
border-radius: 9px 0 0 9px; | |||
border-radius: | |||
background: #d5c2a4; | background: #d5c2a4; | ||
color: #49372c; | color: #49372c; | ||
| 304번째 줄: | 302번째 줄: | ||
position: absolute; | position: absolute; | ||
z-index: 3; | z-index: 3; | ||
top: | top: -1px; | ||
right: - | right: -18px; | ||
bottom: -1px; | |||
width: 19px; | |||
background: #d5c2a4; | |||
content: ""; | content: ""; | ||
clip-path: polygon(0 0, 100% 50%, 0 100%); | |||
} | } | ||
.infobox__details td { | .infobox__details td { | ||
position: relative; | |||
z-index: 1; | |||
width: 65%; | width: 65%; | ||
padding-right: 0.76rem; | padding-right: 0.76rem; | ||
padding-left: 1. | padding-left: 1.35rem; | ||
border: 1px solid #cbb79b; | border: 1px solid #cbb79b; | ||
border-left: 0; | border-left: 0; | ||
border-radius: 0 | border-radius: 0 9px 9px 0; | ||
background: rgba(253, 249, 241, 0.96); | background: rgba(253, 249, 241, 0.96); | ||
color: #3b3028; | color: #3b3028; | ||
| 397번째 줄: | 395번째 줄: | ||
.infobox__title { | .infobox__title { | ||
min-height: 64px; | min-height: 64px; | ||
padding: 0.82rem | padding: 0.82rem 2.3rem 0.78rem; | ||
font-size: 1.9rem; | font-size: 1.9rem; | ||
line-height: 1.18; | line-height: 1.18; | ||
| 404번째 줄: | 402번째 줄: | ||
.infobox__title::before, | .infobox__title::before, | ||
.infobox__title::after { | .infobox__title::after { | ||
width: 23px; | |||
} | } | ||
| 447번째 줄: | 435번째 줄: | ||
padding-left: 0.78rem; | padding-left: 0.78rem; | ||
font-size: 0.98rem; | font-size: 0.98rem; | ||
} | |||
.infobox__details th::after { | |||
right: -20px; | |||
width: 21px; | |||
} | } | ||
| 452번째 줄: | 445번째 줄: | ||
width: 66%; | width: 66%; | ||
padding-right: 0.76rem; | padding-right: 0.76rem; | ||
padding-left: 1. | padding-left: 1.45rem; | ||
font-size: 1rem; | font-size: 1rem; | ||
} | } | ||
| 465번째 줄: | 458번째 줄: | ||
.infobox__title { | .infobox__title { | ||
min-height: 58px; | min-height: 58px; | ||
padding: 0.72rem | padding: 0.72rem 1.9rem 0.68rem; | ||
font-size: 1.7rem; | font-size: 1.7rem; | ||
} | } | ||
| 471번째 줄: | 464번째 줄: | ||
.infobox__title::before, | .infobox__title::before, | ||
.infobox__title::after { | .infobox__title::after { | ||
width: 18px; | |||
} | } | ||
| 519번째 줄: | 502번째 줄: | ||
.infobox__details th { | .infobox__details th { | ||
width: 38%; | width: 38%; | ||
padding-right: 0. | padding-right: 0.78rem; | ||
padding-left: 0.62rem; | padding-left: 0.62rem; | ||
border-radius: 8px 0 0 8px; | border-radius: 8px 0 0 8px; | ||
font-size: 0.92rem; | font-size: 0.92rem; | ||
| 528번째 줄: | 510번째 줄: | ||
.infobox__details th::after { | .infobox__details th::after { | ||
right: - | right: -14px; | ||
width: 15px; | |||
} | } | ||
| 538번째 줄: | 517번째 줄: | ||
width: 62%; | width: 62%; | ||
padding-right: 0.58rem; | padding-right: 0.58rem; | ||
padding-left: | padding-left: 1.05rem; | ||
border-radius: 0 8px 8px 0; | border-radius: 0 8px 8px 0; | ||
font-size: 0.96rem; | font-size: 0.96rem; | ||
| 563번째 줄: | 542번째 줄: | ||
} | } | ||
html.skin-theme-clientpref-night .infobox__title::before | html.skin-theme-clientpref-night .infobox__title::before, | ||
html.skin-theme-clientpref-night .infobox__title::after { | html.skin-theme-clientpref-night .infobox__title::after { | ||
background: #39312b; | |||
} | } | ||
| 612번째 줄: | 588번째 줄: | ||
html.skin-theme-clientpref-night .infobox__details th::after { | html.skin-theme-clientpref-night .infobox__details th::after { | ||
background: #59483b; | |||
} | } | ||
| 652번째 줄: | 628번째 줄: | ||
} | } | ||
html.skin-theme-clientpref-os .infobox__title::before | html.skin-theme-clientpref-os .infobox__title::before, | ||
html.skin-theme-clientpref-os .infobox__title::after { | html.skin-theme-clientpref-os .infobox__title::after { | ||
background: #39312b; | |||
} | } | ||
| 701번째 줄: | 674번째 줄: | ||
html.skin-theme-clientpref-os .infobox__details th::after { | html.skin-theme-clientpref-os .infobox__details th::after { | ||
background: #59483b; | |||
} | } | ||
