neumorphic header
This commit is contained in:
		
							parent
							
								
									f81da9ecf7
								
							
						
					
					
						commit
						8da0d19e44
					
				| 
						 | 
				
			
			@ -10,6 +10,7 @@
 | 
			
		|||
		margin-left: 0px;
 | 
			
		||||
		margin-right: 0px;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	/* Header/logo Title */
 | 
			
		||||
	header {
 | 
			
		||||
		text-align: center;
 | 
			
		||||
| 
						 | 
				
			
			@ -37,15 +38,18 @@
 | 
			
		|||
		padding: 10px;
 | 
			
		||||
		text-decoration: none;
 | 
			
		||||
		text-align: center;
 | 
			
		||||
		cursor: pointer;
 | 
			
		||||
		transition: all 0.3s ease;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	/* Change color on hover */
 | 
			
		||||
	nav a:hover {
 | 
			
		||||
		background-color: #ddd;
 | 
			
		||||
		color: black;
 | 
			
		||||
		box-shadow: 20px 20px 20px #eee, -20px -20px 20px #fff;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	nav a.active {
 | 
			
		||||
	nav a:active {
 | 
			
		||||
		background-color: #ccc;
 | 
			
		||||
		color: #222;
 | 
			
		||||
	}
 | 
			
		||||
| 
						 | 
				
			
			@ -83,6 +87,7 @@
 | 
			
		|||
		margin-left: 0px;
 | 
			
		||||
		margin-right: 0px;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	/* Header/logo Title */
 | 
			
		||||
	header {
 | 
			
		||||
		text-align: center;
 | 
			
		||||
| 
						 | 
				
			
			@ -111,15 +116,16 @@
 | 
			
		|||
		padding: 14px 20px;
 | 
			
		||||
		text-decoration: none;
 | 
			
		||||
		text-align: center;
 | 
			
		||||
		cursor: pointer;
 | 
			
		||||
		transition: all 0.3s ease;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	/* Change color on hover */
 | 
			
		||||
	nav a:hover {
 | 
			
		||||
		background-color: #111;
 | 
			
		||||
		color: #ddd;
 | 
			
		||||
		box-shadow: 20px 20px 20px #070707, -20px -20px 20px #1b1b1b;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	nav a.active {
 | 
			
		||||
	nav a:active {
 | 
			
		||||
		background-color: #ccc;
 | 
			
		||||
		color: #222;
 | 
			
		||||
	}
 | 
			
		||||
| 
						 | 
				
			
			@ -149,8 +155,9 @@
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
@media screen and (max-width: 700px) {
 | 
			
		||||
 | 
			
		||||
	.row,
 | 
			
		||||
	nav {
 | 
			
		||||
		flex-direction: column;
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
}
 | 
			
		||||
		Loading…
	
		Reference in New Issue