menu: UI enhancements in desktop sizes

- add product dialog
- enhance product page layout for desktop size

src/components/ItemDescriptionIcons/ItemDescriptionIcons.tsx

@@ -1,14 +1,17 @@
 import DescIcon1 from "components/Icons/item/DescIcon1";
 import DescIcon2 from "components/Icons/item/DescIcon2";
 import DescIcon3 from "components/Icons/item/DescIcon3";
+import { useAppSelector } from "redux/hooks";
 import styles from "./ItemDescriptionIcons.module.css";
 
 export function ItemDescriptionIcons({ className }: { className?: string }) {
+  const { themeName } = useAppSelector((state) => state.theme);
+  const pathColor = themeName === "dark" ? "white" : "#000044";
   return (
     <div className={className}>
-      <DescIcon1 className={styles.descIcon} />
-      <DescIcon2 className={styles.descIcon} />
-      <DescIcon3 className={styles.descIcon} />
+      <DescIcon1 className={styles.descIcon} pathColor={pathColor} />
+      <DescIcon2 className={styles.descIcon} pathColor={pathColor} />
+      <DescIcon3 className={styles.descIcon} pathColor={pathColor} />
     </div>
   );
 }