_document.js 2.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. import React from 'react';
  2. import Document, { Head, Main, NextScript } from 'next/document';
  3. import { ServerStyleSheet } from 'styled-components';
  4. const style = {
  5. margin: 0,
  6. backgroundColor: '#f3f3f3',
  7. font: '16px/1.45 "Nunito", sans-serif',
  8. overflowX: 'hidden',
  9. color: 'black',
  10. };
  11. class AppDocument extends Document {
  12. static getInitialProps({ renderPage }) {
  13. const sheet = new ServerStyleSheet();
  14. const page = renderPage(App => props => sheet.collectStyles(<App {...props} />));
  15. const styleTags = sheet.getStyleElement();
  16. return { ...page, styleTags };
  17. }
  18. render() {
  19. return (
  20. <html lang="en">
  21. <Head>
  22. <meta charSet="utf-8" />
  23. <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
  24. <meta
  25. name="description"
  26. content="Kutt.it is a free and open source URL shortener with custom domains and stats."
  27. />
  28. <link
  29. href="https://fonts.googleapis.com/css?family=Nunito:300,400,700"
  30. rel="stylesheet"
  31. />
  32. <link rel="icon" sizes="196x196" href="/images/favicon-196x196.png" />
  33. <link rel="icon" sizes="32x32" href="/images/favicon-32x32.png" />
  34. <link rel="icon" sizes="16x16" href="/images/favicon-16x16.png" />
  35. <link rel="apple-touch-icon" href="/images/favicon-196x196.png" />
  36. <link rel="mask-icon" href="/images/icon.svg" color="blue" />
  37. <link rel="manifest" href="manifest.webmanifest" />
  38. <meta name="theme-color" content="#f3f3f3" />
  39. <meta property="fb:app_id" content="123456789" />
  40. <meta property="og:url" content="https://kutt.it" />
  41. <meta property="og:type" content="website" />
  42. <meta property="og:title" content="Kutt.it" />
  43. <meta property="og:image" content="https://kutt.it/images/card.png" />
  44. <meta property="og:description" content="Free & Open Source Modern URL Shortener" />
  45. <meta name="twitter:url" content="https://kutt.it" />
  46. <meta name="twitter:title" content="Kutt.it" />
  47. <meta name="twitter:description" content="Free & Open Source Modern URL Shortener" />
  48. <meta name="twitter:image" content="https://kutt.it/images/card.png" />
  49. {this.props.styleTags}
  50. <script
  51. dangerouslySetInnerHTML={{
  52. __html: `window.recaptchaCallback = function() { window.isCaptchaReady = true; }`,
  53. }}
  54. />
  55. <script src="https://www.google.com/recaptcha/api.js?render=explicit" async defer />
  56. <script src="static/analytics.js" />
  57. </Head>
  58. <body style={style}>
  59. <Main />
  60. <NextScript />
  61. </body>
  62. </html>
  63. );
  64. }
  65. }
  66. export default AppDocument;