Skip to content

Commit

Permalink
tailwind 2.0 fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
gary149 committed Dec 5, 2020
1 parent 0494208 commit 1288cad
Show file tree
Hide file tree
Showing 5 changed files with 193,843 additions and 675 deletions.
40 changes: 16 additions & 24 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,9 @@
/>
</head>

<body class="container mx-auto text-gray-300 md:p-4">
<body class="bg-gradient-to-br from-gray-900 to-black">
<div
class="p-8 overflow-hidden md:rounded-lg md:p-10 lg:p-12 bg-gradient-to-br from-gray-900 to-black"
class="text-gray-300 container mx-auto p-8 overflow-hidden md:rounded-lg md:p-10 lg:p-12"
>
<div class="flex justify-between">
<h1 class="font-serif text-3xl font-medium">Landing</h1>
Expand All @@ -35,12 +35,12 @@ <h1 class="font-serif text-3xl font-medium">Landing</h1>
<div class="h-32 md:h-40"></div>

<p
class="font-sans text-4xl font-bold text-gray-200 lg:text-7xl lg:pr-24 md:text-6xl"
class="font-sans text-4xl font-bold text-gray-200 max-w-5xl lg:text-7xl lg:pr-24 md:text-6xl"
>
Spend less time coding and more time creating
</p>
<div class="h-10"></div>
<p class="max-w-2xl font-serif text-xl text-gray-500 md:text-2xl">
<p class="max-w-2xl font-serif text-xl text-gray-400 md:text-2xl">
Imagine being able to spent less time... This is a demonstration landing
page made with tailwindcss
</p>
Expand All @@ -56,7 +56,7 @@ <h1 class="font-serif text-3xl font-medium">Landing</h1>
</p>
<h2 class="text-4xl font-bold">Made for devs and designers</h2>
<div class="h-6"></div>
<p class="font-serif text-xl text-gray-500 md:pr-10">
<p class="font-serif text-xl text-gray-400 md:pr-10">
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Magnam
autem, a recusandae vero praesentium qui impedit doloremque
molestias necessitatibus.
Expand All @@ -66,15 +66,15 @@ <h2 class="text-4xl font-bold">Made for devs and designers</h2>
<div>
<p class="font-semibold text-gray-400">Made with love</p>
<div class="h-4"></div>
<p class="font-serif text-gray-500">
<p class="font-serif text-gray-400">
Lorem ipsum dolor sit, amet consectetur adipisicing elit.
Delectus labor.
</p>
</div>
<div>
<p class="font-semibold text-gray-400">It's easy to build</p>
<div class="h-4"></div>
<p class="font-serif text-gray-500">
<p class="font-serif text-gray-400">
Ipsum dolor sit, amet consectetur adipisicing elit. Delectus
amet consectetur.
</p>
Expand Down Expand Up @@ -150,33 +150,33 @@ <h2 class="text-4xl font-bold">Made for devs and designers</h2>
</p>
<h2 class="text-4xl font-bold">We could work together</h2>
<div class="h-6"></div>
<p class="font-serif text-xl text-gray-500 md:pr-10">
<p class="font-serif text-xl text-gray-400 md:pr-10">
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Magnam
autem, a recusandae vero praesentium qui impedit doloremque
molestias.
</p>
<div class="h-8"></div>
<div class="grid gap-4 pt-8 border-t border-gray-800 lg:grid-cols-3">
<div class="grid gap-6 pt-8 border-t border-gray-800 lg:grid-cols-3">
<div>
<p class="font-semibold text-gray-400">Made with love</p>
<div class="h-4"></div>
<p class="font-serif text-gray-500">
<p class="font-serif text-gray-400">
Lorem ipsum dolor sit, amet consectetur adipisicing elit.
Delectus labor.
</p>
</div>
<div>
<p class="font-semibold text-gray-400">It's easy to build</p>
<div class="h-4"></div>
<p class="font-serif text-gray-500">
<p class="font-serif text-gray-400">
Ipsum dolor sit, amet consectetur adipisicing elit. Delectus
amet consectetur.
</p>
</div>
<div>
<p class="font-semibold text-gray-400">It's easy to build</p>
<div class="h-4"></div>
<p class="font-serif text-gray-500">
<p class="font-serif text-gray-400">
Ipsum dolor sit, amet consectetur adipisicing elit. Delectus
amet consectetur.
</p>
Expand All @@ -194,9 +194,7 @@ <h2 class="text-4xl font-bold">We could work together</h2>

<div class="grid gap-4 md:grid-cols-4">
<ul class="space-y-1 text-gray-400">
<li class="pb-4 font-serif text-gray-500">
Social networks
</li>
<li class="pb-4 font-serif text-gray-400">Social networks</li>
<li>
<a href="https://twitter.com/victormustar" class="hover:underline"
>Twitter</a
Expand All @@ -210,9 +208,7 @@ <h2 class="text-4xl font-bold">We could work together</h2>
</li>
</ul>
<ul class="space-y-1 text-gray-400">
<li class="pb-4 font-serif text-gray-500">
Locations
</li>
<li class="pb-4 font-serif text-gray-400">Locations</li>
<li>
<a href="#" class="hover:underline">Paris</a>
</li>
Expand All @@ -227,9 +223,7 @@ <h2 class="text-4xl font-bold">We could work together</h2>
</li>
</ul>
<ul class="space-y-1 text-gray-400">
<li class="pb-4 font-serif text-gray-500">
Company
</li>
<li class="pb-4 font-serif text-gray-400">Company</li>
<li>
<a href="#" class="hover:underline">The team</a>
</li>
Expand All @@ -244,9 +238,7 @@ <h2 class="text-4xl font-bold">We could work together</h2>
</li>
</ul>
<ul class="space-y-1 text-gray-400">
<li class="pb-4 font-serif text-gray-500">
Join
</li>
<li class="pb-4 font-serif text-gray-400">Join</li>
<li>
<a
href="https://github.com/gary149/landing-gradients"
Expand Down
63 changes: 0 additions & 63 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 1 addition & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,12 @@
"description": "",
"scripts": {
"dev": "live-server",
"build:tailwind": "tailwindcss build styles/global.css -o static/output.css",
"build:tailwind": "npx tailwindcss-cli@latest build styles/global.css -o static/output.css",
"build": "NODE_ENV=production npm run build:tailwind"
},
"author": "Victor Mustar <[email protected]>",
"license": "ISC",
"devDependencies": {
"autoprefixer": "^10.0.4",
"live-server": "^1.2.1",
"tailwindcss": "^2.0.1"
}
Expand Down
Loading

0 comments on commit 1288cad

Please sign in to comment.