diff --git a/public/locales/en/ensvs2.json b/public/locales/en/ensvs2.json index 14a15d823..a9df3484c 100644 --- a/public/locales/en/ensvs2.json +++ b/public/locales/en/ensvs2.json @@ -1,6 +1,6 @@ { "title": "ENSv2: The Next Generation of ENS", - "caption": "Approve your ENS names for ENSv2 now and enjoy automatic migration, paid for by ENS DAO.", + "caption": "After seven years at the frontier of web3 naming, we're re-envisioning ENS on L2.", "accessible": { "title": "Making ENS accessible to more people", "caption": "We're taking our knowledge from the last 7 years at the frontier of web3 naming to re-envision the architecture from the ground up on L2 By utilizing L2s, we're excited to make ENS more accessible to a wider range of users.", diff --git a/src/pages/ens-v2.tsx b/src/pages/ens-v2.tsx index b6be85326..7cb839202 100644 --- a/src/pages/ens-v2.tsx +++ b/src/pages/ens-v2.tsx @@ -1,3 +1,4 @@ +/* stylelint-disable no-descending-specificity */ import { useTranslation } from 'react-i18next' import styled, { css } from 'styled-components' @@ -57,6 +58,32 @@ const Main = styled.main( `, ) +const PartnershipAnnouncement = styled.div( + ({ theme }) => css` + width: ${theme.space.full}; + padding: ${theme.space['4']}; + background-color: ${theme.colors.backgroundPrimary}; + border-radius: ${theme.radii['4xLarge']}; + font-size: ${theme.fontSizes.body}; + font-weight: ${theme.fontWeights.bold}; + display: flex; + justify-content: space-between; + & > a { + color: ${theme.colors.greenDim}; + cursor: pointer; + display: flex; + align-items: center; + gap: ${theme.space['2']}; + } + & > a:hover { + color: ${theme.colors.green}; + } + @media (min-width: 640px) { + border-radius: ${theme.radii['3xLarge']}; + } + `, +) + const Footer = styled.div( ({ theme }) => css` display: flex; @@ -65,17 +92,21 @@ const Footer = styled.div( h3 { text-align: center; } - span { + + & > div { + display: grid; + grid-template-columns: repeat(1, 1fr); + gap: ${theme.space['4']}; + } + & > div a { display: flex; flex-direction: row; align-items: center; gap: ${theme.space['2']}; color: ${theme.colors.green}; } - & > div { - display: grid; - grid-template-columns: repeat(1, 1fr); - gap: ${theme.space['4']}; + & > div a:hover { + color: ${theme.colors.greenDim}; } & > div > div { width: 100%; @@ -105,32 +136,6 @@ const AnnouncementBanner = styled.div( `, ) -const PartnershipAnnouncement = styled.div( - ({ theme }) => css` - width: ${theme.space.full}; - padding: ${theme.space['4']}; - background-color: ${theme.colors.backgroundPrimary}; - border-radius: ${theme.radii['4xLarge']}; - font-size: ${theme.fontSizes.body}; - font-weight: ${theme.fontWeights.bold}; - display: flex; - justify-content: space-between; - & > a { - color: ${theme.colors.greenDim}; - cursor: pointer; - display: flex; - align-items: center; - gap: ${theme.space['2']}; - } - & > a:hover { - color: ${theme.colors.green}; - } - @media (min-width: 640px) { - border-radius: ${theme.radii['3xLarge']}; - } - `, -) - const TopNav = styled.div( ({ theme }) => css` display: flex; @@ -302,12 +307,12 @@ export default function ENSv2() { {t('footer.support.ticket')} - + {t('footer.support.twitter')} - - + + {t('footer.support.dao')} - +