[UPdate] Add error boundary.

src-ui/app/error_boundary/contacts_container/ContactsContainer.jsx

@@ -0,0 +1,29 @@
+import styles from "./ContactsContainer.module.scss";
+
+export const ContactsContainer = () => {
+    return (
+        <div className={styles.container}>
+            <OpenLinkContainer className={styles.github_issues} href_id="github_issues" text="Github Issues"/>
+            <OpenLinkContainer className={styles.google_forms} href_id="google_forms" text="Google Forms"/>
+        </div>
+    );
+};
+
+import dev_github_icon from "@images/about_vrct/dev_github_icon.png";
+import document from "@images/document.png";
+
+const contacts_links = {
+    github_issues: { img: dev_github_icon, href: "https://github.com/misyaguziya/VRCT/issues" },
+    google_forms: { img: document, href: "https://docs.google.com/forms/d/e/1FAIpQLSei-xoydOY60ivXqhOjaTzNN8PiBQIDcNhzfy6cw2sjYkcg_g/viewform" },
+};
+
+const OpenLinkContainer = ({className, href_id, text}) => {
+    const href = contacts_links[href_id].href;
+    const img = contacts_links[href_id].img;
+    return (
+        <a className={className} href={href} target="_blank" rel="noreferrer" >
+            <img className={styles.contact_button_icon} src={img} />
+            <p className={styles.contact_button_label}>{text}</p>
+        </a>
+    );
+};

src-ui/app/error_boundary/contacts_container/ContactsContainer.module.scss

@@ -0,0 +1,28 @@
+.container {
+    display: flex;
+    gap: 3.2rem;
+}
+
+.github_issues, .google_forms {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+    padding: 1rem;
+    border-radius: 0.4rem;
+    gap: 1rem;
+    &:hover {
+        background-color: var(--dark_800_color);
+    }
+    &:active {
+        background-color: var(--dark_900_color)
+    }
+}
+.contact_button_icon {
+    width: 5.2rem;
+}
+.contact_button_label {
+    font-size: 1.4rem;
+    white-space: nowrap;
+}