|
227 | 227 | ? repo.runtime.split('-')[0]
|
228 | 228 | : undefined}
|
229 | 229 | <Avatar size="xs" alt={repo.name} empty={!iconName}>
|
230 |
| - <SvgIcon name={iconName} iconSize="small" /> |
| 230 | + {#if iconName} |
| 231 | + <SvgIcon name={iconName} iconSize="small" /> |
| 232 | + {/if} |
231 | 233 | </Avatar>
|
232 | 234 | {/if}
|
233 | 235 | <Layout.Stack
|
234 |
| - gap="s" |
235 | 236 | direction="row"
|
236 | 237 | alignItems="center"
|
237 |
| - justifyContent="space-between"> |
238 |
| - <Layout.Stack |
239 |
| - direction="row" |
240 |
| - alignItems="center" |
241 |
| - gap="s" |
242 |
| - style="flex: 1;"> |
243 |
| - {#if action === 'select'} |
244 |
| - <input |
245 |
| - class="is-small u-margin-inline-end-8" |
246 |
| - type="radio" |
247 |
| - name="repositories" |
248 |
| - bind:group={selectedRepository} |
249 |
| - onchange={() => repository.set(repo)} |
250 |
| - value={repo.id} /> |
251 |
| - {/if} |
252 |
| - {#if product === 'sites'} |
253 |
| - {#if repo?.framework && repo.framework !== 'other'} |
254 |
| - <Avatar size="xs" alt={repo.name}> |
255 |
| - <SvgIcon |
256 |
| - name={getFrameworkIcon( |
257 |
| - repo.framework |
258 |
| - )} |
259 |
| - iconSize="small" /> |
260 |
| - </Avatar> |
261 |
| - {:else} |
262 |
| - <Avatar |
263 |
| - size="xs" |
264 |
| - alt={repo.name} |
265 |
| - empty /> |
266 |
| - {/if} |
267 |
| - {:else} |
268 |
| - {@const iconName = repo?.runtime |
269 |
| - ? repo.runtime.split('-')[0] |
270 |
| - : undefined} |
271 |
| - <Avatar |
272 |
| - size="xs" |
273 |
| - alt={repo.name} |
274 |
| - empty={!iconName}> |
275 |
| - {#if iconName} |
276 |
| - <SvgIcon |
277 |
| - name={iconName} |
278 |
| - iconSize="small" /> |
279 |
| - {/if} |
280 |
| - </Avatar> |
281 |
| - {/if} |
282 |
| - <Layout.Stack |
283 |
| - direction="row" |
284 |
| - alignItems="center" |
285 |
| - gap="s" |
286 |
| - style="flex: 1; min-width: 0;"> |
287 |
| - <Typography.Text |
| 238 | + gap="s" |
| 239 | + style="flex: 1; min-width: 0;"> |
| 240 | + <Typography.Text |
| 241 | + truncate |
| 242 | + color="--fgcolor-neutral-secondary" |
| 243 | + style="flex: 1; min-width: 0;"> |
| 244 | + {repo.name} |
| 245 | + </Typography.Text> |
| 246 | + {#if repo.private} |
| 247 | + <Icon |
| 248 | + size="s" |
| 249 | + icon={IconLockClosed} |
| 250 | + color="--fgcolor-neutral-tertiary" /> |
| 251 | + {/if} |
| 252 | + {#if !$isSmallViewport} |
| 253 | + <time datetime={repo.pushedAt}> |
| 254 | + <Typography.Caption |
| 255 | + variant="400" |
288 | 256 | truncate
|
289 |
| - color="--fgcolor-neutral-secondary" |
290 |
| - style="flex: 1; min-width: 0;"> |
291 |
| - {repo.name} |
292 |
| - </Typography.Text> |
293 |
| - {#if repo.private} |
294 |
| - <Icon |
295 |
| - size="s" |
296 |
| - icon={IconLockClosed} |
297 |
| - color="--fgcolor-neutral-tertiary" /> |
298 |
| - {/if} |
299 |
| - {#if !$isSmallViewport} |
300 |
| - <time datetime={repo.pushedAt}> |
301 |
| - <Typography.Caption |
302 |
| - variant="400" |
303 |
| - truncate |
304 |
| - color="--fgcolor-neutral-tertiary"> |
305 |
| - {timeFromNow(repo.pushedAt)} |
306 |
| - </Typography.Caption> |
307 |
| - </time> |
308 |
| - {/if} |
309 |
| - </Layout.Stack> |
310 |
| - {#if action === 'button'} |
311 |
| - <PinkButton.Button |
312 |
| - size="xs" |
313 |
| - variant="secondary" |
314 |
| - style="flex-shrink: 0;" |
315 |
| - on:click={() => connect(repo)}> |
316 |
| - Connect |
317 |
| - </PinkButton.Button> |
318 |
| - gap="s" |
319 |
| - alignItems="center"> |
320 |
| - <Typography.Text |
321 |
| - truncate |
322 |
| - color="--fgcolor-neutral-secondary"> |
323 |
| - {repo.name} |
324 |
| - </Typography.Text> |
325 |
| - {#if repo.private} |
326 |
| - <Icon |
327 |
| - size="s" |
328 |
| - icon={IconLockClosed} |
329 |
| - color="--fgcolor-neutral-tertiary" /> |
330 |
| - {/if} |
331 |
| - {#if !$isSmallViewport} |
332 |
| - <time datetime={repo.pushedAt}> |
333 |
| - <Typography.Caption |
334 |
| - variant="400" |
335 |
| - truncate |
336 |
| - color="--fgcolor-neutral-tertiary"> |
337 |
| - {timeFromNow(repo.pushedAt)} |
338 |
| - </Typography.Caption> |
339 |
| - </time> |
340 |
| - {/if} |
341 |
| - </Layout.Stack> |
342 |
| - {#if action === 'button'} |
343 |
| - <PinkButton.Button |
344 |
| - size="xs" |
345 |
| - variant="secondary" |
346 |
| - on:click={() => connect(repo)}> |
347 |
| - Connect |
348 |
| - </PinkButton.Button> |
| 257 | + color="--fgcolor-neutral-tertiary"> |
| 258 | + {timeFromNow(repo.pushedAt)} |
| 259 | + </Typography.Caption> |
| 260 | + </time> |
349 | 261 | {/if}
|
350 | 262 | </Layout.Stack>
|
| 263 | + {#if action === 'button'} |
| 264 | + <PinkButton.Button |
| 265 | + size="xs" |
| 266 | + variant="secondary" |
| 267 | + style="flex-shrink: 0;" |
| 268 | + on:click={() => connect(repo)}> |
| 269 | + Connect |
| 270 | + </PinkButton.Button> |
| 271 | + {/if} |
351 | 272 | </Layout.Stack>
|
352 | 273 | </Table.Cell>
|
353 | 274 | </Table.Row.Base>
|
|
0 commit comments