Task 8 - Add responsive tweaks
Add a mobile navigation button, change text sizes, change the layout of the sponsors block.
This commit is contained in:
parent
5f6f7bdb4a
commit
204a5f931b
3 changed files with 20 additions and 14 deletions
|
|
@ -13,14 +13,14 @@
|
|||
<div class="mt-6">
|
||||
<ul class="flex flex-wrap justify-center mx-auto -mt-2 -ml-2">
|
||||
{% for sponsor in sponsors.findByType(type) %}
|
||||
<li class="mt-2 ml-2">
|
||||
<a class="flex flex-col items-center justify-center w-64 h-48 p-4 bg-gray-light" href="#0">
|
||||
<span class="flex items-center h-full">
|
||||
<img class="block w-4/5 max-h-full mx-auto" src="{{ sponsor.logo_url }}" alt="">
|
||||
</span>
|
||||
<p class="sr-only">{{ sponsor.name }}</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="w-full mt-2 ml-2 sm:w-auto">
|
||||
<a class="flex flex-col items-center justify-center p-4 sm:w-64 sm:h-48 sm:bg-gray-light" href="#0">
|
||||
<span class="flex items-center h-full">
|
||||
<img class="block w-4/5 max-h-full mx-auto" src="{{ sponsor.logo_url }}" alt="">
|
||||
</span>
|
||||
<p class="sr-only">{{ sponsor.name }}</p>
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue