Skip to content

Instantly share code, notes, and snippets.

@foucist

foucist/index.html

Last active September 20, 2018 07:20
Show Gist options
  • Save foucist/6d1cb7417503a9d6abb5fd9259dd2e4f to your computer and use it in GitHub Desktop.
Save foucist/6d1cb7417503a9d6abb5fd9259dd2e4f to your computer and use it in GitHub Desktop.
Download ZIP
preliminary clone of angular.io with tailwind css
Raw
index.html
<!doctype html>
<html lang="en">
<head>
<title>Tailwind Starter Template</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
</head>
<body>
<div class="container bg-blue-dark">
<div class="bg-blue flex items-center py-1">
<div class="items-center flex w-1/4">
<div class="w-1/2 px-6 hover:bg-blue-dark">
<svg class="inline-block fill-current text-white h-6 w-6" xmlns="http://www.w3.org/2000/svg" focusable="false" viewBox="0 0 24 24"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"></path></svg>
</div>
<div class="text-right w-1/2">
<img class="h-10 w-10" src="https://angular.io/assets/images/logos/angular/shield-large.svg">
</div>
</div>
<div class="w-1/4">
</div>
<div class="items-center flex w-1/2">
<div class="w-1/2">
<input class="border py-1 px-8 text-grey-darker text-sm rounded-full w-40" placeholder="Search">
</div>
<div class="w-1/2 text-right">
<img class="h-6 w-6 mr-2" src="https://angular.io/assets/images/logos/twitter-icon.svg">
<img class="h-6 w-6 mr-2" src="https://angular.io/assets/images/logos/github-icon.svg">
</div>
</div>
</div>
<div class="text-center">
<img class="h-64 w-64" src="https://angular.io/assets/images/logos/angular/angular.svg">
<h1 class="font-sans text-white font-normal leading-normal">One framework. <br> Mobile & Desktop.</h1>
</div>
<div class="text-center">
<button class="bg-white font-extrabold pin-b py-2 px-6 rounded-full shadow text-blue-dark text-lg uppercase">Get Started</button>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment