Fix latest comments

Author: PelayoFelgueroso

packages/lib/src/footer/Footer.test.tsx

@@ -135,16 +135,16 @@ describe("Footer component tests", () => {
 
 describe("getContrastColor function", () => {
   test("should return black color for light backgrounds", () => {
-    expect(getContrastColor("#FFFFFF")).toBe("#000000");
-    expect(getContrastColor("#F5F5F5")).toBe("#000000");
-    expect(getContrastColor("rgb(255, 255, 255)")).toBe("#000000");
-    expect(getContrastColor("rgb(245, 245, 245)")).toBe("#000000");
+    expect(getContrastColor("#FFFFFF")).toBe("var(--color-fg-neutral-dark)");
+    expect(getContrastColor("#F5F5F5")).toBe("var(--color-fg-neutral-dark)");
+    expect(getContrastColor("rgb(255, 255, 255)")).toBe("var(--color-fg-neutral-dark)");
+    expect(getContrastColor("rgb(245, 245, 245)")).toBe("var(--color-fg-neutral-dark)");
   });
 
   test("should return white color for dark backgrounds", () => {
-    expect(getContrastColor("#000000")).toBe("#FFFFFF");
-    expect(getContrastColor("#333333")).toBe("#FFFFFF");
-    expect(getContrastColor("rgb(0, 0, 0)")).toBe("#FFFFFF");
-    expect(getContrastColor("rgb(51, 51, 51)")).toBe("#FFFFFF");
+    expect(getContrastColor("#000000")).toBe("var(--color-fg-neutral-bright)");
+    expect(getContrastColor("#333333")).toBe("var(--color-fg-neutral-bright)");
+    expect(getContrastColor("rgb(0, 0, 0)")).toBe("var(--color-fg-neutral-bright)");
+    expect(getContrastColor("rgb(51, 51, 51)")).toBe("var(--color-fg-neutral-bright)");
   });
 });

packages/lib/src/footer/Footer.tsx

@@ -101,12 +101,17 @@ const RightContainer = styled.div<{ width: number }>`
 `;
 
 const SocialAnchor = styled.a`
-  height: fit-content;
+  height: var(--dimensions-28);
+  aspect-ratio: 1 / 1;
   border-radius: var(--border-radius-s);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border: 2px solid transparent;
+  box-sizing: border-box;
 
   &:focus {
-    outline: var(--border-width-m) var(--border-style-default) var(--border-color-secondary-medium);
-    outline-offset: var(--border-width-m);
+    border-color: var(--border-color-secondary-medium);
   }
 `;
 
@@ -115,7 +120,7 @@ const SocialIconContainer = styled.div`
   align-items: center;
   color: var(--color-fg-primary-strong);
   overflow: hidden;
-  font-size: var(--height-s);
+  font-size: var(--height-xs);
 
   svg {
     height: var(--height-xs);
@@ -203,7 +208,7 @@ const Copyright = styled.div<{ width: number }>`
   ${(props) =>
     getResponsiveStyles.isLargeScreen(props.width) &&
     css`
-      grid-column-start: 2;
+      grid-column-start: 3;
     `}
 
   ${(props) =>

packages/lib/src/footer/Icons.tsx

@@ -5,57 +5,57 @@ export const dxcLogo = (
       <path
         d="M171.5-54.124v12.539h-3.6V-54.124h-4.973v-3.191h13.54v3.191H171.5"
         transform="translate(-68.528 65.45)"
-        fill="var(--color-fg-primary-strong)"
+        fill="#6f4b97"
       />
       <path
         d="M189.96-41.585V-57.315h12.326v3.079h-8.753v3.191h7.7v3.078h-7.7v3.3h8.87v3.078H189.96"
         transform="translate(-77.56 65.45)"
-        fill="var(--color-fg-primary-strong)"
+        fill="#6f4b97"
       />
       <path
         d="M223.558-41.438a8.1,8.1,0,0,1-8.382-8.1v-.045a8.161,8.161,0,0,1,8.522-8.146,8.6,8.6,0,0,1,6.444,2.431l-2.289,2.543a6.133,6.133,0,0,0-4.178-1.778,4.743,4.743,0,0,0-4.738,4.905v.045a4.752,4.752,0,0,0,4.738,4.95,6,6,0,0,0,4.295-1.845l2.288,2.228a8.491,8.491,0,0,1-6.7,2.813"
         transform="translate(-86.019 65.583)"
-        fill="var(--color-fg-primary-strong)"
+        fill="#6f4b97"
       />
       <path
         d="M254.988-41.585V-47.9h-6.63v6.315h-3.6V-57.315h3.6v6.225h6.63v-6.225h3.594v15.731h-3.594"
         transform="translate(-95.903 65.45)"
-        fill="var(--color-fg-primary-strong)"
+        fill="#6f4b97"
       />
       <path
         d="M285.991-41.585l-7.914-10v10h-3.549V-57.315h3.316l7.657,9.685v-9.685h3.549v15.731h-3.058"
         transform="translate(-105.869 65.45)"
-        fill="var(--color-fg-primary-strong)"
+        fill="#6f4b97"
       />
       <path
         d="M317.2-49.583a4.869,4.869,0,0,0-4.949-4.95,4.793,4.793,0,0,0-4.9,4.905v.045a4.869,4.869,0,0,0,4.949,4.95,4.793,4.793,0,0,0,4.9-4.905Zm-4.949,8.145c-5.043,0-8.661-3.623-8.661-8.1v-.045c0-4.478,3.666-8.146,8.708-8.146s8.66,3.623,8.66,8.1v.045c0,4.477-3.664,8.145-8.708,8.145"
         transform="translate(-115.631 65.583)"
-        fill="var(--color-fg-primary-strong)"
+        fill="#6f4b97"
       />
       <path
         d="M336.786-41.585V-57.315h3.6v12.584h8.148v3.146H336.786"
         transform="translate(-126.654 65.45)"
-        fill="var(--color-fg-primary-strong)"
+        fill="#6f4b97"
       />
       <path
         d="M372.78-49.583a4.87,4.87,0,0,0-4.949-4.95,4.794,4.794,0,0,0-4.9,4.905v.045a4.869,4.869,0,0,0,4.949,4.95,4.794,4.794,0,0,0,4.9-4.905Zm-4.949,8.145c-5.043,0-8.662-3.623-8.662-8.1v-.045c0-4.478,3.666-8.146,8.708-8.146s8.661,3.623,8.661,8.1v.045c0,4.477-3.666,8.145-8.708,8.145"
         transform="translate(-135.016 65.583)"
-        fill="var(--color-fg-primary-strong)"
+        fill="#6f4b97"
       />
       <path
         d="M399.735-41.438c-5.09,0-8.592-3.443-8.592-8.1v-.045a8.243,8.243,0,0,1,8.568-8.146,9.18,9.18,0,0,1,6.42,2.16l-2.265,2.634a6.141,6.141,0,0,0-4.272-1.6,4.807,4.807,0,0,0-4.692,4.905v.045a4.8,4.8,0,0,0,4.949,4.995,5.89,5.89,0,0,0,3.384-.945v-2.25h-3.618v-2.992h7.1v6.841a10.837,10.837,0,0,1-6.98,2.5"
         transform="translate(-145.284 65.583)"
-        fill="var(--color-fg-primary-strong)"
+        fill="#6f4b97"
       />
       <path
         d="M428.664-47.855v6.27h-3.6v-6.2l-6.28-9.528h4.2L426.89-51l3.968-6.315h4.085l-6.28,9.46"
         transform="translate(-154.162 65.45)"
-        fill="var(--color-fg-primary-strong)"
+        fill="#6f4b97"
       />
       <path
         d="M84.218-55.737a10.063,10.063,0,0,1,2.589-4.4,9.792,9.792,0,0,1,6.985-2.77h11.328V-69.3H93.792a17.041,17.041,0,0,0-11.8,4.759,16.344,16.344,0,0,0-3.547,5.115,13.247,13.247,0,0,0-1.122,3.688Zm0,4.877a10.065,10.065,0,0,0,2.589,4.4,9.793,9.793,0,0,0,6.985,2.77h11.328V-37.3H93.792a17.042,17.042,0,0,1-11.8-4.759,16.339,16.339,0,0,1-3.547-5.114,13.251,13.251,0,0,1-1.122-3.688ZM63.1-47.98,54.45-37.3H45.873l12.957-16-12.957-16H54.45L63.1-58.619l8.65-10.68h8.578l-12.957,16,12.957,16H71.749ZM48.875-55.737a13.212,13.212,0,0,0-1.122-3.688,16.359,16.359,0,0,0-3.546-5.115,17.043,17.043,0,0,0-11.8-4.759H21.08v6.393H32.408a9.79,9.79,0,0,1,6.985,2.77,10.072,10.072,0,0,1,2.59,4.4Zm0,4.877a13.215,13.215,0,0,1-1.122,3.688,16.353,16.353,0,0,1-3.546,5.114,17.044,17.044,0,0,1-11.8,4.759H21.08v-6.393H32.408a9.791,9.791,0,0,0,6.985-2.77,10.074,10.074,0,0,0,2.59-4.4h6.892"
         transform="translate(-21.08 69.298)"
-        fill="var(--color-fg-primary-strong)"
+        fill="#6f4b97"
       />
     </g>
   </svg>