feat(desktop): add trending in onboarding
This commit is contained in:
DIYgod
parent
9641438dca
commit
7a8a092c63
|
|
@ -18,6 +18,7 @@ import { DiscoverImport } from "../discover/import"
|
|||
import { ProfileSettingForm } from "../profile/profile-setting-form"
|
||||
import { settingSyncQueue } from "../settings/helper/sync-queue"
|
||||
import { LanguageSelector } from "../settings/tabs/general"
|
||||
import { Trending } from "../trending"
|
||||
import { BehaviorGuide } from "./steps/behavior"
|
||||
|
||||
const containerWidth = 600
|
||||
|
|
@ -92,6 +93,16 @@ export function GuideModalContent({ onClose }: { onClose: () => void }) {
|
|||
content: createElement(DiscoverImport),
|
||||
icon: "i-mgc-file-import-cute-re",
|
||||
},
|
||||
{
|
||||
title: t.app("new_user_guide.step.discover.title"),
|
||||
description: t.app("new_user_guide.step.discover.description"),
|
||||
content: (
|
||||
<div className="overflow-scroll">
|
||||
<Trending center limit={50} />
|
||||
</div>
|
||||
),
|
||||
icon: "i-mgc-emoji-2-cute-re",
|
||||
},
|
||||
{
|
||||
title: t.app("new_user_guide.step.profile.title"),
|
||||
description: t.app("new_user_guide.step.profile.description"),
|
||||
|
|
@ -144,9 +155,9 @@ export function GuideModalContent({ onClose }: { onClose: () => void }) {
|
|||
return (
|
||||
<m.div
|
||||
layout
|
||||
className="bg-theme-background relative flex min-h-full w-full flex-col items-center justify-center overflow-hidden pb-14 sm:min-h-[80%] sm:w-4/5 sm:rounded-xl sm:shadow-xl"
|
||||
className="bg-theme-background center relative flex size-full flex-col items-center justify-center overflow-scroll pb-14 sm:size-4/5 sm:rounded-xl sm:shadow-xl"
|
||||
>
|
||||
<div className="center relative mx-auto w-full">
|
||||
<div className="relative mx-auto flex max-h-full w-full justify-center">
|
||||
<AnimatePresence initial={false} custom={direction} mode="popLayout">
|
||||
<m.div
|
||||
key={step - 1}
|
||||
|
|
@ -159,7 +170,7 @@ export function GuideModalContent({ onClose }: { onClose: () => void }) {
|
|||
x: { type: "spring", stiffness: 300, damping: 30 },
|
||||
opacity: { duration: 0.1 },
|
||||
}}
|
||||
className="min-w-0 px-6 sm:mt-12"
|
||||
className="flex min-w-0 flex-col px-6 sm:mt-12"
|
||||
>
|
||||
{!!title && (
|
||||
<div className="mb-8">
|
||||
|
|
|
|||
|
|
@ -120,7 +120,7 @@ export function Trending({
|
|||
{isLoading ? (
|
||||
<>
|
||||
{Array.from({ length: limit }).map((_, index) => (
|
||||
<Skeleton key={index} className="h-[146px]" />
|
||||
<Skeleton key={index} className="h-[146px] w-[386px]" />
|
||||
))}
|
||||
</>
|
||||
) : (
|
||||
|
|
|
|||
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M10.995 2.044C7.799 2.29 5.173 3.742 3.589 6.14c-.297.449-.774 1.425-.968 1.98-.441 1.259-.657 2.799-.606 4.32.065 1.937.382 3.346 1.068 4.746 1.009 2.059 2.727 3.493 5.089 4.248 2.316.741 5.34.741 7.656 0 3.049-.974 5.023-3.087 5.807-6.214.285-1.133.424-2.873.33-4.11-.205-2.691-1.084-4.761-2.704-6.37-1.99-1.977-4.972-2.95-8.266-2.696m2.485 2.055c2.379.366 4.155 1.433 5.29 3.181.986 1.519 1.399 3.62 1.172 5.961-.326 3.358-1.954 5.476-4.882 6.35-1.825.545-4.295.545-6.12 0-2.832-.846-4.432-2.838-4.859-6.051-.083-.624-.095-2.026-.024-2.7.297-2.799 1.634-4.85 3.883-5.959.93-.458 1.823-.696 3.22-.857.328-.038 1.921.013 2.32.075M8.673 7.063c-.244.075-.523.351-.609.603-.094.277-.094 2.391 0 2.668.124.363.549.666.936.666.237 0 .514-.12.697-.303C9.98 10.414 10 10.303 10 9s-.02-1.414-.303-1.697c-.279-.279-.63-.361-1.024-.24m5.967.006c-.144.05-.315.197-.844.727C13.091 8.501 13 8.639 13 9s.091.499.796 1.206c.606.607.683.671.881.73.27.08.374.08.633.003.378-.112.69-.537.69-.939 0-.244-.119-.505-.343-.752L15.433 9l.224-.248c.325-.358.403-.654.282-1.062-.155-.524-.754-.81-1.299-.621m-6.2 4.975c-.486.095-1.013.509-1.244.977-.181.368-.224.732-.163 1.389.026.292.081.656.121.81.624 2.398 2.885 3.99 5.316 3.744.961-.097 1.703-.38 2.502-.955.726-.523 1.415-1.441 1.718-2.289.239-.673.361-1.596.282-2.142-.109-.762-.71-1.4-1.447-1.538-.269-.05-6.827-.046-7.085.004m6.544 2.258c-.108 1.187-.961 2.216-2.144 2.584-.434.135-1.246.135-1.68 0-1.183-.368-2.036-1.397-2.144-2.584L8.989 14h6.022l-.027.302" fill="#10161F" fill-rule="evenodd"/></svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
|
|
@ -255,6 +255,8 @@
|
|||
"new_user_guide.step.behavior.unread_question.option1": "Radical: Automatically marked as read when displayed.",
|
||||
"new_user_guide.step.behavior.unread_question.option2": "Balanced: Automatically marked as read when hovered over or scrolled out of view.",
|
||||
"new_user_guide.step.behavior.unread_question.option3": "Conservative: Marked as read only when clicked.",
|
||||
"new_user_guide.step.discover.description": "You can also find it later in Discover.",
|
||||
"new_user_guide.step.discover.title": "Recommend for you",
|
||||
"new_user_guide.step.features.actions.description": "Action rules allow you to perform different actions for different feeds.\n- Using AI to summarize or translate.\n- Configure how to read entries.\n- Enable notifications for new entries or silence them.\n- Rewrite or block specific entries.\n- Send new entries to a webhook address.",
|
||||
"new_user_guide.step.features.integration.description": "Integrations allow you to save entries to other services. Currently supported services are:\n- Eagle\n- Readwise\n- Instapaper\n- Obsidian\n- Outline\n- Readeck",
|
||||
"new_user_guide.step.migrate.description": "You can also import them later in Discover.",
|
||||
|
|
|
|||
Loading…
Reference in New Issue