mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-05-23 22:25:05 +00:00
bbb043c9cc
## Summary <!-- One sentence describing what changed and why. --> Polish and fix UI for new website ## Changes - **What**: <!-- Core functionality added/modified --> - [x] update about video - [x] update Moment factory story content - [x] update homepage visual - [x] update customer story visual - [x] put images and videos to bucket ## Review Focus <!-- Critical design decisions or edge cases that need attention --> <!-- If this PR fixes an issue, uncomment and update the line below --> <!-- Fixes #ISSUE_NUMBER --> ## Screenshots (if applicable) <!-- Add screenshots or video recording to help explain your changes --> ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-11363-feat-website-Polish-and-fix-UI-3466d73d365081f895aff84b594450c9) by [Unito](https://www.unito.io) --------- Co-authored-by: DrJKL <DrJKL0424@gmail.com> Co-authored-by: Amp <amp@ampcode.com> Co-authored-by: GitHub Action <action@github.com> Co-authored-by: Alexander Brown <drjkl@comfy.org> Co-authored-by: github-actions <github-actions@github.com>
45 lines
1.1 KiB
Vue
45 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
import type { Locale } from '../../i18n/translations'
|
|
|
|
import { t } from '../../i18n/translations'
|
|
import NodeBadge from '../common/NodeBadge.vue'
|
|
|
|
const { locale = 'en' } = defineProps<{ locale?: Locale }>()
|
|
|
|
const row1 = [{ text: t('buildWhat.row1', locale) }]
|
|
const row2 = [
|
|
{ text: t('buildWhat.row2a', locale) },
|
|
{ text: t('buildWhat.row2b', locale) }
|
|
]
|
|
</script>
|
|
|
|
<template>
|
|
<section
|
|
class="bg-primary-comfy-ink flex flex-col items-center px-4 py-24 lg:px-6 lg:py-32"
|
|
>
|
|
<!-- Node rows -->
|
|
<div
|
|
class="font-formula-narrow relative flex flex-col items-center font-semibold"
|
|
>
|
|
<NodeBadge :segments="row1" />
|
|
|
|
<!-- Vertical connector -->
|
|
<img
|
|
src="/icons/node-link.svg"
|
|
alt=""
|
|
class="-my-3 scale-30 rotate-90 transition-all duration-300 sm:-my-2.5 sm:scale-50 lg:-my-1.75 lg:scale-100"
|
|
aria-hidden="true"
|
|
/>
|
|
|
|
<NodeBadge :segments="row2" />
|
|
</div>
|
|
|
|
<!-- Subtitle -->
|
|
<p
|
|
class="text-primary-comfy-canvas mt-24 max-w-2xl text-center text-xl lg:text-sm"
|
|
>
|
|
{{ t('buildWhat.subtitle', locale) }}
|
|
</p>
|
|
</section>
|
|
</template>
|