@@ -35,14 +35,14 @@ description: An inventory of shaders for Flutter developers to explore.
3535 </head >
3636
3737 <body class =" bg-[#27b6d6]"
38- <header class =" py-[128px] flex flex-col justify-center items-center bg-[#FFFFFF] text-[#444444]"
39- <div class =" max-w-[800px] flex flex-row items-center"
40- <div class =" flex-1"
38+ <header class =" pt-[64px] pb-[128px] md: py-[128px] flex flex-col justify-center items-center bg-[#FFFFFF] text-[#444444]"
39+ <div class =" max-w-[800px] block md: flex md: flex-row items-center"
40+ <div class =" md: flex-1 pl-[64px] pr-[64px] pb-[48px] md:pb-0 "
4141 <h1 class =" mb-[8px] text-5xl font-bold uppercase" h1 >
4242 <p class =" mb-[24px] text-3xl text-[#27b6d6] font-bold" p >
4343 <img src =" /images/platform-icons.png" class =" max-w-[275px]"
4444 </div >
45- <div class =" ml-[48px] w-[250px] h-[250px]"
45+ <div class =" mx-[auto] md: ml-[48px] w-[250px] h-[250px]"
4646 <img src =" {{ featured_shader_screenshot }}" class =" w-full rounded-xl"
4747 </div >
4848 </div >
@@ -51,13 +51,13 @@ description: An inventory of shaders for Flutter developers to explore.
5151 </header >
5252 <main class =" py-[96px] text-[#FFFFFFAA]"
5353 <div class =" max-w-[800px] ml-[auto] mr-[auto] mb-[128px]"
54- <div class =" grid grid-cols-3 gap-[48px]"
54+ <div class =" grid grid-cols-1 md:grid-cols-2 lg:grid-cols- 3 gap-[48px]"
5555 {% for page in pages .byTag ("shader" ) %}
5656 <a href =" {{ page.data[" url " ] }}" class =" no-underline"
5757 <div class =" p-[8px] border border-[#FFFFFF10] hover:border-[#FFFFFF33] hover:bg-[#FFFFFF04] rounded-lg"
5858 <img
5959 src =" {{ page.data[" directory " ] }}{{ page.data[" shader " ][" screenshot " ] }}"
60- class =" w-full max-w-[250px] rounded-md"
60+ class =" w-full ml-[auto] mr-[auto] max-w-[250px] rounded-md"
6161 >
6262 <p class =" mt-[12px] mb-[12px] text-center" "] ["title"] }}</p >
6363 </div >
0 commit comments