Add files via upload

src/componants/footer/copyright-test/CopyRightsText.jsx

@@ -0,0 +1,24 @@
+import { useTranslation } from "react-i18next";
+import s from "./CopyRightsText.module.scss";
+
+const CopyRightsText = () => {
+  const developerProfile = "https://www.linkedin.com/in/moamal-alaa-a4bb15237/";
+  const designerProfile = "https://dribbble.com/mdrimel15";
+  const copyRightTrans = "footer.copyRightsText";
+  const { t } = useTranslation();
+
+  return (
+    <p className={s.copyRights}>
+      <span>{t(`${copyRightTrans}.designedBy`)}</span>
+      <a href={designerProfile} target="_blank">
+        Rimel
+      </a>
+
+      <span>{t(`${copyRightTrans}.codedBy`)}</span>
+      <a href={developerProfile} target="_blank">
+        Moamal Alaa
+      </a>
+    </p>
+  );
+};
+export default CopyRightsText;

src/componants/footer/copyright-test/CopyRightsText.module.scss

@@ -0,0 +1,39 @@
+@import "src/Styles/mixins";
+
+.copyRights {
+  width: fit-content;
+  margin: 0 auto;
+  line-height: 24px;
+}
+
+@include small {
+  .copyRights {
+    font-size: .9rem;
+  }
+}
+
+@media (max-width: 342px) {
+  .copyRights {
+    align-items: flex-start;
+  }
+}
+
+.copyRights>span {
+  color: #F9F9F999;
+}
+
+.copyRights>a {
+  outline: none;
+  text-decoration: underline;
+  color: #F9F9F999;
+  margin: 0 4px;
+
+  &:hover,
+  &:focus-visible {
+    color: var(--white);
+  }
+}
+
+.copyRights>*::selection {
+  background-color: var(--white) !important;
+}