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

식물 vs 좀비 위키
← 이전 편집
Brokey (토론 | 기여)
사무관, 인터페이스 관리자, 관리자
385 편집
편집 요약 없음
태그: 되돌려진 기여
편집 요약 없음
 
(같은 사용자의 중간 판 10개는 보이지 않습니다)
1번째 줄: 1번째 줄:
/* Vector 2010 Legacy 인터페이스 디자인
/* Vector 2010 Legacy 인터페이스 디자인
  * 기준: MediaWiki-Gadget-Vector.css-actionbar-v20.txt
  * 기준: MediaWiki-Gadget-Vector.css-actionbar-v20.txt
  * v25: 왼쪽 보조창 복구·검색바 재배치·관련 문서 메뉴 추가
  * v34: 본문·검색바 위치 조정·로고칸 축소·특수 화면 디자인 강제 적용
  */
  */


2,176번째 줄: 2,176번째 줄:
max-width: calc(100vw - 8px) !important;
max-width: calc(100vw - 8px) !important;
}
}
}
/* =========================
  v26 최종 오버라이드
  ========================= */
/* 검색바를 본문 왼쪽 기준의 기존 위치로 복구 */
.skin-vector-legacy #pvz-content-search {
position: absolute !important;
top: 7px !important;
right: auto !important;
left: var(--pvz-content-left, 10em) !important;
width: 350px !important;
max-width: calc(
100vw - var(--pvz-content-left, 10em) - 0.75rem
) !important;
min-width: 0 !important;
margin: 0 !important;
}
/* 본문창과 액션바 위치를 기존 값으로 복구 */
.skin-vector-legacy #content,
.skin-vector-legacy .mw-body,
.skin-vector-legacy #left-navigation,
.skin-vector-legacy #right-navigation {
top: 30px !important;
}
/* 왼쪽 보조창 공간은 유지하고 오른쪽은 화면 끝까지 확장 */
.skin-vector-legacy #content,
.skin-vector-legacy .mw-body {
width: auto !important;
margin-left: 10em !important;
margin-right: 0.55rem !important;
}
.skin-vector-legacy #footer {
margin-left: 10em !important;
margin-right: 0.55rem !important;
}
.skin-vector-legacy #left-navigation {
margin-left: 10em !important;
}
.skin-vector-legacy #right-navigation {
margin-right: 15px !important;
}
/* 관련 문서 햄버거 메뉴 완전 제거 */
.skin-vector-legacy #pvz-related-toggle,
.skin-vector-legacy #pvz-related-menu {
display: none !important;
}
@media (max-width: 620px) {
.skin-vector-legacy #pvz-content-search {
right: auto !important;
left: var(--pvz-content-left, 10em) !important;
width: min(
350px,
calc(100vw - var(--pvz-content-left, 10em) - 0.5rem)
) !important;
max-width: calc(
100vw - var(--pvz-content-left, 10em) - 0.5rem
) !important;
}
}
/* =========================
  v27 최종 오버라이드
  ========================= */
/* 위키 로고를 왼쪽 보조창 내부 로고칸으로 복구 */
.skin-vector-legacy #pvz-sidebar-logo {
display: none !important;
}
.skin-vector-legacy #mw-panel #p-logo {
position: relative !important;
top: auto !important;
right: auto !important;
bottom: auto !important;
left: auto !important;
display: block !important;
width: 100% !important;
max-width: 100% !important;
height: auto !important;
min-height: 0 !important;
margin: 0 0 0.9rem !important;
padding: 0.45rem 0 !important;
overflow: hidden !important;
border: 3px solid #60230d !important;
border-radius: 12px !important;
box-sizing: border-box !important;
background:
linear-gradient(
180deg,
rgba(255, 255, 255, 0.08),
transparent 22%
),
#6c2b12 !important;
background-image:
linear-gradient(
180deg,
rgba(255, 255, 255, 0.08),
transparent 22%
) !important;
box-shadow:
inset 0 2px 3px rgba(255, 168, 98, 0.22),
inset 0 -3px 6px rgba(48, 12, 2, 0.42),
0 2px 3px rgba(60, 20, 6, 0.28) !important;
}
.skin-vector-legacy #mw-panel #p-logo a,
.skin-vector-legacy #mw-panel #p-logo .mw-wiki-logo {
display: block !important;
width: 100% !important;
height: auto !important;
min-height: 0 !important;
aspect-ratio: 1 / 1;
margin: 0 !important;
background-position: center !important;
background-repeat: no-repeat !important;
background-size: contain !important;
}
.skin-vector-legacy #mw-panel #p-logo img {
display: block !important;
width: 100% !important;
height: auto !important;
max-width: 100% !important;
max-height: none !important;
margin: 0 auto !important;
object-fit: contain !important;
}
/* 본문 오른쪽의 보조창용 여백 제거 */
.skin-vector-legacy #content,
.skin-vector-legacy .mw-body {
margin-right: 0 !important;
}
.skin-vector-legacy #footer {
margin-right: 0 !important;
}
/* =========================
  v28 최종 오버라이드
  ========================= */
html {
--pvz-side-panel-edge: 1rem;
--pvz-side-panel-width: 9.1rem;
}
/* 높은 우선순위로 오른쪽 보조창용 여백을 완전히 제거 */
html:not(.pvz-width-wide) .skin-vector-legacy #content,
html:not(.pvz-width-wide) .skin-vector-legacy .mw-body {
width: auto !important;
max-width: none !important;
margin-left: 11.1rem !important;
margin-right: 0.2rem !important;
}
html:not(.pvz-width-wide) .skin-vector-legacy #footer {
margin-left: 11.1rem !important;
margin-right: 0.2rem !important;
}
/* 왼쪽 보조창을 화면 위쪽 가까이 올리고 양옆 바깥 여백 확대 */
.skin-vector-legacy #mw-panel {
top: 7px !important;
left: var(--pvz-side-panel-edge) !important;
width: var(--pvz-side-panel-width) !important;
margin: 0 !important;
}
/* 보조창과 본문 사이 간격도 함께 확대 */
html:not(.pvz-width-wide) .skin-vector-legacy #left-navigation {
margin-left: 11.1rem !important;
}
/* =========================
  v29 최종 오버라이드
  ========================= */
html {
--pvz-layout-edge-gap: 1rem;
--pvz-side-panel-width: 9.1rem;
}
/* 보조창의 왼쪽·위쪽·오른쪽 바깥 여백을 같은 값으로 통일 */
.skin-vector-legacy #mw-panel {
top: var(--pvz-layout-edge-gap) !important;
left: var(--pvz-layout-edge-gap) !important;
width: var(--pvz-side-panel-width) !important;
}
/* 보조창 오른쪽 여백과 동일한 간격 뒤에서 본문 시작 */
html:not(.pvz-width-wide) .skin-vector-legacy #content,
html:not(.pvz-width-wide) .skin-vector-legacy .mw-body {
width: auto !important;
max-width: none !important;
margin-left: calc(
var(--pvz-layout-edge-gap) +
var(--pvz-side-panel-width) +
var(--pvz-layout-edge-gap)
) !important;
margin-right: var(--pvz-layout-edge-gap) !important;
}
html:not(.pvz-width-wide) .skin-vector-legacy #footer {
margin-left: calc(
var(--pvz-layout-edge-gap) +
var(--pvz-side-panel-width) +
var(--pvz-layout-edge-gap)
) !important;
margin-right: var(--pvz-layout-edge-gap) !important;
}
html:not(.pvz-width-wide) .skin-vector-legacy #left-navigation {
margin-left: calc(
var(--pvz-layout-edge-gap) +
var(--pvz-side-panel-width) +
var(--pvz-layout-edge-gap)
) !important;
}
/* 오른쪽 액션바를 본문창 오른쪽 끝에 가깝게 정렬 */
.skin-vector-legacy #right-navigation {
margin-right: var(--pvz-layout-edge-gap) !important;
}
/* 검색 버튼을 더 어두운 초록색 그라데이션으로 변경 */
.skin-vector-legacy #pvz-content-search #searchButton,
.skin-vector-legacy #pvz-content-search .searchButton:not(#mw-searchButton) {
border-left-color: #214f2f !important;
background:
linear-gradient(
180deg,
#3f843f 0%,
#327334 50%,
#285f2c 100%
) !important;
background-color: #327334 !important;
background-image:
linear-gradient(
180deg,
#3f843f 0%,
#327334 50%,
#285f2c 100%
) !important;
}
.skin-vector-legacy #pvz-content-search #searchButton:hover,
.skin-vector-legacy #pvz-content-search .searchButton:not(#mw-searchButton):hover {
background:
linear-gradient(
180deg,
#478f47 0%,
#397d3b 50%,
#2e6932 100%
) !important;
background-color: #397d3b !important;
background-image:
linear-gradient(
180deg,
#478f47 0%,
#397d3b 50%,
#2e6932 100%
) !important;
}
/* 기존 파일과 다른 형태의 흰색 돋보기 SVG */
.skin-vector-legacy #pvz-content-search .pvz-search-button-icon::before {
width: 25px !important;
height: 25px !important;
background: #ffffff !important;
background-image: none !important;
-webkit-mask:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M10.75 3a7.75 7.75 0 1 0 4.82 13.82l4.31 4.31a1.25 1.25 0 0 0 1.77-1.77l-4.31-4.31A7.75 7.75 0 0 0 10.75 3Zm0 2.5a5.25 5.25 0 1 1 0 10.5 5.25 5.25 0 0 1 0-10.5Z'/%3E%3C/svg%3E")
center / contain no-repeat !important;
mask:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M10.75 3a7.75 7.75 0 1 0 4.82 13.82l4.31 4.31a1.25 1.25 0 0 0 1.77-1.77l-4.31-4.31A7.75 7.75 0 0 0 10.75 3Zm0 2.5a5.25 5.25 0 1 1 0 10.5 5.25 5.25 0 0 1 0-10.5Z'/%3E%3C/svg%3E")
center / contain no-repeat !important;
filter: none !important;
transform: none !important;
}
/* =========================
  v30 최종 오버라이드
  ========================= */
html {
--pvz-layout-edge-gap: 1rem;
--pvz-side-panel-width: 9.8rem;
}
/* 넓어진 보조창 너비에 맞춰 본문과 왼쪽 액션바 위치 조정 */
html:not(.pvz-width-wide) .skin-vector-legacy #content,
html:not(.pvz-width-wide) .skin-vector-legacy .mw-body {
width: auto !important;
max-width: none !important;
margin-left: calc(
var(--pvz-layout-edge-gap) +
var(--pvz-side-panel-width) +
var(--pvz-layout-edge-gap)
) !important;
margin-right: var(--pvz-layout-edge-gap) !important;
}
html:not(.pvz-width-wide) .skin-vector-legacy #footer {
margin-left: calc(
var(--pvz-layout-edge-gap) +
var(--pvz-side-panel-width) +
var(--pvz-layout-edge-gap)
) !important;
margin-right: var(--pvz-layout-edge-gap) !important;
}
html:not(.pvz-width-wide) .skin-vector-legacy #left-navigation {
margin-left: calc(
var(--pvz-layout-edge-gap) +
var(--pvz-side-panel-width) +
var(--pvz-layout-edge-gap)
) !important;
}
/* 오른쪽 액션바를 화면 및 본문 오른쪽 끝에 확실히 고정 */
.skin-vector-legacy #right-navigation {
position: absolute !important;
top: 30px !important;
right: var(--pvz-layout-edge-gap) !important;
left: auto !important;
float: none !important;
margin: 0 !important;
padding: 0 !important;
transform: none !important;
}
/* 검색 버튼: 어두운 명도는 유지하면서 초록색 채도 강화 */
.skin-vector-legacy #pvz-content-search #searchButton,
.skin-vector-legacy #pvz-content-search .searchButton:not(#mw-searchButton) {
border-left-color: #075f25 !important;
background:
linear-gradient(
180deg,
#15983a 0%,
#07852e 52%,
#006f24 100%
) !important;
background-color: #07852e !important;
background-image:
linear-gradient(
180deg,
#15983a 0%,
#07852e 52%,
#006f24 100%
) !important;
}
.skin-vector-legacy #pvz-content-search #searchButton:hover,
.skin-vector-legacy #pvz-content-search .searchButton:not(#mw-searchButton):hover {
background:
linear-gradient(
180deg,
#1ca843 0%,
#0b9435 52%,
#007b29 100%
) !important;
background-color: #0b9435 !important;
background-image:
linear-gradient(
180deg,
#1ca843 0%,
#0b9435 52%,
#007b29 100%
) !important;
}
/* 보조창 글자의 밝은 그림자 제거 */
.skin-vector-legacy #mw-panel,
.skin-vector-legacy #mw-panel .vector-menu-heading,
.skin-vector-legacy #mw-panel .portal h3,
.skin-vector-legacy #mw-panel .vector-menu-content a,
.skin-vector-legacy #mw-panel .portal .body a {
text-shadow: none !important;
}
/* 로고칸과 로고 요소의 최소 높이 제한 해제 */
.skin-vector-legacy #mw-panel #p-logo,
.skin-vector-legacy #mw-panel #p-logo a,
.skin-vector-legacy #mw-panel #p-logo .mw-wiki-logo,
.skin-vector-legacy #mw-panel #p-logo img {
min-height: initial !important;
}
/* =========================
  v31 최종 강제 오버라이드
  ========================= */
html {
--pvz-layout-edge-gap: 1rem !important;
--pvz-side-panel-width: 10.4rem !important;
}
/* 보조창 너비를 직접 지정해 이전 변수·너비 선언을 모두 덮어씀 */
body.skin-vector-legacy #mw-panel,
.skin-vector-legacy #mw-panel,
#mw-panel {
left: var(--pvz-layout-edge-gap) !important;
width: var(--pvz-side-panel-width) !important;
max-width: var(--pvz-side-panel-width) !important;
}
/* 넓어진 보조창에 맞춰 본문과 왼쪽 액션바 시작점을 직접 재설정 */
body.skin-vector-legacy #content,
body.skin-vector-legacy .mw-body,
.skin-vector-legacy #content,
.skin-vector-legacy .mw-body {
width: auto !important;
max-width: none !important;
margin-left: calc(
var(--pvz-layout-edge-gap) +
var(--pvz-side-panel-width) +
var(--pvz-layout-edge-gap)
) !important;
margin-right: var(--pvz-layout-edge-gap) !important;
}
body.skin-vector-legacy #footer,
.skin-vector-legacy #footer {
margin-left: calc(
var(--pvz-layout-edge-gap) +
var(--pvz-side-panel-width) +
var(--pvz-layout-edge-gap)
) !important;
margin-right: var(--pvz-layout-edge-gap) !important;
}
body.skin-vector-legacy #left-navigation,
.skin-vector-legacy #left-navigation {
margin-left: calc(
var(--pvz-layout-edge-gap) +
var(--pvz-side-panel-width) +
var(--pvz-layout-edge-gap)
) !important;
}
/* 오른쪽 액션바: JS가 계산한 본문 오른쪽 여백에 강제로 맞춤 */
body.skin-vector-legacy #right-navigation,
.skin-vector-legacy #right-navigation,
#right-navigation {
position: absolute !important;
top: 30px !important;
right: var(--pvz-content-right-gap, 1rem) !important;
left: auto !important;
display: flex !important;
flex-direction: row !important;
align-items: flex-end !important;
justify-content: flex-end !important;
width: max-content !important;
max-width: none !important;
float: none !important;
margin: 0 !important;
padding: 0 !important;
transform: none !important;
}
body.skin-vector-legacy #right-navigation #p-views,
body.skin-vector-legacy #right-navigation #p-cactions,
.skin-vector-legacy #right-navigation #p-views,
.skin-vector-legacy #right-navigation #p-cactions,
#right-navigation #p-views,
#right-navigation #p-cactions {
position: relative !important;
right: auto !important;
left: auto !important;
float: none !important;
margin-right: 0 !important;
margin-left: 3px !important;
transform: none !important;
}
/* 검색 버튼: 명도는 유지하면서 채도를 확실하게 높인 초록색 */
body.skin-vector-legacy #pvz-content-search #simpleSearch #searchButton,
body.skin-vector-legacy #pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton),
.skin-vector-legacy #pvz-content-search #simpleSearch #searchButton,
.skin-vector-legacy #pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton),
#pvz-content-search #simpleSearch #searchButton,
#pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton) {
border-left: 2px solid #00661f !important;
background: linear-gradient(
180deg,
#00ad3d 0%,
#009432 50%,
#007a28 100%
) !important;
background-color: #009432 !important;
background-image: linear-gradient(
180deg,
#00ad3d 0%,
#009432 50%,
#007a28 100%
) !important;
box-shadow: none !important;
filter: none !important;
}
body.skin-vector-legacy #pvz-content-search #simpleSearch #searchButton:hover,
body.skin-vector-legacy #pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton):hover,
.skin-vector-legacy #pvz-content-search #simpleSearch #searchButton:hover,
.skin-vector-legacy #pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton):hover,
#pvz-content-search #simpleSearch #searchButton:hover,
#pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton):hover {
background: linear-gradient(
180deg,
#08bd48 0%,
#00a23a 50%,
#00852e 100%
) !important;
background-color: #00a23a !important;
background-image: linear-gradient(
180deg,
#08bd48 0%,
#00a23a 50%,
#00852e 100%
) !important;
}
/* 보조창 안의 모든 글자 그림자 제거 */
body.skin-vector-legacy #mw-panel,
body.skin-vector-legacy #mw-panel *,
.skin-vector-legacy #mw-panel,
.skin-vector-legacy #mw-panel *,
#mw-panel,
#mw-panel * {
text-shadow: none !important;
}
/* 로고칸 자체의 최소 높이 제한만 제거 */
body.skin-vector-legacy #mw-panel #p-logo,
.skin-vector-legacy #mw-panel #p-logo,
#mw-panel #p-logo {
min-height: unset !important;
}
/* =========================
  v32 최종 오버라이드
  ========================= */
/* 오른쪽 액션바: 왼쪽 액션바와 같은 높이, 그 위치에서 왼쪽으로 15px */
body.skin-vector-legacy #right-navigation,
.skin-vector-legacy #right-navigation,
#right-navigation {
top: var(--pvz-navigation-top, 30px) !important;
right: calc(
var(--pvz-content-right-gap, 1rem) + 15px
) !important;
}
/* 검색바 상단을 보조창 상단과 동일하게 맞춤 */
body.skin-vector-legacy #pvz-content-search,
.skin-vector-legacy #pvz-content-search,
#pvz-content-search {
top: var(--pvz-layout-edge-gap, 1rem) !important;
}
/* 검색 버튼 오른쪽 끝에 밝고 얇은 세로선 추가 */
body.skin-vector-legacy #pvz-content-search #simpleSearch #searchButton,
body.skin-vector-legacy #pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton),
.skin-vector-legacy #pvz-content-search #simpleSearch #searchButton,
.skin-vector-legacy #pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton),
#pvz-content-search #simpleSearch #searchButton,
#pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton) {
overflow: hidden !important;
box-shadow:
inset -1px 0 0 rgba(142, 255, 163, 0.9) !important;
}
/* 로고칸 내부 상하 여백을 최대한 축소 */
body.skin-vector-legacy #mw-panel #p-logo,
.skin-vector-legacy #mw-panel #p-logo,
#mw-panel #p-logo {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
/* =========================
  v33 최종 오버라이드
  ========================= */
html {
--pvz-right-action-offset: 230px;
--pvz-compact-search-width: 175px;
--pvz-compact-search-gap: 15px;
}
/* 오른쪽 액션바를 왼쪽으로 크게 이동해 검색바 공간 확보 */
body.skin-vector-legacy #right-navigation,
.skin-vector-legacy #right-navigation,
#right-navigation {
top: var(--pvz-navigation-top, 30px) !important;
right: calc(
var(--pvz-content-right-gap, 1rem) +
var(--pvz-right-action-offset)
) !important;
left: auto !important;
}
/* 더보기 버튼만 기존 위치보다 4px 위로 이동 */
body.skin-vector-legacy #p-cactions-label,
.skin-vector-legacy #p-cactions-label,
#p-cactions-label {
top: 3px !important;
}
/* 비워 둔 오른쪽 공간에 축소 검색바 배치 */
body.skin-vector-legacy #pvz-content-search,
.skin-vector-legacy #pvz-content-search,
#pvz-content-search {
position: absolute !important;
top: var(--pvz-navigation-top, 30px) !important;
right: calc(
var(--pvz-content-right-gap, 1rem) +
var(--pvz-compact-search-gap)
) !important;
left: auto !important;
width: var(--pvz-compact-search-width) !important;
max-width: var(--pvz-compact-search-width) !important;
min-width: 0 !important;
margin: 0 !important;
}
body.skin-vector-legacy #pvz-content-search #simpleSearch,
.skin-vector-legacy #pvz-content-search #simpleSearch,
#pvz-content-search #simpleSearch {
height: 26px !important;
border-width: 1px !important;
border-radius: 11px !important;
}
body.skin-vector-legacy #pvz-content-search #searchInput,
.skin-vector-legacy #pvz-content-search #searchInput,
#pvz-content-search #searchInput {
padding: 0.15rem 0.32rem !important;
font-size: 0.76rem !important;
line-height: 1.1 !important;
}
body.skin-vector-legacy #pvz-content-search #searchButton,
body.skin-vector-legacy #pvz-content-search .searchButton:not(#mw-searchButton),
.skin-vector-legacy #pvz-content-search #searchButton,
.skin-vector-legacy #pvz-content-search .searchButton:not(#mw-searchButton),
#pvz-content-search #searchButton,
#pvz-content-search .searchButton:not(#mw-searchButton) {
flex-basis: 34px !important;
width: 34px !important;
border-left-width: 1px !important;
}
body.skin-vector-legacy #pvz-content-search .pvz-search-button-icon,
.skin-vector-legacy #pvz-content-search .pvz-search-button-icon,
#pvz-content-search .pvz-search-button-icon {
width: 34px !important;
}
body.skin-vector-legacy #pvz-content-search .pvz-search-button-icon::before,
.skin-vector-legacy #pvz-content-search .pvz-search-button-icon::before,
#pvz-content-search .pvz-search-button-icon::before {
width: 18px !important;
height: 18px !important;
}
/* 더보기 메뉴 */
body.skin-vector-legacy #p-cactions .vector-menu-content,
.skin-vector-legacy #p-cactions .vector-menu-content,
#p-cactions .vector-menu-content {
top: calc(100% + 7px) !important;
right: 0 !important;
left: auto !important;
min-width: 150px !important;
margin: 0 !important;
padding: 0.35rem !important;
overflow: visible !important;
border: 0 !important;
border-radius: 11px !important;
background: rgba(255, 255, 255, 0.98) !important;
background-image: none !important;
box-shadow: 0 5px 14px rgba(86, 51, 22, 0.22) !important;
}
body.skin-vector-legacy #p-cactions .vector-menu-content-list,
.skin-vector-legacy #p-cactions .vector-menu-content-list,
#p-cactions .vector-menu-content-list {
display: block !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
}
body.skin-vector-legacy #p-cactions .vector-menu-content li,
.skin-vector-legacy #p-cactions .vector-menu-content li,
#p-cactions .vector-menu-content li {
display: block !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
}
body.skin-vector-legacy #p-cactions .vector-menu-content li + li,
.skin-vector-legacy #p-cactions .vector-menu-content li + li,
#p-cactions .vector-menu-content li + li {
margin-top: 0.3rem !important;
}
body.skin-vector-legacy #p-cactions .vector-menu-content li > a,
.skin-vector-legacy #p-cactions .vector-menu-content li > a,
#p-cactions .vector-menu-content li > a {
display: block !important;
width: 100% !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0.48rem 0.65rem !important;
border: 1.5px solid #c79a4a !important;
border-radius: 8px !important;
box-sizing: border-box !important;
background: #ffffff !important;
background-image: none !important;
color: #75462d !important;
font-family:
"SB Aggro M",
"SB 어그로 M",
"SB Aggro",
"SB 어그로",
sans-serif !important;
font-size: 0.76rem !important;
font-weight: 500 !important;
line-height: 1.3 !important;
text-align: left !important;
text-shadow: none !important;
box-shadow: none !important;
transform: none !important;
}
body.skin-vector-legacy #p-cactions .vector-menu-content li > a:hover,
.skin-vector-legacy #p-cactions .vector-menu-content li > a:hover,
#p-cactions .vector-menu-content li > a:hover {
border-color: #af7c2f !important;
background: #fff8e9 !important;
color: #5e321e !important;
text-decoration: none !important;
}
/* 환경 설정·로그인·계정 만들기 화면 */
body.mw-special-Preferences #content,
body.mw-special-Userlogin #content,
body.mw-special-CreateAccount #content,
body.mw-special-Preferences .mw-body,
body.mw-special-Userlogin .mw-body,
body.mw-special-CreateAccount .mw-body {
background: #e6d2b2 !important;
border-color: #5b1f09 !important;
}
body.mw-special-Preferences #preferences,
body.mw-special-Preferences #mw-prefs-form,
body.mw-special-Userlogin .mw-htmlform,
body.mw-special-CreateAccount .mw-htmlform,
body.mw-special-Userlogin #userloginForm,
body.mw-special-CreateAccount #userloginForm {
border: 2px solid #b88a59 !important;
border-radius: 16px !important;
background: #fffaf0 !important;
box-shadow: 0 4px 12px rgba(91, 31, 9, 0.12) !important;
}
body.mw-special-Preferences #preferences,
body.mw-special-Preferences #mw-prefs-form {
padding: 1rem !important;
}
body.mw-special-Userlogin .mw-htmlform,
body.mw-special-CreateAccount .mw-htmlform,
body.mw-special-Userlogin #userloginForm,
body.mw-special-CreateAccount #userloginForm {
max-width: 520px !important;
margin-right: auto !important;
margin-left: auto !important;
padding: 1.15rem !important;
box-sizing: border-box !important;
}
body.mw-special-Preferences .oo-ui-inputWidget-input,
body.mw-special-Preferences .mw-ui-input,
body.mw-special-Userlogin .oo-ui-inputWidget-input,
body.mw-special-Userlogin .mw-ui-input,
body.mw-special-CreateAccount .oo-ui-inputWidget-input,
body.mw-special-CreateAccount .mw-ui-input,
body.mw-special-Preferences input[type="text"],
body.mw-special-Preferences input[type="password"],
body.mw-special-Preferences input[type="email"],
body.mw-special-Userlogin input[type="text"],
body.mw-special-Userlogin input[type="password"],
body.mw-special-Userlogin input[type="email"],
body.mw-special-CreateAccount input[type="text"],
body.mw-special-CreateAccount input[type="password"],
body.mw-special-CreateAccount input[type="email"],
body.mw-special-Preferences select,
body.mw-special-Preferences textarea {
border: 2px solid #9d7651 !important;
border-radius: 10px !important;
background: #fffdf8 !important;
color: #4b3328 !important;
box-shadow: none !important;
}
body.mw-special-Preferences .oo-ui-inputWidget-input:focus,
body.mw-special-Preferences .mw-ui-input:focus,
body.mw-special-Userlogin .oo-ui-inputWidget-input:focus,
body.mw-special-Userlogin .mw-ui-input:focus,
body.mw-special-CreateAccount .oo-ui-inputWidget-input:focus,
body.mw-special-CreateAccount .mw-ui-input:focus,
body.mw-special-Preferences input:focus,
body.mw-special-Userlogin input:focus,
body.mw-special-CreateAccount input:focus,
body.mw-special-Preferences select:focus,
body.mw-special-Preferences textarea:focus {
border-color: #479745 !important;
outline: 0 !important;
box-shadow: 0 0 0 3px rgba(71, 151, 69, 0.16) !important;
}
body.mw-special-Preferences .oo-ui-buttonElement-button,
body.mw-special-Preferences .mw-ui-button,
body.mw-special-Userlogin .oo-ui-buttonElement-button,
body.mw-special-Userlogin .mw-ui-button,
body.mw-special-CreateAccount .oo-ui-buttonElement-button,
body.mw-special-CreateAccount .mw-ui-button {
border: 2px solid #356f36 !important;
border-radius: 999px !important;
background: linear-gradient(
180deg,
#62aa5f 0%,
#479745 100%
) !important;
color: #ffffff !important;
font-family:
"SB Aggro M",
"SB 어그로 M",
"SB Aggro",
"SB 어그로",
sans-serif !important;
font-weight: 500 !important;
text-shadow: none !important;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24) !important;
}
body.mw-special-Preferences .oo-ui-buttonElement-button:hover,
body.mw-special-Preferences .mw-ui-button:hover,
body.mw-special-Userlogin .oo-ui-buttonElement-button:hover,
body.mw-special-Userlogin .mw-ui-button:hover,
body.mw-special-CreateAccount .oo-ui-buttonElement-button:hover,
body.mw-special-CreateAccount .mw-ui-button:hover {
filter: brightness(1.06);
}
body.mw-special-Preferences #preftoc,
body.mw-special-Preferences .oo-ui-tabSelectWidget {
border: 2px solid #b88a59 !important;
border-radius: 12px !important;
background: #f5dfbd !important;
}
body.mw-special-Preferences #preftoc a,
body.mw-special-Preferences .oo-ui-tabOptionWidget {
color: #68412c !important;
font-family:
"SB Aggro M",
"SB 어그로 M",
"SB Aggro",
"SB 어그로",
sans-serif !important;
text-shadow: none !important;
}
/* =========================
  v34 최종 오버라이드
  ========================= */
html {
--pvz-content-top-v34: 24px;
--pvz-compact-search-width: 195px;
--pvz-search-down-offset: 5px;
}
/* 본문창을 조금 더 위로 이동 */
body.skin-vector-legacy #content,
body.skin-vector-legacy .mw-body,
.skin-vector-legacy #content,
.skin-vector-legacy .mw-body {
top: var(--pvz-content-top-v34) !important;
}
/* 왼쪽 액션바를 기존 위치보다 조금 더 왼쪽으로 이동 */
body.skin-vector-legacy #left-navigation,
.skin-vector-legacy #left-navigation,
#left-navigation {
top: var(--pvz-content-top-v34) !important;
margin-left: calc(
var(--pvz-layout-edge-gap) +
var(--pvz-side-panel-width) +
var(--pvz-layout-edge-gap) -
8px
) !important;
}
/* 오른쪽 액션바도 본문 높이 변경에 맞춰 유지 */
body.skin-vector-legacy #right-navigation,
.skin-vector-legacy #right-navigation,
#right-navigation {
top: var(--pvz-navigation-top, var(--pvz-content-top-v34)) !important;
}
/* 검색바를 소폭 늘리고 본문 오른쪽 끝에 정확히 맞춤 */
body.skin-vector-legacy #pvz-content-search,
.skin-vector-legacy #pvz-content-search,
#pvz-content-search {
top: calc(
var(--pvz-navigation-top, var(--pvz-content-top-v34)) +
var(--pvz-search-down-offset)
) !important;
right: var(--pvz-content-right-gap, 1rem) !important;
left: auto !important;
width: var(--pvz-compact-search-width) !important;
max-width: var(--pvz-compact-search-width) !important;
}
/* 검색 버튼 배경을 문서 제목과 같은 #106A40으로 통일 */
body.skin-vector-legacy #pvz-content-search #simpleSearch #searchButton,
body.skin-vector-legacy #pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton),
.skin-vector-legacy #pvz-content-search #simpleSearch #searchButton,
.skin-vector-legacy #pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton),
#pvz-content-search #simpleSearch #searchButton,
#pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton) {
border-left-color: #0b5432 !important;
background: #106a40 !important;
background-color: #106a40 !important;
background-image: none !important;
}
body.skin-vector-legacy #pvz-content-search #simpleSearch #searchButton:hover,
body.skin-vector-legacy #pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton):hover,
.skin-vector-legacy #pvz-content-search #simpleSearch #searchButton:hover,
.skin-vector-legacy #pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton):hover,
#pvz-content-search #simpleSearch #searchButton:hover,
#pvz-content-search #simpleSearch .searchButton:not(#mw-searchButton):hover {
background: #0d5b36 !important;
background-color: #0d5b36 !important;
background-image: none !important;
}
/* 로고칸의 상하 길이를 크게 축소 */
body.skin-vector-legacy #mw-panel #p-logo,
.skin-vector-legacy #mw-panel #p-logo,
#mw-panel #p-logo {
height: 58px !important;
min-height: 0 !important;
max-height: 58px !important;
margin-bottom: 0.72rem !important;
padding: 0 !important;
}
body.skin-vector-legacy #mw-panel #p-logo a,
body.skin-vector-legacy #mw-panel #p-logo .mw-wiki-logo,
.skin-vector-legacy #mw-panel #p-logo a,
.skin-vector-legacy #mw-panel #p-logo .mw-wiki-logo,
#mw-panel #p-logo a,
#mw-panel #p-logo .mw-wiki-logo {
width: 100% !important;
height: 58px !important;
min-height: 0 !important;
max-height: 58px !important;
aspect-ratio: auto !important;
background-size: contain !important;
}
body.skin-vector-legacy #mw-panel #p-logo img,
.skin-vector-legacy #mw-panel #p-logo img,
#mw-panel #p-logo img {
width: 100% !important;
height: 58px !important;
min-height: 0 !important;
max-height: 58px !important;
object-fit: contain !important;
}
/* 환경 설정·로그인·회원가입 화면 공통 */
html.pvz-special-preferences body.skin-vector-legacy #content,
html.pvz-special-login body.skin-vector-legacy #content,
html.pvz-special-createaccount body.skin-vector-legacy #content,
html.pvz-special-preferences body.skin-vector-legacy .mw-body,
html.pvz-special-login body.skin-vector-legacy .mw-body,
html.pvz-special-createaccount body.skin-vector-legacy .mw-body {
background: #e6d2b2 !important;
border: 15px solid #5b1f09 !important;
border-radius: 30px !important;
box-shadow: none !important;
}
html.pvz-special-preferences body.skin-vector-legacy #content::before,
html.pvz-special-login body.skin-vector-legacy #content::before,
html.pvz-special-createaccount body.skin-vector-legacy #content::before,
html.pvz-special-preferences body.skin-vector-legacy .mw-body::before,
html.pvz-special-login body.skin-vector-legacy .mw-body::before,
html.pvz-special-createaccount body.skin-vector-legacy .mw-body::before {
content: "" !important;
position: absolute !important;
inset: 15px !important;
z-index: -1 !important;
display: block !important;
border-radius: 18px !important;
background: #fffae9 !important;
}
/* 특수 화면의 실제 폼 컨테이너를 폭넓게 지정 */
html.pvz-special-preferences body.skin-vector-legacy #preferences,
html.pvz-special-preferences body.skin-vector-legacy #mw-prefs-form,
html.pvz-special-preferences body.skin-vector-legacy .mw-prefs-container,
html.pvz-special-preferences body.skin-vector-legacy .oo-ui-panelLayout,
html.pvz-special-login body.skin-vector-legacy #userloginForm,
html.pvz-special-login body.skin-vector-legacy .mw-htmlform,
html.pvz-special-login body.skin-vector-legacy .mw-ui-vform,
html.pvz-special-login body.skin-vector-legacy .oo-ui-panelLayout,
html.pvz-special-createaccount body.skin-vector-legacy #userloginForm,
html.pvz-special-createaccount body.skin-vector-legacy #mw-createaccount-form,
html.pvz-special-createaccount body.skin-vector-legacy .mw-htmlform,
html.pvz-special-createaccount body.skin-vector-legacy .mw-ui-vform,
html.pvz-special-createaccount body.skin-vector-legacy .oo-ui-panelLayout {
border: 2px solid #b88a59 !important;
border-radius: 16px !important;
box-sizing: border-box !important;
background: #fffaf0 !important;
box-shadow: 0 4px 12px rgba(91, 31, 9, 0.12) !important;
}
html.pvz-special-login body.skin-vector-legacy #userloginForm,
html.pvz-special-login body.skin-vector-legacy .mw-htmlform,
html.pvz-special-login body.skin-vector-legacy .mw-ui-vform,
html.pvz-special-createaccount body.skin-vector-legacy #userloginForm,
html.pvz-special-createaccount body.skin-vector-legacy #mw-createaccount-form,
html.pvz-special-createaccount body.skin-vector-legacy .mw-htmlform,
html.pvz-special-createaccount body.skin-vector-legacy .mw-ui-vform {
width: min(100%, 560px) !important;
margin-right: auto !important;
margin-left: auto !important;
padding: 1.2rem !important;
}
/* 환경 설정 탭 */
html.pvz-special-preferences body.skin-vector-legacy #preftoc,
html.pvz-special-preferences body.skin-vector-legacy .oo-ui-tabSelectWidget,
html.pvz-special-preferences body.skin-vector-legacy .oo-ui-indexLayout-tabPanel {
border: 2px solid #b88a59 !important;
border-radius: 12px !important;
background: #f5dfbd !important;
box-shadow: none !important;
}
html.pvz-special-preferences body.skin-vector-legacy #preftoc a,
html.pvz-special-preferences body.skin-vector-legacy .oo-ui-tabOptionWidget,
html.pvz-special-preferences body.skin-vector-legacy .oo-ui-tabOptionWidget-label {
color: #68412c !important;
font-family:
"SB Aggro M",
"SB 어그로 M",
"SB Aggro",
"SB 어그로",
sans-serif !important;
text-shadow: none !important;
}
/* 특수 화면 입력창 */
html.pvz-special-preferences body.skin-vector-legacy input,
html.pvz-special-preferences body.skin-vector-legacy select,
html.pvz-special-preferences body.skin-vector-legacy textarea,
html.pvz-special-preferences body.skin-vector-legacy .oo-ui-inputWidget-input,
html.pvz-special-login body.skin-vector-legacy input,
html.pvz-special-login body.skin-vector-legacy select,
html.pvz-special-login body.skin-vector-legacy textarea,
html.pvz-special-login body.skin-vector-legacy .oo-ui-inputWidget-input,
html.pvz-special-createaccount body.skin-vector-legacy input,
html.pvz-special-createaccount body.skin-vector-legacy select,
html.pvz-special-createaccount body.skin-vector-legacy textarea,
html.pvz-special-createaccount body.skin-vector-legacy .oo-ui-inputWidget-input {
border: 2px solid #9d7651 !important;
border-radius: 10px !important;
box-sizing: border-box !important;
background: #fffdf8 !important;
color: #4b3328 !important;
box-shadow: none !important;
}
html.pvz-special-preferences body.skin-vector-legacy input:focus,
html.pvz-special-preferences body.skin-vector-legacy select:focus,
html.pvz-special-preferences body.skin-vector-legacy textarea:focus,
html.pvz-special-preferences body.skin-vector-legacy .oo-ui-inputWidget-input:focus,
html.pvz-special-login body.skin-vector-legacy input:focus,
html.pvz-special-login body.skin-vector-legacy select:focus,
html.pvz-special-login body.skin-vector-legacy textarea:focus,
html.pvz-special-login body.skin-vector-legacy .oo-ui-inputWidget-input:focus,
html.pvz-special-createaccount body.skin-vector-legacy input:focus,
html.pvz-special-createaccount body.skin-vector-legacy select:focus,
html.pvz-special-createaccount body.skin-vector-legacy textarea:focus,
html.pvz-special-createaccount body.skin-vector-legacy .oo-ui-inputWidget-input:focus {
border-color: #479745 !important;
outline: 0 !important;
box-shadow: 0 0 0 3px rgba(71, 151, 69, 0.16) !important;
}
/* 특수 화면 버튼 */
html.pvz-special-preferences body.skin-vector-legacy button,
html.pvz-special-preferences body.skin-vector-legacy .mw-ui-button,
html.pvz-special-preferences body.skin-vector-legacy .oo-ui-buttonElement-button,
html.pvz-special-login body.skin-vector-legacy button,
html.pvz-special-login body.skin-vector-legacy .mw-ui-button,
html.pvz-special-login body.skin-vector-legacy .oo-ui-buttonElement-button,
html.pvz-special-createaccount body.skin-vector-legacy button,
html.pvz-special-createaccount body.skin-vector-legacy .mw-ui-button,
html.pvz-special-createaccount body.skin-vector-legacy .oo-ui-buttonElement-button {
border: 2px solid #356f36 !important;
border-radius: 999px !important;
background: linear-gradient(
180deg,
#62aa5f 0%,
#479745 100%
) !important;
color: #ffffff !important;
font-family:
"SB Aggro M",
"SB 어그로 M",
"SB Aggro",
"SB 어그로",
sans-serif !important;
font-weight: 500 !important;
text-shadow: none !important;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24) !important;
}
/* 로그인·회원가입 안내 및 보조 박스 */
html.pvz-special-login body.skin-vector-legacy .mw-htmlform-ooui-wrapper,
html.pvz-special-createaccount body.skin-vector-legacy .mw-htmlform-ooui-wrapper,
html.pvz-special-login body.skin-vector-legacy .mw-createacct-benefits-container,
html.pvz-special-createaccount body.skin-vector-legacy .mw-createacct-benefits-container {
border-radius: 14px !important;
background: transparent !important;
color: #4b3328 !important;
}
}
원본 주소 "https://pvzkrwiki.com/index.php/미디어위키:Gadget-Vector.css"