chore(nxdev): update schedule for conference (#6847)

This commit is contained in:
Brandon 2021-08-31 14:16:40 -05:00 committed by GitHub
parent 44db568261
commit 1a6f2537f7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 361 additions and 146 deletions

View File

@ -1,3 +1,5 @@
import { useState } from 'react';
interface ScheduleItem {
description: string;
speakers: Array<string>;
@ -7,63 +9,234 @@ interface ScheduleItem {
}
export function ConfSchedule(): JSX.Element {
const [activeDay, setActiveDay] = useState(1);
const scheduleItemsFor16: ScheduleItem[] = [
{
type: 'event',
time: '10-10:45am (EST)',
title: 'Keynote - Setup Next.js to use Tailwind with Nx',
description:
'This article is a part of a series around building a blog with Nx, Next.js, Tailwing, Storybook and Cypress. In the previous article we learned how to set up Next.js in an Nx workspace. In this article, we carry that forward, by adding Tailwing CSS support to our setup.',
speakers: ['Jeff Cross / Nrwl', 'Victor Savkin / Nrwl'],
time: '10-10:45am',
title: 'Keynote',
description: '',
speakers: ['Jeff Cross', 'Victor Savkin / Nrwl'],
},
{
type: 'break',
time: '10:45-11am (EST)',
time: '10:45-11am',
title: 'Break',
description: '',
speakers: [],
},
{
type: 'event',
time: '10-10:45am (EST)',
title: 'Keynote - Setup Next.js to use Tailwind with Nx',
time: '11-11:25am',
title: 'Go-To-Market with Nx',
description:
'This article is a part of a series around building a blog with Nx, Next.js, Tailwing, Storybook and Cypress. In the previous article we learned how to set up Next.js in an Nx workspace. In this article, we carry that forward, by adding Tailwing CSS support to our setup.',
speakers: ['Jeff Cross / Nrwl', 'Victor Savkin / Nrwl'],
'Does a startup really need a tool like Nx from Day One? Lets take a look at Nx through the eyes of a startup trying to ship its first project. How does Nx accelerate the growth and adaptation necessary for a new venture?',
speakers: ['Jason Jean / Nrwl'],
},
{
type: 'event',
time: '11:30-11:55am',
title: 'Micro Frontends and Nx Monorepos: The Best of Two Worlds?',
description: `Micro Frontends “by the book” are managed in different repositories. However, many Angular developers value the comfort and features provided by monorepos. This session will use Nx and Module Federation to show how to get the best of both worlds including sharing libraries between micro frontends, enforcing isolation, and deployment strategies.`,
speakers: ['Manfred Steyer / Angular Architects'],
},
{
type: 'event',
time: '12-12:25pm',
title:
'Generators, Executors and Plugins - Automating for Speed and Quality with the Nx Devkit',
description: `One of Nxs primary advantages is seamless integration of different tools through automation which we roughly categorized into: executors, generators, and plugins. Nx comes with different packages that already have all of these built-in, but you can also leverage the @nrwl/devkit API to create custom generators, executors and plugins to meet the needs of your specific workspace.`,
speakers: ['Juri Strumpflohner / Nrwl'],
},
{
type: 'break',
time: '12:25-12:45pm',
title: 'Q&A',
description: '',
speakers: [],
},
{
type: 'break',
time: '12:45-1:30pm',
title: 'Lunch Break',
description: '',
speakers: [],
},
{
type: 'break',
time: '1:30-1:55pm',
title: 'TBD',
description: '',
speakers: [],
},
{
type: 'event',
time: '2-2:25pm',
title: 'Revealing the Identity of the "x" in Nx',
description: `Have you heard of Nx? Is it the missing variable in the algebraic expression to solving the nature of our universe? It just might be. Many JavaScript developers live in a universe of TypeScript these days, and Nx is a distinguished variable in solving a multitude of universal TypeScript challenges. Let's explore how Nx can be transformational when it comes to harnessing the power of our TypeScript codebases and how it can help keep us in-line with it's evolutionary journey.`,
speakers: ['Nathan Walker / nStudio'],
},
{
type: 'break',
time: '2:30-2:45pm',
title: 'Q&A',
description: '',
speakers: [],
},
{
type: 'break',
time: '2:45-3:00pm',
title: 'Break',
description: '',
speakers: [],
},
{
type: 'event',
time: '3pm-3:25pm',
title: 'Design Systems for Enterprise',
description: `If you are part of a large organization or team, chances are you need a design system. A combination of Nx and Storybook will make that process more efficient, more enjoyable, and definitely more scalable. Storybook helps you build "UI components in isolation". Combined with Nx and the architecture of a Nx workspace, you can have your UI libraries easily "browsable" and testable by your whole dev and UI/UX teams.`,
speakers: ['Katerina Skroumpleou', 'Rares Matei / Nrwl'],
},
{
type: 'break',
time: '3:30-3:55pm',
title: 'Community Lightning Talks',
description: '',
speakers: [],
},
{
type: 'break',
time: '4:00-4:20pm',
title: 'Q&A',
description: '',
speakers: [],
},
{
type: 'event',
time: '4:20-4:30pm',
title: 'Closing Remarks',
description: '',
speakers: ['Jeff Cross', 'Brandon Roberts / Nrwl'],
},
];
const scheduleItemsFor17: ScheduleItem[] = [
{
type: 'event',
time: '10-10:45am (EST)',
title: 'Keynote - Setup Next.js to use Tailwind with Nx',
description:
'This article is a part of a series around building a blog with Nx, Next.js, Tailwing, Storybook and Cypress. In the previous article we learned how to set up Next.js in an Nx workspace. In this article, we carry that forward, by adding Tailwing CSS support to our setup.',
speakers: ['Jeff Cross / Nrwl', 'Victor Savkin / Nrwl'],
time: '10-10:45am',
title: 'Nrwl/Nx Team Panel',
description: '',
speakers: ['Nrwlians'],
},
{
type: 'break',
time: '10:45-11am (EST)',
time: '10:45-11am',
title: 'Break',
description: '',
speakers: [],
},
{
type: 'break',
time: '11-11:25am',
title: 'Community Lightning Talks',
description: '',
speakers: [''],
},
{
type: 'event',
time: '11:30-11:55am',
title: 'Debugging a NestJS Application',
description:
"In this talk, we'll discuss the process of debugging a NestJS application within Nx.",
speakers: ['Yvonne Allen'],
},
{
type: 'event',
time: '12-12:25pm',
title: 'Optimizing Workspaces for Nx',
description: `In this talk, well discuss the concerns to consider when architecting an Nx workspace, and discuss how to be proactive in managing your dependency graph to get the most out of developer productivity, and reduce the risk of dreaded circular dependencies.`,
speakers: ['Zack DeRose / Nrwl'],
},
{
type: 'break',
time: '12:25-12:45',
title: 'Q&A',
description: '',
speakers: [],
},
{
type: 'event',
time: '1:30-1:55pm',
title: 'Solving Problems with the Dependency Graph',
description: `The dependency graph can be a powerful part of your workspace, but it can be hard to parse
much information from the visualization, especially in large projects. In this talk, youll learn about
strategies to cut your graph down to size to understand more visually and also how to use the
JSON output of the graph when a visual just wont cut it.`,
speakers: ['Philip Fulcher / Nrwl'],
},
{
type: 'event',
time: '2:00-2:25pm',
title: 'ESLint: Your Nx Workspace Rules',
description: `In this talk we will cover what it takes to create and run lint rules directly in your Nx workspace which are specific to your workspaces own requirements and best-practices. Want to avoid using developer time to police your contributing conventions in PR reviews? How to add auto fixing so the correct solutions are a command away? How to leverage existing utilities from the ESLint ecosystem to avoid writing invalid rules? Then this talk is for you!`,
speakers: ['James Henry'],
},
{
type: 'break',
time: '2:30-2:45pm',
title: 'Q&A',
description: '',
speakers: [],
},
{
type: 'break',
time: '2:45-3:00',
title: 'Break',
description: '',
speakers: [],
},
{
type: 'event',
time: '10-10:45am (EST)',
title: 'Keynote - Setup Next.js to use Tailwind with Nx',
description:
'This article is a part of a series around building a blog with Nx, Next.js, Tailwing, Storybook and Cypress. In the previous article we learned how to set up Next.js in an Nx workspace. In this article, we carry that forward, by adding Tailwing CSS support to our setup.',
speakers: ['Jeff Cross / Nrwl', 'Victor Savkin / Nrwl'],
time: '3:00-3:25pm',
title: 'Optimize your development workflow with Nx Cloud',
description: `It's 2021 - time to break away from unintelligent CI set ups, and rudimentary local development
workflows. This talk covers how different features of Nx Cloud power up your Nx development.`,
speakers: ['Kirils Ladovs / Nrwl'],
},
{
type: 'event',
time: '3:30-3:55pm',
title: 'Lose Your Fear of Package Updates',
description: `How can you scare any engineer in two words? Version updates. One of Nxs superpowers is being able
to run common commands incrementally -- but what about commands that we run less frequently? Learn how Nx makes
the upgrade path to latest so simple that you and your team wont want to miss a version bump for your framework
again.`,
speakers: ['Altan Stalker / Nrwl'],
},
{
type: 'break',
time: '4:00-4:20',
title: 'Q&A',
description: '',
speakers: [],
},
{
type: 'event',
time: '4:20-4:30pm',
title: 'Closing Remarks',
description: '',
speakers: ['Jeff Cross', 'Brandon Roberts / Nrwl'],
},
];
return (
return activeDay === 1 ? (
<div className="border-t border-gray-600">
<div className="max-w-screen-lg xl:max-w-screen-xl mx-auto text-white">
<div className="date-container-l grid grid-cols-2 font-input-mono divide-x divide-gray-600">
<div className="p-8 text-center bg-blue-nx-dark">September 16</div>
<div className="p-8 text-center">September 17</div>
<div className="p-8 text-center" onClick={() => setActiveDay(2)}>
September 17
</div>
</div>
</div>
<section className="w-full border-t border-b border-gray-600 divide-y divide-gray-600">
@ -71,23 +244,30 @@ export function ConfSchedule(): JSX.Element {
item.type === 'event' ? scheduleRow(item) : breakRow(item)
)}
</section>
<div className="max-w-screen-lg xl:max-w-screen-xl mx-auto text-white">
<div className="date-container-r grid grid-cols-2 font-input-mono divide-x divide-gray-600">
<div className="p-8 text-center">September 16</div>
<div className="p-8 text-center bg-blue-nx-dark">September 17</div>
</div>
) : (
<div>
<div className="border-t border-gray-600">
<div className="max-w-screen-lg xl:max-w-screen-xl mx-auto text-white">
<div className="date-container-r grid grid-cols-2 font-input-mono divide-x divide-gray-600">
<div className="p-8 text-center" onClick={() => setActiveDay(1)}>
September 16
</div>
<div className="p-8 text-center bg-blue-nx-dark">September 17</div>
</div>
</div>
<section className="w-full border-t border-b border-gray-600 divide-y divide-gray-600">
{scheduleItemsFor17.map((item) =>
item.type === 'event' ? scheduleRow(item) : breakRow(item)
)}
</section>
</div>
<section className="w-full border-t border-b border-gray-600 divide-y divide-gray-600">
{scheduleItemsFor17.map((item) =>
item.type === 'event' ? scheduleRow(item) : breakRow(item)
)}
</section>
</div>
);
}
const scheduleRow = (item: ScheduleItem): JSX.Element => (
<div key={item.title} className="w-full">
<div key={item.title + item.time} className="w-full">
<div className="max-w-screen-lg xl:max-w-screen-xl mx-auto text-white">
<article className="w-full grid grid-cols-1 md:grid-cols-5 md:divide-x md:divide-gray-600">
<div className="px-5 pt-12 pb-8 md:py-12 font-input-mono">
@ -111,7 +291,7 @@ const scheduleRow = (item: ScheduleItem): JSX.Element => (
);
const breakRow = (item: ScheduleItem): JSX.Element => (
<div key={item.title} className="w-full">
<div key={item.title + item.time} className="w-full">
<div className="max-w-screen-lg xl:max-w-screen-xl mx-auto text-white">
<div className="w-full grid grid-cols-1 md:grid-cols-5">
<div className="px-5 pt-12 pb-8 md:py-12 font-input-mono">

View File

@ -17,13 +17,15 @@ export function ConfSpeakers(): JSX.Element {
twitter: 'victorsavkin',
},
{
description: 'Coming soon.',
description:
'Isaac is an Architect at Nrwl. He helps maintain the documentation for Nx at nx.dev and has created two video courses available at nxplaybook.com. Isaac is an Instructor at egghead.io and has written blog posts on Advanced Angular Component Design.',
imageUrl: '/images/conf/isaac-mann.webp',
name: 'Isaac Mann',
twitter: 'MannIsaac',
},
{
description: 'Coming soon.',
description:
'From the faraway lands of Scotland (but without the Scottish accent), Rares works at Nrwl on NxCloud, helping teams speed up and scale their development. He enjoys learning by teaching and has Egghead.io courses on TypeScript and Reactive Programming.',
imageUrl: '/images/conf/rares-matei.webp',
name: 'Rares Matei',
twitter: '__rares',
@ -35,13 +37,6 @@ export function ConfSpeakers(): JSX.Element {
name: 'Manfred Steyer',
twitter: 'ManfredSteyer',
},
{
description:
"Diana Rodriguez is a Full Stack Developer & DevOps lover of all things web and cloud! With 20+ years experience and a strong background in back end and infrastructure Diana likes to bring together the best of both worlds. She's super enthusiastic about encouraging people to start a career in development and a fan of Python, IoT, Automation and things to nerd about.",
imageUrl: '/images/conf/diana-rodriguez.webp',
name: 'Diana Rodriguez',
twitter: 'cotufa82',
},
{
description:
'James leverages his expert knowledge of Nx to help the biggest enterprises on the planet provide maximum value to their customers. He is a prolific open-source contributor, ESLint Core Team Alum, and has worked on a number of projects alongside the TypeScript Team.',
@ -56,6 +51,46 @@ export function ConfSpeakers(): JSX.Element {
name: 'Nathan Walker',
twitter: 'wwwalkerrun',
},
{
description:
"Juri Strumpflohner lives in the very northern part of Italy and is currently working as a JavaScript Architect and Engineering Manager at Nrwl, where he consults for some of the world's biggest companies around the globe. Juri is a Google Developer Expert in Web Technologies & Angular, speaks at international conferences, teaches on Egghead.io, or writes articles on [https://juri.dev](https://juri.dev/)/. He's also a core member of Nx.",
imageUrl: '/images/conf/nrwl-logo.webp',
name: 'Juri Strumpflohner',
twitter: 'juristr',
},
{
description: 'Kirils is a Software Engineer at Nrwl, working on Nx.',
imageUrl: '/images/conf/nrwl-logo.webp',
name: 'Kirils Ladovs',
twitter: 'kirjai',
},
{
description:
'Based in Atlanta, GA, Altan is an engineer on the Nx Cloud team. He enjoys web tech, mechanical keyboards, and drone photography.',
imageUrl: '/images/conf/nrwl-logo.webp',
name: 'Altan Stalker',
twitter: 'StalkAltan',
},
{
description: 'Coming soon.',
imageUrl: '/images/conf/nrwl-logo.webp',
name: 'Katerina Skroumpelou',
twitter: 'psybercity',
},
{
description:
'Zack is a Senior Engineer and Engineering Manager at Nrwl, as well as a Google Developer Expert for Angular. When not in front of a computer screen, Zack enjoys a robust family life at scale, with his wife and 6 kids in San Tan Valley, AZ.',
imageUrl: '/images/conf/nrwl-logo.webp',
name: 'Zack DeRose',
twitter: 'zackderose',
},
{
description:
'Jason is an architect at Nrwl and a part of the Nx Core Team. He works with Fortune 500 companies across different industries to enable them to develop like Google, Microsoft, and Facebook. Jason is also an enthusiast of board games and mechanical keyboards.',
imageUrl: '/images/conf/nrwl-logo.webp',
name: 'Jason Jean',
twitter: 'frozenpandaz',
},
];
function chunkList<ITEM>(itemList: ITEM[], chunkSize: number): Array<ITEM[]> {

View File

@ -222,7 +222,7 @@ export function ConfPage() {
share our ideas and expertise about making development faster,
more scalable, and more collaborative.
</p>
<ul className="sm:text-lg list-disc list-inside mb-6">
{/* <ul className="sm:text-lg list-disc list-inside mb-6">
Here are just a few of our confirmed speakers
<li className="mt-4">
<a
@ -303,7 +303,7 @@ export function ConfPage() {
<p className="sm:text-lg mb-6">
Grab your FREE Nx Conf ticket and save your workshop seat
today!
</p>
</p> */}
<div className="flex mt-16">
<a
className="flex items-center justify-end font-input-mono group w-full sm:text-2xl"
@ -332,111 +332,111 @@ export function ConfPage() {
</div>
<div className="w-full overflow-hidden">
{/*NAVIGATION*/}
{/*<div className="hidden md:block border-t border-b border-gray-600">*/}
{/* <div className="max-w-screen-lg xl:max-w-screen-xl mx-auto text-white">*/}
{/* <div className="md:grid grid-cols-7 items-center text-center font-input-mono divide-x divide-gray-600">*/}
{/* <div className="p-8">*/}
{/* <svg*/}
{/* id="nx-conf-logo"*/}
{/* className="w-22 inline-block"*/}
{/* role="img"*/}
{/* viewBox="0 0 446 86"*/}
{/* fill="none"*/}
{/* xmlns="http://www.w3.org/2000/svg"*/}
{/* >*/}
{/* <path*/}
{/* d="M407.071 31.4634V84.9512H417.42V31.4634H443.292V22.0244H417.42V17.7244C417.42 14.7878 418.558 12.6902 420.835 11.4317C423.112 10.1033 426.147 9.43902 429.942 9.43902C432.909 9.43902 435.461 9.68374 437.6 10.1732C439.808 10.5927 441.67 11.0472 443.188 11.5366L445.258 2.72683C443.257 2.02764 440.981 1.39837 438.428 0.839023C435.944 0.279675 433.116 0 429.942 0C423.457 0 418.006 1.57317 413.591 4.71951C409.244 7.79593 407.071 12.1659 407.071 17.8293V22.0244H389.478V31.4634H407.071Z"*/}
{/* fill="white"*/}
{/* />*/}
{/* <path*/}
{/* d="M180.934 80.0219C185.556 84.0073 192.386 86 201.424 86C209.427 86 215.567 84.3569 219.845 81.0707C224.122 77.7845 226.503 72.9252 226.986 66.4927L216.844 65.8634C216.637 69.4293 215.257 72.1211 212.704 73.939C210.152 75.687 206.392 76.561 201.424 76.561C195.698 76.561 191.42 75.3724 188.592 72.9951C185.832 70.6179 184.452 67.0171 184.452 62.1927V45.2024C184.452 40.1683 185.832 36.4626 188.592 34.0854C191.351 31.6382 195.56 30.4146 201.217 30.4146C206.254 30.4146 210.048 31.4634 212.601 33.561C215.154 35.6585 216.568 38.8748 216.844 43.2098L226.986 42.5805C226.503 35.5187 224.088 30.1699 219.741 26.5341C215.464 22.8285 209.324 20.9756 201.321 20.9756C192.352 20.9756 185.556 23.0382 180.934 27.1634C176.38 31.2187 174.104 37.2317 174.104 45.2024V62.1927C174.104 70.0236 176.38 75.9667 180.934 80.0219Z"*/}
{/* fill="white"*/}
{/* />*/}
{/* <path*/}
{/* fillRule="evenodd"*/}
{/* clipRule="evenodd"*/}
{/* d="M253.208 79.9171C257.693 83.9724 264.109 86 272.457 86C280.805 86 287.187 83.9724 291.602 79.9171C296.086 75.7919 298.329 69.8837 298.329 62.1927V45.2024C298.329 37.4415 296.086 31.4634 291.602 27.2683C287.187 23.0732 280.839 20.9756 272.56 20.9756C264.212 20.9756 257.796 23.0732 253.312 27.2683C248.827 31.4634 246.585 37.4415 246.585 45.2024V62.1927C246.585 69.8837 248.793 75.7919 253.208 79.9171ZM284.151 72.9951C281.598 75.3724 277.7 76.561 272.457 76.561C267.214 76.561 263.316 75.3724 260.763 72.9951C258.21 70.6179 256.934 67.0171 256.934 62.1927V45.2024C256.934 40.1683 258.21 36.4626 260.763 34.0854C263.316 31.6382 267.214 30.4146 272.457 30.4146C277.7 30.4146 281.598 31.6382 284.151 34.0854C286.704 36.4626 287.98 40.1683 287.98 45.2024V62.1927C287.98 67.0171 286.704 70.6179 284.151 72.9951Z"*/}
{/* fill="white"*/}
{/* />*/}
{/* <path*/}
{/* d="M319.067 84.9512V22.0244H329.415V32.5122H332.52C334.038 28.9463 336.418 26.1496 339.661 24.122C342.903 22.0244 346.594 20.9756 350.734 20.9756C356.943 20.9756 361.841 22.8984 365.429 26.7439C369.017 30.5894 370.81 35.8333 370.81 42.4756V84.9512H360.462V44.5732C360.462 40.1683 359.392 36.8122 357.253 34.5049C355.184 32.1276 352.183 30.939 348.25 30.939C345.145 30.939 341.972 31.8829 338.729 33.7707C335.556 35.6585 332.451 38.3854 329.415 41.9512V84.9512H319.067Z"*/}
{/* fill="white"*/}
{/* />*/}
{/* <path*/}
{/* d="M0 21.9504V84.8056H10.3081V41.8545C13.3318 38.2927 16.4243 35.569 19.5854 33.6833C22.8153 31.7977 25.9765 30.8549 29.0689 30.8549C32.986 30.8549 35.9753 32.0421 38.037 34.4166C40.1673 36.7213 41.2325 40.0736 41.2325 44.4735V84.8056H51.5406V42.3783C51.5406 35.7436 49.7539 30.5056 46.1804 26.6645C42.6069 22.8234 37.7277 20.9028 31.5429 20.9028C27.4196 20.9028 23.743 21.9504 20.5132 24.0455C17.2833 26.0709 14.9124 28.8644 13.4006 32.4262H10.3081V21.9504H0Z"*/}
{/* fill="white"*/}
{/* />*/}
{/* <path*/}
{/* d="M97.3489 60.8158L113.327 84.8056H124.872L103.431 52.7494L125.284 21.9504H113.842L98.2767 44.9973L82.9176 21.9504H71.3725L92.298 53.2732L70.6509 84.8056H82.0929L97.3489 60.8158Z"*/}
{/* fill="white"*/}
{/* />*/}
{/* </svg>*/}
{/* </div>*/}
{/* <Link href="#agenda">*/}
{/* <a className="p-8 hover:bg-blue-nx-dark transition cursor-pointer">*/}
{/* Agenda*/}
{/* </a>*/}
{/* </Link>*/}
{/* <Link href="#speakers">*/}
{/* <a className="p-8 hover:bg-blue-nx-dark transition cursor-pointer">*/}
{/* Speakers*/}
{/* </a>*/}
{/* </Link>*/}
{/* <Link href="#workshop">*/}
{/* <a className="p-8 hover:bg-blue-nx-dark transition cursor-pointer">*/}
{/* Workshop*/}
{/* </a>*/}
{/* </Link>*/}
{/* <Link href="#sponsors">*/}
{/* <a className="p-8 hover:bg-blue-nx-dark transition cursor-pointer">*/}
{/* Sponsors*/}
{/* </a>*/}
{/* </Link>*/}
{/* <div className="p-8 col-span-2">*/}
{/* <a*/}
{/* className="flex items-center font-input-mono group w-full"*/}
{/* href="https://ti.to/nrwl/nx-conf-2021?utm_source=nxdev"*/}
{/* >*/}
{/* <span className="group-hover:underline">Register now</span>*/}
{/* <svg*/}
{/* xmlns="http://www.w3.org/2000/svg"*/}
{/* className="ml-1 h-4 w-4 transform-gpu transition ease-out duration-200 group-hover:translate-x-2 "*/}
{/* fill="none"*/}
{/* viewBox="0 0 24 24"*/}
{/* stroke="currentColor"*/}
{/* >*/}
{/* <path*/}
{/* strokeLinecap="round"*/}
{/* strokeLinejoin="round"*/}
{/* strokeWidth={2}*/}
{/* d="M13 7l5 5m0 0l-5 5m5-5H6"*/}
{/* />*/}
{/* </svg>*/}
{/* </a>*/}
{/* </div>*/}
{/* </div>*/}
{/* </div>*/}
{/*</div>*/}
<div className="hidden md:block border-t border-b border-gray-600">
<div className="max-w-screen-lg xl:max-w-screen-xl mx-auto text-white">
<div className="md:grid grid-cols-7 items-center text-center font-input-mono divide-x divide-gray-600">
<div className="p-8">
<svg
id="nx-conf-logo"
className="w-22 inline-block"
role="img"
viewBox="0 0 446 86"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M407.071 31.4634V84.9512H417.42V31.4634H443.292V22.0244H417.42V17.7244C417.42 14.7878 418.558 12.6902 420.835 11.4317C423.112 10.1033 426.147 9.43902 429.942 9.43902C432.909 9.43902 435.461 9.68374 437.6 10.1732C439.808 10.5927 441.67 11.0472 443.188 11.5366L445.258 2.72683C443.257 2.02764 440.981 1.39837 438.428 0.839023C435.944 0.279675 433.116 0 429.942 0C423.457 0 418.006 1.57317 413.591 4.71951C409.244 7.79593 407.071 12.1659 407.071 17.8293V22.0244H389.478V31.4634H407.071Z"
fill="white"
/>
<path
d="M180.934 80.0219C185.556 84.0073 192.386 86 201.424 86C209.427 86 215.567 84.3569 219.845 81.0707C224.122 77.7845 226.503 72.9252 226.986 66.4927L216.844 65.8634C216.637 69.4293 215.257 72.1211 212.704 73.939C210.152 75.687 206.392 76.561 201.424 76.561C195.698 76.561 191.42 75.3724 188.592 72.9951C185.832 70.6179 184.452 67.0171 184.452 62.1927V45.2024C184.452 40.1683 185.832 36.4626 188.592 34.0854C191.351 31.6382 195.56 30.4146 201.217 30.4146C206.254 30.4146 210.048 31.4634 212.601 33.561C215.154 35.6585 216.568 38.8748 216.844 43.2098L226.986 42.5805C226.503 35.5187 224.088 30.1699 219.741 26.5341C215.464 22.8285 209.324 20.9756 201.321 20.9756C192.352 20.9756 185.556 23.0382 180.934 27.1634C176.38 31.2187 174.104 37.2317 174.104 45.2024V62.1927C174.104 70.0236 176.38 75.9667 180.934 80.0219Z"
fill="white"
/>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M253.208 79.9171C257.693 83.9724 264.109 86 272.457 86C280.805 86 287.187 83.9724 291.602 79.9171C296.086 75.7919 298.329 69.8837 298.329 62.1927V45.2024C298.329 37.4415 296.086 31.4634 291.602 27.2683C287.187 23.0732 280.839 20.9756 272.56 20.9756C264.212 20.9756 257.796 23.0732 253.312 27.2683C248.827 31.4634 246.585 37.4415 246.585 45.2024V62.1927C246.585 69.8837 248.793 75.7919 253.208 79.9171ZM284.151 72.9951C281.598 75.3724 277.7 76.561 272.457 76.561C267.214 76.561 263.316 75.3724 260.763 72.9951C258.21 70.6179 256.934 67.0171 256.934 62.1927V45.2024C256.934 40.1683 258.21 36.4626 260.763 34.0854C263.316 31.6382 267.214 30.4146 272.457 30.4146C277.7 30.4146 281.598 31.6382 284.151 34.0854C286.704 36.4626 287.98 40.1683 287.98 45.2024V62.1927C287.98 67.0171 286.704 70.6179 284.151 72.9951Z"
fill="white"
/>
<path
d="M319.067 84.9512V22.0244H329.415V32.5122H332.52C334.038 28.9463 336.418 26.1496 339.661 24.122C342.903 22.0244 346.594 20.9756 350.734 20.9756C356.943 20.9756 361.841 22.8984 365.429 26.7439C369.017 30.5894 370.81 35.8333 370.81 42.4756V84.9512H360.462V44.5732C360.462 40.1683 359.392 36.8122 357.253 34.5049C355.184 32.1276 352.183 30.939 348.25 30.939C345.145 30.939 341.972 31.8829 338.729 33.7707C335.556 35.6585 332.451 38.3854 329.415 41.9512V84.9512H319.067Z"
fill="white"
/>
<path
d="M0 21.9504V84.8056H10.3081V41.8545C13.3318 38.2927 16.4243 35.569 19.5854 33.6833C22.8153 31.7977 25.9765 30.8549 29.0689 30.8549C32.986 30.8549 35.9753 32.0421 38.037 34.4166C40.1673 36.7213 41.2325 40.0736 41.2325 44.4735V84.8056H51.5406V42.3783C51.5406 35.7436 49.7539 30.5056 46.1804 26.6645C42.6069 22.8234 37.7277 20.9028 31.5429 20.9028C27.4196 20.9028 23.743 21.9504 20.5132 24.0455C17.2833 26.0709 14.9124 28.8644 13.4006 32.4262H10.3081V21.9504H0Z"
fill="white"
/>
<path
d="M97.3489 60.8158L113.327 84.8056H124.872L103.431 52.7494L125.284 21.9504H113.842L98.2767 44.9973L82.9176 21.9504H71.3725L92.298 53.2732L70.6509 84.8056H82.0929L97.3489 60.8158Z"
fill="white"
/>
</svg>
</div>
<Link href="#agenda">
<a className="p-8 hover:bg-blue-nx-dark transition cursor-pointer">
Agenda
</a>
</Link>
<Link href="#speakers">
<a className="p-8 hover:bg-blue-nx-dark transition cursor-pointer">
Speakers
</a>
</Link>
<Link href="#workshop">
<a className="p-8 hover:bg-blue-nx-dark transition cursor-pointer">
Workshop
</a>
</Link>
<Link href="#sponsors">
<a className="p-8 hover:bg-blue-nx-dark transition cursor-pointer">
Sponsors
</a>
</Link>
<div className="p-8 col-span-2">
<a
className="flex items-center font-input-mono group w-full"
href="https://ti.to/nrwl/nx-conf-2021?utm_source=nxdev"
>
<span className="group-hover:underline">Register now</span>
<svg
xmlns="http://www.w3.org/2000/svg"
className="ml-1 h-4 w-4 transform-gpu transition ease-out duration-200 group-hover:translate-x-2 "
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2}
d="M13 7l5 5m0 0l-5 5m5-5H6"
/>
</svg>
</a>
</div>
</div>
</div>
</div>
{/*AGENDA*/}
{/*<div className="max-w-screen-lg xl:max-w-screen-xl mx-auto px-5 py-5 text-white">*/}
{/* <div className="mt-24">*/}
{/* <h2 id="agenda" className="my-20 text-3xl font-input-mono">*/}
{/* Agenda*/}
{/* </h2>*/}
{/* </div>*/}
{/*</div>*/}
{/*<ConfSchedule />*/}
<div className="max-w-screen-lg xl:max-w-screen-xl mx-auto px-5 py-5 text-white">
<div className="mt-24">
<h2 id="agenda" className="my-20 text-3xl font-input-mono">
Agenda (EST)
</h2>
</div>
</div>
<ConfSchedule />
{/*SPEAKERS*/}
{/*<div className="max-w-screen-lg xl:max-w-screen-xl mx-auto px-5 py-5 text-white">*/}
{/* <div className="mt-24">*/}
{/* <h2 id="speakers" className="my-20 text-3xl font-input-mono">*/}
{/* Speakers*/}
{/* </h2>*/}
{/* </div>*/}
{/*</div>*/}
{/*<ConfSpeakers />*/}
<div className="max-w-screen-lg xl:max-w-screen-xl mx-auto px-5 py-5 text-white">
<div className="mt-24">
<h2 id="speakers" className="my-20 text-3xl font-input-mono">
Speakers
</h2>
</div>
</div>
<ConfSpeakers />
<div className="max-w-screen-lg xl:max-w-screen-xl mx-auto px-5 py-5 text-white">
{/*WORKSHOP*/}

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.4 KiB