diff --git a/packages/example/src/index.tsx b/packages/example/src/index.tsx index a218167..39f58cd 100644 --- a/packages/example/src/index.tsx +++ b/packages/example/src/index.tsx @@ -36,7 +36,7 @@ export const GlobalStyle = createGlobalStyle` } html { - font-family: 'Inter', 'sans-serif'; + font-family: Inter; font-style: normal; } diff --git a/packages/react-components/src/WakuPolling/Poll.tsx b/packages/react-components/src/WakuPolling/Poll.tsx index 7be96c6..494308f 100644 --- a/packages/react-components/src/WakuPolling/Poll.tsx +++ b/packages/react-components/src/WakuPolling/Poll.tsx @@ -82,8 +82,8 @@ export function Poll({ poll, wakuVoting, signer }: PollProps) { } const VotingWrapper = styled.div` - width: 100%; margin-top: 40px; + margin-left: 32px; ` const PollWrapper = styled.div` diff --git a/packages/react-components/src/WakuPolling/PollResults.tsx b/packages/react-components/src/WakuPolling/PollResults.tsx index f7c34f4..cf053c8 100644 --- a/packages/react-components/src/WakuPolling/PollResults.tsx +++ b/packages/react-components/src/WakuPolling/PollResults.tsx @@ -64,14 +64,14 @@ const PollAnswer = styled.div` const PollAnswerWrapper = styled.div` display: flex; + justify-content: flex-start; + align-items: center; + max-width: 65%; ` const PollAnswerText = styled.div` display: inline-block; - height: 100%; - font-weight: 500; - align-items: center; letter-spacing: 1.5px; - text-transform: uppercase; + word-break: break-word; ` const VoteCount = styled.div` @@ -84,6 +84,7 @@ const CheckCircle = styled.div` height: 14px; margin-left: 8px; background-image: url(${checkCircle}); + flex-shrink: 0; ` const ResultInfoWrapper = styled.div` diff --git a/packages/react-components/src/WakuPolling/index.tsx b/packages/react-components/src/WakuPolling/index.tsx index e7b166e..ddb0a30 100644 --- a/packages/react-components/src/WakuPolling/index.tsx +++ b/packages/react-components/src/WakuPolling/index.tsx @@ -91,10 +91,11 @@ const Wrapper = styled.div` display: flex; flex-direction: column; align-items: center; - max-width: 1082px; + max-width: 1146px; position: relative; margin: 0 auto; - padding: 150px 0 50px; + padding: 150px 32px 50px; + width: 100%; @media (max-width: 600px) { padding: 132px 16px 32px; diff --git a/packages/react-components/src/components/radioGroup/RadioButton.tsx b/packages/react-components/src/components/radioGroup/RadioButton.tsx index 717570a..634ae92 100644 --- a/packages/react-components/src/components/radioGroup/RadioButton.tsx +++ b/packages/react-components/src/components/radioGroup/RadioButton.tsx @@ -47,4 +47,5 @@ const TextWrapper = styled.div` margin-left: 16px; font-size: 22px; line-height: 24px; + word-break: break-word; `