미디어위키:Gadget-godot3.css

리버티게임(개발), 모두가 만들어가는 자유로운 게임
Senouis (토론 | 기여)님의 2023년 10월 28일 (토) 18:55 판 (고도 엔진 버전 3용 래퍼 CSS)
(차이) ← 이전 판 | 최신판 (차이) | 다음 판 → (차이)
둘러보기로 이동 검색으로 이동

참고: 설정을 저장한 후에 바뀐 점을 확인하기 위해서는 브라우저의 캐시를 새로 고쳐야 합니다.

  • 파이어폭스 / 사파리: Shift 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5 또는 Ctrl-R을 입력 (Mac에서는 ⌘-R)
  • 구글 크롬: Ctrl-Shift-R키를 입력 (Mac에서는 ⌘-Shift-R)
  • 인터넷 익스플로러 / 엣지: Ctrl 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5를 입력.
  • 오페라: Ctrl-F5를 입력.
body {
	touch-action: none;
	margin: 0;
	border: 0 none;
	padding: 0;
	text-align: center;
	background-color: black;
}

#canvas {
	display: block;
	margin: 0;
	color: white;
}

#canvas:focus {
	outline: none;
}

.godot {
	font-family: 'Noto Sans', 'Droid Sans', Arial, sans-serif;
	color: #e0e0e0;
	background-color: #3b3943;
	background-image: linear-gradient(to bottom, #403e48, #35333c);
	border: 1px solid #45434e;
	box-shadow: 0 0 1px 1px #2f2d35;
}

/* Status display */

#status {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	/* don't consume click events - make children visible explicitly */
	visibility: hidden;
}

#status-progress {
	width: 366px;
	height: 7px;
	background-color: #38363A;
	border: 1px solid #444246;
	padding: 1px;
	box-shadow: 0 0 2px 1px #1B1C22;
	border-radius: 2px;
	visibility: visible;
}

@media only screen and (orientation:portrait) {
	#status-progress {
		width: 61.8%;
	}
}

#status-progress-inner {
	height: 100%;
	width: 0;
	box-sizing: border-box;
	transition: width 0.5s linear;
	background-color: #202020;
	border: 1px solid #222223;
	box-shadow: 0 0 1px 1px #27282E;
	border-radius: 3px;
}

#status-indeterminate {
	height: 42px;
	visibility: visible;
	position: relative;
}

#status-indeterminate > div {
	width: 4.5px;
	height: 0;
	border-style: solid;
	border-width: 9px 3px 0 3px;
	border-color: #2b2b2b transparent transparent transparent;
	transform-origin: center 21px;
	position: absolute;
}

#status-indeterminate > div:nth-child(1) { transform: rotate( 22.5deg); }
#status-indeterminate > div:nth-child(2) { transform: rotate( 67.5deg); }
#status-indeterminate > div:nth-child(3) { transform: rotate(112.5deg); }
#status-indeterminate > div:nth-child(4) { transform: rotate(157.5deg); }
#status-indeterminate > div:nth-child(5) { transform: rotate(202.5deg); }
#status-indeterminate > div:nth-child(6) { transform: rotate(247.5deg); }
#status-indeterminate > div:nth-child(7) { transform: rotate(292.5deg); }
#status-indeterminate > div:nth-child(8) { transform: rotate(337.5deg); }

#status-notice {
	margin: 0 100px;
	line-height: 1.3;
	visibility: visible;
	padding: 4px 6px;
	visibility: visible;
}