Translatathon pages

public/content/translatathon/details/index.md

@@ -0,0 +1,78 @@
+---
+title: Details and rules
+lang: en
+template: translatathon
+---
+
+![](./participate.png)
+
+The Translatathon is open and anyone can participate by filling out the application form and joining the project in Crowdin.
+
+Translators collect points by suggesting translations for untranslated strings in their language in the Crowdin editor during the translation period (August 9th - August 18th).
+
+Each participants final score is determined by the number of words they have translated during the translation period and any potential multipliers they’ve collected.
+
+### Getting started
+
+The translation process takes place in the ethereum.org project in Crowdin and translators suggest their translations for untranslated strings, made up of almost all of content from the ethereum.org website.
+
+Translations are suggested directly in the online editor so there is no need to download or upload any files or deliverables. Each translated word is tracked and counted.
+
+**1) Join the project**
+- To start contributing, you will need to join the [ethereum.org project in Crowdin](https://crowdin.com/project/ethereum-org)
+- You will need to sign in or create an account - all that is required is an email address and password
+
+**2) Select your language**
+- Find your language on the list of target languages and open it by clicking on its name or flag
+- If you would like to translate into a language that isn’t available, reach out to [Ethereum.org Team](https://crowdin.com/profile/ethdotorg) on crowdin or send us an email to translations@ethereum.org and we will add new additional target languages per request
+
+**3) Open an untranslated file**
+- Find the first untranslated file to start translating. The folders containing the source files are based on priority - (1) Homepage, 2) Essential learning, 3) Essentials, 4) Exploring, etc. so you should start translating the first folder that contains untranslated files
+- Each file has a progress indicator showing how much of the translatable content in the file has been translated and approved… if translation progress for any file is below 100%, please translate it
+
+**4) Translate the untranslated strings**
+- When you open a file to translate, make sure you are only translating untranslated strings!
+- Each string has a status indicator that shows whether it’s *Translated*, *Untranslated*, or *Approved*. If a source string already has a suggested translation in your language, there is no need to translate it
+- You can also filter strings in the editor to show *Untranslated first* or *Untranslated only*
+
+For a detailed guide to navigating and using the Crowdin online editor, we recommend all Translatathon participants to read our ‘[How to translate](https://ethereum.org/en/contributing/translation-program/how-to-translate/)’ guide.
+
+To learn more about the conventions and best practices for translating ethereum.org content, yo can also check out our [translation style guide](https://ethereum.org/en/contributing/translation-program/translators-guide/).
+
+### Prizes
+
+The total prize pool for the Translatathon is 30,000$.
+
+A detailed breakdown of prizes will be announced at the end of the application period.
+
+### Evaluation process
+
+We work with [Acolad](https://www.acolad.com/), a leading localization agency, on all review and QA processes for ethereum.org content.
+
+As part of the evaluation process for the Translatathon, all translations will be subject to a QA and feedback step, where professional linguists will evaluate submissions by individual translators based on quality and accuracy.
+
+We will also be running anti-machine translation measures, with Crowdin providing some tools that automatically detect machine translations.
+
+While translation quality will not play a critical role in the scoring, any participants found using machine translation or suggesting low-quality and inaccurate translations will be disqualified and not eligible to compete for prizes!
+
+The evaluation period will take place between August 19th-28th and the results will be announced on the ethereum.org community call on August 29th.
+
+All translations will also be subject to a thorough review before being added to the website.
+
+### FAQ - Frequently asked questions
+
+<ExpandableCard title="Who can I contact if I need help or have questions, feedback, or ideas?">
+  <ul>
+    <li>In Crowdin, you can send a direct message to <a href="https://crowdin.com/profile/ethdotorg"><strong>Ethereum.org Team</strong></a></li>
+    <li>On the ethereum.org Discord, you can send a message in the <strong>#translatathon</strong> & <strong>#translate</strong> channels</li>
+    <li>You can send an email to <strong>translations@ethereum.org</strong></li>
+  </ul>
+</ExpandableCard>
+
+<ExpandableCard title="Which languages can I translate into?">
+    You can translate into any language! It is recommended to only translate into your native language to ensure sufficient quality, but in short, all language available in Crowdin are in scope for the Translatathon.
+
+    If you want to translate into a language that isn't available in Crowdin, reach out to us and we will add any language per request.
+</ExpandableCard>
+
+<ApplyNow />

public/content/translatathon/index.md

@@ -0,0 +1,99 @@
+---
+title: Translatathon hub
+lang: en
+template: translatathon
+---
+
+<CardContainer>
+  <EmojiCard
+    emoji=':globe_with_meridians:'
+    title='Translate ethereum.org'
+    description='Translate ethereum.org content into your language and help make the website more accessible'
+  />
+  <EmojiCard
+    emoji=':trophy:'
+    title='Win prizes'
+    description='Compete for your share of 30,000$ in prizes and opportunities to win Devcon tickets'
+  />
+  <EmojiCard
+    emoji=':bulb:'
+    title='Learn about Ethereum'
+    description='Learn about different Ethereum related topics while contributing and competing'
+  />
+</CardContainer>
+
+## Introduction
+
+The ethereum.org Translation program is an initiative to translate the website into as many languages as possible in order to make educational content around Ethereum content and onboarding resources for beginners accessible to everyone, regardless of the language they speak.
+
+As part of the Translation program, we are organizing the 2nd edition of the Translatation with the aim of incentivizing translation contributions in less active languages, increasing the number of languages and amount of content available on the site, onboard new contributors and reward our existing ones.
+
+If you are bilingual and want to help make Ethereum content more accessible while competing for prizes, read on to learn more!
+
+[Learn more about the translation program](/contributing/translation-program/)
+
+## Dates and timeline
+
+Here are the important dates for the 2024 Translatathon
+
+<DatesAndTimeline />
+
+<br/><br/>
+
+<TranslatathonInANutshell />
+
+## Participate
+
+![](./participate.png)
+
+### Who should participate
+
+<TwoColumnContent>
+  <CardContent>
+    <h3>Who can participate?</h3>
+    In order to participate, you need to be older than 18 years and fluent in at least one language in addition to English.
+  </CardContent>
+  <CardContent>
+  <h3>Do I need to be a translator?</h3>
+    No. You simply have to be bilingual and suggest human translations (using machine translation is forbidden!) to the best of your ability, no professional experience required.
+  </CardContent>
+</TwoColumnContent>
+
+<TwoColumnContent>
+  <CardContent>
+    <h3>How much time do I have to commit?</h3>
+    As much as you want. The minimum threshold to be eligible for participatory prizes is 100 translated words, which takes about 10-20 minutes to complete, while competing for the top prizes will require a larger time commitment.
+  </CardContent>
+  <CardContent>
+    <h3>Do I need to be familiar with Ethereum?</h3>
+    No. While being familiar with Ethereum can help with your productivity and quality, the Translatathon is as much a learning experience as it is a competition, and everyone is invited to join and learn more about Ethereum while participating.
+  </CardContent>
+</TwoColumnContent>
+
+<TwoColumnContent>
+  <CardContent>
+    <h3>What do I need to participate?</h3>
+    We recommend using a computer to translate since using Crowdin will be optimal on desktop. You’ll also need an internet connection and you’re good to go.
+  </CardContent>
+</TwoColumnContent>
+
+For more details, [see the full Terms & conditions](/translatathon/terms-and-conditions)
+
+### Step by step instructions
+
+<StepByStepInstructions />
+
+## Stay up to date
+
+<!-- TODO: Uncomment when the hubs page is ready -->
+<!-- <TranslationHubCallout>
+  <h3 style={{margin:0}}>Translataton hubs</h3>
+
+  THis year we bring IRL community hugs to join local communities and help translate.
+
+  this hubs are located all over the world, find out if there is one close to you and jion the community
+</TranslationHubCallout> -->
+
+<TranslatathonCalendar />
+
+<ApplyNow />

public/content/translatathon/terms-and-conditions/index.md

@@ -0,0 +1,43 @@
+---
+title: Terms and conditions
+lang: en
+template: translatathon
+---
+
+The Ethereum.org Translation Competition, also referred to as the “Translatathon”, is an experimental initiative by the ethereum.org team to incentivise and reward contributions to the ethereum.org Translation Program.
+
+## Modification and Termination.
+
+We reserve the right to modify the rules or to terminate the Translatathon at any time, without prior notice. All changes will be effective immediately upon announcement.
+
+## Eligibility, Judging, and Prizes
+
+The determination of eligibility, scoring and judging methodology, and prize distribution fall solely and irrevocably under our discretion.
+
+## Data Privacy
+
+By submitting the application form, applicants and participants confirm that they have read and agree to our Privacy Policy and consent to share with us the requested information, which may include information that constitutes personal data. We will keep all information provided confidential, except for the participants’ provided Crowdin usernames and profile images which may be used in public announcements related to competition results and winners.
+
+## Translation Standards
+
+The use of machine translation tools, as determined by us in our sole discretion, may result in disqualification from the competition. In addition, the submission of incorrect and/or inaccurate translations, as determined by us in our sole discretion, may result in ineligibility for prize consideration. Further, any contributions towards strings that have already been translated or reviewed, as determined by us in our sole discretion, will not be included in the participants’ final score. We reserve the right to make such determinations, which shall be final and binding.
+
+## Intellectual Property
+
+Participants agree that by submitting a translation work during the Translatathon, they grant the Ethereum Foundation an irrevocable, non-exclusive, royalty-free licence to use, reproduce, distribute, display, modify, adapt, create derivative works from, and otherwise alter their translation work. Further, participants agree that their translation works may be made publicly available on the ethereum.org website under an open-source licence, including a Creative Commons licence, which allows others to use, share, and build upon the work.
+
+## Taxes
+
+Any tax implications arising from the receipt of prizes are the sole responsibility of the prize recipient.
+
+## Comprehensively Sanctioned Countries
+
+Participants from regions or countries that are subject to comprehensive international sanctions (including, but not limited to Iran, Cuba, Syria, North Korea, and the Crimea, Donetsk People's Republic and Luhansk People's Republic regions of Ukraine) will not be eligible for participation.
+
+## Waiver of Liability
+
+Participants agree that the Ethereum Foundation, its affiliates, and all of their respective officers, directors, employees, and agents will have no liability whatsoever for any injuries, losses, or damages of any kind arising from or in connection with their participation in the Translatathon.
+
+## Governing Law
+
+Any dispute or claim arising out of or relating to the Translatathon (in each case, including non-contractual disputes or claims), shall be governed by and construed in accordance with the laws of Switzerland without giving effect to any choice or conflict of law provision or rule (whether of Switzerland or any other jurisdiction).

src/components/Callout.tsx

@@ -53,7 +53,7 @@ const Callout = ({
           <Image src={image} alt={alt || ""} height={200} />
         </Center>
       )}
-      <Flex direction="column" justify="space-between" mt={10} h="full">
+      <Flex direction="column" justify="space-between" h="full">
         <div>
           {emoji && <Emoji text={emoji} fontSize="5xl" />}
           <OldHeading as="h3" fontSize="2xl" lineHeight={1.4}>

src/components/Hero/ContentHero/index.tsx

@@ -10,14 +10,14 @@ import { CallToAction } from "../CallToAction"
 export type ContentHeroProps = Omit<CommonHeroProps<string>, "header">
 
 const ContentHero = (props: ContentHeroProps) => {
-  const { breadcrumbs, heroImg, buttons, title, description, blurDataURL } =
+  const { breadcrumbs, heroImg, buttons, title, description, blurDataURL, maxHeight } =
     props
   return (
     <Box bgImg="bgMainGradient">
-      <SimpleGrid columns={{ base: 1, lg: 2 }} maxW="1536px" mx="auto">
+      <SimpleGrid columns={{ base: 1, lg: 2 }} maxW="1536px" mx="auto" alignItems='center'>
         <Box
           order={{ lg: 1 }}
-          height={{ base: "300px", md: "400px", lg: "full" }}
+          height={{ base: "300px", md: "400px", lg: maxHeight ? maxHeight : "full" }}
         >
           <Image
             src={heroImg}

src/components/Translatathon/ApplyNow.tsx

@@ -0,0 +1,34 @@
+import { Box, Flex } from "@chakra-ui/react"
+
+import { ButtonLink } from "@/components/Buttons"
+import Callout from "@/components/Callout"
+
+import DolphinImage from "@/public/images/translatathon/translatathon_dolphin.png"
+
+// TODO: Confirm deadline for applying
+
+export const ApplyNow = () => {
+  const dateToday = new Date()
+  const deadline = new Date("August 6, 2024")
+
+  if (dateToday < deadline) {
+    return (
+      <Box pt={12}>
+        <Callout
+          flex="1 1 416px"
+          image={DolphinImage}
+          titleKey="page-translatathon:translatathon-apply-now"
+          descriptionKey="page-translatathon:translatathon-apply-now-desc"
+          alignItems="center"
+          textAlign="center"
+        >
+          <Flex m="auto">
+            <ButtonLink href="/">Apply now</ButtonLink>
+          </Flex>
+        </Callout>
+      </Box>
+    )
+  } else {
+    return <></>
+  }
+}

src/components/Translatathon/CountdownBanner.tsx

@@ -0,0 +1,57 @@
+import { useEffect, useState } from "react"
+
+import BannerNotification from "@/components/Banners/BannerNotification"
+
+export const CountdownBanner = () => {
+  const [countdown, setCountdown] = useState("")
+
+  const translatathonStartDate = new Date("August 9, 2024 12:00:00 UTC")
+  const translatathonEndDate = new Date("August 18, 2024 12:00:00 UTC")
+
+  const calculateCountdown = (targetDate: Date) => {
+    const currentTime = new Date()
+    const timeDifference = targetDate.getTime() - currentTime.getTime()
+
+    const days = Math.floor(timeDifference / (1000 * 60 * 60 * 24))
+    const hours = Math.floor(
+      (timeDifference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)
+    )
+    const minutes = Math.floor(
+      (timeDifference % (1000 * 60 * 60)) / (1000 * 60)
+    )
+    const seconds = Math.floor((timeDifference % (1000 * 60)) / 1000)
+
+    return `${days} days, ${hours} hours, ${minutes} minutes, ${seconds} seconds`
+  }
+
+  useEffect(() => {
+    const interval = setInterval(() => {
+      const newCountdown =
+        new Date() < translatathonStartDate
+          ? calculateCountdown(translatathonStartDate)
+          : calculateCountdown(translatathonEndDate)
+      setCountdown(newCountdown)
+    }, 1000)
+
+    return () => {
+      clearInterval(interval)
+    }
+  }, [])
+
+  return new Date() < translatathonStartDate ? (
+    <>
+      <BannerNotification shouldShow={true}>
+        Translations start in {countdown}
+      </BannerNotification>
+    </>
+  ) : new Date() > translatathonStartDate &&
+    new Date() < translatathonEndDate ? (
+    <>
+      <BannerNotification shouldShow={true}>
+        Translations end in {countdown}
+      </BannerNotification>
+    </>
+  ) : (
+    <></>
+  )
+}