ssmusoke
/ showbreakpoints.blade.php
Last active
December 13, 2020 20:33
— forked from adamhopkinson/showbreakpoints.blade.php
Small TailwindCss component to show which breakpoint is active based on the debug mode
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @if (config('app.debug')) | |
| <div class="flex space-x-2 mb-4 rounded border text-center text-sm font-bold"> | |
| <div class="flex-1 p-2"><span class="text-green-700 mr-1 xs:inline-block sm:hidden">✓</span><span class="text-red-700 mr-1 hidden sm:inline-block">✗</span><br>XS</div> | |
| <div class="flex-1 p-2"><span class="text-green-700 mr-1 hidden sm:inline-block md:hidden">✓</span><span class="text-red-700 mr-1 inline-block sm:hidden md:inline-block">✗</span><br>SM</div> | |
| <div class="flex-1 p-2"><span class="text-green-700 mr-1 hidden md:inline-block lg:hidden">✓</span><span class="text-red-700 mr-1 inline-block md:hidden lg:inline-block">✗</span><br>MD</div> | |
| <div class="flex-1 p-2"><span class="text-green-700 mr-1 hidden lg:inline-block xl:hidden">✓</span><span class="text-red-700 mr-1 inline-block lg:hidden xl:inline-block">✗</span><br>LG</div> | |
| <div class="flex-1 p-2"><span class="text-green-700 mr-1 hidden xl:inline-block 2xl:hidden">✓</span><span |