Skip to content

Commit

Permalink
Merge pull request #134 from vtexdocs/Tutorial-landing-page-new-version
Browse files Browse the repository at this point in the history
feat: new tutorial landing page version
  • Loading branch information
ricardoaerobr authored Nov 18, 2024
2 parents aed21c8 + c98f23b commit b94854d
Show file tree
Hide file tree
Showing 16 changed files with 60,975 additions and 55,835 deletions.
116,220 changes: 60,614 additions & 55,606 deletions public/navigation.json

Large diffs are not rendered by default.

6 changes: 3 additions & 3 deletions src/components/see-also-section/functions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,14 +6,14 @@ import { useIntl } from 'react-intl'

const getDoctype = (category: string) => {
switch (category) {
case 'Tutorials & Solutions':
return 'Tutorials & Solutions'
case 'Tutorials':
return 'Tutorials'
case 'Start here':
return 'Start here'
case 'Announcements':
return 'Announcements'
default:
return 'Tutorials & Solutions'
return 'Tutorials'
}
}

Expand Down
6 changes: 3 additions & 3 deletions src/components/tutorial-index/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,14 +16,14 @@ const TutorialIndexing = ({ ...props }) => {
<>
<PageHeader
title={intl.formatMessage({
id: 'tutorial_and_solutions_page.title',
id: 'tutorials_page.title',
})}
description={intl.formatMessage({
id: 'tutorial_and_solutions_page.description',
id: 'tutorials_page.description',
})}
imageUrl={startHereImage}
imageAlt={intl.formatMessage({
id: 'tutorial_and_solutions_page.title',
id: 'tutorials_page.title',
})}
/>
<Flex sx={styles.innerContainer}>
Expand Down
8 changes: 4 additions & 4 deletions src/components/tutorial-markdown-render/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ const TutorialMarkdownRender = (props: Props) => {
<>
<Head>
<title>{props.serialized.frontmatter?.title as string}</title>
<meta name="docsearch:doctype" content="Tutorials & Solutions" />
<meta name="docsearch:doctype" content="Tutorials" />
{props.serialized.frontmatter?.hidden && (
<meta name="robots" content="noindex" />
)}
Expand All @@ -69,14 +69,14 @@ const TutorialMarkdownRender = (props: Props) => {
</Head>
<PageHeader
title={intl.formatMessage({
id: 'tutorial_and_solutions_page.title',
id: 'tutorials_page.title',
})}
description={intl.formatMessage({
id: 'tutorial_and_solutions_page.description',
id: 'tutorials_page.description',
})}
imageUrl={startHereImage}
imageAlt={intl.formatMessage({
id: 'tutorial_and_solutions_page.title',
id: 'tutorials_page.title',
})}
/>
<DocumentContextProvider headings={props.headings}>
Expand Down
34 changes: 34 additions & 0 deletions src/components/whats-next-card/tutorials/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
import { Box, Flex, IconCaret, Text, Link } from '@vtex/brand-ui'

import type { WhatsNextDataElementTutorial } from 'utils/typings/types'

import styles from '../styles'

const WhatsNextCardTutorial = ({
title,
linkTitle,
linkTo,
}: WhatsNextDataElementTutorial) => {
return (
<Link href={linkTo} sx={styles.container}>
<Box>
<Text sx={styles.title} className="title">
{title}
</Text>
<Flex sx={styles.linkContainer}>
<Text sx={styles.link} className="link">
{linkTitle}
</Text>
<IconCaret
className="caret"
color="#A1A8B3"
direction="right"
size={16}
/>
</Flex>
</Box>
</Link>
)
}

export default WhatsNextCardTutorial
55 changes: 55 additions & 0 deletions src/components/whats-next-card/tutorials/styles.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
import type { SxStyleProp } from '@vtex/brand-ui'

const container: SxStyleProp = {
mt: '16px',
padding: '16px',
borderRadius: '4px',
border: '1px solid #E7E9EE',
width: ['100%', '49%'],
transition: 'all 0.3s ease-out',
':hover': {
cursor: 'pointer',
},
':active, :hover': {
borderColor: 'muted.2',
boxShadow: '0px 0px 16px rgba(0, 0, 0, 0.1)',
transition: 'all 0.3 ease-out',

'.title, .description': {
transition: 'all 0.3s ease-out',
color: '#000711',
},

'.link, .caret': {
transition: 'all 0.3s ease-out',
color: 'muted.0',
},
},
}

const title: SxStyleProp = {
mb: '8px',
fontSize: '16px',
fontWeight: '400',
lineHeight: ['22px', '18px'],
color: 'muted.0',
}

const description: SxStyleProp = {
fontSize: '12px',
fontWeight: '400',
lineHeight: '16px',
color: 'muted.0',
}

const linkContainer: SxStyleProp = {
mt: '8px',
alignItems: 'center',
}

const link: SxStyleProp = {
...description,
color: 'muted.1',
}

export default { container, title, description, linkContainer, link }
76 changes: 70 additions & 6 deletions src/messages/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@
"landing_page_documentation.title": "Documentation",
"documentation_start_here.title": "Start here",
"documentation_start_here.description": "Learn, step by step, everything you need to know to get started on VTEX.",
"documentation_tutorials.title": "Tutorials & Solutions",
"documentation_tutorials.description": "Access content and find solutions to all your questions about the platform",
"documentation_tutorials.title": "Tutorials",
"documentation_tutorials.description": "Explore in-depth tutorials for operating your VTEX store.",
"documentation_developers_portal.title": "Developer portal",
"documentation_developers_portal.description": "Find info about integrations, APIs, and development resources for your store.",
"landing_page_faq.title": "Frequently Asked Questions",
Expand Down Expand Up @@ -75,7 +75,7 @@
"api_reference_page.subtitle": "Use our API reference documentation to build custom solutions that fit your business.",
"start_here_page.title": "Start here",
"start_here_page.subtitle": "Learn, step by step, everything you need to know to start using VTEX.",
"start_here_page.link": "Learn more",
"start_here_page.link": "See tutorials",
"start_here_page_onboarding.title": "Onboarding guide",
"start_here_page_onboarding.content.0.title": "VTEX store overview",
"start_here_page_onboarding.content.0.description": "Learn about the merchant’s journey from architecture planning to store go-live.",
Expand Down Expand Up @@ -192,6 +192,70 @@
"start_here_page_conversational.content.1.title": "VTEX Assisted Sales (SuiteShare)",
"start_here_page_conversational.content.1.description": "Learn solutions to attract more customers, organize your team's services, capture customer data, close sales, and measure results.",
"start_here_page_conversational.content.1.link": "tracks/what-is-suiteshare",
"start_here_tutorials_page.title": "Tutorials",
"start_here_tutorials_page.subtitle": "Guides with step-by-step information to assist you in operating the VTEX platform and developing your business.",
"start_here_tutorials_page.link": "Learn more",
"tutorials_main_page.title": "Access the sections below to find out how to use our platform in your store operations:",
"tutorials_main_page.content.0.title": "Account management",
"tutorials_main_page.content.0.link": "tutorial/category-account-management",
"tutorials_main_page.content.1.title": "Apps",
"tutorials_main_page.content.1.link": "tutorial/category-apps",
"tutorials_main_page.content.2.title": "Authentication",
"tutorials_main_page.content.2.link": "tutorial/category-authentications",
"tutorials_main_page.content.3.title": "B2B",
"tutorials_main_page.content.3.link": "tutorial/category-b2b",
"tutorials_main_page.content.4.title": "Beta",
"tutorials_main_page.content.4.link": "tutorial/category-beta-products",
"tutorials_main_page.content.5.title": "Billing",
"tutorials_main_page.content.5.link": "tutorial/category-billing",
"tutorials_main_page.content.6.title": "Catalog",
"tutorials_main_page.content.6.link": "tutorial/category-catalog",
"tutorials_main_page.content.7.title": "Checkout",
"tutorials_main_page.content.7.link": "tutorial/category-checkout",
"tutorials_main_page.content.8.title": "Conversational Commerce",
"tutorials_main_page.content.8.link": "tutorial/category-conversational-commerce",
"tutorials_main_page.content.9.title": "Dashboards",
"tutorials_main_page.content.9.link": "tutorial/category-insights",
"tutorials_main_page.content.10.title": "Infrastructure",
"tutorials_main_page.content.10.link": "tutorial/category-infrastructure",
"tutorials_main_page.content.11.title": "Integrations",
"tutorials_main_page.content.11.link": "tutorial/category-integrations",
"tutorials_main_page.content.12.title": "Intelligent Search",
"tutorials_main_page.content.12.link": "tutorial/category-intelligent-search",
"tutorials_main_page.content.13.title": "Master Data",
"tutorials_main_page.content.13.link": "tutorial/category-master-data",
"tutorials_main_page.content.14.title": "Message center",
"tutorials_main_page.content.14.link": "tutorial/category-message-center",
"tutorials_main_page.content.15.title": "Omnichannel",
"tutorials_main_page.content.15.link": "tutorial/category-omnichannel",
"tutorials_main_page.content.16.title": "Orders",
"tutorials_main_page.content.16.link": "tutorial/category-orders",
"tutorials_main_page.content.17.title": "Other",
"tutorials_main_page.content.17.link": "tutorial/category-other",
"tutorials_main_page.content.18.title": "Payments",
"tutorials_main_page.content.18.link": "tutorial/category-payments",
"tutorials_main_page.content.19.title": "Prices",
"tutorials_main_page.content.19.link": "tutorial/category-prices",
"tutorials_main_page.content.20.title": "Promotions & taxes",
"tutorials_main_page.content.20.link": "tutorial/category-promotions-and-taxes",
"tutorials_main_page.content.21.title": "Security",
"tutorials_main_page.content.21.link": "tutorial/category-security",
"tutorials_main_page.content.22.title": "Sellers",
"tutorials_main_page.content.22.link": "tutorial/category-sellers",
"tutorials_main_page.content.23.title": "Shipping",
"tutorials_main_page.content.23.link": "tutorial/category-shipping",
"tutorials_main_page.content.24.title": "Store Settings",
"tutorials_main_page.content.24.link": "tutorial/category-store-settings",
"tutorials_main_page.content.25.title": "Storefront",
"tutorials_main_page.content.25.link": "tutorial/category-cms",
"tutorials_main_page.content.26.title": "Subscriptions",
"tutorials_main_page.content.26.link": "tutorial/category-subscriptions",
"tutorials_main_page.content.27.title": "Trade policies",
"tutorials_main_page.content.27.link": "tutorial/category-trade-policies",
"tutorials_main_page.content.28.title": "Unified Commerce",
"tutorials_main_page.content.28.link": "tutorial/category-unified-commerce",
"tutorials_main_page.content.29.title": "VTEX Tracking",
"tutorials_main_page.content.29.link": "tutorial/category-vtex-tracking",
"storefront_development_page.title": "Storefront Development",
"storefront_development_page.subtitle": "Express your brand identity creating unique storefronts.",
"vtex_io_apps_page.title": "VTEX IO Apps",
Expand Down Expand Up @@ -230,7 +294,7 @@
"sidebar_support_rules.description": "See details of the support plans available for each business plan.",
"updates_info_notes.title": "Frequently Asked Questions",
"updates_info_notes.description": "Find answers to your key questions quickly and conveniently.",
"menu_status.description": "Follow the plataform's historical record.",
"menu_status.description": "Follow the platform's historical record.",
"sidebar_support_rules.title": "Support Rules",
"sidebar_support_rules.link": "/faq/how-does-vtex-support-work",
"sidebar_known_issues.title": "Known Issues",
Expand All @@ -255,8 +319,8 @@
"known_issues_result.empty": "No matching results. Try other filters.",
"known_issues_date.created": "Created at",
"known_issues_date.updated": "Updated at",
"tutorial_and_solutions_page.title": "Tutorials & Solutions",
"tutorial_and_solutions_page.description": "Access the documentation of all platform modules and clarify your doubts.",
"tutorials_page.title": "Tutorials",
"tutorials_page.description": "Explore in-depth tutorials for operating your VTEX store.",
"date_text.created": "Published on",
"date_text.updated": "Last update on",
"announcements_page_result.empty": "No matching results.",
Expand Down
76 changes: 70 additions & 6 deletions src/messages/es.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@
"landing_page_documentation.title": "Documentation",
"documentation_start_here.title": "Comece aqui",
"documentation_start_here.description": "Aprenda, passo a passo, tudo que precisa saber para começar a usar os principais módulos da VTEX.",
"documentation_tutorials.title": "Tutoriais",
"documentation_tutorials.description": "Acesse a documentação de todos os módulos da plataforma e tire suas dúvidas.",
"documentation_tutorials.title": "Tutoriales",
"documentation_tutorials.description": "Explore tutoriales detallados para operar su tienda VTEX.",
"documentation_developers_portal.title": "Portal del desarrollador",
"documentation_developers_portal.description": "Visite nosso portal de desenvolvedores e encontre informações técnicas sobre integrações, APIs e recursos de desenvolvimento.",
"landing_page_faq.title": "Preguntas Frecuentes",
Expand Down Expand Up @@ -36,7 +36,7 @@
"landing_page_education_github.title": "Github",
"landing_page_education_github.description": "Follow our code and contribute with VTEX on GitHub.",
"landing_page_education_github.textLink": "Go to Github",
"landing_page_education_developer_portal.title": "Developer Portal",
"landing_page_education_developer_portal.title": "Developer portal",
"landing_page_education_developer_portal.description": "Encuentre información sobre integraciones, API y recursos de desarrollo para su tienda.",
"landing_page_education_developer_portal.textLink": "Explore Developer Portal",
"landing_page_education_support.title": "Solicite soporte a VTEX",
Expand Down Expand Up @@ -75,7 +75,7 @@
"api_reference_page.subtitle": "Use our API reference documentation to build custom solutions that fit your business.",
"start_here_page.title": "Comience aquí",
"start_here_page.subtitle": "Aprende, paso a paso, todo lo que necesitas saber para empezar a usar VTEX.",
"start_here_page.link": "Saber más",
"start_here_page.link": "Ver tutoriales",
"start_here_page_onboarding.title": "Guía de onboarding",
"start_here_page_onboarding.content.0.title": "Serie de la tienda VTEX",
"start_here_page_onboarding.content.0.description": "Sigue la jornada del retailer desde la planificación de la arquitectura hasta el go live de la tienda.",
Expand Down Expand Up @@ -195,6 +195,70 @@
"start_here_page_conversational.content.0.title": "VTEX Assisted Sales (SuiteShare)",
"start_here_page_conversational.content.0.description": "Aprenda soluciones para atraer más clientes, organizar los servicios de su equipo, captar datos de clientes, cerrar ventas y medir resultados.",
"start_here_page_conversational.content.0.link": "tracks/que-es-suiteshare",
"start_here_tutorials_page.title": "Tutoriales",
"start_here_tutorials_page.subtitle": "Guías con información paso a paso para ayudarle a operar la plataforma VTEX y desarrollar su negocio.",
"start_here_tutorials_page.link": "Aprenda más",
"tutorials_main_page.title": "Acceda a las siguientes secciones para descubrir cómo utilizar nuestra plataforma en las operaciones de su tienda:",
"tutorials_main_page.content.0.title": "Apps",
"tutorials_main_page.content.0.link": "tutorial/categoria-apps",
"tutorials_main_page.content.1.title": "Autenticación",
"tutorials_main_page.content.1.link": "tutorial/categoria-autenticaciones",
"tutorials_main_page.content.2.title": "B2B",
"tutorials_main_page.content.2.link": "tutorial/categoria-b2b",
"tutorials_main_page.content.3.title": "Beta",
"tutorials_main_page.content.3.link": "tutorial/categoria-beta-producto",
"tutorials_main_page.content.4.title": "Catalogo",
"tutorials_main_page.content.4.link": "tutorial/categoria-catalogo",
"tutorials_main_page.content.5.title": "Centro de mensajes",
"tutorials_main_page.content.5.link": "tutorial/categoria-centro-de-mensajes",
"tutorials_main_page.content.6.title": "Checkout",
"tutorials_main_page.content.6.link": "tutorial/categoria-checkout",
"tutorials_main_page.content.7.title": "Comercio Unificado",
"tutorials_main_page.content.7.link": "tutorial/categoria-comercio-unificado",
"tutorials_main_page.content.8.title": "Configuraciones de la Tienda",
"tutorials_main_page.content.8.link": "tutorial/categoria-configuraciones-de-la-tienda",
"tutorials_main_page.content.9.title": "Conversational Commerce",
"tutorials_main_page.content.9.link": "tutorial/categoria-conversational-commerce",
"tutorials_main_page.content.10.title": "Dashboards",
"tutorials_main_page.content.10.link": "tutorial/categoria-insights",
"tutorials_main_page.content.11.title": "Envío",
"tutorials_main_page.content.11.link": "tutorial/categoria-envio",
"tutorials_main_page.content.12.title": "Facturas",
"tutorials_main_page.content.12.link": "tutorial/categoria-facturas",
"tutorials_main_page.content.13.title": "Gestión de la cuenta",
"tutorials_main_page.content.13.link": "tutorial/categoria-gestion-de-la-cuenta",
"tutorials_main_page.content.14.title": "Infraestructura",
"tutorials_main_page.content.14.link": "tutorial/categoria-infraestructura",
"tutorials_main_page.content.15.title": "Integraciones",
"tutorials_main_page.content.15.link": "tutorial/categoria-integraciones",
"tutorials_main_page.content.16.title": "Intelligent Search",
"tutorials_main_page.content.16.link": "tutorial/categoria-intelligent-search",
"tutorials_main_page.content.17.title": "Master Data",
"tutorials_main_page.content.17.link": "tutorial/categoria-master-data",
"tutorials_main_page.content.18.title": "Omnichannel",
"tutorials_main_page.content.18.link": "tutorial/categoria-omnichannel",
"tutorials_main_page.content.19.title": "Otros",
"tutorials_main_page.content.19.link": "tutorial/categoria-otros",
"tutorials_main_page.content.20.title": "Pagos",
"tutorials_main_page.content.20.link": "tutorial/categoria-pagos",
"tutorials_main_page.content.21.title": "Pedidos comerciales",
"tutorials_main_page.content.21.link": "tutorial/categoria-pedidos",
"tutorials_main_page.content.22.title": "Políticas comerciales",
"tutorials_main_page.content.22.link": "tutorial/categoria-politicas-comerciales",
"tutorials_main_page.content.23.title": "Precios",
"tutorials_main_page.content.23.link": "tutorial/categoria-precios",
"tutorials_main_page.content.24.title": "Seguridad",
"tutorials_main_page.content.24.link": "tutorial/categoria-seguridad",
"tutorials_main_page.content.25.title": "Sellers",
"tutorials_main_page.content.25.link": "tutorial/categoria-sellers",
"tutorials_main_page.content.26.title": "Storefront",
"tutorials_main_page.content.26.link": "tutorial/categoria-cms",
"tutorials_main_page.content.27.title": "Suscripciones",
"tutorials_main_page.content.27.link": "tutorial/categoria-suscripciones",
"tutorials_main_page.content.28.title": "Tasas y promociones",
"tutorials_main_page.content.28.link": "tutorial/categoria-tasas-y-promociones",
"tutorials_main_page.content.29.title": "VTEX Tracking",
"tutorials_main_page.content.29.link": "tutorial/categoria-vtex-tracking",
"storefront_development_page.title": "Storefront Development",
"storefront_development_page.subtitle": "Express your brand identity creating unique storefronts.",
"vtex_io_apps_page.title": "VTEX IO Apps",
Expand Down Expand Up @@ -258,8 +322,8 @@
"known_issues_result.empty": "Ningún resultado coincidente. Pruebe con otros filtros.",
"known_issues_date.created": "Creado en",
"known_issues_date.updated": "Actualizado en",
"tutorial_and_solutions_page.title": "Tutoriales y Soluciones",
"tutorial_and_solutions_page.description": "Accede a la documentación de todos los módulos de la plataforma y resuelve tus dudas.",
"tutorials_page.title": "Tutoriales",
"tutorials_page.description": "Explore tutoriales detallados para operar su tienda VTEX.",
"date_text.created": "Publicado en",
"date_text.updated": "Última actualización",
"announcements_page_result.empty": "Ningún resultado coincidente.",
Expand Down
Loading

0 comments on commit b94854d

Please sign in to comment.