99 lines
		
	
	
	
		
			1.4 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
		
		
			
		
	
	
			99 lines
		
	
	
	
		
			1.4 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
|   | /* Styles spécifiques à la page /demo/traffic */ | ||
|  | 
 | ||
|  | .user-info-panel { | ||
|  | 	background-color: #f5f5f5; | ||
|  | 	border-radius: 4px; | ||
|  | 	padding: 10px; | ||
|  | 	margin: 10px 0; | ||
|  | 	box-shadow: 0 2px 4px rgba(0,0,0,0.1); | ||
|  | } | ||
|  | 
 | ||
|  | .user-info-panel h3 { | ||
|  | 	margin-top: 0; | ||
|  | 	margin-bottom: 10px; | ||
|  | 	color: #333; | ||
|  | } | ||
|  | 
 | ||
|  | .user-info-panel p { | ||
|  | 	margin: 5px 0; | ||
|  | } | ||
|  | 
 | ||
|  | .user-points { | ||
|  | 	font-weight: bold; | ||
|  | 	color: #0078ff; | ||
|  | } | ||
|  | 
 | ||
|  | .reality-check { | ||
|  | 	margin-top: 10px; | ||
|  | 	padding: 10px; | ||
|  | 	background-color: #fff3e0; | ||
|  | 	border-radius: 4px; | ||
|  | } | ||
|  | 
 | ||
|  | .reality-check-buttons { | ||
|  | 	display: flex; | ||
|  | 	justify-content: space-between; | ||
|  | 	margin-top: 8px; | ||
|  | } | ||
|  | 
 | ||
|  | .confirm-btn, .deny-btn { | ||
|  | 	padding: 5px 10px; | ||
|  | 	border: none; | ||
|  | 	border-radius: 4px; | ||
|  | 	cursor: pointer; | ||
|  | 	font-weight: bold; | ||
|  | } | ||
|  | 
 | ||
|  | .confirm-btn { | ||
|  | 	background-color: #4caf50; | ||
|  | 	color: white; | ||
|  | } | ||
|  | 
 | ||
|  | .deny-btn { | ||
|  | 	background-color: #f44336; | ||
|  | 	color: white; | ||
|  | } | ||
|  | 
 | ||
|  | .reality-check-info { | ||
|  | 	margin-top: 10px; | ||
|  | 	padding: 8px; | ||
|  | 	background-color: #e8f5e9; | ||
|  | 	border-radius: 4px; | ||
|  | 	font-size: 0.9em; | ||
|  | } | ||
|  | 
 | ||
|  | #photoPreviewContainer { | ||
|  | 	margin-top: 8px; | ||
|  | 	display: none; | ||
|  | } | ||
|  | 
 | ||
|  | #photoPreview { | ||
|  | 	max-width: 100%; | ||
|  | 	border-radius: 4px; | ||
|  | } | ||
|  | 
 | ||
|  | .camera-block { | ||
|  | 	margin-top: 12px; | ||
|  | 	background: #f9fafb; | ||
|  | 	border: 1px solid #e5e7eb; | ||
|  | 	border-radius: 6px; | ||
|  | 	padding: 10px; | ||
|  | } | ||
|  | .camera-block .note { font-size: 12px; color: #666; } | ||
|  | .camera-controls { | ||
|  | 	display: flex; | ||
|  | 	gap: 8px; | ||
|  | 	margin-bottom: 8px; | ||
|  | } | ||
|  | .camera-preview video { | ||
|  | 	width: 100%; | ||
|  | 	max-height: 260px; | ||
|  | 	background: #000; | ||
|  | 	border-radius: 4px; | ||
|  | } | ||
|  | .gps-status { | ||
|  | 	margin-left: 8px; | ||
|  | 	font-size: 12px; | ||
|  | 	color: #555; | ||
|  | } |