github-featured/triggerdotdev--trigger.dev
2
0
Fork 0
Code Issues Pull Requests Deployments Models Agent Notes Packages Projects Releases Wiki Activity

Moved the integration icons to the bottom

Browse Source
This commit is contained in:
D-K-P
2023-02-14 14:43:21 +00:00
parent 805f675264
commit f0a05ab4e3
2 changed files with 22 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/webapp/app/components/templates/TemplateOverview.tsx
+12 -12
View File
@@ -32,24 +32,24 @@ export function TemplateOverview({ template }: { template: TemplateListItem }) {
</div>
</div>
<div className="sticky top-[220px] ml-2 flex h-max w-[240px] min-w-[240px] flex-col rounded-r px-4">
<div className="flex flex-row gap-x-1">
{template.services.map((service) => (
<div key={service.slug} className="">
<ApiLogoIcon
integration={service}
size="regular"
className="flex h-8 w-8 mb-3 items-center justify-center rounded border-[1px] border-slate-700 bg-slate-900 transition group-hover:border-slate-600 group-hover:bg-slate-900/80"
/>
</div>
))}
</div>
<div className="flex flex-col gap-y-3 ">
<Header2 size="regular" className="font-semibold">
{title}
</Header2>
<Body>{description}</Body>
<div className="flex flex-row gap-x-1">
{template.services.map((service) => (
<div key={service.slug} className="">
<ApiLogoIcon
integration={service}
size="regular"
className="flex h-8 w-8 items-center justify-center rounded border-[1px] border-slate-700 bg-slate-900 transition group-hover:border-slate-600 group-hover:bg-slate-900/80"
/>
</div>
))}
</div>
<TertiaryA href={repositoryUrl} target="_blank">
<OctoKitty className="h-4 w-4" />
<Body size="extra-small" className="truncate font-mono">
apps/webapp/app/components/templates/TemplatesGrid.tsx
+10 -11
View File
@@ -42,7 +42,7 @@ export function TemplatesGrid({
key={template.title}
type="button"
onClick={(e) => setOpenedTemplate(template)}
className="group w-full flex flex-col h-full overflow-hidden rounded-md border border-slate-700 bg-slate-800 text-left text-sm text-slate-200 shadow-md transition hover:cursor-pointer hover:border-slate-500 hover:bg-slate-700/30 disabled:opacity-50"
className="group flex h-full w-full flex-col overflow-hidden rounded-md border border-slate-700 bg-slate-800 text-left text-sm text-slate-200 shadow-md transition hover:cursor-pointer hover:border-slate-500 hover:bg-slate-700/30 disabled:opacity-50"
>
<div className="h-24 w-full bg-slate-600 transition group-hover:opacity-90">
<img
@@ -52,26 +52,25 @@ export function TemplatesGrid({
/>
</div>
<div className="flex flex-col p-4">
<div className="flex flex-col gap-y-2 ">
<Header1 size="small" className="font-semibold">
{template.title}
</Header1>
<Body size="small" className="text-slate-400">
{template.description}
</Body>
</div>
<div className="flex flex-row gap-x-1">
{template.services.map((service) => (
<div key={service.slug} className="">
<ApiLogoIcon
integration={service}
size="regular"
className="flex mb-2 h-8 w-8 items-center justify-center rounded border-[1px] border-slate-700 bg-slate-900 transition group-hover:border-slate-600 group-hover:bg-slate-900/80"
className="mt-2 flex h-8 w-8 items-center justify-center rounded border-[1px] border-slate-700 bg-slate-900 transition group-hover:border-slate-600 group-hover:bg-slate-900/80"
/>
</div>
))}
</div>
<div className="flex flex-col gap-y-2 ">
<Header1 size="small" className="font-semibold">
{template.title}
</Header1>
<Body size="small" className="text-slate-400">
{template.description}
</Body>
</div>
</div>
</button>
);