873-feat: Update jetbrans logo (#878)

* feat: 873 - update jetBrains logo in partners widget

* feat: 873 - add link to jetBrains website

* feat: 873 - fix typo

* feat: 873 - apply grayscale and lower contrast to JetBrains logo

* feat: 873 - update logo type to mono black

* refactor: 873 - use link-custom component

* feat: 873 - add link to aws website

* feat: 873 - add link to github website

* refactor: 873 - wrap the logos in links inside the Partnered component

* Update src/shared/icons/github.tsx

Co-authored-by: Yuliya Kursevich <[email protected]>

---------

Co-authored-by: Yuliya Kursevich <[email protected]>
Co-authored-by: YulikK <[email protected]>

Author: chmdln

src/shared/assets/svg/jetbrains.svg

@@ -3,5 +3,7 @@ import Image from 'next/image';
 import aws from '@/shared/assets/icons/aws-gray.svg';
 
 export const AwsLogo = () => {
-  return <Image src={aws} alt="AWS icon" />;
+  return (
+    <Image src={aws} alt="AWS icon" />
+  );
 };

src/shared/icons/aws.tsx

@@ -3,5 +3,7 @@ import Image from 'next/image';
 import github from '@/shared/assets/svg/github.svg';
 
 export const GithubLogo = () => {
-  return <Image src={github} alt=" github icon" />;
+  return (
+    <Image src={github} alt="github icon" />
+  );
 };

src/shared/icons/github.tsx

@@ -3,5 +3,12 @@ import Image from 'next/image';
 import jetbrains from '@/shared/assets/svg/jetbrains.svg';
 
 export const JetBrainsLogo = () => {
-  return <Image src={jetbrains} alt="jetbrains icon" />;
+  return (
+    <Image
+      src={jetbrains}
+      style={{ filter: 'grayscale(100%) contrast(15%)' }}
+      width={200}
+      alt="jetbrains icon"
+    />
+  );
 };

src/shared/icons/jetbrains.tsx

@@ -55,10 +55,10 @@ export const LinkCustom = ({
 }: LinkCustomProps) => {
   const resolveIcon = (): ReactNode => {
     switch (true) {
-      case external && variant === 'textLink':
-        return <TextLinkIcon />;
       case icon !== undefined:
         return icon;
+      case external && variant === 'textLink':
+        return <TextLinkIcon />;
       case variant === 'secondary':
         return <ArrowIcon />;
       case variant === 'rounded':

src/shared/ui/link-custom/link-custom.tsx

@@ -19,7 +19,7 @@
       justify-content: space-between;
 
       width: 100%;
-      max-width: 500px;
+      max-width: 600px;
       padding: 16px;
 
       .partner-logo-container {

src/widgets/partnered/partnered.scss

@@ -1,4 +1,5 @@
 import { AwsLogo, GithubLogo, JetBrainsLogo } from '@/shared/icons';
+import { LinkCustom } from '@/shared/ui/link-custom';
 import { WidgetTitle } from '@/shared/ui/widget-title';
 
 import './partnered.scss';
@@ -9,13 +10,31 @@ export const Partnered = () => (
       <WidgetTitle size="small">Partnered with</WidgetTitle>
       <div className="partners">
         <div className="partner-logo-container">
-          <JetBrainsLogo />
+          <LinkCustom
+            href="https://www.jetbrains.com"
+            external
+            icon={null}
+          >
+            <JetBrainsLogo />
+          </LinkCustom>
         </div>
         <div className="partner-logo-container">
-          <AwsLogo />
+          <LinkCustom
+            href="https://aws.amazon.com/"
+            external
+            icon={null}
+          >
+            <AwsLogo />
+          </LinkCustom>
         </div>
         <div className="partner-logo-container">
-          <GithubLogo />
+          <LinkCustom
+            href="https://github.com/"
+            external
+            icon={null}
+          >
+            <GithubLogo />
+          </LinkCustom>
         </div>
       </div>
     </div>