more minor styling changes to booking

pull/427/head
Peer Richelsen 2021-08-08 17:46:21 +02:00
parent 425055fd36
commit d32d8ea4c3
2 changed files with 7 additions and 5 deletions

View File

@ -166,8 +166,10 @@ const DatePicker = ({
return selectedMonth ? (
<div
className={
"mt-8 sm:mt-0 " +
(selectedDate ? "sm:w-1/3 sm:border-r sm:dark:border-black sm:px-4" : "sm:w-1/2 sm:pl-4")
"mt-8 sm:mt-0 min-w-[350px] " +
(selectedDate
? "w-full sm:w-1/2 md:w-1/3 sm:border-r sm:dark:border-black sm:pl-4 sm:pr-6"
: "sm:w-1/2 sm:pl-4")
}>
<div className="flex text-gray-600 font-light text-xl mb-4 ml-2">
<span className="w-1/2 text-gray-600 dark:text-white">
@ -191,7 +193,7 @@ const DatePicker = ({
</button>
</div>
</div>
<div className="grid grid-cols-7 gap-y-4 text-center">
<div className="grid grid-cols-7 gap-4 text-center">
{["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
.sort((a, b) => (weekStart.startsWith(a) ? -1 : weekStart.startsWith(b) ? 1 : 0))
.map((weekDay) => (

View File

@ -129,7 +129,7 @@ export default function Type(props): Type {
<main
className={
"mx-auto my-0 sm:my-24 transition-max-width ease-in-out duration-500 " +
(selectedDate ? "max-w-6xl" : "max-w-3xl")
(selectedDate ? "max-w-5xl" : "max-w-3xl")
}>
<div className="dark:bg-neutral-900 bg-white border border-gray-200 rounded-sm dark:border-0">
<div className="sm:flex px-4 py-5 sm:p-4">
@ -148,7 +148,7 @@ export default function Type(props): Type {
</p>
<Collapsible.Root open={isTimeOptionsOpen} onOpenChange={setIsTimeOptionsOpen}>
<Collapsible.Trigger className="text-gray-500 mb-1 px-2 py-1 -ml-2">
<Collapsible.Trigger className="text-gray-500 mb-1 px-2 py-1 -ml-2 text-left min-w-32 ">
<GlobeIcon className="inline-block w-4 h-4 mr-1 -mt-1" />
{timeZone()}
{isTimeOptionsOpen ? (