add feedback from call

Misfits-Labs · Nov 6, 2023 · 874a57a · 874a57a
1 parent 2b4b6ae
commit 874a57a
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 20 deletions.
diff --git a/src/common/HoveringOrbs/index.tsx b/src/common/HoveringOrbs/index.tsx
@@ -58,6 +58,7 @@ const HoveringOrbs: React.FC<HoveringOrbsProps> = ({ children, isHovering, ...pr
         tw="dark:bg-[#C836E0] 
         pointer-events-none 
         absolute w-[350px] h-[350px]
+        blur-[75px]
         left-[12rem]
         rounded-[100%]
         z-[-27]"
@@ -66,14 +67,16 @@ const HoveringOrbs: React.FC<HoveringOrbsProps> = ({ children, isHovering, ...pr
         dark:bg-[#B80D57] 
         pointer-events-none 
         absolute 
+        blur-[75px]
         w-[350px] 
         h-[350px] 
         rounded-[100%]
         left-[9rem] z-[-26]
         "></div>
         <div className="orb" tw="
         dark:bg-oranjo 
-        pointer-events-none 
+        pointer-events-none
+        blur-[75px] 
         absolute w-[350px] h-[350px] rounded-[100%] 
         left-[3rem] z-[-25]"></div>
       </div>

diff --git a/src/components/GameCard/index.tsx b/src/components/GameCard/index.tsx
@@ -16,13 +16,13 @@ import Button from '../../common/Button';
 import { gsap } from 'gsap'; 
 import { Link } from "react-router-dom";
 import { WegaTypes, WegaTypesEnum } from '../../models';
+import 'twin.macro';
 
 export const DiceGameCard = () => {
   const iconRef = useRef<SVGSVGElement>(null);
   const orbRef = useRef<SVGSVGElement>(null);
   const [hovering, setHovering] = useState<boolean>();
 
-
   useEffect(() => {    
     const ctx = gsap.context(() => {
       const duration = 0.65;
@@ -56,15 +56,16 @@ export const DiceGameCard = () => {
 
   return (
     <GameCardContainer onMouseEnter={() => setHovering(true)} onMouseLeave={() => setHovering(false)} >
-      <GameCardHeader className="flex justify-center items-center">
+      <GameCardHeader tw="flex justify-center items-center">
       <DiceIcon ref={iconRef} width="120px" height="90.7px" />
       <GameCardOrb
         ref={orbRef}
         width='269px'
         height='269px'
         filter="blur(15px)"
         fill= "#C836E0"
-        className="card-orb absolute inset-0 z-40 translate-y-[-1.125rem]" 
+        tw="absolute inset-0 z-40 translate-y-[-1.125rem]"
+        className="card-orb" 
       />
       </GameCardHeader>
       <GameCardBody className="position-inherit">
@@ -73,7 +74,7 @@ export const DiceGameCard = () => {
         Roll the dice, the player with the highest number wins.
       </GameCardDescription>
       {
-        <Link replace={true} to="https://app.wega.fun/#/dice/create" className="w-[75%]" state={ { gameType: WegaTypes[WegaTypesEnum.DICE] }}><Button buttonType="primary" content='Play' className="w-[100%]"/></Link>
+        <Link replace={true} to="https://app.wega.fun/#/dice/create" tw="w-[75%]" state={ { gameType: WegaTypes[WegaTypesEnum.DICE] }}><Button buttonType="primary" content='Play' tw="w-[100%]" /></Link>
       }
       </GameCardBody>
     </GameCardContainer>
@@ -124,7 +125,8 @@ export const CoinFlipGameCard = () => {
       width='269px'
       height='269px'
       filter="blur(15px)"
-      className="card-orb fill-oranjo absolute inset-0 z-40 translate-y-[-1.125rem]" 
+      className="card-orb"
+      tw="fill-oranjo absolute inset-0 z-40 translate-y-[-1.125rem]" 
      />
     </GameCardHeader>
     <GameCardBody>
@@ -134,7 +136,7 @@ export const CoinFlipGameCard = () => {
      </GameCardDescription>
 
      {
-      <Link replace={true} to="https://app.wega.fun/#/coinflip/create" className="w-[75%]" state={ { gameType: WegaTypes[WegaTypesEnum.COINFLIP] } } ><Button buttonType="primary" content='Play' className="w-[100%]" /></Link>
+      <Link replace={true} to="https://app.wega.fun/#/coinflip/create" tw="w-[75%]" state={ { gameType: WegaTypes[WegaTypesEnum.COINFLIP] } } ><Button buttonType="primary" content='Play' tw="w-[100%]" /></Link>
      }
     </GameCardBody>
    </GameCardContainer>
@@ -179,15 +181,16 @@ export const CoinFlipGameCard = () => {
 
   return (
    <GameCardContainer onMouseEnter={() => setHovering(true)} onMouseLeave={() => setHovering(false)}>
-    <GameCardHeader className="flex justify-center items-center relative">
-     <RaffleIcon width="120px" height="143px" ref={iconRef} className="rotate-[25deg] translate-y-[1.125rem]" />
+    <GameCardHeader tw="flex justify-center items-center relative">
+     <RaffleIcon width="120px" height="143px" ref={iconRef} tw="rotate-[25deg] translate-y-[1.125rem]" />
      <GameCardOrb
       ref={orbRef}
       width='269px'
       height='269px'
       filter="blur(15px)"
       fill="#B80D57"
-      className="card-orb absolute inset-0 z-40 translate-y-[-1.125rem]"  
+      className="card-orb"
+      tw="absolute inset-0 z-40 translate-y-[-1.125rem]"  
      />
     </GameCardHeader>
     <GameCardBody>
@@ -199,7 +202,7 @@ export const CoinFlipGameCard = () => {
       buttonType="primary" 
       disabled={true}
       content='Coming soon' 
-      className="w-[75%] dark:bg-gradient-to-r from-oranjo-blanc to-oranjo"/>
+      tw="w-[75%] dark:bg-gradient-to-r from-oranjo-blanc to-oranjo"/>
     </GameCardBody>
    </GameCardContainer>
   )

diff --git a/src/components/LandingHeroPlayerCard/index.tsx b/src/components/LandingHeroPlayerCard/index.tsx
@@ -71,7 +71,7 @@ export const RightPlayerCard = () => {
           ensImage={rightAvatarSource}
           size={26.5} 
         />
-        <NormalText>0000.eth</NormalText>
+        <NormalText>Jared.eth</NormalText>
       </PlayerAvatarWrapper>
       <div tw="flex flex-col gap-y-[16px] items-center w-full">
         <NormalText tw="text-shinishi text-left w-full">Wager: </NormalText>

diff --git a/src/components/LandingPageHeroMobile/index.tsx b/src/components/LandingPageHeroMobile/index.tsx
@@ -14,13 +14,13 @@ const LandingPageHeroMobile = () => {
  return (
   <div tw="relative flex flex-col items-center mt-[85px]" >
    <VersusIcon tw="relative top-0 mt-[-3rem] mx-auto mb-[-1.5rem] z-[20]" />
-   <div tw="relative flex gap-x-[8.5px] self-center ">
+   <div tw="relative flex gap-x-[8.5px] self-center z-[-19]">
     <LeftPlayerCardMobile />
     <RightPlayerCardMobile />
    </div>
    <Dice tw="rounded-[15px] w-[115px] h-[115px] p-[14px] border-[2.5px] mt-[-0.75rem]" diceRef={diceRef} />
    <Button 
-    buttonType="primary" tw="shadow-primary-button py-[9.92px] px-[19.83px] min-w-[162px] min-h-[35px] mt-[5rem]" >
+    buttonType="primary" tw="z-[-20] shadow-primary-button py-[9.92px] px-[19.83px] min-w-[162px] min-h-[35px] mt-[5rem]" >
         Coming soon
       </Button>
   </div>

diff --git a/src/components/LandingPageOwnTheYardSection/index.tsx b/src/components/LandingPageOwnTheYardSection/index.tsx
@@ -44,7 +44,7 @@ const LandingPageOwnTheYardSection = () => {
     onMouseLeave={() => handleGradientBackgroundHover("leave")}
    >
     <div tw="border border-[2px] border-blanc relative w-full h-full flex flex-row items-center justify-center px-[35px] rounded-[25px]">
-     <div tw="flex flex-col ">
+     <div tw="flex flex-col sm:mr-[3rem]">
       <LargeText>Powered by Wega Protocol</LargeText>
       <NormalText tw="text-[21px] leading-[19px] text-blanc">
        The leading NFT betting protocol aimed at expanding NFT use cases across different platforms.

diff --git a/src/containers/NavigationMobile/index.tsx b/src/containers/NavigationMobile/index.tsx
@@ -54,12 +54,8 @@ export const NavigationMobile = () => {
            <Brand tw="font-[32px] font-semibold" ><Link to="/">Wega<span className="font-[32px] dark:text-oranjo">.</span></Link></Brand>
          </BrandContainer>
        </NavigationLinksContainer>
-       <div tw="flex items-end w-[22px]" onClick={toggleNav} ><HamburgerIcon /></div>
+       <div tw="relative flex items-end w-[22px] z-[756]" onClick={toggleNav} ><HamburgerIcon /></div>
      </div>
-
-    {/* <div tw="absolute top-0 right-0 w-full h-full opacity-[0.85] bg-pretu z-[695] shadow-wega-nav transition-wega-nav shadow-inner"></div>  */}
-    {/** box-shadow container */}
-    {/* <div tw="absolute top-0 right-0 w-full h-full z-[690] transition-wega-nav backdrop-blur-[20rem] backdrop-opacity-[0.97]"></div> */}
    </NavigationBar>
    <div ref={mobileLinksContainerRef} tw="z-[800] fixed top-0 w-full flex flex-col items-center translate-y-[-25rem]">
      <div tw="relative flex flex-col mx-auto w-[385px] z-[inherit]">