♻️ refactor: added styled component for letter g in logotext

Ayngie · Jan 22, 2024 · 7624ad3 · 7624ad3
1 parent 343b62f
commit 7624ad3
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/src/components/layout/header/PageLogo.tsx b/src/components/layout/header/PageLogo.tsx
@@ -1,6 +1,6 @@
 import { Link } from "react-router-dom";
 import logoImg from "/G-logo.png";
-import { LogoTextContainer, LogoWrapper, StyledLogoContainer, StyledLogoImg, StyledLogoText } from "../../styles/layout/header/StyledLogo";
+import { LogoTextContainer, LogoWrapper, StyledLogoContainer, StyledLogoImg, StyledLogoText, LetterG } from "../../styles/layout/header/StyledLogo";
 
 export const PageLogo = () => {
 
@@ -11,7 +11,7 @@ export const PageLogo = () => {
             <StyledLogoImg alt="G-logotype" src={logoImg}></StyledLogoImg>  
             <LogoTextContainer>
               <StyledLogoText>raviditetsdiabetes</StyledLogoText>    
-              <StyledLogoText>uiden</StyledLogoText>
+              <StyledLogoText><LetterG>g</LetterG>uiden</StyledLogoText>    
             </LogoTextContainer>
         </StyledLogoContainer>
       </Link>

diff --git a/src/components/styles/layout/header/StyledLogo.ts b/src/components/styles/layout/header/StyledLogo.ts
@@ -41,6 +41,10 @@ export const StyledLogoText = styled.span `
     }
 `;
 
+export const LetterG = styled.span `
+//make responsive the letter g
+`;
+
 export const LogoWrapper = styled.div `
     padding-top: 4%;
     width: 60%;