Implement ICO details page

[dapyh17d4]

Version history
Version 1.0, Sep 2, 2018 Added design of the desktop and mobile versions
Version 1.1, Sep 4, 2018 Added the coin image to the pages
Version 1.2, Sep 11, 2018 Clarified the random number generation

How can users get to this page
Clicking the sword with the blue background in the ICO comic page will take the users to the ICO details page.

ICO details page design specs

• Clicking "Download whitepaper" will start downloading the whitepaper file. (Whitepaper file to be provided by @sjmackenzie )
• Generate a random number for e. The site's algorithm's p value should match the user's calculation of p when:
• Clicking "Submit" will check whether the user has ticked all the checkboxes of the points and provided the correct answer to the mathematical question.
  Page background color: #a7ddec (Gradient to #58b4cd at the bottom)
  Token details light blue box color: #E8F7FA
  Checkbox (unchecked): border 1px solid #cccccc; (checked) # 58b4cd
  Text field: border 1px solid #cccccc; hint text #cccccc; text #0d3e4c
  Coin image: https://drive.google.com/open?id=1VjF1P87Zb_EdXkPvLntwo-oNOoeX_7Tu

Desktop

Tablet

Phone

• If the answer is correct and all the checkboxes are checked, show the address in a popup.
  Mathematical question light blue box color: #E8F7FA
  Clicking the X icon or outside of the popup box will close the popup.

Desktop

Tablet

Phone

• If the answer is wrong or not all the checkboxes are checked, show an error message and regenerate a new epoch number in the challenge question.
  Error message text color: #ed7a7f
  Missing/incorrect field highlights: 1px solid #ed7a7f

Desktop

Tablet

Phone

[sjmackenzie]

An important point needs to be included on this page:

• add a new checkbox item saying "I agree not to send ADA directly from a hardware wallet as I will not be able to extract the private key from the device and will never be able to clain my LUCEO."

[miguelsimoni]

Hi @sjmackenzie
I have a couple of questions:

• What is the reduction factor of the discount (d)? It's something like 75/42 until reach zero?
• Should I get the current ADA epoch value from the URL you send me a couple of weeks ago?
• Where should I get the value of the exchange rate (x)?

Thanks in advance!

[sjmackenzie]

• reduction factor: the equation is listed here: Implement ICO comic page #187 (comment) in other words it's a constant which starts at 75% discount. So you just plug in 75 and that's it. If you want a different starting discount amount say 99% discount on the first epoch then you put 99 in there.
• Yeah it's probably better NOT to ask for the current ADA<>LUCEO exchange rate by using the current ADA epoch each time instead keep it as the randomly generated epoch between 0~41 epochs, for simplicity sake.
• also better to print the correct message below the text box so that users can see where they went wrong and can correct for things like decimal places and rounding errors.
• you don't need to get the value of the exchange rate (between LUCEO and ADA). You're working out the exchange rate with the above equation.