forked from website/openpower.foundation
				
			
			You cannot select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
	
	
		
			145 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			SCSS
		
	
			
		
		
	
	
			145 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			SCSS
		
	
| #contact .form #sendmessage {
 | |
| 	color: #ff8800;
 | |
| 	border: 1px solid #1dc8cd;
 | |
| 	display: none;
 | |
| 	text-align: center;
 | |
| 	padding: 15px;
 | |
| 	font-weight: 600;
 | |
| 	margin-bottom: 15px;
 | |
| }
 | |
| #contact .form #errormessage {
 | |
| 	color: red;
 | |
| 	display: none;
 | |
| 	border: 1px solid red;
 | |
| 	text-align: center;
 | |
| 	padding: 15px;
 | |
| 	font-weight: 600;
 | |
| 	margin-bottom: 15px;
 | |
| }
 | |
| .contactee select {
 | |
| 	background-color: #2566f4;
 | |
| 	color: white;
 | |
| 	padding: 12px;
 | |
| 	width: 100%;
 | |
| 	border: none;
 | |
| 	font-size: 20px;
 | |
| 	box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2);   -webkit-appearance: button;   appearance: button;   outline: none;
 | |
| }
 | |
| 
 | |
| #passport .form #sendmessage {
 | |
| 	color: #2566f4;
 | |
| 	border: 2px solid #008800;
 | |
| 	display: none;
 | |
| 	text-align: center;
 | |
| 	padding: 15px;
 | |
| 	font-weight: 600;
 | |
| 	margin-bottom: 15px;
 | |
| }
 | |
| #passport .form #errormessage {
 | |
| 	color: #ff0000;
 | |
| 	display: none;
 | |
| 	border: 2px solid #880000;
 | |
| 	text-align: center;
 | |
| 	padding: 15px;
 | |
| 	font-weight: 600;
 | |
| 	margin-bottom: 15px;
 | |
| }
 | |
| #passport .form #sendmessage.show,
 | |
| #passport .form #errormessage.show,
 | |
| #passport .form .show {
 | |
| 	display: block;
 | |
| }
 | |
| #passport .form .validation {
 | |
| 	color: #880000;
 | |
| 	display: none;
 | |
| 	margin: 0 0 20px;
 | |
| 	font-weight: 400;
 | |
| 	font-size: 13px;
 | |
| }
 | |
| #passport .form input, #contact .form textarea {
 | |
| 	border-radius: 0;
 | |
| 	box-shadow: none;
 | |
| 	font-size: 14px;
 | |
| }
 | |
| #passport .form button[type="submit"] {
 | |
| 	background: #2566f4;
 | |
| 	border: 0;
 | |
| 	border-radius: 2rem;
 | |
| 	padding: 1rem 5rem 1rem 5rem;
 | |
| 	color: #ffffff;
 | |
| }
 | |
| #passport .form button[type="submit"]:hover {
 | |
| 	background: #000000;
 | |
| 	cursor: pointer;
 | |
| }
 | |
| 
 | |
| .member-value,
 | |
| .member-list {
 | |
| 	width: 100%;
 | |
| }
 | |
| .member-value {
 | |
| 	font-weight: 600;
 | |
| 	letter-spacing: 4px;
 | |
| 	height: 4rem;
 | |
| 	font-size: 1.1rem;
 | |
| 	padding: 1rem;
 | |
| 	color: #ffffff;
 | |
| 	background-color: #2566f4;
 | |
| 	border: 3px solid transparent;
 | |
| 	transition: .3s ease-in-out;
 | |
| 	&::-webkit-input-placeholder {
 | |
| 		color: #ffffff;
 | |
| 	}
 | |
| 	&:hover {
 | |
| 		background-color: #2566f4;
 | |
| 		cursor: pointer;
 | |
| 		&::-webkit-input-placeholder {
 | |
| 			color: #ffffff;
 | |
| 		}
 | |
| 	}
 | |
| 	&:focus,
 | |
| 	&.open {
 | |
| 		box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.2);
 | |
| 		outline: 0;
 | |
| 		color: #ffffff;
 | |
| 		background-color: #2566f4;
 | |
| 		&::-webkit-input-placeholder {
 | |
| 			color: #ffffff;
 | |
| 		}
 | |
| 	}
 | |
| }
 | |
| .member-list {
 | |
| 	list-style: none;
 | |
| 	box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.2);
 | |
| 	overflow: hidden;
 | |
| 	max-height: 0;
 | |
| 	transition: .3s ease-in-out;
 | |
| 	&.open {
 | |
| 		max-height: 320px;
 | |
| 		overflow: auto;
 | |
| 	}
 | |
| 	li {
 | |
| 		position: relative;
 | |
| 		height: 4rem;
 | |
| 		color: #ffffff;
 | |
| 		background-color: #2566f4;
 | |
| 		padding: 1rem;
 | |
| 		font-size: 1.1rem;
 | |
| 		display: flex;
 | |
| 		align-items: center;
 | |
| 		cursor: pointer;
 | |
| 		transition: background-color .3s;
 | |
| 		opacity: 1;
 | |
| 		&:hover {
 | |
| 			color: #2566f4;
 | |
| 			background-color: #ffffff;
 | |
| 		}	
 | |
| 		&.closed {
 | |
| 			max-height: 0;
 | |
| 			overflow: hidden;
 | |
| 			padding: 0;
 | |
| 			opacity: 0;
 | |
| 		}
 | |
| 	}
 | |
| }
 |