Tweak contact card example on intro page
This commit is contained in:
parent
a5144aba0f
commit
88014ba2de
1 changed files with 10 additions and 12 deletions
|
|
@ -31,11 +31,9 @@ Here's an example of a contact card component built with Tailwind without writin
|
|||
|
||||
@component('_partials.code-sample', ['class' => 'bg-grey-lighter py-8'])
|
||||
<div class="bg-white mx-auto max-w-sm shadow-lg rounded-lg overflow-hidden">
|
||||
<div class="flex items-center px-6 py-4">
|
||||
<div class="mr-4">
|
||||
<img class="h-24 rounded-full" src="https://avatars2.githubusercontent.com/u/4323180?s=400&u=4962a4441fae9fba5f0f86456c6c506a21ffca4f&v=4" alt="">
|
||||
</div>
|
||||
<div class="flex-grow">
|
||||
<div class="sm:flex sm:items-center px-6 py-4">
|
||||
<img class="block h-16 sm:h-24 rounded-full mx-auto mb-4 sm:mb-0 sm:mr-4 sm:ml-0" src="https://avatars2.githubusercontent.com/u/4323180?s=400&u=4962a4441fae9fba5f0f86456c6c506a21ffca4f&v=4" alt="">
|
||||
<div class="text-center sm:text-left sm:flex-grow">
|
||||
<div class="mb-4">
|
||||
<p class="text-xl leading-tight">Adam Wathan</p>
|
||||
<p class="text-sm leading-tight text-grey-dark">Developer at NothingWorks Inc.</p>
|
||||
|
|
@ -48,16 +46,16 @@ Here's an example of a contact card component built with Tailwind without writin
|
|||
</div>
|
||||
@slot('code')
|
||||
<div class="bg-white mx-auto max-w-sm shadow-lg rounded-lg overflow-hidden">
|
||||
<div class="flex items-center px-6 py-4">
|
||||
<div class="mr-4">
|
||||
<img class="h-24 rounded-full" src="https://avatars2.githubusercontent.com/u/4323180?s=400&u=4962a4441fae9fba5f0f86456c6c506a21ffca4f&v=4" alt="">
|
||||
</div>
|
||||
<div>
|
||||
<div class="sm:flex sm:items-center px-6 py-4">
|
||||
<img class="block h-16 sm:h-24 rounded-full mx-auto mb-4 sm:mb-0 sm:mr-4 sm:ml-0" src="https://avatars2.githubusercontent.com/u/4323180?s=400&u=4962a4441fae9fba5f0f86456c6c506a21ffca4f&v=4" alt="">
|
||||
<div class="text-center sm:text-left sm:flex-grow">
|
||||
<div class="mb-4">
|
||||
<p class="text-xl leading-tight text-black">Adam Wathan</p>
|
||||
<p class="text-xl leading-tight">Adam Wathan</p>
|
||||
<p class="text-sm leading-tight text-grey-dark">Developer at NothingWorks Inc.</p>
|
||||
</div>
|
||||
<button class="text-xs font-semibold rounded-full px-4 py-1 leading-normal bg-white border border-purple text-purple hover:bg-purple hover:text-white">Message</button>
|
||||
<div>
|
||||
<button class="text-xs font-semibold rounded-full px-4 py-1 leading-normal bg-white border border-purple text-purple hover:bg-purple hover:text-white">Message</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue