)
diff --git a/src/pages/components/square.tsx b/src/pages/components/square.tsx
index 444b1a3e..effa6d05 100644
--- a/src/pages/components/square.tsx
+++ b/src/pages/components/square.tsx
@@ -1,7 +1,6 @@
-import styles from '@/styles/Home.module.css';
function Square({children}: {children: React.ReactNode}) {
return (
- A Generic Square
{children}Inspiring sculptors:
@@ -19,7 +24,7 @@ export default function List() {
+
+ 
+
+ )
+}
+
export default function Gallery() {
return (
- 
-
-
- 
-
+
+
+ }/)
);
return 
;
+export default function Profile() {
+ return (
+ );
}
diff --git a/src/pages/qcomps/props_item.tsx b/src/pages/qcomps/props_item.tsx
index 78ba47bf..4a658e12 100644
--- a/src/pages/qcomps/props_item.tsx
+++ b/src/pages/qcomps/props_item.tsx
@@ -1,6 +1,9 @@
import { ItemProps } from "@/types/item";
function Item({ name, isPacked } : ItemProps) {
+ if (isPacked) {
+ return {name}
+ }
return (
{name}
diff --git a/src/pages/qcomps/recipes.tsx b/src/pages/qcomps/recipes.tsx
index 37803925..08f5ca7a 100644
--- a/src/pages/qcomps/recipes.tsx
+++ b/src/pages/qcomps/recipes.tsx
@@ -12,11 +12,32 @@ export const recipes = [{
ingredients: new Set(['chickpeas', 'olive oil', 'garlic cloves', 'lemon', 'tahini'])
}];
+function IngredientList({ingredients}: {ingredients: Set}) {
+ const ingredientsList = Array.from(ingredients);
+ return (
+ ingredientsList.map((ingredient, index) =>
+ {ingredient}
+ )
+ )
+}
+
+function RecipeDiv({name, ingredients, key}: {name: string, ingredients: Set, key: string}) {
+ return (
+
+
-
);
}
\ No newline at end of file
diff --git a/src/pages/qcomps/firstcomp.tsx b/src/pages/qcomps/firstcomp.tsx
index 9cce715e..c3c20bd0 100644
--- a/src/pages/qcomps/firstcomp.tsx
+++ b/src/pages/qcomps/firstcomp.tsx
@@ -1 +1,10 @@
-function MyComp() {}
\ No newline at end of file
+function MyComp() {
+ Welcome to my website!
+
You can find my thoughts here.
And pictures of people!
+
+}
\ No newline at end of file
diff --git a/src/pages/qcomps/gallery_props.tsx b/src/pages/qcomps/gallery_props.tsx
index fc118123..7e619156 100644
--- a/src/pages/qcomps/gallery_props.tsx
+++ b/src/pages/qcomps/gallery_props.tsx
@@ -1,55 +1,64 @@
+interface ProfilePropsType {
+ name: string,
+ profession: string,
+ awards: string,
+ discovered: string,
+ image: {
+ src: string,
+ alt: string,
+ width: number,
+ height: number
+ }
+}
+
+function Profile(props:ProfilePropsType) {
+ const {name, image, profession, awards, discovered} = props;
+ return (
+ My first component
+-
+
- Components: UI Building Block +
- Defining a Component +
- Using a Component +
{name}
+-
+
- + Profession: + {profession} + +
- + Awards: + {awards} + +
- + Discovered: + {discovered} + +
Notable Scientists
-Maria Skłodowska-Curie
-
- -
-
- - Profession: - physicist and chemist - -
- - Awards: 4 - (Nobel Prize in Physics, Nobel Prize in Chemistry, Davy Medal, Matteucci Medal) - -
- - Discovered: - polonium (element) - -
Katsuko Saruhashi
-
- -
-
- - Profession: - geochemist - -
- - Awards: 2 - (Miyake Prize for geochemistry, Tanaka Prize) - -
- - Discovered: - a method for measuring carbon dioxide in seawater - -
- {listItems}
;
+export default function Profile() {
+ return (
+ );
}
diff --git a/src/pages/qcomps/props_item.tsx b/src/pages/qcomps/props_item.tsx
index 78ba47bf..4a658e12 100644
--- a/src/pages/qcomps/props_item.tsx
+++ b/src/pages/qcomps/props_item.tsx
@@ -1,6 +1,9 @@
import { ItemProps } from "@/types/item";
function Item({ name, isPacked } : ItemProps) {
+ if (isPacked) {
+ return
+
+ )
+}
+
export default function RecipeList() {
+ const recipeList = recipes.map(recipe => (
+