Landing page for base
This commit is contained in:
		
							parent
							
								
									9aa86dd896
								
							
						
					
					
						commit
						e6a7310e04
					
				| 
						 | 
				
			
			@ -94,6 +94,14 @@ input, button, textarea, select {
 | 
			
		|||
/* Utility Classes */
 | 
			
		||||
/* --------------- */
 | 
			
		||||
 | 
			
		||||
/* Layouts */
 | 
			
		||||
 | 
			
		||||
.container {
 | 
			
		||||
  padding-inline: clamp(0.5rem, 4rem, 5rem);
 | 
			
		||||
  margin-inline: auto;
 | 
			
		||||
  max-width: 80rem;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.flex {
 | 
			
		||||
  display: flex;
 | 
			
		||||
  gap: 2rem;
 | 
			
		||||
| 
						 | 
				
			
			@ -124,12 +132,13 @@ input, button, textarea, select {
 | 
			
		|||
  justify-content: space-evenly;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.container {
 | 
			
		||||
  padding-inline: clamp(0.5rem, 4rem, 5rem);
 | 
			
		||||
  margin-inline: auto;
 | 
			
		||||
  max-width: 80rem;
 | 
			
		||||
.lock-bottom {
 | 
			
		||||
  position: absolute;
 | 
			
		||||
  bottom: 0%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/* Other */
 | 
			
		||||
 | 
			
		||||
.hr::after { /* Add fake hr after header */
 | 
			
		||||
  content: '';
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -95,7 +95,7 @@
 | 
			
		|||
		<h2>Sample Pages</h2>
 | 
			
		||||
		<ul class="container two-columns">
 | 
			
		||||
			<li><a href="samplepage">First Sample Page</a></li>
 | 
			
		||||
			<li><a>Second Sample Page</a></li>
 | 
			
		||||
			<li><a href="landingpage">Second Sample Page</a></li>
 | 
			
		||||
			<li><a>Third Sample Page</a></li>
 | 
			
		||||
		</ul>
 | 
			
		||||
	</section>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -0,0 +1,28 @@
 | 
			
		|||
<!DOCTYPE html>
 | 
			
		||||
<html lang="en">
 | 
			
		||||
<head>
 | 
			
		||||
	<meta charset="utf-8">
 | 
			
		||||
	<meta name="viewport" content="width=device-width, initial-scale=1">
 | 
			
		||||
	<title>Base - Landing Page</title>
 | 
			
		||||
	<link rel="stylesheet" href="index.css">
 | 
			
		||||
	<style>
 | 
			
		||||
		body {
 | 
			
		||||
		overflow: hidden;
 | 
			
		||||
		}
 | 
			
		||||
	</style>
 | 
			
		||||
	<!-- Base v1.1 -->
 | 
			
		||||
</head>
 | 
			
		||||
<body>
 | 
			
		||||
<main>
 | 
			
		||||
<header>
 | 
			
		||||
	<div class="container flex column">
 | 
			
		||||
		<h1 class="text-dark">Base Landing Page</h1>
 | 
			
		||||
		<p>One might want a flashy landing page</p>
 | 
			
		||||
	</div>
 | 
			
		||||
</header>
 | 
			
		||||
</main>
 | 
			
		||||
<footer class="lock-bottom">
 | 
			
		||||
	<a href="./">Return to Base</a>
 | 
			
		||||
</footer>
 | 
			
		||||
</body>
 | 
			
		||||
</html>
 | 
			
		||||
		Loading…
	
		Reference in New Issue