diff --git a/resources/css/blocks/client-satisfaction.css b/resources/css/blocks/client-satisfaction.css index a1259c1..22735ef 100644 --- a/resources/css/blocks/client-satisfaction.css +++ b/resources/css/blocks/client-satisfaction.css @@ -1,5 +1,5 @@ #client-satisfaction { - @apply border border-neutral-300 rounded-2xl px-2 py-8 md:p-8 my-8; + @apply border border-neutral-300 rounded-2xl px-4 py-8 md:p-8 my-8; h2 { @apply !text-3xl !font-bold !text-neutral-900 !mb-8; @@ -14,7 +14,7 @@ @apply py-0; } .gform_confirmation_message { - @apply flex gap-12 justify-center text-left !bg-white p-0; + @apply flex flex-col md:flex-row gap-12 justify-center text-left !bg-white p-0; h3 { @apply p-0 m-0 text-neutral-900 text-xl font-bold; } diff --git a/resources/css/components/forms/field-classic-rating.css b/resources/css/components/forms/field-classic-rating.css index a161f3a..eecdb3c 100644 --- a/resources/css/components/forms/field-classic-rating.css +++ b/resources/css/components/forms/field-classic-rating.css @@ -3,10 +3,19 @@ @apply pb-6 !text-2xl text-center; } .gfield_radio { - @apply flex justify-between max-w-lg text-center mx-auto; + @apply grid grid-cols-2 sm:flex justify-between max-w-lg text-center mx-auto; + @media screen and (max-width: 400px) { + grid-template-columns: auto auto; + width: fit-content; + column-gap: 1rem; + } .gchoice { @apply flex flex-col justify-center items-center; + &:last-child { + grid-column: auto / span 2; + } + label.gform-field-label { @apply !ml-0 mt-3 !font-normal; }