добавил ветку main-page

front/src/components/Footer/Footer.module.css

@@ -0,0 +1,92 @@
+.footer {
+color: #bfbfbf;
+background: #000;
+padding: 60px 0;
+}
+
+
+.container {
+width: 90%;
+margin: 0 auto;
+display: flex;
+align-items: flex-start;
+justify-content: space-between;
+}
+
+
+.left {
+display: flex;
+flex-direction: column;
+gap: 25px;
+}
+
+
+.logo {
+width: 160px;
+opacity: 0.9;
+}
+
+
+.copy {
+font-size: 14px;
+opacity: 0.7;
+}
+
+
+.center {
+display: flex;
+flex-direction: column;
+gap: 14px;
+font-size: 16px;
+}
+
+
+.center a {
+cursor: pointer;
+transition: 0.3s ease;
+}
+
+
+.center a:hover {
+color: #fff;
+}
+
+
+.right {
+text-align: right;
+}
+
+
+.phone {
+color: #fff;
+font-size: 20px;
+font-weight: 600;
+}
+
+
+.mail {
+margin-top: 6px;
+display: inline-block;
+font-size: 16px;
+color: #bfbfbf;
+}
+
+
+.mail:hover {
+color: #fff;
+}
+
+
+/* Mobile */
+@media (max-width: 900px) {
+.container {
+flex-direction: column;
+gap: 40px;
+text-align: center;
+}
+
+
+.right {
+text-align: center;
+}
+}

front/src/components/Footer/Footer.tsx

@@ -0,0 +1,32 @@
+import React from "react";
+import styles from "./Footer.module.css";
+import { NavLink } from "react-router-dom";
+
+const Footer: React.FC = () => {
+return (
+<footer className={styles.footer}>
+<div className={styles.container}>
+<div className={styles.left}>
+<img src="/images/logo-footer.png" alt="logo" className={styles.logo} />
+<span className={styles.copy}>ТРК Спринт. 2017-2025 ©</span>
+</div>
+
+
+<div className={styles.center}>
+<NavLink to="about" >O КОМПАНИИ</NavLink>
+<NavLink to="products" >ПРОДУКЦИЯ</NavLink>
+<a>ПРАЙС-ЛИСТ</a>
+</div>
+
+
+<div className={styles.right}>
+<div className={styles.phone}>+7 910 121 09 62</div>
+<a className={styles.mail}>rkplastic@mail.ru</a>
+</div>
+</div>
+</footer>
+);
+};
+
+
+export default Footer;