틀:알림 상자: 두 판 사이의 차이

리버티게임(개발), 모두가 만들어가는 자유로운 게임
둘러보기로 이동 검색으로 이동
시각위키텍스트
잔글편집 요약 없음
편집 요약 없음
 
(사용자 3명의 중간 판 146개는 보이지 않습니다)
1번째 줄: 1번째 줄:
* [[../|상위 문서에서 테스트 중]]
<onlyinclude>{{#css:틀:알림 상자/CSS}}<div class="template-ambox ambox" style="{{#if:{{{배경색|}}}|background: {{{배경색|#f5f5f5}}};}}{{#if:{{{최소폭|{{{폭|}}}}}}|min-width:min({{{최소폭|{{{폭|80%}}}}}}, calc(100% - 10px));}}{{#if:{{{최대폭|}}}|max-width: {{{최대폭|100%}}};}}{{#if:{{{경계선|}}}|border: {{{경계선|none}}};}}">{{#if:{{{왼쪽 그림|}}}{{{왼쪽 그림 예외|}}}|<div class="ambox-image ambox-image-left">{{{왼쪽 그림 예외|[[파일:{{{왼쪽 그림}}}|{{{왼쪽 그림 크기|45px}}}|{{{왼쪽 그림 설명|}}}]]}}}</div>}}{{#if:{{{제목|}}}{{{색|}}}|<div class="ambox-title" style="{{#if:{{{색|}}}|background: {{{색}}};}}{{#if:{{{제목색|}}}|color: {{{제목색}}};}}">{{{제목|}}}</div>}}<div class="ambox-detail" style="{{#if:{{{본문색|}}}|color: {{{본문색}}};}}{{#if:{{{높이|}}}|min-height: {{{높이}}};}}">{{{본문|}}}</div>{{#if:{{{오른쪽 그림|}}}{{{오른쪽 그림 예외|}}}|<div class="ambox-image ambox-image-right">{{{오른쪽 그림 예외|[[파일:{{{오른쪽 그림}}}|{{{오른쪽 그림 크기|45px}}}|{{{오른쪽 그림 설명|}}}]]}}}</div>}}</div></onlyinclude>


<onlyinclude><div class="template-ambox" style="clear: both; width: {{{폭|75%}}}; margin: 0 auto; border-collapse: collapse; background: {{{배경색|#fbfbfb}}}; border: {{{경계선|1px solid #aaa}}};  {{#if:{{{오른쪽색|}}}|border-right: 10px solid {{{오른쪽색|#1e90ff}}}; }}border-left: 10px solid {{{색|없음}}};"
<templatedata>
>
{
<div>{{#if:{{{왼쪽 그림|}}}|<span style="float:left; width: 120px; padding: 2px 0px 2px 0.5em; text-align: center;">{{{왼쪽 그림 예외|[[파일:{{{왼쪽 그림| - }}}|{{{왼쪽 그림 크기|45px}}}{{{왼쪽 그림 설명|}}}]]}}}</span>}}
"params": {
{{#if:{{{제목|}}}|<span style="float:inline-block;color:{{{제목색|#000000}}};">'''{{{제목}}}'''</span><br />}}
"배경색": {
{{#if:{{{오른쪽 그림|}}}|<span style="float:right; width: 120px; padding: 2px 4px 2px 0px; text-align: center;">{{{오른쪽 그림 예외|[[파일:{{{오른쪽 그림| - }}}|{{{오른쪽 그림 크기|45px}}}|{{{오른쪽 그림 설명|}}}]]}}}</span>}}
"description": "알림 상자 및 본문/그림 영역의 배경 색상을 설정합니다.",
</div><br>
"type": "string",
<div style="color:{{{본문색|#000000}}}">{{{본문}}}</div>
"default": "#f5f5f5",
</div></onlyinclude>
"example": "white"
},
"최소폭": {
"aliases": [
"폭"
],
"description": "데스크탑 환경과 같이 넓은 화면에서의 폭인 최소폭을 설정합니다. 화면을 점점 늘릴 때 알림 상자가 최대폭만큼 화면을 차지하다 40em(한글 40글자)이 되면 알림 상자가 최소폭만큼 차지할 때까지 크기를 유지하다가 다시 화면과 함께 늘어납니다.",
"type": "string",
"default": "80%"
},
"최대폭": {
"description": "모바일 환경과 같이 좁은 화면에서의 폭인 최대폭을 설정합니다. 화면을 점점 줄일 때 알림 상자가 최소폭만큼 화면을 차지하다 40em(한글 40글자)이 되면 알림 상자가 최대폭만큼 차지할 때까지 크기를 유지하다가 다시 화면과 함께 줄어듭니다.",
"type": "string",
"default": "100%"
},
"경계선": {
"description": "알림 상자의 바깥쪽 테두리를 설정합니다. 지정하지 않으면 경계선은 표시되지 않습니다.",
"example": "1px solid #c8ccd1",
"type": "string",
"default": "none"
},
"왼쪽 그림": {
"description": "본문 왼쪽에 표시될 그림의 파일명을 입력합니다. 없으면 왼쪽 그림 자리까지 본문이 늘어납니다.",
"type": "wiki-file-name"
},
"왼쪽 그림 예외": {
"description": "왼쪽 그림 자리에 그림 대신 띄울 내용을 입력할 수 있습니다.",
"type": "content"
},
"왼쪽 그림 크기": {
"description": "왼쪽 그림의 크기를 지정합니다.",
"type": "string",
"default": "45px"
},
"왼쪽 그림 설명": {
"description": "왼쪽 그림에 마우스를 대거나 시각 장애인이 스크린 리더를 사용할 때 알려줄 그림에 대한 설명을 입력합니다.",
"type": "line"
},
"제목": {
"description": "알림 상자 윗부분에 표시될 알림 상자의 제목을 입력합니다.",
"type": "line",
"suggested": true
},
"색": {
"description": "알림 상자의 테마색으로, 제목의 배경으로 설정됩니다. 제목이 있을 때 색이 지정되지 않으면 기본적으로 회색으로 표시됩니다. 제목이 없을 때 색만 지정할 경우 제목 자리에 지정된 색상의 가로선이 나옵니다.",
"type": "string",
"default": "gray"
},
"제목색": {
"description": "제목의 텍스트 색상을 설정합니다. 제목의 배경색은 색 파라미터로 지정해 주세요.",
"default": "white",
"example": "black",
"type": "string"
},
"본문색": {
"description": "본문의 텍스트 색상을 설정합니다. 본문의 배경색은 배경색 파라미터로 지정해 주세요.",
"type": "string",
"default": "black"
},
"본문": {
"description": "제목 아래에 표시될 알림 상자의 상세 내용을 입력합니다. 왼쪽/오른쪽 그림 사이에 나옵니다.",
"type": "content",
"required": true
},
"오른쪽 그림": {
"description": "본문 오른쪽에 표시될 그림의 파일명을 입력합니다. 없으면 오른쪽 그림 자리까지 본문이 늘어납니다.",
"type": "wiki-file-name"
},
"오른쪽 그림 예외": {
"description": "오른쪽 그림 자리에 그림 대신 띄울 내용을 입력할 수 있습니다.",
"type": "content"
},
"오른쪽 그림 크기": {
"description": "오른쪽 그림의 크기를 지정합니다.",
"type": "string",
"default": "45px"
},
"오른쪽 그림 설명": {
"description": "오른쪽 그림에 마우스를 대거나 시각 장애인이 스크린 리더를 사용할 때 알려줄 그림에 대한 설명을 입력합니다.",
"type": "line"
},
"높이": {
"description": "본문 영역의 최소 높이를 설정합니다. 본문 내용의 높이가 낮으면 여기서 설정한 높이로 고정되고, 더 크면 설정한 높이가 무시되고 더 늘어납니다.",
"example": "45px",
"type": "string"
}
},
"description": "게임 내 알림 사항을 표시하는 틀입니다.",
"paramOrder": [
"색",
"제목",
"본문",
"왼쪽 그림",
"왼쪽 그림 크기",
"왼쪽 그림 설명",
"왼쪽 그림 예외",
"오른쪽 그림",
"오른쪽 그림 크기",
"오른쪽 그림 설명",
"오른쪽 그림 예외",
"최소폭",
"최대폭",
"경계선",
"배경색",
"제목색",
"본문색",
"높이"
],
"format": "block"
}
</templatedata>


== 파라미터 구현 목록 ==
== 이전 버전과의 차이 ==
* 폭
=== [[보존:알림 상자/2024 상반기|2024년 상반기 버전]] ===
* 배경색
* 제목: 내용 및 그림 '위'에 표시됨(레거시 버전은 그림들 '사이'에 제목이 내용과 같이 표시됨)
* 오른쪽색
* 색 : 제목의 배경색으로 표시
* 왼쪽 그림... : 전체
* 폭 : 데스크탑에서는 최소폭(기본 80%)으로, 모바일에서는 최대폭(기본 100%)으로 표시됨. 폭 파라미터는 최소폭을 지정함.
* 오른쪽 그림... : 전체
* 배경색 : O
* 본문색
* 왼쪽 그림 설명 : O
* 본문
* 오른쪽 그림 설명 : O
* 제목색
 
* 제목
=== [[보존:알림 상자/2010|2010년 버전 (위키백과·백괴 버전)]] ===
* 경계선
* 제목: 내용 및 그림 '위'에 표시됨(레거시 버전은 그림들 '사이'에 제목이 내용과 같이 표시됨)
* 폭: 최대폭 파라미터로 모바일 폭 지정 가능
* 오른쪽색 : X
* 왼쪽/오른쪽 그림 예외 : 왼쪽/오른쪽 그림을 별도로 지정하지 않아도 표시됨
* 간격: X
 
[[분류:머릿글 틀]]

2024년 10월 24일 (목) 21:27 기준 최신판

게임 내 알림 사항을 표시하는 틀입니다.

틀 변수[틀데이터 관리]

이 틀은 변수마다 줄바꿈을 하여 쓰는 것이 권장됩니다.

변수설명형식상태
색색

알림 상자의 테마색으로, 제목의 배경으로 설정됩니다. 제목이 있을 때 색이 지정되지 않으면 기본적으로 회색으로 표시됩니다. 제목이 없을 때 색만 지정할 경우 제목 자리에 지정된 색상의 가로선이 나옵니다.

기본값
gray
문자열선택 사항
제목제목

알림 상자 윗부분에 표시될 알림 상자의 제목을 입력합니다.

짧은 문구제안
본문본문

제목 아래에 표시될 알림 상자의 상세 내용을 입력합니다. 왼쪽/오른쪽 그림 사이에 나옵니다.

내용필수
왼쪽 그림왼쪽 그림

본문 왼쪽에 표시될 그림의 파일명을 입력합니다. 없으면 왼쪽 그림 자리까지 본문이 늘어납니다.

파일선택 사항
왼쪽 그림 크기왼쪽 그림 크기

왼쪽 그림의 크기를 지정합니다.

기본값
45px
문자열선택 사항
왼쪽 그림 설명왼쪽 그림 설명

왼쪽 그림에 마우스를 대거나 시각 장애인이 스크린 리더를 사용할 때 알려줄 그림에 대한 설명을 입력합니다.

짧은 문구선택 사항
왼쪽 그림 예외왼쪽 그림 예외

왼쪽 그림 자리에 그림 대신 띄울 내용을 입력할 수 있습니다.

내용선택 사항
오른쪽 그림오른쪽 그림

본문 오른쪽에 표시될 그림의 파일명을 입력합니다. 없으면 오른쪽 그림 자리까지 본문이 늘어납니다.

파일선택 사항
오른쪽 그림 크기오른쪽 그림 크기

오른쪽 그림의 크기를 지정합니다.

기본값
45px
문자열선택 사항
오른쪽 그림 설명오른쪽 그림 설명

오른쪽 그림에 마우스를 대거나 시각 장애인이 스크린 리더를 사용할 때 알려줄 그림에 대한 설명을 입력합니다.

짧은 문구선택 사항
오른쪽 그림 예외오른쪽 그림 예외

오른쪽 그림 자리에 그림 대신 띄울 내용을 입력할 수 있습니다.

내용선택 사항
최소폭최소폭 폭

데스크탑 환경과 같이 넓은 화면에서의 폭인 최소폭을 설정합니다. 화면을 점점 늘릴 때 알림 상자가 최대폭만큼 화면을 차지하다 40em(한글 40글자)이 되면 알림 상자가 최소폭만큼 차지할 때까지 크기를 유지하다가 다시 화면과 함께 늘어납니다.

기본값
80%
문자열선택 사항
최대폭최대폭

모바일 환경과 같이 좁은 화면에서의 폭인 최대폭을 설정합니다. 화면을 점점 줄일 때 알림 상자가 최소폭만큼 화면을 차지하다 40em(한글 40글자)이 되면 알림 상자가 최대폭만큼 차지할 때까지 크기를 유지하다가 다시 화면과 함께 줄어듭니다.

기본값
100%
문자열선택 사항
경계선경계선

알림 상자의 바깥쪽 테두리를 설정합니다. 지정하지 않으면 경계선은 표시되지 않습니다.

기본값
none
예시
1px solid #c8ccd1
문자열선택 사항
배경색배경색

알림 상자 및 본문/그림 영역의 배경 색상을 설정합니다.

기본값
#f5f5f5
예시
white
문자열선택 사항
제목색제목색

제목의 텍스트 색상을 설정합니다. 제목의 배경색은 색 파라미터로 지정해 주세요.

기본값
white
예시
black
문자열선택 사항
본문색본문색

본문의 텍스트 색상을 설정합니다. 본문의 배경색은 배경색 파라미터로 지정해 주세요.

기본값
black
문자열선택 사항
높이높이

본문 영역의 최소 높이를 설정합니다. 본문 내용의 높이가 낮으면 여기서 설정한 높이로 고정되고, 더 크면 설정한 높이가 무시되고 더 늘어납니다.

예시
45px
문자열선택 사항

이전 버전과의 차이

2024년 상반기 버전

  • 제목: 내용 및 그림 '위'에 표시됨(레거시 버전은 그림들 '사이'에 제목이 내용과 같이 표시됨)
  • 색 : 제목의 배경색으로 표시
  • 폭 : 데스크탑에서는 최소폭(기본 80%)으로, 모바일에서는 최대폭(기본 100%)으로 표시됨. 폭 파라미터는 최소폭을 지정함.
  • 배경색 : O
  • 왼쪽 그림 설명 : O
  • 오른쪽 그림 설명 : O

2010년 버전 (위키백과·백괴 버전)

  • 제목: 내용 및 그림 '위'에 표시됨(레거시 버전은 그림들 '사이'에 제목이 내용과 같이 표시됨)
  • 폭: 최대폭 파라미터로 모바일 폭 지정 가능
  • 오른쪽색 : X
  • 왼쪽/오른쪽 그림 예외 : 왼쪽/오른쪽 그림을 별도로 지정하지 않아도 표시됨
  • 간격: X
원본 주소 "https://dev.libertygame.work/index.php?title=틀:알림_상자&oldid=32007"