From fbc693d4c0a8730a5dee29b98ee81b8db24397a3 Mon Sep 17 00:00:00 2001
From: Adam Wathan <adam.wathan@gmail.com>
Date: Mon, 30 Oct 2017 19:45:39 -0400
Subject: [PATCH] Replace rounded-pill with rounded-full without fucking
 everything up

---
 .../source/_partials/feature-badges.blade.php | 32 +++++++++----------
 docs/source/docs/examples/buttons.blade.md    |  2 +-
 docs/source/docs/examples/cards.blade.md      |  8 ++---
 docs/source/docs/opacity.blade.md             | 10 +++---
 docs/source/docs/positioning.blade.md         |  6 ++--
 docs/source/docs/shadows.blade.md             | 10 +++---
 docs/source/docs/visibility.blade.md          | 14 ++++----
 7 files changed, 41 insertions(+), 41 deletions(-)

diff --git a/docs/source/_partials/feature-badges.blade.php b/docs/source/_partials/feature-badges.blade.php
index 5eff24194..58e890ab7 100644
--- a/docs/source/_partials/feature-badges.blade.php
+++ b/docs/source/_partials/feature-badges.blade.php
@@ -1,14 +1,14 @@
 <div class="flex mb-6">
     @if ($responsive)
-    <span class="inline-flex items-center rounded-pill border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none mr-2">
-        <span class="inline-flex rounded-pill bg-green-light text-white mr-1">
+    <span class="inline-flex items-center rounded-full border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none mr-2">
+        <span class="inline-flex rounded-full bg-green-light text-white mr-1">
             <svg class="h-4 w-4" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M5.8 9.4c-.33-.442-.958-.53-1.4-.2-.442.33-.53.958-.2 1.4l3 4c.38.508 1.134.537 1.553.06l7-8c.363-.417.32-1.05-.094-1.413-.417-.363-1.05-.32-1.413.094L8.06 12.414 5.8 9.4z"/></svg>
         </span>
         <span>Responsive</span>
     </span>
     @else
-    <span class="inline-flex items-center rounded-pill border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none opacity-50 mr-2">
-        <span class="inline-flex rounded-pill bg-grey text-white mr-1">
+    <span class="inline-flex items-center rounded-full border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none opacity-50 mr-2">
+        <span class="inline-flex rounded-full bg-grey text-white mr-1">
             <svg class="h-4 w-4" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M10 8.586L6.707 5.293c-.39-.39-1.024-.39-1.414 0-.39.39-.39 1.024 0 1.414L8.586 10l-3.293 3.293c-.39.39-.39 1.024 0 1.414.39.39 1.024.39 1.414 0L10 11.414l3.293 3.293c.39.39 1.024.39 1.414 0 .39-.39.39-1.024 0-1.414L11.414 10l3.293-3.293c.39-.39.39-1.024 0-1.414-.39-.39-1.024-.39-1.414 0L10 8.586z"/></svg>
         </span>
         <span>Responsive</span>
@@ -16,15 +16,15 @@
     @endif
 
     @if ($customizable)
-    <span class="inline-flex items-center rounded-pill border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none mr-2">
-        <span class="inline-flex rounded-pill bg-green-light text-white mr-1">
+    <span class="inline-flex items-center rounded-full border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none mr-2">
+        <span class="inline-flex rounded-full bg-green-light text-white mr-1">
             <svg class="h-4 w-4" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M5.8 9.4c-.33-.442-.958-.53-1.4-.2-.442.33-.53.958-.2 1.4l3 4c.38.508 1.134.537 1.553.06l7-8c.363-.417.32-1.05-.094-1.413-.417-.363-1.05-.32-1.413.094L8.06 12.414 5.8 9.4z"/></svg>
         </span>
         <span>Customizable</span>
     </span>
     @else
-    <span class="inline-flex items-center rounded-pill border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none opacity-50 mr-2">
-        <span class="inline-flex rounded-pill bg-grey text-white mr-1">
+    <span class="inline-flex items-center rounded-full border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none opacity-50 mr-2">
+        <span class="inline-flex rounded-full bg-grey text-white mr-1">
             <svg class="h-4 w-4" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M10 8.586L6.707 5.293c-.39-.39-1.024-.39-1.414 0-.39.39-.39 1.024 0 1.414L8.586 10l-3.293 3.293c-.39.39-.39 1.024 0 1.414.39.39 1.024.39 1.414 0L10 11.414l3.293 3.293c.39.39 1.024.39 1.414 0 .39-.39.39-1.024 0-1.414L11.414 10l3.293-3.293c.39-.39.39-1.024 0-1.414-.39-.39-1.024-.39-1.414 0L10 8.586z"/></svg>
         </span>
         <span>Customizable</span>
@@ -32,15 +32,15 @@
     @endif
 
     @if ($hover)
-    <span class="inline-flex items-center rounded-pill border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none mr-2">
-        <span class="inline-flex rounded-pill bg-green-light text-white mr-1">
+    <span class="inline-flex items-center rounded-full border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none mr-2">
+        <span class="inline-flex rounded-full bg-green-light text-white mr-1">
             <svg class="h-4 w-4" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M5.8 9.4c-.33-.442-.958-.53-1.4-.2-.442.33-.53.958-.2 1.4l3 4c.38.508 1.134.537 1.553.06l7-8c.363-.417.32-1.05-.094-1.413-.417-.363-1.05-.32-1.413.094L8.06 12.414 5.8 9.4z"/></svg>
         </span>
         <span>Hover</span>
     </span>
     @else
-    <span class="inline-flex items-center rounded-pill border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none opacity-50 mr-2">
-        <span class="inline-flex rounded-pill bg-grey text-white mr-1">
+    <span class="inline-flex items-center rounded-full border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none opacity-50 mr-2">
+        <span class="inline-flex rounded-full bg-grey text-white mr-1">
             <svg class="h-4 w-4" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M10 8.586L6.707 5.293c-.39-.39-1.024-.39-1.414 0-.39.39-.39 1.024 0 1.414L8.586 10l-3.293 3.293c-.39.39-.39 1.024 0 1.414.39.39 1.024.39 1.414 0L10 11.414l3.293 3.293c.39.39 1.024.39 1.414 0 .39-.39.39-1.024 0-1.414L11.414 10l3.293-3.293c.39-.39.39-1.024 0-1.414-.39-.39-1.024-.39-1.414 0L10 8.586z"/></svg>
         </span>
         <span>Hover</span>
@@ -48,15 +48,15 @@
     @endif
 
     @if ($focus)
-    <span class="inline-flex items-center rounded-pill border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none mr-2">
-        <span class="inline-flex rounded-pill bg-green-light text-white mr-1">
+    <span class="inline-flex items-center rounded-full border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none mr-2">
+        <span class="inline-flex rounded-full bg-green-light text-white mr-1">
             <svg class="h-4 w-4" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M5.8 9.4c-.33-.442-.958-.53-1.4-.2-.442.33-.53.958-.2 1.4l3 4c.38.508 1.134.537 1.553.06l7-8c.363-.417.32-1.05-.094-1.413-.417-.363-1.05-.32-1.413.094L8.06 12.414 5.8 9.4z"/></svg>
         </span>
         <span>Focus</span>
     </span>
     @else
-    <span class="inline-flex items-center rounded-pill border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none opacity-50 mr-2">
-        <span class="inline-flex rounded-pill bg-grey text-white mr-1">
+    <span class="inline-flex items-center rounded-full border border-grey-light bg-grey-lightest text-xs font-semibold pl-1 pt-1 pb-1 pr-2 leading-none opacity-50 mr-2">
+        <span class="inline-flex rounded-full bg-grey text-white mr-1">
             <svg class="h-4 w-4" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M10 8.586L6.707 5.293c-.39-.39-1.024-.39-1.414 0-.39.39-.39 1.024 0 1.414L8.586 10l-3.293 3.293c-.39.39-.39 1.024 0 1.414.39.39 1.024.39 1.414 0L10 11.414l3.293 3.293c.39.39 1.024.39 1.414 0 .39-.39.39-1.024 0-1.414L11.414 10l3.293-3.293c.39-.39.39-1.024 0-1.414-.39-.39-1.024-.39-1.414 0L10 8.586z"/></svg>
         </span>
         <span>Focus</span>
diff --git a/docs/source/docs/examples/buttons.blade.md b/docs/source/docs/examples/buttons.blade.md
index 73a2594ac..7f7b4d9a1 100644
--- a/docs/source/docs/examples/buttons.blade.md
+++ b/docs/source/docs/examples/buttons.blade.md
@@ -48,7 +48,7 @@ Here's a bunch of examples:
 ### Pill
 
 @component('_partials.code-sample', ['lang' => 'html', 'class' => 'text-center'])
-<button class="bg-blue hover:bg-blue-dark text-white font-bold py-2 px-4 rounded-pill">
+<button class="bg-blue hover:bg-blue-dark text-white font-bold py-2 px-4 rounded-full">
     Button
 </button>
 @endcomponent
diff --git a/docs/source/docs/examples/cards.blade.md b/docs/source/docs/examples/cards.blade.md
index 557ba5ff3..f8c53ebbd 100644
--- a/docs/source/docs/examples/cards.blade.md
+++ b/docs/source/docs/examples/cards.blade.md
@@ -17,9 +17,9 @@ We don't ship alert components because every app has it's own visual style, but
             </p>
         </div>
         <div class="px-6 py-4">
-            <span class="inline-block bg-smoke-light rounded-pill px-3 py-1 text-sm font-semibold text-slate mr-2">#photography</span>
-            <span class="inline-block bg-smoke-light rounded-pill px-3 py-1 text-sm font-semibold text-slate mr-2">#travel</span>
-            <span class="inline-block bg-smoke-light rounded-pill px-3 py-1 text-sm font-semibold text-slate">#winter</span>
+            <span class="inline-block bg-smoke-light rounded-full px-3 py-1 text-sm font-semibold text-slate mr-2">#photography</span>
+            <span class="inline-block bg-smoke-light rounded-full px-3 py-1 text-sm font-semibold text-slate mr-2">#travel</span>
+            <span class="inline-block bg-smoke-light rounded-full px-3 py-1 text-sm font-semibold text-slate">#winter</span>
         </div>
     </div>
 </div>
@@ -41,7 +41,7 @@ We don't ship alert components because every app has it's own visual style, but
                 </p>
             </div>
             <div class="flex items-center">
-                <img class="w-10 h-10 rounded-pill mr-4" src="https://pbs.twimg.com/profile_images/885868801232961537/b1F6H4KC_400x400.jpg" alt="">
+                <img class="w-10 h-10 rounded-full mr-4" src="https://pbs.twimg.com/profile_images/885868801232961537/b1F6H4KC_400x400.jpg" alt="">
                 <div class="text-sm">
                     <p class="text-slate-darker leading-none">Jonathan Reinink</p>
                     <p class="text-slate-light">Aug 18</p>
diff --git a/docs/source/docs/opacity.blade.md b/docs/source/docs/opacity.blade.md
index 60257f4da..734c87e7b 100644
--- a/docs/source/docs/opacity.blade.md
+++ b/docs/source/docs/opacity.blade.md
@@ -79,27 +79,27 @@ For more information about Tailwind's responsive design features, check out the
 @component('_partials.responsive-code-sample')
 @slot('none')
 <div class="text-center">
-    <div class="px-4 py-2 bg-smoke opacity-100 w-24 h-24 rounded-pill inline-block"></div>
+    <div class="px-4 py-2 bg-smoke opacity-100 w-24 h-24 rounded-full inline-block"></div>
 </div>
 @endslot
 @slot('sm')
 <div class="text-center">
-    <div class="px-4 py-2 bg-smoke opacity-75 w-24 h-24 rounded-pill inline-block"></div>
+    <div class="px-4 py-2 bg-smoke opacity-75 w-24 h-24 rounded-full inline-block"></div>
 </div>
 @endslot
 @slot('md')
 <div class="text-center">
-    <div class="px-4 py-2 bg-smoke opacity-50 w-24 h-24 rounded-pill inline-block"></div>
+    <div class="px-4 py-2 bg-smoke opacity-50 w-24 h-24 rounded-full inline-block"></div>
 </div>
 @endslot
 @slot('lg')
 <div class="text-center">
-    <div class="px-4 py-2 bg-smoke opacity-25 w-24 h-24 rounded-pill inline-block"></div>
+    <div class="px-4 py-2 bg-smoke opacity-25 w-24 h-24 rounded-full inline-block"></div>
 </div>
 @endslot
 @slot('xl')
 <div class="text-center">
-    <div class="px-4 py-2 bg-smoke opacity-0 w-24 h-24 rounded-pill inline-block"></div>
+    <div class="px-4 py-2 bg-smoke opacity-0 w-24 h-24 rounded-full inline-block"></div>
 </div>
 @endslot
 @slot('code')
diff --git a/docs/source/docs/positioning.blade.md b/docs/source/docs/positioning.blade.md
index de1d6970c..5ee3bd9a3 100644
--- a/docs/source/docs/positioning.blade.md
+++ b/docs/source/docs/positioning.blade.md
@@ -212,9 +212,9 @@ Offsets are calculated relative to the viewport and the element *will* act as a
 <div class="rounded-b overflow-hidden max-w-md mx-auto mt-4 mb-4">
   <div class="rounded-t border-t border-l border-r border-smoke bg-smoke-light flex px-4 py-3">
     <div class="mr-6">
-      <span class="inline-block rounded-pill bg-smoke-dark h-3 w-3 mr-1"></span>
-      <span class="inline-block rounded-pill bg-smoke-dark h-3 w-3 mr-1"></span>
-      <span class="inline-block rounded-pill bg-smoke-dark h-3 w-3"></span>
+      <span class="inline-block rounded-full bg-smoke-dark h-3 w-3 mr-1"></span>
+      <span class="inline-block rounded-full bg-smoke-dark h-3 w-3 mr-1"></span>
+      <span class="inline-block rounded-full bg-smoke-dark h-3 w-3"></span>
     </div>
     <div class="flex-1 bg-white border border-smoke rounded mr-4"></div>
   </div>
diff --git a/docs/source/docs/shadows.blade.md b/docs/source/docs/shadows.blade.md
index 75dce030d..e8e191bc0 100644
--- a/docs/source/docs/shadows.blade.md
+++ b/docs/source/docs/shadows.blade.md
@@ -110,27 +110,27 @@ For more information about Tailwind's responsive design features, check out the
 @component('_partials.responsive-code-sample')
 @slot('none')
 <div class="flex justify-center">
-    <div class="shadow px-4 py-2 bg-smoke-lighter opacity-100 w-24 h-24 rounded-pill"></div>
+    <div class="shadow px-4 py-2 bg-smoke-lighter opacity-100 w-24 h-24 rounded-full"></div>
 </div>
 @endslot
 @slot('sm')
 <div class="flex justify-center">
-    <div class="shadow-md px-4 py-2 bg-smoke-lighter opacity-100 w-24 h-24 rounded-pill"></div>
+    <div class="shadow-md px-4 py-2 bg-smoke-lighter opacity-100 w-24 h-24 rounded-full"></div>
 </div>
 @endslot
 @slot('md')
 <div class="flex justify-center">
-    <div class="shadow-lg px-4 py-2 bg-smoke-lighter opacity-100 w-24 h-24 rounded-pill"></div>
+    <div class="shadow-lg px-4 py-2 bg-smoke-lighter opacity-100 w-24 h-24 rounded-full"></div>
 </div>
 @endslot
 @slot('lg')
 <div class="flex justify-center">
-    <div class="shadow-inner px-4 py-2 bg-smoke-lighter opacity-100 w-24 h-24 rounded-pill"></div>
+    <div class="shadow-inner px-4 py-2 bg-smoke-lighter opacity-100 w-24 h-24 rounded-full"></div>
 </div>
 @endslot
 @slot('xl')
 <div class="flex justify-center">
-    <div class="shadow-none px-4 py-2 bg-smoke-lighter opacity-100 w-24 h-24 rounded-pill"></div>
+    <div class="shadow-none px-4 py-2 bg-smoke-lighter opacity-100 w-24 h-24 rounded-full"></div>
 </div>
 @endslot
 @slot('code')
diff --git a/docs/source/docs/visibility.blade.md b/docs/source/docs/visibility.blade.md
index 8356dc6b9..98861053c 100644
--- a/docs/source/docs/visibility.blade.md
+++ b/docs/source/docs/visibility.blade.md
@@ -52,7 +52,7 @@ title: "Visibility"
 Use `.visible` to make an element visible. This will typically be used as a reset when using the `.invisible` utility.
 
 @component('_partials.code-sample', ['class' => 'flex justify-center'])
-<div class="visible bg-smoke w-24 h-24 rounded-pill"></div>
+<div class="visible bg-smoke w-24 h-24 rounded-full"></div>
 @endcomponent
 
 ### Invisible
@@ -60,7 +60,7 @@ Use `.visible` to make an element visible. This will typically be used as a rese
 Use `.invisible` to hide an element, but still maintain it's space.
 
 @component('_partials.code-sample', ['class' => 'flex justify-center'])
-<div class="invisible bg-smoke w-24 h-24 rounded-pill"></div>
+<div class="invisible bg-smoke w-24 h-24 rounded-full"></div>
 @endcomponent
 
 
@@ -73,27 +73,27 @@ For more information about Tailwind's responsive design features, check out the
 @component('_partials.responsive-code-sample')
 @slot('none')
 <div class="flex justify-center">
-    <div class="visible bg-smoke w-24 h-24 rounded-pill"></div>
+    <div class="visible bg-smoke w-24 h-24 rounded-full"></div>
 </div>
 @endslot
 @slot('sm')
 <div class="flex justify-center">
-    <div class="invisible bg-smoke w-24 h-24 rounded-pill"></div>
+    <div class="invisible bg-smoke w-24 h-24 rounded-full"></div>
 </div>
 @endslot
 @slot('md')
 <div class="flex justify-center">
-    <div class="visible bg-smoke w-24 h-24 rounded-pill"></div>
+    <div class="visible bg-smoke w-24 h-24 rounded-full"></div>
 </div>
 @endslot
 @slot('lg')
 <div class="flex justify-center">
-    <div class="invisible bg-smoke w-24 h-24 rounded-pill"></div>
+    <div class="invisible bg-smoke w-24 h-24 rounded-full"></div>
 </div>
 @endslot
 @slot('xl')
 <div class="flex justify-center">
-    <div class="visible bg-smoke w-24 h-24 rounded-pill"></div>
+    <div class="visible bg-smoke w-24 h-24 rounded-full"></div>
 </div>
 @endslot
 @slot('code')