public-offering
/
cal.pub0.org
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: text overflow (#5080) 

Co-authored-by: Alan <alannnc@gmail.com>
pull/5080/merge
Udit Takkar 2022-10-19 05:01:41 +05:30 committed by GitHub
parent 759a89bb0c
commit 79c491986a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 24 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
apps/web/components/booking/AvailableEventLocations.tsx
View File

@ -5,29 +5,30 @@ import { Props } from "./pages/AvailabilityPage";
export function AvailableEventLocations({ locations }: { locations: Props["eventType"]["locations"] }) { export function AvailableEventLocations({ locations }: { locations: Props["eventType"]["locations"] }) {
return locations.length ? ( return locations.length ? (
<div> <div className="dark:text-darkgray-600 mr-6 flex w-full flex-col space-y-2 break-words text-sm text-gray-600">
<div className="dark:text-darkgray-600 mr-6 flex w-full flex-col space-y-2 break-words text-sm text-gray-600"> {locations.map((location) => {
{locations.map((location) => { const eventLocationType = getEventLocationType(location.type);
const eventLocationType = getEventLocationType(location.type); if (!eventLocationType) {
if (!eventLocationType) { // It's possible that the location app got uninstalled
// It's possible that the location app got uninstalled return null;
return null; }
} return (
return ( <div key={location.type} className="flex flex-row items-center text-sm font-medium">
<div key={location.type} className="flex flex-row items-center text-sm font-medium"> <img
<img src={eventLocationType.iconUrl}
src={eventLocationType.iconUrl} className={classNames(
className={classNames( "mr-[10px] ml-[2px] h-4 w-4 opacity-70 dark:opacity-100 ",
"mr-[10px] ml-[2px] h-4 w-4 opacity-70 dark:opacity-100 ", !eventLocationType.iconUrl?.includes("api") ? "dark:invert" : ""
!eventLocationType.iconUrl?.includes("api") ? "dark:invert" : "" )}
)} alt={`${eventLocationType.label} icon`}
alt={`${eventLocationType.label} icon`} />
/>
<span key={location.type}>{locationKeyToString(location)} </span> <span className="max-w-full pr-4" key={location.type}>
</div> {locationKeyToString(location)}
); </span>
})} </div>
</div> );
})}
</div> </div>
) : ( ) : (
<></> <></>