From db

README.md

@@ -3,5 +3,5 @@
 
 ## CHEF POINT Menu
 
-This is a very simple app that nicely displays scheduled dishes from a JSON file. It automatically discards dishes from the past. Supports Dark Mode
+This is a very simple app that nicely displays scheduled dishes from MongoDB. It automatically discards dishes from the past. Supports Dark Mode
 and large screen formats.

components/day/Day.js

@@ -42,9 +42,9 @@ export default function Day({ content }) {
         {content.special_day ? <div className={styles.specialDayIcon}>{content.special_day.icon}</div> : null}
       </div>
       <div className={styles.dishes}>
-        <Dish type={'vegan'} name={content.vegan} />
-        <Dish type={'fish'} name={content.fish} />
-        <Dish type={'meat'} name={content.meat} />
+        <Dish type={'vegan'} name={content.dishes.vegan} />
+        <Dish type={'fish'} name={content.dishes.fish} />
+        <Dish type={'meat'} name={content.dishes.meat} />
       </div>
     </div>
   );

components/dish/Dish.js

@@ -35,8 +35,8 @@ export default function Dish({ type, name }) {
       >
         {label}
       </h2>
-      <p className={styles.pt}>{name.pt}</p>
-      <p className={styles.en}>{name.en}</p>
+      <p className={styles.pt}>{name ? name.title_pt : ''}</p>
+      <p className={styles.en}>{name ? name.title_en : ''}</p>
     </div>
   );
 }

components/info/Info.js

@@ -0,0 +1,5 @@
+import styles from './Info.module.css';
+
+export default function Info({ text }) {
+  return <div className={styles.container}>{text}</div>;
+}

components/info/Info.module.css

@@ -0,0 +1,8 @@
+.container {
+  width: 100%;
+  text-align: center;
+  padding-top: 50px;
+  font-size: 30px;
+  font-weight: var(--font-medium);
+  color: var(--gray-4);
+}