forked from froge/cyberfrog.me
		
	Add site header and restyle page content
This commit is contained in:
		
							parent
							
								
									3a1dddcf50
								
							
						
					
					
						commit
						c6c4b3a367
					
				
					 3 changed files with 65 additions and 32 deletions
				
			
		| 
						 | 
				
			
			@ -6,12 +6,10 @@ html {
 | 
			
		|||
 | 
			
		||||
body {
 | 
			
		||||
  font-family: Open Sans,Arial;
 | 
			
		||||
  color: #d4d4d4;
 | 
			
		||||
  background-color: #252422;
 | 
			
		||||
  font-size: 16px;
 | 
			
		||||
  margin: 1em auto;
 | 
			
		||||
  color: #e4e4e4;
 | 
			
		||||
  font-size: 14px;
 | 
			
		||||
  margin: auto;
 | 
			
		||||
  max-width: 48em;
 | 
			
		||||
  padding: 1em;
 | 
			
		||||
  line-height: 1.4;
 | 
			
		||||
  -webkit-hyphens: auto;
 | 
			
		||||
  -ms-hyphens: auto;
 | 
			
		||||
| 
						 | 
				
			
			@ -27,11 +25,42 @@ li {
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
a {
 | 
			
		||||
  color:#00a2e7
 | 
			
		||||
  color: #fa4c58;
 | 
			
		||||
  text-decoration: none;
 | 
			
		||||
  font-weight: bold;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
a:visited {
 | 
			
		||||
  color:#ca1a70;
 | 
			
		||||
  color: #ac69e2;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
a:hover {
 | 
			
		||||
  text-decoration: underline;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#site-content {
 | 
			
		||||
  height: 20em;
 | 
			
		||||
  margin: 5em auto;
 | 
			
		||||
  padding: 1em;
 | 
			
		||||
  border-radius: 1em;
 | 
			
		||||
  background: rgba(0,0,0, 0.6);
 | 
			
		||||
  box-shadow: 1em 1em 1em 1em rgba(0,0,0, 0.5);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#ascii-header {
 | 
			
		||||
  font-size: 10px;
 | 
			
		||||
  color: #e4e4e4;
 | 
			
		||||
  text-decoration: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#ascii-header a {
 | 
			
		||||
  color: #e4e4e4;
 | 
			
		||||
  text-decoration: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#ascii-header a:visited {
 | 
			
		||||
  color: #e4e4e4;
 | 
			
		||||
  text-decoration: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.blog-post-date {
 | 
			
		||||
| 
						 | 
				
			
			@ -39,29 +68,25 @@ a:visited {
 | 
			
		|||
 padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#blog-title {
 | 
			
		||||
.blog-title {
 | 
			
		||||
  margin-bottom: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
/* Magic frog pool CSS lives here */
 | 
			
		||||
#frog-pool-container {
 | 
			
		||||
/* Magic background CSS lives here */
 | 
			
		||||
#bg-effect-container {
 | 
			
		||||
  z-index: -1;
 | 
			
		||||
  position: absolute;
 | 
			
		||||
  bottom: 0%;
 | 
			
		||||
  left: 0%;
 | 
			
		||||
  /*transform: translate(-50%, -50%);*/
 | 
			
		||||
  transform: rotate(0deg);
 | 
			
		||||
  background: rgb(37,36,34);
 | 
			
		||||
  background: linear-gradient(-20deg, rgba(37,36,34,1) 25%, rgba(62,34,143,1) 60%, rgba(39,171,198,1) 95%); 
 | 
			
		||||
  height: 100%;
 | 
			
		||||
  width: 100%;
 | 
			
		||||
  background-color: blue;
 | 
			
		||||
  background-color: #252422;
 | 
			
		||||
  overflow: hidden;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.frog-pool-water {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.frog-pool-emoji {
 | 
			
		||||
.bg-effect {
 | 
			
		||||
  background: linear-gradient(to bottom right, rgba(0,0,0,1) 10%, rgba(65,14,105, 0.6) 40%, rgba(55,17,95,0.7) 50%, rgba(32,14,84,0.6) 60%, rgba(0,0,0,1) 90%);
 | 
			
		||||
  height: 100%;
 | 
			
		||||
  width: 100%;
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue