Review responsive layout

This commit is contained in:
Daniele Tonon
2023-11-05 18:33:08 +01:00
parent 59eae28ed3
commit 5a3b36950c
7 changed files with 9 additions and 9 deletions

View File

@@ -16,7 +16,7 @@
class="mx-auto block px-4 sm:flex sm:items-center sm:justify-center sm:px-0"
>
<div
class="flex w-full max-w-screen-2xl justify-between gap-10 overflow-visible px-4 print:w-full sm:w-9/12 lg:gap-48vw"
class="flex w-full max-w-screen-2xl justify-between gap-10 overflow-visible px-4 print:w-full sm:w-11/12 md:w-10/12 lg:w-9/12 lg:gap-48vw"
>
<div
class="relative top-auto flex basis-1/4 items-center self-start sm:sticky sm:top-8 sm:mt-8 sm:items-start"

View File

@@ -14,7 +14,7 @@
<div class="mx-auto px-4 sm:flex sm:items-center sm:justify-center sm:px-0">
<div
class="w-full max-w-screen-2xl justify-between gap-10 overflow-visible print:w-full sm:flex sm:w-9/12 sm:px-4 lg:gap-48vw"
class="w-full max-w-screen-2xl justify-between gap-10 overflow-visible print:w-full sm:flex sm:w-11/12 sm:px-4 md:w-10/12 lg:w-9/12 lg:gap-48vw"
>
<div class="w-full break-words print:w-full">
<header class="mb-4 max-w-full">

View File

@@ -14,7 +14,7 @@
<div class="mx-auto px-4 sm:flex sm:items-center sm:justify-center sm:px-0">
<div
class="w-full max-w-screen-2xl justify-between gap-10 overflow-visible print:w-full sm:flex sm:w-9/12 sm:px-4 lg:gap-48vw"
class="w-full max-w-screen-2xl justify-between gap-10 overflow-visible print:w-full sm:flex sm:w-11/12 sm:px-4 md:w-10/12 lg:w-9/12 lg:gap-48vw"
>
<div class="w-full break-words print:w-full">
<header class="mb-4 max-w-full">

View File

@@ -17,9 +17,9 @@
class="mx-auto block px-4 sm:flex sm:items-center sm:justify-center sm:px-0"
>
<div
class="flex w-full max-w-screen-2xl justify-between gap-10 overflow-visible px-4 print:w-full sm:w-9/12 lg:gap-48vw"
class="flex w-full max-w-screen-2xl justify-between gap-10 overflow-visible px-4 print:w-full sm:w-11/12 md:w-10/12 lg:w-9/12 lg:gap-48vw"
>
<div class="w-full break-words print:w-full sm:w-9/12">
<div class="w-full break-words print:w-full md:w-10/12 lg:w-9/12">
<header class="">
<div class="mb-4 text-2xl">{{.KindDescription}}</div>
</header>

View File

@@ -35,7 +35,7 @@
<div class="mx-auto px-4 sm:flex sm:items-center sm:justify-center sm:px-0">
<div
class="w-full max-w-screen-2xl justify-between gap-10 overflow-visible print:w-full sm:flex sm:w-9/12 sm:px-4 lg:gap-48vw"
class="w-full max-w-screen-2xl justify-between gap-10 overflow-visible print:w-full sm:flex sm:w-11/12 sm:px-4 md:w-10/12 lg:w-9/12 lg:gap-48vw"
>
<header
class="relative top-auto flex basis-1/4 items-center self-start sm:sticky sm:top-8 sm:mt-8 sm:block sm:items-start"

View File

@@ -32,7 +32,7 @@
<div class="mx-auto px-4 sm:flex sm:items-center sm:justify-center sm:px-0">
<div
class="w-full max-w-screen-2xl justify-between gap-10 overflow-visible px-4 print:w-full sm:flex sm:w-9/12 lg:gap-48vw"
class="w-full max-w-screen-2xl justify-between gap-10 overflow-visible px-4 print:w-full sm:flex md:w-10/12 lg:w-9/12 lg:gap-48vw"
>
<div
class="relative top-auto flex basis-1/4 items-center self-start sm:sticky sm:top-8 sm:mt-8 sm:items-start"

View File

@@ -1,7 +1,7 @@
<header class="items-center p-4 text-sm print:block sm:flex sm:text-base">
<header class="items-center p-4 pb-6 text-sm print:block sm:flex sm:text-base">
<a
href="https://nostr.com"
class="text-md basis-1/6 text-right print:hidden"
class="text-md text-right text-sm print:hidden md:basis-1/6"
target="_blank"
>What is <span class="text-strongpink">Nostr</span>?</a
>