mirror of
https://github.com/tailwindlabs/tailwindcss.git
synced 2025-12-08 21:36:08 +00:00
Use rounded-pill instead of pill
This commit is contained in:
parent
1049500f8e
commit
6f7a0766a2
@ -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">
|
||||
|
||||
@ -159,7 +159,7 @@ div {
|
||||
.rounded-r-lg;
|
||||
.rounded-b-lg;
|
||||
.rounded-l-lg;
|
||||
.pill;
|
||||
.rounded-pill;
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user