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

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

@@ 1번째 줄: / 1번째 줄: @@
-<onlyinclude><div class="template-ambox {{#if:{{{폭|}}}||ambox-hybrid}}" style="display:table;width:{{{폭|80%}}};text-align:center;border:{{{경계선|1px solid #aafaaa}}};">
+<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>
-<div style="display:table-row;vertical-align:center;">
-{{#if: {{{왼쪽 그림|}}}|<span style="display: table-cell;">
-[[파일:{{{왼쪽 그림}}}|45px]]
-</span>|<span style="display: table-cell;">&nbsp;&nbsp;&nbsp;&nbsp;</span>}}
-<p style="display: table-cell;">
-{{#if: {{{제목|}}}|'''{{{제목}}}'''|}}</p>
-{{#if: {{{오른쪽 그림|}}}|<span style="display: table-cell;">
-[[파일:{{{오른쪽 그림}}}|45px]]
-</span>|<span style="display: table-cell;">&nbsp;&nbsp;&nbsp;&nbsp;</span>}}</div>
-<div style="display:table-row;width:80%;text-align:center;"><span style="display: table-cell;"><!-- 공백 --></span><span style="display: table-cell;">{{{본문}}}</span><span style="display: table-cell;"><!-- 공백 --></span></div>
-</div></onlyinclude>
-게임 내 알림 사항을 표시하는 틀입니다.
+<templatedata>
-== 파라미터 구현 목록 ==
+{
-* 왼쪽 그림 = 제목 왼편 그림, 비우면 안 뜸. (그림 파일을 띄울 수도 있습니다.)
+	"params": {
-* 오른쪽 그림 = 제목 오른편 그림, 없어도 됨
+		"배경색": {
-* 경계선 : 기본은 1px solid #aafaaa입니다.
+			"description": "알림 상자 및 본문/그림 영역의 배경 색상을 설정합니다.",
-* 제목: 제목을 적으면 됩니다.
+			"type": "string",
-* 본문: 상세 내용을 적으면 됩니다. 그림 아래에 표시됩니다.
+			"default": "#f5f5f5",
-=== [[보존:알림 상자/레거시|이전 알림 상자]]와의 파라미터 차이 ===
+			"example": "white"
-추후 차이점을 줄이기 위해 업데이트 예정입니다. 'X'는 아직 미구현 상태라는 뜻입니다.
+		},
-* 색 : X
+		"최소폭": {
-* 폭 : X
+			"aliases": [
-** 단, 폭 파라미터가 적용하던 ambox-hybrid 클래스는 현재 조건부로 적용됨<!--, 모바일 100% (기본 설정)
+				"폭"
-** 단, 기본설정이 아닐시 데스크톱, 모바일 공용으로 적용됨 -->
+			],
-* 배경색 : X
+			"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
+* 왼쪽/오른쪽 그림 예외 : 왼쪽/오른쪽 그림을 별도로 지정하지 않아도 표시됨
-* 오른쪽 그림 크기 및 왼쪽 그림 예외 : 나머지 X
-* 본문색 : X
-* 제목색 : X
-* '''내용'''이 그림 및 제목 '아래'에 표시됨(레거시 버전은 그림들 '사이'에 내용이 제목과 같이 표시됨)
 * 간격: X
 [[분류:머릿글 틀]]

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

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

이전 버전과의 차이

2024년 상반기 버전

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

둘러보기 메뉴

검색