검색 여닫기
메뉴 여닫기
37
87
11
1.6천
Project ZETA Wiki
환경 설정 메뉴 여닫기
개인 메뉴 여닫기
로그인하지 않음
지금 편집한다면 당신의 IP 주소가 공개될 수 있습니다.

User:Pjzeta: 두 판 사이의 차이

편집 452회에 가입함
더 많은 작업
← 이전 편집
Pjzeta (토론 | 기여)
인터페이스 관리자, 관리자
452 편집
내용 삭제됨 내용 추가됨
시각위키텍스트
편집 요약 없음
편집 요약 없음
 
(같은 사용자의 중간 판 22개는 보이지 않습니다)
1번째 줄: 1번째 줄:
== 코덱스 아이콘 라이트 모드 개선안 비교 ==
== InfoboxNeue 테스트 — 왕벌의 비행 ==
각 방안을 라이트/다크 배경에 고정해 나란히 표시. 실제 적용 시에는 <code>틀:CodexTable/styles.css</code>에 CSS 한 줄을 추가하는 방식.

{{#invoke:InfoboxNeue|fromArgs
|title = 왕벌의 비행
|subtitle = 휘몰아치는 선율로 이름난 비행의 곡
|image = 왕벌의_비행.png

|section1 = 기본 정보
|label2 = 분류 | content2 = 공격형
|label3 = 가격 | content3 = 600

|section4 = 보유 효과
|label5 = 공격 속도 | content5 = 8.5% / 17.5% / 26% / 36.5%

|section6 = 고유 효과
|section-col6 = 1
|label7 = T2 | content7 = 적 히어로에게 기본 공격 시 다음 3회의 기본 공격 동안 공격 속도가 '''50%''' 증가합니다. (15초)
|label8 = T4 | content8 = 적 히어로에게 기본 공격 시 다음 3회의 기본 공격 동안 공격 속도가 '''100%''' 증가하고 '''기본 공격으로 입히는 피해가 20% 증가합니다'''. (15초)
}}

----

== 바리에이션 1 — Genshin 유물 스타일 (2세트/4세트 강조) ==

''레퍼런스: [https://genshin-impact.fandom.com/wiki/Crimson_Witch_of_Flames Crimson Witch of Flames] — 2-Piece/4-Piece Bonus 개념을 T2/T4로 차용''

{| style="float:right; width:340px; margin:0 0 1em 1em; border:1px solid #888; border-radius:6px; background:var(--color-surface-1); word-break:keep-all;"
|-
| style="padding:12px; text-align:center; background:var(--color-surface-2); border-radius:6px 6px 0 0;" | [[파일:왕벌의_비행.png|260px|프레임없음]]
|-
| style="padding:8px 14px; text-align:center; font-size:1.3em; font-weight:700;" | 왕벌의 비행
|-
| style="padding:0 14px 10px; text-align:center; font-style:italic; color:var(--color-subtle); border-bottom:1px solid var(--border-color-subtle);" | "휘몰아치는 선율로 이름난 비행의 곡"
|-
| style="padding:10px 14px;" |
{| style="width:100%;"
| style="color:var(--color-subtle);" | 분류 || style="text-align:right;" | 공격형
|-
| style="color:var(--color-subtle);" | 가격 || style="text-align:right;" | 600
|-
| style="color:var(--color-subtle);" | 공격 속도 || style="text-align:right;" | 8.5% / 17.5% / 26% / 36.5%
|}
|-
| style="padding:10px 14px; background:var(--background-color-progressive-subtle); border-top:1px solid var(--border-color-subtle);" |
'''T2 보너스'''<br>
적 히어로에게 기본 공격 시 다음 3회의 기본 공격 동안 공격 속도가 '''50%''' 증가합니다. (15초)
|-
| style="padding:10px 14px; background:var(--background-color-warning-subtle); border-top:1px solid var(--border-color-subtle); border-radius:0 0 6px 6px;" |
'''T4 보너스'''<br>
적 히어로에게 기본 공격 시 다음 3회의 기본 공격 동안 공격 속도가 '''100%''' 증가하고 '''기본 공격으로 입히는 피해가 20% 증가합니다'''. (15초)
|}

Genshin 유물 인포박스는 '''2세트 효과'''와 '''4세트 효과'''를 각각 배경색 다른 섹션으로 구분해 시각적으로 강조한다. ZETA 코덱스의 '''고유 효과 T2/T4'''도 동일한 개념이므로 이 패턴을 그대로 적용할 수 있다.
{{-}}

----

== 바리에이션 2 — ARC Kettle 4단계 업그레이드 스타일 ==

''레퍼런스: [https://arcraiders.wiki/wiki/Kettle Kettle] — 4단계 업그레이드 정보를 테이블로 분리하여 표시''

{| style="float:right; width:340px; margin:0 0 1em 1em; border:1px solid #888; border-radius:6px; background:var(--color-surface-1); word-break:keep-all;"
|-
| style="padding:12px; text-align:center; background:var(--color-surface-2); border-radius:6px 6px 0 0;" | [[파일:왕벌의_비행.png|260px|프레임없음]]
|-
| style="padding:8px 14px; text-align:center; font-size:1.3em; font-weight:700;" | 왕벌의 비행
|-
| style="padding:0 14px 10px; text-align:center; font-size:0.85em; color:var(--color-subtle);" | 휘몰아치는 선율로 이름난 비행의 곡
|-
| style="padding:8px 14px; border-top:1px solid var(--border-color-subtle);" |
{| style="width:100%;"
| style="color:var(--color-subtle);" | 분류 || style="text-align:right;" | 공격형
|-
| style="color:var(--color-subtle);" | 가격 || style="text-align:right;" | 600
|}
|-
| style="padding:6px 14px; background:var(--color-surface-2); font-weight:700; border-top:1px solid var(--border-color-subtle);" | 티어별 보유 효과
|-
| style="padding:0;" |
{| style="width:100%; border-collapse:collapse;"
|-
! style="padding:4px 14px; background:var(--color-surface-2); text-align:left; width:50px;" | T1
| style="padding:4px 14px; text-align:right;" | 공격 속도 8.5%
|-
! style="padding:4px 14px; background:var(--color-surface-2); text-align:left;" | T2
| style="padding:4px 14px; text-align:right;" | 공격 속도 17.5%
|-
! style="padding:4px 14px; background:var(--color-surface-2); text-align:left;" | T3
| style="padding:4px 14px; text-align:right;" | 공격 속도 26%
|-
! style="padding:4px 14px; background:var(--color-surface-2); text-align:left;" | T4
| style="padding:4px 14px; text-align:right; font-weight:700;" | 공격 속도 36.5%
|}
|-
| style="padding:6px 14px; background:var(--color-surface-2); font-weight:700; border-top:1px solid var(--border-color-subtle);" | 고유 효과
|-
| style="padding:8px 14px; font-size:0.9em;" |
'''T2''' 적 히어로에게 기본 공격 시 다음 3회의 기본 공격 동안 공격 속도가 '''50%''' 증가합니다. (15초)
|-
| style="padding:8px 14px; font-size:0.9em; border-radius:0 0 6px 6px;" |
'''T4''' 적 히어로에게 기본 공격 시 다음 3회의 기본 공격 동안 공격 속도가 '''100%''' 증가하고 '''기본 공격으로 입히는 피해가 20% 증가합니다'''. (15초)
|}

ARC Kettle 인포박스는 기본 스펙을 상단에, '''티어별 값'''은 별도 테이블에 명확히 분리한다. 4티어를 각 행으로 나눠 비교가 쉬우며 T4만 볼드 처리하여 최종 목표값을 강조한다.
{{-}}

----

== 바리에이션 3 — ARC Combat Mk. 1 단순 인포박스 스타일 ==

''레퍼런스: [https://arcraiders.wiki/wiki/Combat_Mk._1 Combat Mk. 1] — 정보를 label:data 쌍으로 단순 나열''

{| style="float:right; width:320px; margin:0 0 1em 1em; border:1px solid #888; background:var(--color-surface-1); word-break:keep-all;"
|-
| colspan="2" style="padding:10px; text-align:center; background:var(--color-surface-2);" | [[파일:왕벌의_비행.png|240px|프레임없음]]
|-
| colspan="2" style="padding:10px; text-align:center; font-size:1.25em; font-weight:700; border-bottom:1px solid var(--border-color-subtle);" | 왕벌의 비행
|-
| colspan="2" style="padding:8px 12px; text-align:center; font-style:italic; color:var(--color-subtle); border-bottom:1px solid var(--border-color-subtle);" | 휘몰아치는 선율로 이름난 비행의 곡
|-
! style="padding:6px 12px; width:90px; text-align:left; color:var(--color-subtle); font-weight:normal;" | 분류
| style="padding:6px 12px;" | 공격형
|-
! style="padding:6px 12px; text-align:left; color:var(--color-subtle); font-weight:normal;" | 가격
| style="padding:6px 12px;" | 600
|-
! style="padding:6px 12px; text-align:left; color:var(--color-subtle); font-weight:normal;" | 공격 속도
| style="padding:6px 12px;" | 8.5% / 17.5% / 26% / 36.5%
|-
! style="padding:6px 12px; text-align:left; color:var(--color-subtle); font-weight:normal; vertical-align:top;" | T2 효과
| style="padding:6px 12px; font-size:0.85em;" | 적 히어로에게 기본 공격 시 다음 3회의 기본 공격 동안 공격 속도가 '''50%''' 증가합니다. (15초)
|-
! style="padding:6px 12px; text-align:left; color:var(--color-subtle); font-weight:normal; vertical-align:top;" | T4 효과
| style="padding:6px 12px; font-size:0.85em;" | 적 히어로에게 기본 공격 시 다음 3회의 기본 공격 동안 공격 속도가 '''100%''' 증가하고 '''기본 공격으로 입히는 피해가 20% 증가합니다'''. (15초)
|}

ARC Combat Mk. 1 인포박스는 가장 단순한 Wikipedia 스타일 label:data 패턴. 섹션 구분이 없고 모든 정보가 한 흐름에 나열되어 빠르게 훑어볼 수 있다. 컬럼 수가 적고 모바일 친화적.
{{-}}

----

== 바리에이션 4 — LoL 아이템 카드 스타일 (컴팩트) ==

''레퍼런스: [https://leagueoflegends.fandom.com/wiki/Infinity_Edge Infinity Edge] — 가격을 상단 강조 헤더로, 패시브를 하단에 카드형 배치''

{| style="float:right; width:300px; margin:0 0 1em 1em; border:1px solid #888; border-radius:8px; background:var(--color-surface-1); word-break:keep-all; overflow:hidden;"
|-
| style="padding:14px; text-align:center; background:var(--background-color-destructive-subtle);" |
[[파일:왕벌의_비행.png|180px|프레임없음]]
<div style="font-size:1.3em; font-weight:700; margin-top:8px;">왕벌의 비행</div>
<div style="font-size:0.85em; font-style:italic; color:var(--color-subtle); margin-top:4px;">휘몰아치는 선율로 이름난 비행의 곡</div>
<div style="margin-top:10px; font-size:1.5em; font-weight:700; color:var(--color-warning);">600</div>
<div style="font-size:0.75em; color:var(--color-subtle);">가격 · 공격형</div>
|-
| style="padding:10px 14px; border-top:1px solid var(--border-color-subtle);" |
'''보유 효과'''
* 공격 속도 '''8.5% / 17.5% / 26% / 36.5%'''
|-
| style="padding:10px 14px; border-top:1px solid var(--border-color-subtle); background:var(--color-surface-2);" |
'''고유 효과 — T2'''<br>
<span style="font-size:0.9em;">적 히어로에게 기본 공격 시 다음 3회의 기본 공격 동안 공격 속도가 '''50%''' 증가합니다. (15초)</span>
|-
| style="padding:10px 14px; border-top:1px solid var(--border-color-subtle); background:var(--color-surface-2);" |
'''고유 효과 — T4'''<br>
<span style="font-size:0.9em;">적 히어로에게 기본 공격 시 다음 3회의 기본 공격 동안 공격 속도가 '''100%''' 증가하고 '''기본 공격으로 입히는 피해가 20% 증가합니다'''. (15초)</span>
|}

LoL 아이템 인포박스는 '''가격을 가장 크게 강조'''하고 이름/분류를 함께 헤더에 몰아넣는다. 스탯은 불릿 리스트, 패시브는 별도 카드형 섹션. 컴팩트하면서도 시각적 우선순위가 명확.
{{-}}

----

== 바리에이션 비교 요약 ==


{| class="wikitable" style="word-break:keep-all;"
{| class="wikitable" style="word-break:keep-all;"
! 방안 !! style="min-width:240px;" | 라이트 배경 !! style="min-width:240px;" | 다크 배경 !! 비고
! 바리에이션 !! 레퍼런스 !! 특징 !! 적합한 상황
|-
|-
| '''A. 현재''' (보정 없음)
| '''InfoboxNeue (현재)''' || SCT Avenger Titan || 섹션 분리 풍부, Citizen 스타일 || 함선/차량 같이 필드가 많을 때
| style="background:#ffffff; text-align:center;" | [[파일:왕벌의_비행.png|40px|link=]] [[파일:트로이의_목마.png|40px|link=]] [[파일:깨달음.png|40px|link=]] [[파일:운명_교향곡.png|40px|link=]]
| style="background:#14181f; text-align:center;" | [[파일:왕벌의_비행.png|40px|link=]] [[파일:트로이의_목마.png|40px|link=]] [[파일:깨달음.png|40px|link=]] [[파일:운명_교향곡.png|40px|link=]]
| 라이트에서 아이콘 소실
|-
|-
| '''B. 다크 칩 — 그라데이션'''
| '''1. Genshin 유물 스타일''' || Crimson Witch of Flames || T2/T4 배경색 구분 강조 || 코덱스 (T2/T4 개념 완벽 매칭)
| style="background:#ffffff; text-align:center;" | <span style="display:inline-block; background:linear-gradient(160deg,#2a3140,#161a23); border-radius:8px; padding:4px; margin:1px;">[[파일:왕벌의_비행.png|40px|link=]]</span> <span style="display:inline-block; background:linear-gradient(160deg,#2a3140,#161a23); border-radius:8px; padding:4px; margin:1px;">[[파일:트로이의_목마.png|40px|link=]]</span> <span style="display:inline-block; background:linear-gradient(160deg,#2a3140,#161a23); border-radius:8px; padding:4px; margin:1px;">[[파일:깨달음.png|40px|link=]]</span> <span style="display:inline-block; background:linear-gradient(160deg,#2a3140,#161a23); border-radius:8px; padding:4px; margin:1px;">[[파일:운명_교향곡.png|40px|link=]]</span>
| style="background:#14181f; text-align:center;" | <span style="display:inline-block; background:linear-gradient(160deg,#2a3140,#161a23); border-radius:8px; padding:4px; margin:1px;">[[파일:왕벌의_비행.png|40px|link=]]</span> <span style="display:inline-block; background:linear-gradient(160deg,#2a3140,#161a23); border-radius:8px; padding:4px; margin:1px;">[[파일:트로이의_목마.png|40px|link=]]</span> <span style="display:inline-block; background:linear-gradient(160deg,#2a3140,#161a23); border-radius:8px; padding:4px; margin:1px;">[[파일:깨달음.png|40px|link=]]</span> <span style="display:inline-block; background:linear-gradient(160deg,#2a3140,#161a23); border-radius:8px; padding:4px; margin:1px;">[[파일:운명_교향곡.png|40px|link=]]</span>
| 양 테마 동일 CSS, 인게임 UI 느낌. 테마 분기 불필요
|-
|-
| '''C. 다크 칩 — 단색 + 테두리'''
| '''2. Kettle 4단계 스타일''' || ARC Kettle || 티어별 테이블 내장 || 모든 티어 값을 한번에 비교
| style="background:#ffffff; text-align:center;" | <span style="display:inline-block; background:#1f2430; border:1px solid #3a4256; border-radius:8px; padding:4px; margin:1px;">[[파일:왕벌의_비행.png|40px|link=]]</span> <span style="display:inline-block; background:#1f2430; border:1px solid #3a4256; border-radius:8px; padding:4px; margin:1px;">[[파일:트로이의_목마.png|40px|link=]]</span> <span style="display:inline-block; background:#1f2430; border:1px solid #3a4256; border-radius:8px; padding:4px; margin:1px;">[[파일:깨달음.png|40px|link=]]</span> <span style="display:inline-block; background:#1f2430; border:1px solid #3a4256; border-radius:8px; padding:4px; margin:1px;">[[파일:운명_교향곡.png|40px|link=]]</span>
| style="background:#14181f; text-align:center;" | <span style="display:inline-block; background:#1f2430; border:1px solid #3a4256; border-radius:8px; padding:4px; margin:1px;">[[파일:왕벌의_비행.png|40px|link=]]</span> <span style="display:inline-block; background:#1f2430; border:1px solid #3a4256; border-radius:8px; padding:4px; margin:1px;">[[파일:트로이의_목마.png|40px|link=]]</span> <span style="display:inline-block; background:#1f2430; border:1px solid #3a4256; border-radius:8px; padding:4px; margin:1px;">[[파일:깨달음.png|40px|link=]]</span> <span style="display:inline-block; background:#1f2430; border:1px solid #3a4256; border-radius:8px; padding:4px; margin:1px;">[[파일:운명_교향곡.png|40px|link=]]</span>
| B보다 평면적, 다크에서 테두리로 칸 구분 명확
|-
|-
| '''D. 외곽선 강화''' (drop-shadow)
| '''3. Combat Mk. 1 단순 스타일''' || ARC Combat Mk. 1 || label:data 단순 나열 || 정보 밀도가 낮고 빠른 탐색
| style="background:#ffffff; text-align:center;" | <span style="display:inline-block; filter:drop-shadow(0 0 2px #000) drop-shadow(0 0 1px #000); margin:1px;">[[파일:왕벌의_비행.png|40px|link=]]</span> <span style="display:inline-block; filter:drop-shadow(0 0 2px #000) drop-shadow(0 0 1px #000); margin:1px;">[[파일:트로이의_목마.png|40px|link=]]</span> <span style="display:inline-block; filter:drop-shadow(0 0 2px #000) drop-shadow(0 0 1px #000); margin:1px;">[[파일:깨달음.png|40px|link=]]</span> <span style="display:inline-block; filter:drop-shadow(0 0 2px #000) drop-shadow(0 0 1px #000); margin:1px;">[[파일:운명_교향곡.png|40px|link=]]</span>
| style="background:#14181f; text-align:center;" | <span style="display:inline-block; filter:drop-shadow(0 0 2px #000) drop-shadow(0 0 1px #000); margin:1px;">[[파일:왕벌의_비행.png|40px|link=]]</span> <span style="display:inline-block; filter:drop-shadow(0 0 2px #000) drop-shadow(0 0 1px #000); margin:1px;">[[파일:트로이의_목마.png|40px|link=]]</span> <span style="display:inline-block; filter:drop-shadow(0 0 2px #000) drop-shadow(0 0 1px #000); margin:1px;">[[파일:깨달음.png|40px|link=]]</span> <span style="display:inline-block; filter:drop-shadow(0 0 2px #000) drop-shadow(0 0 1px #000); margin:1px;">[[파일:운명_교향곡.png|40px|link=]]</span>
| 16px 스탯 아이콘에 쓰는 방식. 면적 큰 흰 영역 내부는 여전히 흰색
|-
|-
| '''E. 반전''' (invert, 라이트 한정)
| '''4. LoL 카드 스타일''' || LoL Infinity Edge || 가격 강조 + 카드형 || 가격이 중요한 비교 요소
| style="background:#ffffff; text-align:center;" | <span style="display:inline-block; filter:invert(1); margin:1px;">[[파일:왕벌의_비행.png|40px|link=]]</span> <span style="display:inline-block; filter:invert(1); margin:1px;">[[파일:트로이의_목마.png|40px|link=]]</span> <span style="display:inline-block; filter:invert(1); margin:1px;">[[파일:깨달음.png|40px|link=]]</span> <span style="display:inline-block; filter:invert(1); margin:1px;">[[파일:운명_교향곡.png|40px|link=]]</span>
| style="background:#14181f; text-align:center;" | [[파일:왕벌의_비행.png|40px|link=]] [[파일:트로이의_목마.png|40px|link=]] [[파일:깨달음.png|40px|link=]] [[파일:운명_교향곡.png|40px|link=]]
| 라이트에서만 반전 적용 가정. 테마 3종(라이트/다크/OS 자동) 분기 CSS 필요, 반투명 픽셀 회색 번짐 가능
|}
|}

2026년 6월 5일 (금) 15:11 기준 최신판

코덱스 아이콘 라이트 모드 개선안 비교

각 방안을 라이트/다크 배경에 고정해 나란히 표시. 실제 적용 시에는 틀:CodexTable/styles.css에 CSS 한 줄을 추가하는 방식.

방안 라이트 배경 다크 배경 비고
A. 현재 (보정 없음) 라이트에서 아이콘 소실
B. 다크 칩 — 그라데이션 양 테마 동일 CSS, 인게임 UI 느낌. 테마 분기 불필요
C. 다크 칩 — 단색 + 테두리 B보다 평면적, 다크에서 테두리로 칸 구분 명확
D. 외곽선 강화 (drop-shadow) 16px 스탯 아이콘에 쓰는 방식. 면적 큰 흰 영역 내부는 여전히 흰색
E. 반전 (invert, 라이트 한정) 라이트에서만 반전 적용 가정. 테마 3종(라이트/다크/OS 자동) 분기 CSS 필요, 반투명 픽셀 회색 번짐 가능
원본 주소 "https://zeta.wiki/index.php?title=User:Pjzeta&oldid=1583"
마지막 수정
이 문서는 2026년 6월 5일 (금) 15:11에 마지막으로 편집되었습니다.
저작권
별도로 명시하지 않은 경우, 내용은 Creative Commons Attribution-ShareAlike에 따라 사용할 수 있습니다.