mirror of
				https://github.com/unanmed/HumanBreak.git
				synced 2025-10-31 12:12:58 +08:00 
			
		
		
		
	
		
			
				
	
	
		
			163 lines
		
	
	
		
			2.5 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			163 lines
		
	
	
		
			2.5 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
| html,
 | |
| body {
 | |
|     margin: 0;
 | |
|     padding: 0;
 | |
|     width: 100%;
 | |
|     height: 100%;
 | |
|     background-color: #000;
 | |
|     overflow: hidden;
 | |
| }
 | |
| 
 | |
| #game {
 | |
|     width: 100%;
 | |
|     height: 100%;
 | |
|     position: absolute;
 | |
|     display: flex;
 | |
|     justify-content: center;
 | |
|     align-items: center;
 | |
| }
 | |
| 
 | |
| #game-draw {
 | |
|     width: 100%;
 | |
|     height: 100%;
 | |
|     display: flex;
 | |
|     justify-content: center;
 | |
|     align-items: center;
 | |
|     overflow: hidden;
 | |
| }
 | |
| 
 | |
| #game-draw > * {
 | |
|     position: absolute;
 | |
| }
 | |
| 
 | |
| .gameCanvas {
 | |
|     position: absolute;
 | |
|     box-sizing: border-box;
 | |
|     -moz-box-sizing: border-box;
 | |
|     -webkit-box-sizing: border-box;
 | |
|     display: none;
 | |
| }
 | |
| 
 | |
| #curtain {
 | |
|     z-index: 125;
 | |
| }
 | |
| 
 | |
| #ui {
 | |
|     z-index: 140;
 | |
| }
 | |
| 
 | |
| #data {
 | |
|     z-index: 170;
 | |
| }
 | |
| 
 | |
| #inputDiv {
 | |
|     display: none;
 | |
|     width: 100%;
 | |
|     height: 100%;
 | |
|     position: fixed;
 | |
|     top: 0;
 | |
|     left: 0;
 | |
|     background: rgba(127, 127, 127, 0.6);
 | |
|     z-index: 2000;
 | |
|     color: black;
 | |
| }
 | |
| 
 | |
| #inputDialog {
 | |
|     position: fixed;
 | |
|     top: 50%;
 | |
|     left: 50%;
 | |
|     transform: translate(-50%, -55%);
 | |
|     background: white;
 | |
|     width: 250px;
 | |
|     min-height: 50px;
 | |
|     color: black;
 | |
| }
 | |
| 
 | |
| #inputMessage {
 | |
|     word-wrap: break-word;
 | |
|     text-align: left;
 | |
|     margin-left: 8%;
 | |
|     margin-right: 5%;
 | |
|     color: black;
 | |
| }
 | |
| 
 | |
| #inputBox {
 | |
|     margin-left: 8%;
 | |
|     width: 80%;
 | |
|     margin-bottom: 10px;
 | |
|     padding: 5px 3px;
 | |
|     border: 1px solid;
 | |
|     background: #f0f0f0;
 | |
|     color: black;
 | |
| }
 | |
| 
 | |
| #inputYes {
 | |
|     margin-bottom: 15px;
 | |
|     margin-left: 8%;
 | |
|     color: black;
 | |
| }
 | |
| 
 | |
| #inputNo {
 | |
|     float: right;
 | |
|     margin-right: 10%;
 | |
|     color: black;
 | |
| }
 | |
| 
 | |
| #_selector,
 | |
| ._uievent_selector {
 | |
|     animation: selector 2s ease-in-out 0s infinite normal none running;
 | |
| }
 | |
| 
 | |
| @-webkit-keyframes selector {
 | |
|     0% {
 | |
|         opacity: 0.55;
 | |
|     }
 | |
|     50% {
 | |
|         opacity: 0.25;
 | |
|     }
 | |
|     100% {
 | |
|         opacity: 0.55;
 | |
|     }
 | |
| }
 | |
| 
 | |
| @keyframes selector {
 | |
|     0% {
 | |
|         opacity: 0.55;
 | |
|     }
 | |
|     50% {
 | |
|         opacity: 0.25;
 | |
|     }
 | |
|     100% {
 | |
|         opacity: 0.55;
 | |
|     }
 | |
| }
 | |
| 
 | |
| #next {
 | |
|     width: 5px;
 | |
|     height: 5px;
 | |
|     display: none;
 | |
|     position: absolute;
 | |
|     transform: rotate(45deg);
 | |
|     border-bottom-width: 4px;
 | |
|     border-bottom-style: solid;
 | |
|     border-right-width: 4px;
 | |
|     border-right-style: solid;
 | |
|     -webkit-animation: next 0.5s ease-in-out alternate infinite;
 | |
|     animation: next 0.5s ease-in-out alternate infinite;
 | |
|     left: 0;
 | |
|     top: 0;
 | |
|     opacity: 0.7;
 | |
|     z-index: 169;
 | |
| }
 | |
| 
 | |
| @-webkit-keyframes next {
 | |
|     100% {
 | |
|         transform: rotate(45deg) translate(-3px, -3px);
 | |
|     }
 | |
| }
 | |
| @keyframes next {
 | |
|     100% {
 | |
|         transform: rotate(45deg) translate(-3px, -3px);
 | |
|     }
 | |
| }
 |