daniel543x/artcraft
1
0 Fork 0
mirror of https://github.com/storytold/artcraft.git synced 2026-11-14 13:52:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #276 from storytold/bflat-fy-landing-add-faceanimation

Browse Source 
face animation on landing
This commit is contained in:
Brandon Thomas authored and GitHub committed 2023-09-22 09:40:58 -04:00
2 parents e550cc9e7f 3a5dea5265
commit 85c5d9451c
2 files changed
+49 -14
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/fakeyou.com/src/scss/site-refresh.scss
+12
View File
@@ -689,6 +689,18 @@ styles with important tags:
}
}
.badge-new {
font-weight: 600;
font-size: 12px;
padding: 2px 6px;
border: none;
border-radius: 0.3rem;
opacity: 0.85;
max-height: 18px;
background-color: #fff3d0;
color: #833c00;
}
.rounded-circle {
border-radius: 50px;
}
packages/fakeyou.com/src/v2/view/pages/landing/LandingPage.tsx
+37 -14
View File
@@ -2,7 +2,7 @@ import React, { useMemo } from "react";
import { Link } from "react-router-dom";
import { SessionWrapper } from "@storyteller/components/src/session/SessionWrapper";
import { SessionSubscriptionsWrapper } from "@storyteller/components/src/session/SessionSubscriptionsWrapper";
import { useLocalize } from 'hooks';
import { useLocalize } from "hooks";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import {
faStar,
@@ -11,7 +11,7 @@ import {
} from "@fortawesome/free-solid-svg-icons";
import { faDiscord, faTwitter } from "@fortawesome/free-brands-svg-icons";
import { WebUrl } from "../../../../common/WebUrl";
import { faFileArrowUp } from "@fortawesome/pro-solid-svg-icons";
import { faFileArrowUp, faSparkles } from "@fortawesome/pro-solid-svg-icons";
import { PosthogClient } from "@storyteller/components/src/analytics/PosthogClient";
// import {
// faFileArrowUp,
@@ -171,11 +171,10 @@ function LandingPage(props: Props) {
</div>
<div className="col-12 col-lg-7 d-flex flex-column justify-content-center flex-reverse px-md-5 px-lg-3">
<h1 className="fw-bold display-5 text-center text-lg-start px-md-5 px-lg-0">
{t2('hero.top')}
{t2("hero.top")}
</h1>
<p className="lead opacity-75 pb-4 text-center text-lg-start px-md-5 px-lg-0 pe-lg-5">
{t2('hero.bottom')}
{t2("hero.bottom")}
</p>
<div className="d-flex flex-column flex-md-row gap-3 mt-3 mb-4 w-100 justify-content-center justify-content-lg-start">
{upgradeButton}
@@ -251,14 +250,14 @@ function LandingPage(props: Props) {
to="/tts"
className="panel panel-select d-flex flex-column align-items-center"
>
<div className="d-flex px-4 pt-4 align-items-center w-100">
<div className="d-flex px-4 pt-4 align-items-start w-100">
<div className="flex-grow-1">
<h3 className="fw-bold text-white mb-1">Text to Speech</h3>
<h6 className="fw-normal opacity-75 text-white">
Generate audio from text
</h6>
</div>
<Link to="/tts" className="btn btn-square">
<Link to="/tts" className="btn btn-square mt-1">
<FontAwesomeIcon icon={faArrowRight} />
</Link>
</div>
@@ -275,14 +274,14 @@ function LandingPage(props: Props) {
to="/voice-conversion"
className="panel panel-select d-flex flex-column align-items-center"
>
<div className="d-flex px-4 pt-4 align-items-center w-100">
<div className="d-flex px-4 pt-4 align-items-start w-100">
<div className="flex-grow-1">
<h3 className="fw-bold text-white mb-1">Voice to Voice</h3>
<h6 className="fw-normal opacity-75 text-white">
Speak as someone else
</h6>
</div>
<Link to="/voice-conversion" className="btn btn-square">
<Link to="/voice-conversion" className="btn btn-square mt-1">
<FontAwesomeIcon icon={faArrowRight} />
</Link>
</div>
@@ -296,17 +295,23 @@ function LandingPage(props: Props) {
</div>
<div className="col-12 col-md-4">
<Link
to="/video"
to="/face-animation"
className="panel panel-select d-flex flex-column align-items-center"
>
<div className="d-flex px-4 pt-4 align-items-center w-100">
<div className="d-flex px-4 pt-4 align-items-start w-100">
<div className="flex-grow-1">
<h3 className="fw-bold text-white mb-1">Video Lip Sync</h3>
<h4 className="fw-bold text-white mb-1 d-flex align-items-center text-nowrap">
<span className="badge-new mt-0 me-2">
<FontAwesomeIcon icon={faSparkles} className="me-1" />
NEW
</span>
Face Animation
</h4>
<h6 className="fw-normal opacity-75 text-white">
Lip sync video to audio
Create videos from audio
</h6>
</div>
<Link to="/video" className="btn btn-square">
<Link to="/face-animation" className="btn btn-square mt-1">
<FontAwesomeIcon icon={faArrowRight} />
</Link>
</div>
@@ -318,6 +323,24 @@ function LandingPage(props: Props) {
/>
</Link>
</div>
<div className="col-12 col-md-4">
<Link
to="/video"
className="panel panel-select d-flex flex-column align-items-center h-auto pb-4"
>
<div className="d-flex px-4 pt-4 align-items-center w-100">
<div className="flex-grow-1">
<h3 className="fw-bold text-white mb-1">Video Lip Sync</h3>
<h6 className="fw-normal opacity-75 text-white mb-0">
Lip sync video to audio
</h6>
</div>
<Link to="/video" className="btn btn-square mt-1">
<FontAwesomeIcon icon={faArrowRight} />
</Link>
</div>
</Link>
</div>
<img
src="/images/landing/bg-dots.webp"
alt="background dots"