fix: upcoming button overlap (#3713)

* docs: new resources for jsx and functional components

* fix: upcoming button overlap

src/components/UpcomingForm.astro

@@ -3,7 +3,7 @@ import CaptchaFields from './Captcha/CaptchaFields.astro';
 import Icon from './Icon.astro';
 ---
 
-<div class='my-0 px-5 rounded-lg text-left sm:text-center'>
+<div class='my-0 px-5 rounded-lg text-left sm:text-center sm:pb-10 pb-8'>
   <div class='sm:max-w-[400px] mx-auto'>
     <div class='hidden sm:block'><Icon icon='bell' /></div>
     <h2 class='text-3xl mb-1 font-medium hidden sm:block'>Upcoming</h2>

src/data/roadmaps/react/content/102-components/101-functional-components.md

@@ -5,5 +5,7 @@ Functional components are some of the more common components that will come acro
 Visit the following resources to learn more:
 
 - [Components and Props](https://reactjs.org/docs/components-and-props.html#function-and-class-components)
+- [Your first component](https://react.dev/learn/your-first-component)
+- [Passing props to a component](https://react.dev/learn/passing-props-to-a-component)
 - [Functional Components in React (1)](https://www.geeksforgeeks.org/reactjs-functional-components/)
 - [Functional Components in React (2)](https://www.robinwieruch.de/react-function-component/)

src/data/roadmaps/react/content/102-components/102-jsx.md

@@ -5,5 +5,6 @@ JSX stands for JavaScript XML. It allows writing HTML in JavaScript and converts
 Visit the following resources to learn more:
 
 - [Introduction to JSX](https://reactjs.org/docs/introducing-jsx.html)
+- [Writing markup with JSX](https://react.dev/learn/writing-markup-with-jsx)
 - [JSX in React – Explained with Examples](https://www.freecodecamp.org/news/jsx-in-react-introduction/)
 - [JSX in React on w3school](https://www.w3schools.com/react/react_jsx.asp)