Use rounded-pill instead of pill

This commit is contained in:
Adam Wathan 2017-08-27 18:48:41 -04:00
parent 1049500f8e
commit 6f7a0766a2
3 changed files with 6 additions and 6 deletions

View File

@ -13,7 +13,7 @@
<header class="container">
<div class="py-6 flex items-center justify-between">
<div class="flex items-center">
<div class="pill h-12 w-12 bg-light p-2 inline-flex items-center justify-center shadow-2 mr-4">
<div class="rounded-pill h-12 w-12 bg-light p-2 inline-flex items-center justify-center shadow-2 mr-4">
<svg class="fit w-full" viewBox="0 0 60 36" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient x1="0%" y1="0%" y2="100%" id="a"><stop stop-color="#2383AE" offset="0%"></stop><stop stop-color="#6DD7B9" offset="100%"></stop></linearGradient></defs><path d="M15 12c2-8 7-12 15-12 12 0 13.5 9 19.5 10.5 4 1 7.5-.5 10.5-4.5-2 8-7 12-15 12-12 0-13.5-9-19.5-10.5-4-1-7.5.5-10.5 4.5zM0 30c2-8 7-12 15-12 12 0 13.5 9 19.5 10.5 4 1 7.5-.5 10.5-4.5-2 8-7 12-15 12-12 0-13.5-9-19.5-10.5-4-1-7.5.5-10.5 4.5z" fill="url(#a)" fill-rule="evenodd"></path></svg>
</div>
<svg class="h-4" viewBox="0 0 136 19" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Tailwind CSS">

View File

@ -159,7 +159,7 @@ div {
.rounded-r-lg;
.rounded-b-lg;
.rounded-l-lg;
.pill;
.rounded-pill;
}
```

View File

@ -81,9 +81,9 @@
</p>
</div>
<div class="px-6 py-4">
<span class="inline-block bg-light-softer pill px-3 py-1 text-sm text-medium text-dark-soft mr-2">#photography</span>
<span class="inline-block bg-light-softer pill px-3 py-1 text-sm text-medium text-dark-soft mr-2">#travel</span>
<span class="inline-block bg-light-softer pill px-3 py-1 text-sm text-medium text-dark-soft">#winter</span>
<span class="inline-block bg-light-softer rounded-pill px-3 py-1 text-sm text-medium text-dark-soft mr-2">#photography</span>
<span class="inline-block bg-light-softer rounded-pill px-3 py-1 text-sm text-medium text-dark-soft mr-2">#travel</span>
<span class="inline-block bg-light-softer rounded-pill px-3 py-1 text-sm text-medium text-dark-soft">#winter</span>
</div>
</div>
</div>
@ -105,7 +105,7 @@
</p>
</div>
<div class="flex items-center">
<img class="w-10 h-10 pill mr-4" src="https://pbs.twimg.com/profile_images/885868801232961537/b1F6H4KC_400x400.jpg" alt="">
<img class="w-10 h-10 rounded-pill mr-4" src="https://pbs.twimg.com/profile_images/885868801232961537/b1F6H4KC_400x400.jpg" alt="">
<div class="text-sm">
<p class="text-dark leading-none">Jonathan Reinink</p>
<p class="text-dark-softer">Aug 18</p>