Update colors in backgrounds and buttons docs

This commit is contained in:
Adam Wathan 2017-08-18 13:25:09 -04:00
parent 0b71c16d21
commit d1ac4322c9
2 changed files with 26 additions and 26 deletions

View file

@ -46,14 +46,6 @@ title: "Backgrounds"
<td class="w-24 h-12 bg-orange-light border-b border-dark-overlay-softer"></td>
<td class="border-b border-dark-overlay-softer py-3 px-6" style="vertical-align: middle;"><code>.bg-orange-light</code></td>
</tr>
<tr>
<td class="w-24 h-12 bg-amber border-b border-dark-overlay-softer"></td>
<td class="border-b border-dark-overlay-softer py-3 px-6" style="vertical-align: middle;"><code>.bg-amber</code></td>
</tr>
<tr>
<td class="w-24 h-12 bg-amber-light border-b border-dark-overlay-softer"></td>
<td class="border-b border-dark-overlay-softer py-3 px-6" style="vertical-align: middle;"><code>.bg-amber-light</code></td>
</tr>
<tr>
<td class="w-24 h-12 bg-yellow border-b border-dark-overlay-softer"></td>
<td class="border-b border-dark-overlay-softer py-3 px-6" style="vertical-align: middle;"><code>.bg-yellow</code></td>

View file

@ -17,7 +17,7 @@ title: "Buttons"
</button>
</div>
<div class="mb-4">
<button class="text-medium text-light rounded py-2 px-4 bg-dark mr-4">
<button class="text-medium text-light rounded py-2 px-4 bg-dark hover-bg-dark-dark mr-4">
Save
</button>
<button class="text-medium text-light rounded py-2 px-4 bg-dark-soft mr-4">
@ -28,66 +28,74 @@ title: "Buttons"
</button>
</div>
<div class="mb-4">
<button class="text-medium text-light rounded py-2 px-4 bg-red mr-4">
<button class="text-medium text-light rounded py-2 px-4 bg-red hover-bg-red-dark mr-4">
Save
</button>
<button class="text-medium text-light rounded py-2 px-4 bg-red-light mr-4">
Save
Disabled
</button>
</div>
<div class="mb-4">
<button class="text-medium text-light rounded py-2 px-4 bg-amber mr-4">
<button class="text-medium text-light rounded py-2 px-4 bg-orange hover-bg-orange-dark mr-4">
Save
</button>
<button class="text-medium text-light rounded py-2 px-4 bg-amber-light mr-4">
Save
<button class="text-medium text-light rounded py-2 px-4 bg-orange-light mr-4">
Disabled
</button>
</div>
<div class="mb-4">
<button class="text-medium text-light rounded py-2 px-4 bg-green mr-4">
<button class="text-medium text-light rounded py-2 px-4 bg-yellow hover-bg-yellow-dark mr-4">
Save
</button>
<button class="text-medium text-light rounded py-2 px-4 bg-yellow-light mr-4">
Disabled
</button>
</div>
<div class="mb-4">
<button class="text-medium text-light rounded py-2 px-4 bg-green hover-bg-green-dark mr-4">
Save
</button>
<button class="text-medium text-light rounded py-2 px-4 bg-green-light mr-4">
Save
Disabled
</button>
</div>
<div class="mb-4">
<button class="text-medium text-light rounded py-2 px-4 bg-teal mr-4">
<button class="text-medium text-light rounded py-2 px-4 bg-teal hover-bg-teal-dark mr-4">
Save
</button>
<button class="text-medium text-light rounded py-2 px-4 bg-teal-light mr-4">
Save
Disabled
</button>
</div>
<div class="mb-4">
<button class="text-medium text-light rounded py-2 px-4 bg-blue mr-4">
<button class="text-medium text-light rounded py-2 px-4 bg-blue hover-bg-blue-dark mr-4">
Save
</button>
<button class="text-medium text-light rounded py-2 px-4 bg-blue-light mr-4">
Save
Disabled
</button>
</div>
<div class="mb-4">
<button class="text-medium text-light rounded py-2 px-4 bg-indigo mr-4">
<button class="text-medium text-light rounded py-2 px-4 bg-indigo hover-bg-indigo-dark mr-4">
Save
</button>
<button class="text-medium text-light rounded py-2 px-4 bg-indigo-light mr-4">
Save
Disabled
</button>
</div>
<div class="mb-4">
<button class="text-medium text-light rounded py-2 px-4 bg-purple mr-4">
<button class="text-medium text-light rounded py-2 px-4 bg-purple hover-bg-purple-dark mr-4">
Save
</button>
<button class="text-medium text-light rounded py-2 px-4 bg-purple-light mr-4">
Save
Disabled
</button>
</div>
<div class="mb-4">
<button class="text-medium text-light rounded py-2 px-4 bg-pink mr-4">
<button class="text-medium text-light rounded py-2 px-4 bg-pink hover-bg-pink-dark mr-4">
Save
</button>
<button class="text-medium text-light rounded py-2 px-4 bg-pink-light mr-4">
Save
Disabled
</button>
</div>