Skip to content

Added socials in contact form #14

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
cyntaxinc merged 5 commits into from
Jun 25, 2025
Merged

Added socials in contact form #14

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
83bde7f
Merge pull request #2 from Cyntax-Inc/test
cyntaxinc Jun 1, 2025
fc7f1ed
Merge pull request #3 from Cyntax-Inc/qa
cyntaxinc Jun 1, 2025
536a3d1
Merge pull request #8 from Cyntax-Inc/test
cyntaxinc Jun 24, 2025
741f48f
Merge pull request #9 from Cyntax-Inc/qa
cyntaxinc Jun 24, 2025
1b6d9bc
Added socials in contact form
marcelweikum Jun 24, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
100 changes: 100 additions & 0 deletions components/Common/SocialIcons.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,100 @@
import React from "react";

const SocialIcons = () => {
return (
<ul className="flex items-center gap-4">
<li>
<a
href="https://www.linkedin.com/company/cyntaxdevelopers"
target="_blank"
rel="noopener noreferrer"
aria-label="LinkedIn"
className="transition-all duration-300 hover:scale-110"
>
<svg
className="fill-[#D1D8E0] transition-all duration-300 hover:fill-primary"
width="20"
height="20"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g clipPath="url(#clip0_48_1505)">
<path
d="M6.94 5.00002C6.93974 5.53046 6.72877 6.03906 6.35351 6.41394C5.97825 6.78883 5.46944 6.99929 4.939 6.99902C4.40857 6.99876 3.89997 6.78779 3.52508 6.41253C3.1502 6.03727 2.93974 5.52846 2.94 4.99802C2.94027 4.46759 3.15124 3.95899 3.5265 3.5841C3.90176 3.20922 4.41057 2.99876 4.941 2.99902C5.47144 2.99929 5.98004 3.21026 6.35492 3.58552C6.72981 3.96078 6.94027 4.46959 6.94 5.00002ZM7 8.48002H3V21H7V8.48002ZM13.32 8.48002H9.34V21H13.28V14.43C13.28 10.77 18.05 10.43 18.05 14.43V21H22V13.07C22 6.90002 14.94 7.13002 13.28 10.16L13.32 8.48002Z"
fill=""
/>
</g>
<defs>
<clipPath id="clip0_48_1505">
<rect width="24" height="24" fill="white" />
</clipPath>
</defs>
</svg>
</a>
</li>
<li>
<a
href="https://github.com/cyntax-inc"
target="_blank"
rel="noopener noreferrer"
aria-label="GitHub"
className="transition-all duration-300 hover:scale-110"
>
<svg
className="fill-[#D1D8E0] transition-all duration-300 hover:fill-primary"
width="20"
height="20"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g clipPath="url(#clip0_1234_5678)">
<path
d="M12 0.297852C5.371 0.297852 0 5.66785 0 12.2979C0 17.6229 3.438 22.0979 8.207 23.7179C8.807 23.8279 9.025 23.4779 9.025 23.1679C9.025 22.8879 9.015 22.2079 9.009 21.2979C5.672 21.9979 4.968 19.7179 4.968 19.7179C4.422 18.2979 3.633 17.9179 3.633 17.9179C2.547 17.1479 3.717 17.1679 3.717 17.1679C4.922 17.2579 5.554 18.4179 5.554 18.4179C6.633 20.2979 8.421 19.7979 9.07 19.4979C9.175 18.7179 9.487 18.1679 9.832 17.8579C7.164 17.5479 4.344 16.4979 4.344 11.7979C4.344 10.4679 4.801 9.37785 5.566 8.52785C5.447 8.21785 5.057 6.92785 5.672 5.29785C5.672 5.29785 6.693 4.96785 8.998 6.55785C9.981 6.28785 11.033 6.14785 12.084 6.14185C13.135 6.14785 14.187 6.28785 15.17 6.55785C17.473 4.96785 18.492 5.29785 18.492 5.29785C19.109 6.92785 18.717 8.21785 18.598 8.52785C19.365 9.37785 19.818 10.4679 19.818 11.7979C19.818 16.5099 16.991 17.5419 14.314 17.8459C14.751 18.2279 15.14 19.0079 15.14 20.1779C15.14 21.8779 15.123 22.8479 15.123 23.1679C15.123 23.4819 15.337 23.8379 15.948 23.7159C20.721 22.0929 24 17.6199 24 12.2979C24 5.66785 18.627 0.297852 12 0.297852Z"
fill=""
/>
</g>
<defs>
<clipPath id="clip0_1234_5678">
<rect width="24" height="24" fill="white" />
</clipPath>
</defs>
</svg>
</a>
</li>
<li>
<a
href="https://twitter.com/CyntaxDev"
target="_blank"
rel="noopener noreferrer"
aria-label="Twitter"
className="transition-all duration-300 hover:scale-110"
>
<svg
className="fill-[#D1D8E0] transition-all duration-300 hover:fill-primary"
width="20"
height="20"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g clipPath="url(#clip0_48_1502)">
<path
d="M22.162 5.65593C21.3985 5.99362 20.589 6.2154 19.76 6.31393C20.6337 5.79136 21.2877 4.96894 21.6 3.99993C20.78 4.48793 19.881 4.82993 18.944 5.01493C18.3146 4.34151 17.4803 3.89489 16.5709 3.74451C15.6615 3.59413 14.7279 3.74842 13.9153 4.18338C13.1026 4.61834 12.4564 5.30961 12.0771 6.14972C11.6978 6.98983 11.6067 7.93171 11.818 8.82893C10.1551 8.74558 8.52832 8.31345 7.04328 7.56059C5.55823 6.80773 4.24812 5.75098 3.19799 4.45893C2.82628 5.09738 2.63095 5.82315 2.63199 6.56193C2.63199 8.01193 3.36999 9.29293 4.49199 10.0429C3.828 10.022 3.17862 9.84271 2.59799 9.51993V9.57193C2.59819 10.5376 2.93236 11.4735 3.54384 12.221C4.15532 12.9684 5.00647 13.4814 5.95299 13.6729C5.33661 13.84 4.6903 13.8646 4.06299 13.7449C4.32986 14.5762 4.85 15.3031 5.55058 15.824C6.25117 16.345 7.09712 16.6337 7.96999 16.6499C7.10247 17.3313 6.10917 17.8349 5.04687 18.1321C3.98458 18.4293 2.87412 18.5142 1.77899 18.3819C3.69069 19.6114 5.91609 20.2641 8.18899 20.2619C15.882 20.2619 20.089 13.8889 20.089 8.36193C20.089 8.18193 20.084 7.99993 20.076 7.82193C20.8949 7.2301 21.6016 6.49695 22.163 5.65693L22.162 5.65593Z"
fill=""
/>
</g>
<defs>
<clipPath id="clip0_48_1502">
<rect width="24" height="24" fill="white" />
</clipPath>
</defs>
</svg>
</a>
</li>
</ul>
);
};

export default SocialIcons;
10 changes: 9 additions & 1 deletion components/Contact/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
import { motion } from "framer-motion";
import Image from "next/image";
import React, { useState } from "react";
import SocialIcons from "../Common/SocialIcons";

const Contact = () => {
/**
Expand Down Expand Up @@ -156,7 +157,7 @@ const Contact = () => {
htmlFor="default-checkbox"
className="flex max-w-[425px] cursor-pointer select-none pl-5"
>
By clicking Checkbox, you agree to use our “Form” terms
By clicking Checkbox, you agree to use our "Form" terms
And consent cookie usage in browser.
</label>
</div>
Expand Down Expand Up @@ -230,6 +231,13 @@ const Contact = () => {
<a href="#">+1 (864) 256-1502</a>
</p>
</div>

<div className="mt-8">
<h4 className="mb-4 text-metatitle3 font-medium text-black dark:text-white">
Follow Us
</h4>
<SocialIcons />
</div>
</motion.div>
</div>
</div>
Expand Down