wrapper/tailwindcss
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Update shadows documentation

Browse source
This commit is contained in:
Adam Wathan 2017-10-17 14:58:53 -04:00
parent 3be4648d41
commit ea433a69ee
3 changed files with 26 additions and 69 deletions
Download patch file Download diff file Expand all files Collapse all files

23
docs/source/styles/shadows.md → docs/source/styles/shadows.blade.md
View file

@ -15,26 +15,23 @@ title: "Shadows"
Box shadows can be applied using the shadow utilities. By default these are a linear scale, where the lower values represent smaller (shallow) shadows, and higher values represent bigger (deeper) shadows.
<div class="flex text-sm my-6">
<div class="mr-3 p-4 shadow-inner">.shadow-inner</div>
<div class="mr-3 p-4 shadow-1">.shadow-1</div>
<div class="mr-3 p-4 shadow-2">.shadow-2</div>
<div class="mr-3 p-4 shadow-3">.shadow-3</div>
<div class="mr-3 p-4 shadow-4">.shadow-4</div>
<div class="mr-3 p-4 shadow-5">.shadow-5</div>
@component('_partials.code-sample', ['lang' => 'html'])
<div class="flex justify-around text-sm my-6">
<div class="mr-3 p-4 bg-smoke-lighter shadow-inner">.shadow-inner</div>
<div class="mr-3 p-4 shadow">.shadow</div>
<div class="mr-3 p-4 shadow-md">.shadow-md</div>
<div class="mr-3 p-4 shadow-lg">.shadow-lg</div>
</div>
<div>
</div>
```html
@slot('code')
<div class="shadow-inner"></div>
<div class="shadow-1"></div>
<div class="shadow"></div>
<div class="shadow-2"></div>
<div class="shadow-3"></div>
<div class="shadow-4"></div>
<div class="shadow-5"></div>
```
@endslot
@endcomponent
## Responsive