라이믹스/매뉴얼/네모의 꿈 레이아웃 주제 색상

상위 문서: 라이믹스/매뉴얼

1. 개요#

라이믹스 기본 스킨의 주제 색상(Primary color)을 레이아웃 설정에서 지정하는 규약이다. 이를 지원하는 레이아웃과 스킨을 조합하면 사이트의 중심 색상을 공유할 수 있다. 설정 항목을 추가하는 것만으로 임의의 CSS가 자동 변경되는 것은 아니며, 해당 색상을 사용하는 테마 구현이 필요하다.

2. 사용자 설정#

주제 색상을 지원하는 레이아웃의 설정 화면에서 미리 정한 색상을 선택하거나 컬러 피커로 사용자 지정 색상을 고른다. 실제 메뉴와 적용 범위는 레이아웃에 따라 다르다.

3. 제작자 설정#

레이아웃의 info.xml에서 extra_vars에 아래 항목을 정의한다.

이름	type	용도
primary_color	select	미리 정한 색상 또는 사용자 지정 항목 선택
customized_primary_color	colorpicker	사용자 지정 HEX 색상 입력

primary_color는 6자리 HEX 색상 코드 또는 지원하는 색상 이름을 사용할 수 있다. 공식 예제는 사용자 지정 항목의 값으로 customized를 사용하며, 이 항목을 선택했을 때 customized_primary_color를 사용하도록 안내한다.

4. 설정 예제#

아래는 기존 info.xml의 <extra_vars> 안에 넣을 항목의 예이다. 전체 레이아웃 메타데이터를 대체하는 파일이 아니다.

<var name="primary_color" type="select">
    <title xml:lang="ko">주제 색상</title>
    <options value="blue">
        <title xml:lang="ko">파랑</title>
    </options>
    <options value="red">
        <title xml:lang="ko">빨강</title>
    </options>
    <options value="customized">
        <title xml:lang="ko">사용자 지정</title>
    </options>
</var>
<var name="customized_primary_color" type="colorpicker">
    <title xml:lang="ko">사용자 지정 색상</title>
    <description xml:lang="ko">주제 색상에서 사용자 지정을 선택한 경우에 사용합니다.</description>
</var>

5. 지원 색상 이름#

red, crimson, pink, purple, deep-purple, indigo, deep-blue, blue, light-blue, cyan, teal, green, light-green, lime, yellow, amber, orange, deep-orange, brown, grey, blue-grey, black, white가 공식 매뉴얼에 열거되어 있다.

모든 CSS 색상 이름을 임의로 넣어도 동일하게 처리된다는 뜻은 아니다. 테마에서 사용하는 값의 해석과 지원 범위를 확인한다.

6. 확인할 점#

• 선택형 색상과 사용자 지정 색상이 각각 저장되고 적용되는지 확인한다.
• 레이아웃뿐 아니라 사용하는 게시판·위젯 스킨이 주제 색상 규약을 지원하는지 확인한다.
• 사용자 지정 색상에서 글자와 배경의 대비가 유지되는지 확인한다.
• 밝은 화면과 어두운 화면을 지원한다면 두 모드에서 모두 점검한다.

7. 같이 보기#

• 라이믹스/매뉴얼/테마 제작
• 라이믹스/매뉴얼/템플릿 문법 v2

8. 출처#

이 문서는 라이믹스 공식 매뉴얼을 바탕으로 설명과 예제를 정리하였다. 공식 매뉴얼은 CC BY-SA 4.0으로 배포된다. 원문의 기여 이력은 rhymix-docs 저장소에서 확인할 수 있다.