틀:정보상자/styles.css: 두 판 사이의 차이
식물 vs 좀비 위키
편집 요약 없음 |
편집 요약 없음 |
||
| 6번째 줄: | 6번째 줄: | ||
margin: 0 0 1.25rem 1.25rem; | margin: 0 0 1.25rem 1.25rem; | ||
padding: 0.72rem; | padding: 0.72rem; | ||
border: 3px solid # | border: 3px solid #3f843d; | ||
border-radius: 6px; | border-radius: 6px; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
background: # | background: #dcebd7; | ||
color: # | color: #263624; | ||
font-family: | font-family: | ||
-apple-system, | -apple-system, | ||
| 20번째 줄: | 20번째 줄: | ||
font-size: 0.92rem; | font-size: 0.92rem; | ||
line-height: 1.5; | line-height: 1.5; | ||
box-shadow: 0 0 24px rgba( | box-shadow: 0 0 24px rgba(54, 101, 49, 0.34); | ||
} | } | ||
.infobox__title { | .infobox__title { | ||
padding: 0. | padding: 0.42rem 0.85rem; | ||
border: 0; | border: 0; | ||
border-radius: 4px; | border-radius: 4px; | ||
background: # | background: #479745; | ||
color: # | color: #f8fff6; | ||
font-family: | font-family: | ||
"SB Aggro B", | "SB Aggro B", | ||
| 50번째 줄: | 50번째 줄: | ||
border-radius: 5px; | border-radius: 5px; | ||
overflow: hidden; | overflow: hidden; | ||
background: # | background: #f3f8ef; | ||
} | } | ||
| 59번째 줄: | 59번째 줄: | ||
padding: 1.5rem 1rem 1.35rem; | padding: 1.5rem 1rem 1.35rem; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
background: # | background: #eaf3e5; | ||
} | } | ||
| 70번째 줄: | 70번째 줄: | ||
margin: 0 auto; | margin: 0 auto; | ||
object-fit: contain; | object-fit: contain; | ||
filter: drop-shadow(0 11px 9px rgba( | filter: drop-shadow(0 11px 9px rgba(54, 94, 48, 0.24)); | ||
} | } | ||
| 116번째 줄: | 116번째 줄: | ||
width: 35%; | width: 35%; | ||
padding-right: 0.75rem; | padding-right: 0.75rem; | ||
color: # | color: #667b62; | ||
font-size: 0.86rem; | font-size: 0.86rem; | ||
text-align: left; | text-align: left; | ||
| 123번째 줄: | 123번째 줄: | ||
.infobox__details td { | .infobox__details td { | ||
color: # | color: #2d3c2b; | ||
font-size: 0.9rem; | font-size: 0.9rem; | ||
text-align: left; | text-align: left; | ||
| 149번째 줄: | 149번째 줄: | ||
.infobox a { | .infobox a { | ||
color: # | color: #3f7f3b; | ||
text-decoration: none; | text-decoration: none; | ||
} | } | ||
.infobox a:hover { | .infobox a:hover { | ||
color: # | color: #285c25; | ||
text-decoration: underline; | text-decoration: underline; | ||
} | } | ||
| 167번째 줄: | 167번째 줄: | ||
padding: 0.62rem; | padding: 0.62rem; | ||
border-radius: 5px; | border-radius: 5px; | ||
box-shadow: 0 0 21px rgba( | box-shadow: 0 0 21px rgba(54, 101, 49, 0.31); | ||
} | } | ||
.infobox__title { | .infobox__title { | ||
padding: 0. | padding: 0.38rem 0.75rem; | ||
border-radius: 3px; | border-radius: 3px; | ||
font-size: 1.16rem; | font-size: 1.16rem; | ||
| 229번째 줄: | 229번째 줄: | ||
@media screen { | @media screen { | ||
html.skin-theme-clientpref-night .infobox { | html.skin-theme-clientpref-night .infobox { | ||
border-color: # | border-color: #527d4f; | ||
background: # | background: #293728; | ||
color: # | color: #e2eee0; | ||
box-shadow: 0 0 26px rgba(0, 0, 0, 0.46); | box-shadow: 0 0 26px rgba(0, 0, 0, 0.46); | ||
} | } | ||
html.skin-theme-clientpref-night .infobox__title { | html.skin-theme-clientpref-night .infobox__title { | ||
background: # | background: #426f40; | ||
color: # | color: #f3fbf1; | ||
} | } | ||
html.skin-theme-clientpref-night .infobox__panel { | html.skin-theme-clientpref-night .infobox__panel { | ||
background: # | background: #253124; | ||
} | } | ||
html.skin-theme-clientpref-night .infobox__image { | html.skin-theme-clientpref-night .infobox__image { | ||
background: # | background: #2e3d2d; | ||
} | } | ||
| 253번째 줄: | 253번째 줄: | ||
html.skin-theme-clientpref-night .infobox__details th { | html.skin-theme-clientpref-night .infobox__details th { | ||
color: # | color: #a7bea3; | ||
} | } | ||
html.skin-theme-clientpref-night .infobox__details td { | html.skin-theme-clientpref-night .infobox__details td { | ||
color: # | color: #e3eee1; | ||
} | } | ||
html.skin-theme-clientpref-night .infobox a { | html.skin-theme-clientpref-night .infobox a { | ||
color: # | color: #91ca8b; | ||
} | } | ||
html.skin-theme-clientpref-night .infobox a:hover { | html.skin-theme-clientpref-night .infobox a:hover { | ||
color: # | color: #b6e3b1; | ||
} | } | ||
} | } | ||
| 271번째 줄: | 271번째 줄: | ||
@media screen and (prefers-color-scheme: dark) { | @media screen and (prefers-color-scheme: dark) { | ||
html.skin-theme-clientpref-os .infobox { | html.skin-theme-clientpref-os .infobox { | ||
border-color: # | border-color: #527d4f; | ||
background: # | background: #293728; | ||
color: # | color: #e2eee0; | ||
box-shadow: 0 0 26px rgba(0, 0, 0, 0.46); | box-shadow: 0 0 26px rgba(0, 0, 0, 0.46); | ||
} | } | ||
html.skin-theme-clientpref-os .infobox__title { | html.skin-theme-clientpref-os .infobox__title { | ||
background: # | background: #426f40; | ||
color: # | color: #f3fbf1; | ||
} | } | ||
html.skin-theme-clientpref-os .infobox__panel { | html.skin-theme-clientpref-os .infobox__panel { | ||
background: # | background: #253124; | ||
} | } | ||
html.skin-theme-clientpref-os .infobox__image { | html.skin-theme-clientpref-os .infobox__image { | ||
background: # | background: #2e3d2d; | ||
} | } | ||
| 295번째 줄: | 295번째 줄: | ||
html.skin-theme-clientpref-os .infobox__details th { | html.skin-theme-clientpref-os .infobox__details th { | ||
color: # | color: #a7bea3; | ||
} | } | ||
html.skin-theme-clientpref-os .infobox__details td { | html.skin-theme-clientpref-os .infobox__details td { | ||
color: # | color: #e3eee1; | ||
} | } | ||
html.skin-theme-clientpref-os .infobox a { | html.skin-theme-clientpref-os .infobox a { | ||
color: # | color: #91ca8b; | ||
} | } | ||
html.skin-theme-clientpref-os .infobox a:hover { | html.skin-theme-clientpref-os .infobox a:hover { | ||
color: # | color: #b6e3b1; | ||
} | } | ||
} | } | ||
