틀:정보상자/styles.css: 두 판 사이의 차이

식물 vs 좀비 위키
← 이전 편집다음 편집 →
편집 취소Brokey (토론 | 기여)
사무관, 인터페이스 관리자, 관리자
385 편집
편집 요약 없음
편집 요약 없음
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 #4b8d47;
border: 3px solid #c5a979;
border-radius: 18px;
border-radius: 18px;
box-sizing: border-box;
box-sizing: border-box;
background: #d9edd4;
background: #f2e6cf;
color: #293728;
color: #3a3028;
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(55, 104, 50, 0.34);
box-shadow: 0 0 24px rgba(92, 72, 47, 0.3);
}
}


.infobox__title {
.infobox__title {
position: relative;
padding: 0.28rem 0.85rem;
margin: 0 0.32rem;
padding: 0.28rem 1.35rem;
border: 0;
border: 0;
border-radius: 11px;
border-radius: 11px;
background: #4f9f4b;
background: #326b3a;
color: #f8fff6;
color: #fffdf7;
font-family:
font-family:
"SB Aggro B",
"SB Aggro B",
45번째 줄: 43번째 줄:
overflow-wrap: anywhere;
overflow-wrap: anywhere;
word-break: keep-all;
word-break: keep-all;
box-shadow: 0 4px 9px rgba(45, 89, 41, 0.22);
box-shadow: 0 4px 9px rgba(60, 48, 33, 0.2);
}
 
.infobox__title::before,
.infobox__title::after {
position: absolute;
top: 50%;
width: 0;
height: 0;
transform: translateY(-50%);
content: "";
}
 
.infobox__title::before {
left: 0;
border-top: 0.62rem solid transparent;
border-bottom: 0.62rem solid transparent;
border-left: 0.52rem solid #d9edd4;
}
 
.infobox__title::after {
right: 0;
border-top: 0.62rem solid transparent;
border-right: 0.52rem solid #d9edd4;
border-bottom: 0.62rem solid transparent;
}
}


77번째 줄: 51번째 줄:
border-radius: 14px;
border-radius: 14px;
overflow: hidden;
overflow: hidden;
background: #f1f8ee;
background: #fff9ed;
}
}


87번째 줄: 61번째 줄:
padding: 1.5rem 1rem 1.35rem;
padding: 1.5rem 1rem 1.35rem;
box-sizing: border-box;
box-sizing: border-box;
background: #f1f8ee;
background: #fff9ed;
}
}


96번째 줄: 70번째 줄:
left: 1rem;
left: 1rem;
height: 1px;
height: 1px;
background: #aac9a3;
background: #dcc7a4;
content: "";
content: "";
}
}
108번째 줄: 82번째 줄:
margin: 0 auto;
margin: 0 auto;
object-fit: contain;
object-fit: contain;
filter: drop-shadow(0 11px 9px rgba(48, 87, 44, 0.24));
filter: drop-shadow(0 11px 9px rgba(84, 65, 43, 0.23));
}
}


154번째 줄: 128번째 줄:
width: 35%;
width: 35%;
padding-right: 0.75rem;
padding-right: 0.75rem;
color: #668062;
color: #8a7864;
font-size: 0.86rem;
font-size: 0.86rem;
text-align: left;
text-align: left;
161번째 줄: 135번째 줄:


.infobox__details td {
.infobox__details td {
color: #2d3c2b;
color: #3d342c;
font-size: 0.9rem;
font-size: 0.9rem;
text-align: left;
text-align: left;
187번째 줄: 161번째 줄:


.infobox a {
.infobox a {
color: #3e853a;
color: #926435;
text-decoration: none;
text-decoration: none;
}
}


.infobox a:hover {
.infobox a:hover {
color: #275f24;
color: #654322;
text-decoration: underline;
text-decoration: underline;
}
}
205번째 줄: 179번째 줄:
padding: 0.62rem;
padding: 0.62rem;
border-radius: 16px;
border-radius: 16px;
box-shadow: 0 0 21px rgba(55, 104, 50, 0.31);
box-shadow: 0 0 21px rgba(92, 72, 47, 0.28);
}
}


.infobox__title {
.infobox__title {
margin-right: 0.28rem;
padding: 0.25rem 0.75rem;
margin-left: 0.28rem;
padding: 0.25rem 1.2rem;
border-radius: 10px;
border-radius: 10px;
font-size: 1.16rem;
font-size: 1.16rem;
}
.infobox__title::before {
border-top-width: 0.58rem;
border-bottom-width: 0.58rem;
border-left-width: 0.46rem;
}
.infobox__title::after {
border-top-width: 0.58rem;
border-right-width: 0.46rem;
border-bottom-width: 0.58rem;
}
}


267번째 줄: 227번째 줄:
padding-top: 0.2rem;
padding-top: 0.2rem;
padding-bottom: 0.2rem;
padding-bottom: 0.2rem;
border-radius: 9px;
font-size: 1.12rem;
font-size: 1.12rem;
}
.infobox__title::before {
border-top-width: 0.54rem;
border-bottom-width: 0.54rem;
}
.infobox__title::after {
border-top-width: 0.54rem;
border-bottom-width: 0.54rem;
}
}


312번째 줄: 263번째 줄:
@media screen {
@media screen {
html.skin-theme-clientpref-night .infobox {
html.skin-theme-clientpref-night .infobox {
border-color: #4f7f4b;
border-color: #806d50;
background: #2d3d2b;
background: #3b3329;
color: #e4eee1;
color: #eee4d5;
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: #4d8249;
background: #2c5f34;
color: #f4fff1;
color: #fffaf1;
box-shadow: 0 4px 9px rgba(0, 0, 0, 0.26);
box-shadow: 0 4px 9px rgba(0, 0, 0, 0.27);
}
 
html.skin-theme-clientpref-night .infobox__title::before {
border-left-color: #2d3d2b;
}
 
html.skin-theme-clientpref-night .infobox__title::after {
border-right-color: #2d3d2b;
}
}


html.skin-theme-clientpref-night .infobox__panel {
html.skin-theme-clientpref-night .infobox__panel {
background: #293627;
background: #302a23;
}
}


html.skin-theme-clientpref-night .infobox__image {
html.skin-theme-clientpref-night .infobox__image {
background: #293627;
background: #302a23;
}
}


html.skin-theme-clientpref-night .infobox__image::after {
html.skin-theme-clientpref-night .infobox__image::after {
background: #536f4f;
background: #6e5d47;
}
}


349번째 줄: 292번째 줄:


html.skin-theme-clientpref-night .infobox__details th {
html.skin-theme-clientpref-night .infobox__details th {
color: #abc5a6;
color: #c5b49d;
}
}


html.skin-theme-clientpref-night .infobox__details td {
html.skin-theme-clientpref-night .infobox__details td {
color: #e3eee1;
color: #eee5d8;
}
}


html.skin-theme-clientpref-night .infobox a {
html.skin-theme-clientpref-night .infobox a {
color: #9ed697;
color: #dfb783;
}
}


html.skin-theme-clientpref-night .infobox a:hover {
html.skin-theme-clientpref-night .infobox a:hover {
color: #c0e9ba;
color: #f3d2a5;
}
}
}
}
367번째 줄: 310번째 줄:
@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: #4f7f4b;
border-color: #806d50;
background: #2d3d2b;
background: #3b3329;
color: #e4eee1;
color: #eee4d5;
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: #4d8249;
background: #2c5f34;
color: #f4fff1;
color: #fffaf1;
box-shadow: 0 4px 9px rgba(0, 0, 0, 0.26);
box-shadow: 0 4px 9px rgba(0, 0, 0, 0.27);
}
 
html.skin-theme-clientpref-os .infobox__title::before {
border-left-color: #2d3d2b;
}
 
html.skin-theme-clientpref-os .infobox__title::after {
border-right-color: #2d3d2b;
}
}


html.skin-theme-clientpref-os .infobox__panel {
html.skin-theme-clientpref-os .infobox__panel {
background: #293627;
background: #302a23;
}
}


html.skin-theme-clientpref-os .infobox__image {
html.skin-theme-clientpref-os .infobox__image {
background: #293627;
background: #302a23;
}
}


html.skin-theme-clientpref-os .infobox__image::after {
html.skin-theme-clientpref-os .infobox__image::after {
background: #536f4f;
background: #6e5d47;
}
}


404번째 줄: 339번째 줄:


html.skin-theme-clientpref-os .infobox__details th {
html.skin-theme-clientpref-os .infobox__details th {
color: #abc5a6;
color: #c5b49d;
}
}


html.skin-theme-clientpref-os .infobox__details td {
html.skin-theme-clientpref-os .infobox__details td {
color: #e3eee1;
color: #eee5d8;
}
}


html.skin-theme-clientpref-os .infobox a {
html.skin-theme-clientpref-os .infobox a {
color: #9ed697;
color: #dfb783;
}
}


html.skin-theme-clientpref-os .infobox a:hover {
html.skin-theme-clientpref-os .infobox a:hover {
color: #c0e9ba;
color: #f3d2a5;
}
}
}
}
원본 주소 "https://pvzkrwiki.com/index.php/틀:정보상자/styles.css"