미디어위키:Gadget-Vector.css: 두 판 사이의 차이

식물 vs 좀비 위키
편집 요약 없음
태그: 되돌려진 기여
편집 요약 없음
 
(같은 사용자의 중간 판 11개는 보이지 않습니다)
1번째 줄: 1번째 줄:
/* Vector 2010 Legacy 인터페이스 디자인
/* Vector 2010 Legacy 인터페이스 디자인
  * 기준: MediaWiki-Gadget-Vector.css-actionbar-v20.txt
  * 기준: MediaWiki-Gadget-Vector.css-actionbar-v20.txt
  * v39: 더보기 재클릭 닫기·탄성 스크롤 배경 동기화
  * v48: 최하단창 단순형 디자인
  */
  */


10번째 줄: 10번째 줄:


html {
html {
--pvz-background-overscroll-y: 0px;
min-height: 100% !important;
min-height: 100% !important;
background-color: #f5ead7 !important;
background-color: #f5ead7 !important;
27번째 줄: 26번째 줄:
content: "";
content: "";
position: fixed;
position: fixed;
top: -96px;
inset: 0;
right: 0;
bottom: -96px;
left: 0;
z-index: -1;
z-index: -1;
display: block;
display: block;
width: 100vw;
width: 100vw;
height: auto;
height: 100vh;
pointer-events: none;
pointer-events: none;
background-color: #f5ead7;
background-color: #f5ead7;
42번째 줄: 38번째 줄:
background-repeat: no-repeat;
background-repeat: no-repeat;
background-size: cover;
background-size: cover;
transform:
translate3d(
0,
var(--pvz-background-overscroll-y),
0
);
transition: none;
will-change: transform;
}
html.pvz-background-resetting body.skin-vector-legacy::before {
transition:
transform 180ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
}


260번째 줄: 243번째 줄:
flex: 0 0 14px;
flex: 0 0 14px;
width: 14px;
width: 14px;
height: 14px;
height: 10px;
margin-right: 0;
margin-right: 0;
background-repeat: no-repeat;
background-repeat: no-repeat;
507번째 줄: 490번째 줄:




/* =========================
/* 문단 기본선을 실제 잔디 구분선 요소로 교체 */
  왼쪽 보조창
.skin-vector-legacy .mw-heading2,
  ========================= */
.skin-vector-legacy .mw-parser-output h2.pvz-grass-heading {
position: relative !important;
margin-bottom: 0.9em !important;
padding-bottom: 12px !important;
border: 0 !important;
border-bottom: 0 !important;
background: none !important;
background-image: none !important;
box-shadow: none !important;
}
 
.skin-vector-legacy .mw-heading2::before,
.skin-vector-legacy .mw-heading2::after,
.skin-vector-legacy .mw-parser-output h2.pvz-grass-heading::before,
.skin-vector-legacy .mw-parser-output h2.pvz-grass-heading::after {
content: none !important;
display: none !important;
border: 0 !important;
background: none !important;
box-shadow: none !important;
}


.skin-vector-legacy #mw-panel {
.skin-vector-legacy .mw-heading2 > h2,
left: 0.6rem !important;
.skin-vector-legacy .mw-parser-output h2.pvz-grass-heading {
width: calc(10em - 0.9rem) !important;
margin-bottom: 0 !important;
margin-top: 0.45rem;
padding-bottom: 0 !important;
margin-left: 0 !important;
border: 0 !important;
padding: 0.7rem 0.55rem 1rem;
border-bottom: 0 !important;
border: 3px solid #5b220e;
background: none !important;
border-radius: 13px;
background-image: none !important;
box-sizing: border-box;
box-shadow: none !important;
}
 
.skin-vector-legacy .pvz-grass-divider {
position: absolute;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
display: block;
height: 14px;
overflow: hidden;
pointer-events: none;
background: #ead9b8;
-webkit-mask-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 112 12'%3E%3Cpath fill='black' d='M0 12V8Q3 8 5 5Q6 3 8 6L11 9Q14 7 16 4Q17 2 19 5L22 9Q25 7 28 5Q29 3 31 6L34 9Q37 7 39 4Q40 2 42 5L45 9Q48 7 51 5Q52 3 54 6L57 9Q60 7 63 4Q64 2 66 5L69 9Q72 7 75 5Q76 3 78 6L81 9Q84 7 87 4Q88 2 90 5L93 9Q96 7 99 5Q100 3 102 6L105 9Q109 8 112 7V12Z'/%3E%3C/svg%3E");
mask-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 112 12'%3E%3Cpath fill='black' d='M0 12V8Q3 8 5 5Q6 3 8 6L11 9Q14 7 16 4Q17 2 19 5L22 9Q25 7 28 5Q29 3 31 6L34 9Q37 7 39 4Q40 2 42 5L45 9Q48 7 51 5Q52 3 54 6L57 9Q60 7 63 4Q64 2 66 5L69 9Q72 7 75 5Q76 3 78 6L81 9Q84 7 87 4Q88 2 90 5L93 9Q96 7 99 5Q100 3 102 6L105 9Q109 8 112 7V12Z'/%3E%3C/svg%3E");
-webkit-mask-repeat: repeat-x;
mask-repeat: repeat-x;
-webkit-mask-position: left bottom;
mask-position: left bottom;
-webkit-mask-size: 112px 12px;
mask-size: 112px 12px;
}
 
 
/* =========================
  왼쪽 보조창
  ========================= */
 
.skin-vector-legacy #mw-panel {
left: 0.6rem !important;
width: calc(10em - 0.9rem) !important;
margin-top: 0.45rem;
margin-left: 0 !important;
padding: 0.7rem 0.55rem 1rem;
border: 3px solid #5b220e;
border-radius: 13px;
box-sizing: border-box;
background:
background:
linear-gradient(
linear-gradient(
1,074번째 줄: 1,116번째 줄:
) !important;
) !important;
}
}




/* =========================
/* =========================
   최하단창
   분류창
   ========================= */
   ========================= */


.skin-vector-legacy #footer {
.skin-vector-legacy #catlinks,
position: relative !important;
.skin-vector-legacy .catlinks {
isolation: isolate;
margin-top: 1.35rem !important;
display: flow-root;
padding: 0.52rem 0.72rem !important;
width: auto !important;
border: 1px solid #c79a4a !important;
max-width: none !important;
border-radius: 10px !important;
margin:
box-sizing: border-box !important;
5rem
background: #f8ecd3 !important;
var(--pvz-layout-edge-gap, 1rem)
background-image: none !important;
0
color: #75462d !important;
calc(
font-family:
var(--pvz-layout-edge-gap, 1rem) +
"SB Aggro L",
var(--pvz-side-panel-width, 10.4rem) +
"SB 어그로 L",
var(--pvz-layout-edge-gap, 1rem)
"SB Aggro",
) !important;
"SB 어그로",
padding:
sans-serif !important;
calc(1rem + 15px)
font-weight: 300 !important;
calc(1.2rem + 15px)
line-height: 1.55 !important;
1rem !important;
text-shadow: none !important;
border: 15px solid #5b1f09 !important;
box-shadow: none !important;
border-bottom: 0 !important;
}
border-radius: 30px 30px 0 0 !important;
 
box-sizing: border-box !important;
.skin-vector-legacy #catlinks a,
overflow: hidden !important;
.skin-vector-legacy .catlinks a,
background: #e6d2b2 !important;
.skin-vector-legacy #mw-normal-catlinks a,
background-image: none !important;
.skin-vector-legacy .mw-normal-catlinks a,
box-shadow: none !important;
.skin-vector-legacy #mw-hidden-catlinks a,
color: #4b3328 !important;
.skin-vector-legacy .mw-hidden-catlinks a {
}
color: #75462d !important;
 
font-family:
.skin-vector-legacy #footer::before {
"SB Aggro L",
content: "";
"SB 어그로 L",
position: absolute;
"SB Aggro",
inset: 15px 15px 0;
"SB 어그로",
z-index: -1;
sans-serif !important;
display: block;
font-weight: 300 !important;
border-radius: 18px 18px 0 0;
text-shadow: none !important;
background: #fffae9;
}
pointer-events: none;
 
.skin-vector-legacy #catlinks a:hover,
.skin-vector-legacy .catlinks a:hover {
color: #5e321e !important;
text-decoration: underline !important;
}
 
.skin-vector-legacy #mw-normal-catlinks,
.skin-vector-legacy .mw-normal-catlinks,
.skin-vector-legacy #mw-hidden-catlinks,
.skin-vector-legacy .mw-hidden-catlinks {
border: 0 !important;
background: transparent !important;
color: inherit !important;
}
 
 
/* =========================
  각주창
  ========================= */
 
.skin-vector-legacy .mw-parser-output > .mw-references-wrap,
.skin-vector-legacy .mw-parser-output > ol.references,
.skin-vector-legacy .mw-parser-output > .references {
margin-top: 1.35rem !important;
padding: 0.72rem 0.9rem !important;
border: 3px solid #8f632d !important;
border-radius: 12px !important;
box-sizing: border-box !important;
background: #f8ecd3 !important;
background-image: none !important;
color: #75462d !important;
font-family:
"SB Aggro L",
"SB 어그로 L",
"SB Aggro",
"SB 어그로",
sans-serif !important;
font-weight: 300 !important;
line-height: 1.55 !important;
text-shadow: none !important;
box-shadow: none !important;
}
 
.skin-vector-legacy .mw-parser-output > .mw-references-wrap > ol.references {
margin-top: 0 !important;
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
border: 0 !important;
background: transparent !important;
color: inherit !important;
font: inherit !important;
}
 
.skin-vector-legacy .mw-parser-output > .mw-references-wrap a,
.skin-vector-legacy .mw-parser-output > ol.references a,
.skin-vector-legacy .mw-parser-output > .references a {
color: #75462d !important;
font-family:
"SB Aggro L",
"SB 어그로 L",
"SB Aggro",
"SB 어그로",
sans-serif !important;
font-weight: 300 !important;
text-shadow: none !important;
}
 
.skin-vector-legacy .mw-parser-output > .mw-references-wrap a:hover,
.skin-vector-legacy .mw-parser-output > ol.references a:hover,
.skin-vector-legacy .mw-parser-output > .references a:hover {
color: #5e321e !important;
}
 
/* =========================
  최하단창
  ========================= */
 
.skin-vector-legacy #footer {
position: relative !important;
display: flow-root;
width: auto !important;
max-width: none !important;
margin:
4rem
var(--pvz-layout-edge-gap, 1rem)
0
calc(
var(--pvz-layout-edge-gap, 1rem) +
var(--pvz-side-panel-width, 10.4rem) +
var(--pvz-layout-edge-gap, 1rem)
) !important;
padding: 1.15rem 1.35rem 1rem !important;
border: 1px solid #c79a4a !important;
border-bottom: 0 !important;
border-radius: 16px 16px 0 0 !important;
box-sizing: border-box !important;
background: #f3e5ca !important;
background-image: none !important;
box-shadow: none !important;
color: #5f4030 !important;
}
 
.skin-vector-legacy #footer::before,
.skin-vector-legacy #footer::after {
content: none !important;
display: none !important;
}
}


.skin-vector-legacy #footer ul,
.skin-vector-legacy #footer ul,
.skin-vector-legacy #footer li {
.skin-vector-legacy #footer li {
position: relative;
z-index: 1;
margin-bottom: 0 !important;
margin-bottom: 0 !important;
}
}
2,787번째 줄: 2,936번째 줄:
.skin-vector-legacy #p-cactions .vector-menu-content,
.skin-vector-legacy #p-cactions .vector-menu-content,
#p-cactions .vector-menu-content {
#p-cactions .vector-menu-content {
display: none !important;
top: calc(100% + 7px) !important;
top: calc(100% + 7px) !important;
right: 0 !important;
right: 0 !important;
2,805번째 줄: 2,953번째 줄:
}
}


body.skin-vector-legacy #p-cactions.pvz-cactions-open .vector-menu-content,
.skin-vector-legacy #p-cactions.pvz-cactions-open .vector-menu-content,
#p-cactions.pvz-cactions-open .vector-menu-content {
display: block !important;
}