oddsgate-ds 1.0.168 → 1.0.171

package/src/components/molecules/ShareModal/ShareModal.theme.ts

@@ -1,103 +1,103 @@
-import { colors, radius, responsiveMedia, spaces, typography } from '@/styles/variables';
-import styled, { css } from 'styled-components';
-
-import { IShareModal } from './ShareModal.interface';
-import { fontSize } from '@/styles/utilities';
-
-export const StyledModal = styled.div<IShareModal>`
-  color: ${colors.third50};
-
-  & a {
-    display: inline-block;
-    width: 50%;
-
-    text-decoration: none;
-    text-align: center;
-    padding: ${spaces[3]};
-
-    & > div {
-      display: flex;
-      width: 3.2rem;
-      height: 3.2rem;
-      line-height: 3.2rem;
-      border-radius: 50%;
-      color: ${colors.secondary50};
-      background: ${colors.third50};
-      margin: auto;
-      transition: all 0.3s ease;
-
-      & i {
-        color: currentColor;
-        font-size: 1.6rem;
-        margin: auto;
-      }
-    };
-
-    &:hover {
-      & > div {
-        background: ${colors.primary50}
-      }
-    };
-
-    @media only screen and (min-width: ${responsiveMedia}) {
-      width: 25%;
-    }
-  }
-`;
-
-export const StyledInput = styled.div<IShareModal>`
-  position: relative;
-  background: ${colors.white};
-  border: 1px solid ${colors.primary20};
-  border-radius: ${radius.sm};
-  padding: ${spaces[2]} ${spaces[3]};
-  cursor: pointer;
-
-  & span {
-    color: ${colors.gray90};
-    display: block;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    max-width: 90%;
-  };
-
-  & i {
-    position: absolute;
-    top: 50%;
-    right: ${spaces[2]};
-    color: ${colors.black};
-    font-size: 18px;
-    transform: translateY(-50%)
-  }
-`;
-
-export const StyledMessage = styled.div<IShareModal>`
-  position: absolute;
-  bottom: 1.5rem;
-  left: 50%;
-
-  display: inline-block;
-  vertical-align: top;
-
-  color: ${colors.white};
-  background-color: ${colors.primary50};
-
-  cursor: pointer;
-  padding: ${spaces[2]} ${spaces[4]};
-  ${fontSize('texts')};
-
-  border-radius: ${radius.lg};
-
-  opacity: 0;
-  visibility: hidden;
-  transform: translate(-50%, 3rem);
-  transition: all 0.3s ease;
-
-  &.active {
-    opacity: 1;
-    visibility: visible;
-    transform: translate(-50%, 0)
-  }
-`;
-
+import { colors, radius, responsiveMedia, spaces, typography } from '@/styles/variables';
+import styled, { css } from 'styled-components';
+
+import { IShareModal } from './ShareModal.interface';
+import { fontSize } from '@/styles/utilities';
+
+export const StyledModal = styled.div<IShareModal>`
+  color: ${colors.third50};
+
+  & a {
+    display: inline-block;
+    width: 50%;
+
+    text-decoration: none;
+    text-align: center;
+    padding: ${spaces[3]};
+
+    & > div {
+      display: flex;
+      width: 3.2rem;
+      height: 3.2rem;
+      line-height: 3.2rem;
+      border-radius: 50%;
+      color: ${colors.secondary50};
+      background: ${colors.third50};
+      margin: auto;
+      transition: all 0.3s ease;
+
+      & i {
+        color: currentColor;
+        font-size: 1.6rem;
+        margin: auto;
+      }
+    };
+
+    &:hover {
+      & > div {
+        background: ${colors.primary50}
+      }
+    };
+
+    @media only screen and (min-width: ${responsiveMedia}) {
+      width: 25%;
+    }
+  }
+`;
+
+export const StyledInput = styled.div<IShareModal>`
+  position: relative;
+  background: ${colors.white};
+  border: 1px solid ${colors.primary20};
+  border-radius: ${radius.sm};
+  padding: ${spaces[2]} ${spaces[3]};
+  cursor: pointer;
+
+  & span {
+    color: ${colors.gray90};
+    display: block;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    max-width: 90%;
+  };
+
+  & i {
+    position: absolute;
+    top: 50%;
+    right: ${spaces[2]};
+    color: ${colors.black};
+    font-size: 18px;
+    transform: translateY(-50%)
+  }
+`;
+
+export const StyledMessage = styled.div<IShareModal>`
+  position: absolute;
+  bottom: 1.5rem;
+  left: 50%;
+
+  display: inline-block;
+  vertical-align: top;
+
+  color: ${colors.white};
+  background-color: ${colors.primary50};
+
+  cursor: pointer;
+  padding: ${spaces[2]} ${spaces[4]};
+  ${fontSize('texts')};
+
+  border-radius: ${radius.lg};
+
+  opacity: 0;
+  visibility: hidden;
+  transform: translate(-50%, 3rem);
+  transition: all 0.3s ease;
+
+  &.active {
+    opacity: 1;
+    visibility: visible;
+    transform: translate(-50%, 0)
+  }
+`;
+

package/src/components/molecules/ShareModal/index.ts

@@ -1 +1 @@
-export { default } from './ShareModal.component'
+export { default } from './ShareModal.component'

package/src/components/molecules/TeamCard/TeamCard.component.tsx

@@ -1,31 +1,31 @@
-import Heading from '@/components/atoms/Heading'
-import { ITeamCard } from './TeamCard.interface'
-import ImageWrapper from '@/components/atoms/ImageWrapper'
-import React from 'react'
-import SocialLinks from '@/components/atoms/SocialLinks/SocialLinks.component'
-import { StyledTeamCard } from './TeamCard.theme'
-
-const TeamCard = ({
-  title,
-  imageElement,
-  role,
-  description,
-  ...props
-}: ITeamCard) => {
-  return (
-    <StyledTeamCard
-      imageElement={
-        <ImageWrapper aspectRatioHeight={78}>{imageElement}</ImageWrapper>
-      }
-    >
-      <Heading tag={'span'} size={'captions'} className={'text-uppercase mt-4'}>
-        {role}
-      </Heading>
-      <Heading tag={'span'} size={'h6'} className={'fw-light mt-2'}>
-        {title}
-      </Heading>
-    </StyledTeamCard>
-  )
-}
-
-export default TeamCard
+import Heading from '@/components/atoms/Heading'
+import { ITeamCard } from './TeamCard.interface'
+import ImageWrapper from '@/components/atoms/ImageWrapper'
+import React from 'react'
+import SocialLinks from '@/components/atoms/SocialLinks/SocialLinks.component'
+import { StyledTeamCard } from './TeamCard.theme'
+
+const TeamCard = ({
+  title,
+  imageElement,
+  role,
+  description,
+  ...props
+}: ITeamCard) => {
+  return (
+    <StyledTeamCard
+      imageElement={
+        <ImageWrapper aspectRatioHeight={78}>{imageElement}</ImageWrapper>
+      }
+    >
+      <Heading tag={'span'} size={'captions'} className={'text-uppercase mt-4'}>
+        {role}
+      </Heading>
+      <Heading tag={'span'} size={'h6'} className={'fw-light mt-2'}>
+        {title}
+      </Heading>
+    </StyledTeamCard>
+  )
+}
+
+export default TeamCard

package/src/components/molecules/TeamCard/TeamCard.interface.ts

@@ -1,7 +1,7 @@
-import { ICard } from '../Card/Card.interface';
-
-export interface ITeamCard extends ICard {
-  title?: string
-  role?: string,
-  description?: string | React.ReactElement
-}
+import { ICard } from '../Card/Card.interface';
+
+export interface ITeamCard extends ICard {
+  title?: string
+  role?: string,
+  description?: string | React.ReactElement
+}

package/src/components/molecules/TeamCard/TeamCard.stories.tsx

@@ -1,33 +1,33 @@
-import type { Meta, StoryObj } from '@storybook/react'
-
-import { ITeamCard } from './TeamCard.interface'
-import React from 'react'
-import TeamCard from './TeamCard.component'
-
-// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
-export default {
-  title: 'Components/TeamCard',
-  component: TeamCard,
-  tags: ['autodocs']
-} as Meta
-
-const image = (
-  <img
-    width="100%"
-    height="100%"
-    sizes="100vw"
-    decoding="async"
-    src="/assets/placeholder.png"
-    alt="Empty state"
-  />
-)
-
-export const Simple: StoryObj<ITeamCard> = {
-  render: args => <TeamCard {...args} style={{ maxWidth: '220px' }}></TeamCard>,
-  args: {
-    role: 'Lorem ipsum',
-    title: 'Lorem ipsum',
-    imageElement: image,
-    description: 'Cras vel facilisis tellus'
-  }
-}
+import type { Meta, StoryObj } from '@storybook/react'
+
+import { ITeamCard } from './TeamCard.interface'
+import React from 'react'
+import TeamCard from './TeamCard.component'
+
+// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
+export default {
+  title: 'Components/TeamCard',
+  component: TeamCard,
+  tags: ['autodocs']
+} as Meta
+
+const image = (
+  <img
+    width="100%"
+    height="100%"
+    sizes="100vw"
+    decoding="async"
+    src="/assets/placeholder.png"
+    alt="Empty state"
+  />
+)
+
+export const Simple: StoryObj<ITeamCard> = {
+  render: args => <TeamCard {...args} style={{ maxWidth: '220px' }}></TeamCard>,
+  args: {
+    role: 'Lorem ipsum',
+    title: 'Lorem ipsum',
+    imageElement: image,
+    description: 'Cras vel facilisis tellus'
+  }
+}

package/src/components/molecules/TeamCard/TeamCard.theme.ts

@@ -1,12 +1,12 @@
-import styled, { css } from 'styled-components';
-
-import Card from '../Card/Card.component';
-import { ITeamCard } from './TeamCard.interface';
-import { colors } from '@/styles/variables';
-
-export const StyledTeamCard = styled(Card) <ITeamCard>`
-  overflow: hidden;
-  margin-bottom: 24px;
-  pointer-events: none;
-`;
-
+import styled, { css } from 'styled-components';
+
+import Card from '../Card/Card.component';
+import { ITeamCard } from './TeamCard.interface';
+import { colors } from '@/styles/variables';
+
+export const StyledTeamCard = styled(Card) <ITeamCard>`
+  overflow: hidden;
+  margin-bottom: 24px;
+  pointer-events: none;
+`;
+

package/src/components/molecules/TeamCard/index.ts

@@ -1 +1 @@
-export { default } from "./TeamCard.component";
+export { default } from "./TeamCard.component";