Central

편집 보호된 문서입니다. 문서의

을 확인하세요.

위키 스킨
the tree	공식	Liberty buma
the tree	비공식	blanc Central clearsky clue Glass Neoline NINEAPPLE modern sonagu riverty
the seed	공식	Liberty senkawa namu-dough
the seed	비공식	buma vector vutterfly
openNAMU	공식	Ringo Liberty Before_namu SL_open Acme
openNAMU	비공식	Liberty buma Vision
미디어위키	공식
미디어위키	비공식	Liberty
_{음영 표시: 업데이트가 중단된 스킨}

1. 개요2. 제로 베이스 위키 스킨을 만들게 된 계기3. 특징4. 라이선스5. 사용 위키6. 사용 방법

6.1. the tree

6.1.1. publicConfig.json6.1.2. stringConfig.json

6.2. openNAMU

6.2.1. 사이드바 요소 가리기6.2.2. 파비콘 적용

7. 업데이트 내역

7.1. v3.0a7.2. v3.1b7.3. v3.27.4. v3.37.5. v3.47.6. v3.57.7. v3.67.8. v3.77.9. v4.0

7.9.1. 2025/01/257.9.2. 2025/01/267.9.3. 2025/01/277.9.4. 2025/01/287.9.5. 2025/01/297.9.6. 2025/01/307.9.7. 2025/01/317.9.8. 2025/02/017.9.9. 2025/02/037.9.10. 2025/02/047.9.11. 2025/02/057.9.12. 2025/02/067.9.13. 2025/02/127.9.14. 2025/02/17

7.10. v4.1

7.10.1. 2025/02/197.10.2. 2025/02/237.10.3. 2025/02/247.10.4. 2025/02/257.10.5. 2025/02/267.10.6. 2025/02/277.10.7. 2025/03/09

7.11. v4.2

7.11.1. 2025/03/107.11.2. 2025/03/117.11.3. 2025/03/127.11.4. 2025/03/157.11.5. 2025/03/167.11.6. 2025/03/177.11.7. 2025/03/187.11.8. 2025/03/197.11.9. 2025/03/207.11.10. 2025/03/287.11.11. 2025/04/057.11.12. 2025/04/21

7.12. v5.0

7.12.1. 2025/04/277.12.2. 2025/04/287.12.3. 2025/04/307.12.4. 2025/05/027.12.5. 2025/05/03

1. 개요 [편집]


PC 버전	Mobile 버전
Central 스킨 스크린샷 (2025/02) 사진을 눌러 크게 볼 수 있습니다.

라이선스 페이지 | Github (the tree)[권한필요] | Github (openNAMU)[권한필요]

다올위키의 기본 스킨인 Vision 스킨의 후속작이며, 2024년 12월 2일부터 대체되었다.
초기 계획안은 Vision 스킨의 v3로 버전을 높일 예정이였으나, 생각보다 큰 스케일이라 스킨 이름까지 변경하였다.
- 그 덕에 스킨 이름이 바뀔 때마다 버전 1씩 올라가는 규칙이 생겼'었'다.
  - Liberty: v1, Vision: v2, Central: v3
  - openNAMU 버전의 Central은 v3이고 the tree의 ejs 버전의 Central는 v4, vue 버전은 v5로 버전이 올라가면서 이 규칙은 사라졌다.
클로즈드 소스이며, 공개할 계획은 없다. 단, 사용권이 부여된 위키에서 사용할 수 있게 부분적으로 완화되었다.
부트스트랩을 버리고 제로 베이스로 새롭게 만든 스킨이다.
Vision과 큰 차이는 없지만 소소하게 다른 점이 많다. 자세한 정보는 특징 문단 참고.
해당 스킨의 openNAMU 버전은 openNAMU의 다국어 가이드라인을 지키지 않기 때문에 사용자 설정에서 영어로 설정해도 한국어로 나오는 부분이 있다. the tree는 다국어 기능이 존재하지 않기 때문에 해당 사항이 없다.
해당 스킨의 후속작인 central이 출시되었다. 하지만 메인 스킨이 될 예정은 없다.

2. 제로 베이스 위키 스킨을 만들게 된 계기 [편집]

다시 만든 이유는 끔찍한 Vision의 로딩 속도 때문이다. 특히, 속도제한 같은 특수한 상황에서 더더욱.
실제로 용량이 많이 줄었다. Liberty(한마음): 1310KB[3] / Vision: 108KB / Central: 59KB로 Vision에 비해 2배 이상[4] 줄어들었기 때문이다.

3. 특징 [편집]

상단바
- 상단바 높이를 좀 더 늘렸다.
- PC 같이 넓은 화면에서는 검색 창이 더 넓게 표시된다.
상단바 드롭다운 부분
- 위 아래 간격을 좀 더 넓혔다.
- 애니메이션이 세련되게 바뀌었다(?)
- 알림 드롭다운이 추가되었다.
본문
- 둥근 테두리를 본문에도 추가하여 사이드바와 통일성을 더했다.[5]
- 글자 크기를 the seed 신스킨과 통일하기 위해 14.4px에서 15px로 조정하였다.
- 배경 색도 더 밝게 조정하였다.
사이드바
- 절대 시간으로 표기되던 것이 상대 시간으로 표기된다.

4. 라이선스 [편집]

다올위키의 라이선스 페이지를 참고하세요.

5. 사용 위키 [편집]

순서는 적용된 순서대로 정렬합니다.

6. 사용 방법 [편집]

6.1. the tree [편집]

6.1.1. publicConfig.json [편집]

Central 스킨 변수
종류	변수 이름	기본값	사용 예시	추가 설명
메인 컬러	skin.central.main_color	#996FFF	"skin.central.main_color": "#696FFF"	[12]
상단바 색상	skin.central.nav_color	#996FFF	"skin.central.nav_color": "linear-gradient(90deg, #996FFF, #696FFF)"	[13]
서브 컬러	skin.central.sub_color	#A783FF	"skin.central.sub_color": "#7E83FF"	[14]
이름공간 밑줄 색상	skin.central.ns_color	#A783FF40 [15]	"skin.central.ns_color": "#e7ddff"	[16]
이름공간 밑줄 색상	skin.central.dark_ns_color	#A783FF40 [15]	"skin.central.dark_ns_color": "#532fa9"	[17]
상단바 로고 가로 길이	skin.central.logo_width	75px	"skin.central.logo_width": "75px"	[18]
상단바 로고 이미지 세로 크기	skin.central.logo_size	auto	"skin.central.logo_size": "20px"	[19]
특수 기능 드롭다운 위치 변경	skin.central.dropdown_left	auto	"skin.central.dropdown_left": "0"	[20]
[사이드바 일정] 시작일	skin.central.banner_date_start	-	"2023-11-01"	[21]
[사이드바 일정] 종료일	skin.central.banner_date_end	-	"2023-11-01"	[22]
[사이드바 일정] 제목	skin.central.banner_date_title	-	"머찐 기념일"	[23]
[사이드바 일정] 설명	skin.central.banner_date_content	-	"우와 머찌다"	[24]
[사이드바 일정] 색상	skin.central.banner_date_color	1	"2"	[25]
[사이드바 일정] 링크	skin.central.banner_date_link	-	"/w/central"	[26]

6.1.2. stringConfig.json [편집]

skin.central.footer_html
- footer_text보다 우선 적용하고 싶을 때 사용
skin.central.sitenotice
- 위키 전체 공지보다 우선 적용
- 해당 스킨만 작동하는 공지를 적용하고 싶을 때도 가능
skin.central.ad_top_html / skin.central.ad_side_html
- 문서 제목과 내용 사이 / 사이드바 목차 아래에 광고 적용 가능
- nonce="{cspNonce}"를 넣어야 정상 작동

6.2. openNAMU [편집]

관리 도구 > 소유자 설정 > 메인 <HEAD> 으로 이동합니다.
(central)을 클릭한 후 다음 코드를 붙여넣습니다.

<meta name="theme-color" content="#(메인 컬러)">
<style>
:root {
    --main-color: #(메인 컬러);
    --menu-button-color: #(메인 컬러);
    --sub-color: #(서브 컬러);
    --light-sub-color: #(서브 컬러);
}
</style>

메인 컬러는 위키의 메인 컬러를 뜻합니다.
서브 컬러는 네비 바 옵션에 마우스를 올렸을 때의 색상을 뜻합니다.
혹시 해서 말하지만 색상 코드는 #abcdef 식입니다. 괄호는 빼야합니다.

(central-cssdark) 탭에 들어갑니다.
다음 코드를 그대로 붙여넣습니다.

<style>
:root {
    --main-color: #2d2f34;
    --menu-button-color: #777;
    --sub-color: #383b40;
}
</style>

6.2.1. 사이드바 요소 가리기 [편집]

관리 도구 > 소유자 설정 > 메인 <HEAD>으로 이동합니다.
다음 코드를 입력합니다.

<style>
.sidebar-0 {
	display: none;
}
</style>

<style>
.sidebar-0, .sidebar-2 {
	display: none;
}
</style>

* 다음과 같이 ','로 구분하여 다른 사이드바 탭도 끌 수 있습니다.
* 다른 사이드바 정보는 다음과 같으며 '.'을 꼭 붙여야 작동하니 참고하세요.

사용자 정보	.sidebar-0
최근 변경	.sidebar-1
최근 토론	.sidebar-2
목차[27]	.sidebar-5

6.2.2. 파비콘 적용 [편집]

스킨 특성상 파비콘은 서버 내에서 적용하여야 합니다.

7. 업데이트 내역 [편집]

v3: openNAMU
v4: the tree (ejs)
v5: the tree (vue, 최신 버전)

7.1. v3.0a [편집]

2024/09/01 ~ 2024/12/01 수정
2024/12/01 업데이트
Alpha 버전으로, 업데이트 될때마다 버전을 수정하지 않는다.

2024년 9월 1일
- 기본 틀 만들기
  - html, css, js 틀 만들기
2024년 9월 9일
- 상단바 40% 완성
  - 로고, 내비 메뉴, 드롭다운까지 완성
2024년 11월 25일
- 상단바 ringo의 힘을 빌려 모두 완성
- ~~오래 걸린 이유는 군대 이슈이니 이해를...~~
2024년 11월 29일
- 사이드바 완성
- 점프 버튼 완성
2024년 12월 1일
- 완성

7.2. v3.1b [편집]

2024/12/02 ~ 2024/12/08 수정
2024/12/08 업데이트

묘하게 중앙이 안 맞는 헤더 메뉴 글씨들 대강 수정
모바일 UI에서 상단바 메뉴 호버했을 때 가운데가 안 맞던 문제 수정
그라바타가 위쪽으로 쏠린 문제 수정
점프버튼 세로에서 가로로 변경
데스크탑 UI 1024px ~ 1200px 한정 사이드바가 오른쪽으로 넘어가는 문제 수정
모바일 사파리에서 버튼이 흰색 글씨로 나오는 문제 수정

7.3. v3.2 [편집]

2024/12/08 ~ 2024/12/12 수정
2024/12/12 업데이트

ringo 업데이트 포크
사이드바 목차 추가[28]
기본 글자 크기 트랜드에 맞춰 15px로 조정
라이선스 링크 다올위키로 변경
푸터에 Hosted by Wikive project 추가

7.4. v3.3 [편집]

2024/12/13 ~ 2024/12/14 수정
2024/12/14 업데이트

데스크탑 UI 1024px ~ 1200px 한정 사이드바가 오른쪽으로 넘어가는 문제 진짜로 수정
math 매크로 사용 시 본문보다 위로 올라가는 현상 수정
대표색 Wikive 컬러로 변경
편집 창 폰트, 글자 크기 재 지정

7.5. v3.4 [편집]

2024/12/15 ~ 2024/12/17 수정
2024/12/17 업데이트

사용자 정보 사이드바에서 닉네임이 사이드바 길이보다 길 경우[29] 튀어나가는 문제 수정
드롭다운 애니메이션 추가
오픈나무 업데이트로 인한 토론 자체 디자인 적용 안되던 문제 해결
PC 한정: 사이드바 디자인에 맞춰 본문도 동글하게 수정
본문 배경 색과 사이드바 배경 색 통일
1024px ~ 1200px 사이드바 잘림 문제 패치 이후 1400px 이상일 때 사이드바 오른쪽 잘리는 문제 해결
768px ~ 1023px: 검색 라이아웃, 상단 메뉴와 공백이 안 맞던 문제 해결
배경 색 및 드롭다운 색상 수정
저장 미리보기 버튼에 위키 대표 색 적용

7.6. v3.5 [편집]

2024/12/22 ~ 2024/12/24 수정
2024/12/24 업데이트

색상 변수 값 정리
문서 제목 서브 글자 크기 조정
체크 박스 다크모드 적용
토론 자체 디자인 컬러 조정
사이드바 사용자 정보에 레벨 추가
사이드바 절대 시간에서 상대 시간으로 변경
라이트 / 다크 테마 전환 토글 추가
왼쪽 헤더 메뉴 묘하게 중앙 안 맞는 문제 또 수정

7.7. v3.6 [편집]

2024/12/25 ~ 2025/01/05 수정
2025/01/05 업데이트

여론에 따라 사이드바의 최근 게시글, 연합 최근 변경 삭제[30]
토론에서 도구 팝업이 좀 많이 내려가는 현상 수정

7.8. v3.7 [편집]

2025/01/05 ~ 2025/01/12 수정
2025/01/12 업데이트

Wikive 전체 공지 시스템 추가[전체공지]

7.9. v4.0 [편집]

7.9.1. 2025/01/25 [편집]

첫 커밋 시작
dark.css 우선 순위 변경
js 변수 구조 변경
드롭다운 작동 안하는 문제 수정
사이드바 API 대신 엔진 API로 변경
툴 버튼 드롭다운 일부 사용
최근 변경에서 닉네임이 길 경우 줄 바꿈 되도록 수정
툴 버튼에 드롭다운이 존재하면 마지막 둥근 모서리 안되는 문제 수정
의도치 않은 동작 때문에 :focus 삭제

7.9.2. 2025/01/26 [편집]

skin.central.dark_ns_color 추가
the tree와 맞지 않는 링크 수정
편집 요청 팝업 구현 전 임시로 링크로 들어가지게 수정
일부 다크모드 미적용 해결
색상 불러오는 방식 모두 js로 수정
공지 디자인 수정
스킨 설정(내비바 고정, 사이드바 위치 조정) 추가

7.9.3. 2025/01/27 [편집]

다크모드일 때 sub 색상이 라이트 색상으로 표시되던 오류 수정
변수 색상[32] 조정
업로드나 편집할 때 저장 버튼이 본문에서 튀어나가는 문제 해결

7.9.4. 2025/01/28 [편집]

변수 색상 실수 수정
로고 css 수정
사이드바 사용자 탭 추가
설정에 사용자 사이드바 끄기 기능 추가

7.9.5. 2025/01/29 [편집]

보고 있는 문서에 토론이 진행 중이면 토론 버튼에 강조 색상 추가
사이드바 최근 변경 수 8개에서 12개로 변경
다크모드 방식 변경

7.9.6. 2025/01/30 [편집]

문서 이름이 길 때 툴 버튼에서 줄바꿈되는 오류 수정
광고 상단, 측면 추가
모바일에서 툴 버튼이 튀어나가는 오류 수정

7.9.7. 2025/01/31 [편집]

사용자 토론이 존재하면 표시되는 공지 UI 추가[33]
공지 UI 활용하여 편집 요청 메시지 추가
공지 UI의 카테고리가 중앙이 틀어진 오류 수정

7.9.8. 2025/02/01 [편집]

툴 버튼의 일부 아이콘 변경
본문 글씨 크기 16px에서 15px로 조정

7.9.9. 2025/02/03 [편집]

[다크 모드] 편집 요청 공지 UI에서 링크 구별이 안되는 오류 수정
[다크 모드] the tree 내부 UI에서 다크 모드가 적용 안되는 부분 적용되게 수정
[다크 모드] 배경 색 변경

7.9.10. 2025/02/04 [편집]

code 박스, 중괄호로 문법 무효할 때의 글꼴 지정
라이선스 페이지에서 가로 스크롤 추가[34]

7.9.11. 2025/02/05 [편집]

[다크 모드] 위키 공지에 링크 색상 변경
[다크 모드] the tree 내부 UI에서 다크 모드가 적용 안되는 부분 적용되게 수정 2

7.9.12. 2025/02/06 [편집]

[다크 모드] 문서에서 외부 링크 색상 수정

7.9.13. 2025/02/12 [편집]

js 파일이 the tree로 옮겨지면서 main.js, sub.js 굳이 이원화할 이유가 사라짐에 따라 main.js로 통합

7.9.14. 2025/02/17 [편집]

각주에 사진이 있을 때 글자와 세로 중앙이 안 맞는 문제 해결

7.10. v4.1 [편집]

7.10.1. 2025/02/19 [편집]

the tree 엔진에 이름공간에 따른 라이선스 표기 방식으로 변경됨에 따라 라이선스 표기 방식 변경

7.10.2. 2025/02/23 [편집]

폰트어썸 버전 업데이트
다크 모드, 라이트 모드로 전환할 때 부드럽게 전환되게 애니메이션 추가
위키에서 볼드체 표기를 700에서 600으로 변경
이름공간 밑줄 표시를 : 포함시키도록 수정

7.10.3. 2025/02/24 [편집]

[다크 모드] the tree 내부 UI에서 다크 모드가 적용 안되는 부분 적용되게 수정 3

7.10.4. 2025/02/25 [편집]

편집을 아예 못할 때 표시되는 자물쇠 열려 있는 아이콘을 수정
사용자 사이드바 끄기를 기본값으로 변경
문서 하단에 표기되는 저작권 정책을 오측 정렬로 본문가 이격
위키 로고가 짧은 경우를 위해 특수 기능 드롭다운 위치를 조정할 수 있는 config 추가
최하단 링크를 눌렀을 때 새 탭으로 열리도록 수정

7.10.5. 2025/02/26 [편집]

문서 도구 드롭다운에도 아이콘 추가
본문의 최소 높이를 추가
사용자 드롭다운에 편집 요청 기여 목록 추가

7.10.6. 2025/02/27 [편집]

사이드바 기본값의 모바일, PC 구분 방식 변경
부드러운 스크롤 추가

7.10.7. 2025/03/09 [편집]

[다크 모드] 버튼 hover 색상 변경
[다크 모드] the tree 내부 UI에서 다크 모드가 적용 안되는 부분 적용되게 수정 4
[다크 모드] 공지 디자인에서 X 버튼에 색상 변경
the tree에 고립된 분류 기능 추가에 따른 드롭다운에 링크 추가

7.11. v4.2 [편집]

7.11.1. 2025/03/10 [편집]

스킨 라이선스 표기 방식 변경
[다크 모드] 위키 엔진에서 사용하는 최근 변경 위키 대표 색을 변경

7.11.2. 2025/03/11 [편집]

프리텐다드가 적용되지 않는 select도 적용되도록 수정
모나코 에디터와 충돌하는 css 수정
표 기본 색상을 #fff로 수정

7.11.3. 2025/03/12 [편집]

[다크 모드] the tree 내부 UI를 건드리는 css 모두 삭제
사이드바 아이템을 호버했을 때의 변화 추가
사이드바 목차 기능 추가
레거시 목차 css 갱신

7.11.4. 2025/03/15 [편집]

목차 링크 구현

7.11.5. 2025/03/16 [편집]

목차 .을 숫자 텍스트에 포함
사이드바 목차에 문법 표시 삭제
사이드바 목차 headings null 확인
사이드바 padding 값 수정

7.11.6. 2025/03/17 [편집]

the tree 업데이트인 다크 모드 class 명칭 변경에 따른 .theseed-dark-mode → .thetree-dark-mode로 변경

7.11.7. 2025/03/18 [편집]

사이드바 목차의 글자 크기를 15px에서 14.4px로 변경
[다크 모드] 링크 색상이 적용 안되는 문제 해결
[다크 모드] 라이선스 페이지에서 링크 색상 수정

7.11.8. 2025/03/19 [편집]

css 우선 순위로 인한 수정

7.11.9. 2025/03/20 [편집]

css 우선 순위로 인한 수정

7.11.10. 2025/03/28 [편집]

모나코 에디터와 충돌로 인한 div에 프리텐다드 적용 삭제

7.11.11. 2025/04/05 [편집]

프로그레스 바에 이름공간 밑줄 색상이 적용되도록 수정
최근 변경 사이드바 메뉴들도 15px에서 14.4px로 수정

7.11.12. 2025/04/21 [편집]

다크 모드에서 파란 링크로 표시되는 것을 설정화 함
- 주황 링크를 원하는 사람이 있어서 패치를 해봄
- 반쪽 짜리 기능이였으나 vue로 오면서 작동 안 함...

7.12. v5.0 [편집]

7.12.1. 2025/04/27 [편집]

the tree의 프론트엔드가 ejs에서 vue로 전환됨에 따라 Vue 포팅
드롭다운 작동 방식 변경
상단바에 위키 로고 config 수정
vue로 전환하면서 the seed와 호환을 위해 .thetree-dark-mode → .theseed-dark-mode로 환원
다른 드롭다운을 열었을 때 기존 드롭다운이 안 닫히는 오류? 해결
vue 전환에 따른 js 파일 제거
[다크 모드] 문서명 색상이 과도하게 바뀌는 문제 해결
[다크 모드] 라이선스 페이지에서 링크 색상 적용 안되는 문제 해결

7.12.2. 2025/04/28 [편집]

ACL 메시지 표시 후 클릭 시 편집 페이지로 이동
contentTool 새 엔진 호환
제목 옆에 붙는 (역사)나 (비교) 등이 제목과 붙는 문제 해결

7.12.3. 2025/04/30 [편집]

프로그레스 바 색상이 변경 안 되는 문제 해결

7.12.4. 2025/05/02 [편집]

볼드체 700 → 600 재조정

7.12.5. 2025/05/03 [편집]

내비바 고정일 때 사이드바 목차 위치 재조정

[권한필요] ^1.1 ^1.2 접근 권한이 있어야 볼 수 있다.[3] 이때는 부트스트랩, 폰트어썸 등을 CDN 따위 쓰지 않고 스킨 파일에 때려박았기 때문에 굉장히 엄청났다.[4] 스킨 용량으로 보면 2배가 안되나, CDN으로 불러오는 부트스트랩과 제이쿼리는 제외된 용량이기 때문에 2배 이상이 맞다.[5] PC만 적용된다.[기본] ^6.1 ^6.2 ^6.3 ^6.4 ^6.5 [제한] 비로그인 사용자는 본 스킨 이용 불가[12] 크롬 테마 컬러와 엔진 내부의 브랜드 컬러로 사용된다.[13] 단색이 기본값이나 그라데이션 같은 문법도 사용 가능하다.[14] 상단바 아이템을 마우스 호버할 때 나타나는 색상과 마우스 드래그 했을 때 표시되는 색상이다.[15] 투명도가 포함되어 있는 헥스 코드이기 때문에 기본값으로는 다크모드 구분이 없다. 구버전 브라우저에서는 작동 안 할 수 있다.[16] 라이트모드일 때의 이름공간 밑줄 색상.[17] 라이트모드일 때의 이름공간 밑줄 색상.[18] 로고가 표시될 면적[19] svg면 자동 조정되나 png, jpg같은 일반 이미지는 따로 조정해줘야 한다.[20] 로고 길이가 짧은 경우 드롭다운이 오른쪽 정렬할 때 왼쪽이 잘리는 문제가 있는 경우만 0으로 사용할 것.[21] 사이드바에 일정을 표시할 시작일 작성[22] 사이드바에 일정을 표시할 종료일 작성[23] 사이드바에 일정의 제목 입력[24] 사이드바에 일정의 설명 입력[25] 사이드바에 일정의 색상 선택. 1: 빨강 / 2: 노랑 / 3: 초록[26] 사이드바에 일정을 클릭했을 때 넘어갈 링크 작성. 외부 링크 불가[27] 목차가 존재하는 페이지에서만 작동[28] v3.5.1-v23 이전 버전은 일반 문서에는 적용되지 않는 버그 존재[29] 예) IPv6[30] 미래에 버튼으로 구현할 계획 때문에 일단 js에선 각주로 남겨둠[전체공지] [32] 라이트 모드 링크 색상, 드래그할 때 나오는 컬러[33] 검색 창 오른쪽에 알림은 가독성이 안 좋다고 판단하여 닫을 수 있는 알림 추가.[34] 라이선스 정보가 더 길 경우 스킨을 벗어나는 문제가 있었음.

문서 가져옴

이 문서는 위키/스킨/Central(openNAMU)의 r4 에서 가져왔어요. 기여자 확인

문서 가져옴

이 문서는 위키/스킨/Central(the tree)의 r19 에서 가져왔어요. 기여자 확인