feat: move haqq website project from frontend repo

.env.example

@@ -0,0 +1,3 @@
+NEXT_PUBLIC_TURNSTILE_SITEKEY=
+NEXT_PUBLIC_POSTHOG_HOST=
+NEXT_PUBLIC_POSTHOG_KEY=

.eslintrc.json

@@ -1,6 +1,6 @@
 {
   "root": true,
-  "ignorePatterns": ["!**/*", ".next/**/*"],
+  "ignorePatterns": ["!**/*", ".next/**/*", "storybook-static"],
   "plugins": ["@nx"],
   "overrides": [
     {

.gitattributes

@@ -0,0 +1 @@
+pnpm-lock.yaml linguist-generated

.gitignore

@@ -1,8 +1,8 @@
 # See http://help.github.com/ignore-files/ for more about ignoring files.
 
 # compiled output
-dist
-tmp
+/dist
+/tmp
 /out-tsc
 
 # dependencies
@@ -25,22 +25,40 @@ node_modules
 !.vscode/extensions.json
 
 # misc
-/.sass-cache
-/connect.lock
-/coverage
-/libpeerconnection.log
-npm-debug.log
-yarn-error.log
-testem.log
+.lock
+.log
 /typings
 
 # System Files
 .DS_Store
 Thumbs.db
 
-.nx/cache
-.nx/workspace-data
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+
+/coverage
+.env
+.log
+
+migrations.json
+package-lock.json
+.vercel
 
 # Next.js
 .next
-out
+.nx/cache
+.nx/workspace-data
+
+# Sentry Config File
+.sentryclirc
+
+# Sentry Config File
+.env.sentry-build-plugin
+
+
+storybook-static

.nvmrc

@@ -0,0 +1 @@
+20.14

.prettierignore

@@ -1,5 +1,9 @@
 # Add files here to ignore them from prettier formatting
 /dist
 /coverage
+/.yarn
+.yarnrc.yml
+.next
 /.nx/cache
-/.nx/workspace-data
+/.nx/workspace-data
+pnpm-lock.yaml

.storybook/decorators.tsx

@@ -0,0 +1,26 @@
+import type { StoryFn, StoryContext } from '@storybook/react';
+
+export function withoutPadding(Story: StoryFn, context: StoryContext) {
+  return (
+    <>
+      <style>{`
+        .sb-show-main { height: 100vh; margin: 0 !important; padding: 0 !important }
+        #storybook-root { width: 100%; height: 100%; }
+      `}</style>
+      <Story {...context} />
+    </>
+  );
+}
+
+export function withStickyEmulation(Story: StoryFn, context: StoryContext) {
+  return (
+    <div className="storybook-sticky-emulation">
+      <style>{`
+        #storybook-root { height: 100vh; width: 100vw; position: relative; }
+      `}</style>
+      <div className="transform-gpu bg-[#252528] bg-opacity-75 backdrop-blur">
+        <Story {...context} />
+      </div>
+    </div>
+  );
+}

.storybook/index.css

@@ -0,0 +1,182 @@
+@import url('https://fonts.googleapis.com/css2?family=El+Messiri:wght@400;700&family=Open+Sans:wght@300;500;700&family=Manrope:wght@200;400;500&display=swap');
+
+@tailwind components;
+@tailwind base;
+@tailwind utilities;
+
+@layer base {
+  input[type='number'] {
+    appearance: textfield;
+
+    &::-webkit-outer-spin-button,
+    &::-webkit-inner-spin-button {
+      appearance: none;
+    }
+  }
+}
+
+@font-face {
+  font-family: 'Clash Display';
+  src: url('../src/assets/fonts/clash-display-medium.woff2') format('woff2');
+  font-weight: 500;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'HK Guise';
+  src: url('../src/assets/fonts/hk-guise-medium.woff2') format('woff2');
+  font-weight: 500;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'HK Guise';
+  src: url('../src/assets/fonts/hk-guise-regular.woff2') format('woff2');
+  font-weight: 400;
+  font-style: normal;
+}
+
+:root {
+  --font-apple: -apple-system, 'BlinkMacSystemFont';
+  --font-fallback: 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell',
+    'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
+  --font-emoji: 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
+  --font-family-base: var(--font-apple), var(--font-fallback), var(--font-emoji);
+
+  --guise-font: 'HK Guise', var(--font-family-base);
+  --clash-font: 'Clash Display', var(--font-family-base);
+  --font-messiri: 'El Messiri', var(--font-family-base);
+  --font-manrope: 'Manrope', var(--font-family-base);
+}
+
+body {
+  @apply bg-haqq-black font-guise text-white;
+}
+
+.ledger-block-background {
+  background-image: url('/assets/images/ledger-block-bg.svg');
+  background-repeat: repeat;
+}
+
+@keyframes rotate-30 {
+  0%,
+  100% {
+    transform: rotate(0deg);
+  }
+  50% {
+    transform: rotate(30deg);
+  }
+}
+
+@keyframes ledger-bounce {
+  0%,
+  20%,
+  40% {
+    transform: translateY(0px);
+    animation-timing-function: ease-out;
+  }
+  10%,
+  30% {
+    transform: translateY(-25px);
+    animation-timing-function: ease-in;
+  }
+}
+
+@keyframes scale-and-fade {
+  0% {
+    opacity: 0;
+    transform: scale(1.01);
+  }
+  50% {
+    opacity: 1;
+  }
+  100% {
+    transform: scale(1.2);
+    opacity: 0;
+  }
+}
+
+.ledger-bounce-animation {
+  animation-name: ledger-bounce;
+  animation-duration: 5s;
+  animation-iteration-count: infinite;
+}
+
+.non-custodial-wallet-animation {
+  animation-name: rotate-30;
+  animation-duration: 12s;
+  animation-iteration-count: infinite;
+  animation-play-state: paused;
+  animation-timing-function: ease-in-out;
+}
+
+.non-custodial-wallet:hover .non-custodial-wallet-animation {
+  animation-play-state: running;
+}
+
+.social-login-animation {
+  opacity: 0;
+}
+
+.social-login:hover .social-login-animation {
+  animation-name: scale-and-fade;
+  animation-duration: 1.7s;
+  animation-iteration-count: infinite;
+  animation-timing-function: ease-in-out;
+}
+
+.social-login-animation:nth-child(1) {
+  animation-delay: 300ms;
+}
+.social-login-animation:nth-child(2) {
+  animation-delay: 600ms;
+}
+.social-login-animation:nth-child(3) {
+  animation-delay: 900ms;
+}
+
+.sunrise-background {
+  background-image: url('/assets/images/sunrise-bg.png');
+  background-repeat: no-repeat;
+  background-size: 100%;
+  background-position: center bottom;
+  z-index: 0;
+}
+
+.anchor-fix {
+  --height: calc(60px + 40px);
+
+  @media screen(sm) {
+    --height: calc(70px + 40px);
+  }
+
+  & [id] {
+    &::before {
+      content: '';
+      display: block;
+      height: var(--height);
+      margin-top: calc(-1 * var(--height));
+    }
+  }
+}
+
+.anchor-fix-blog {
+  --height: calc(60px + 60px);
+
+  @media screen(sm) {
+    --height: calc(70px + 60px);
+  }
+
+  & [id] {
+    &::before {
+      content: '';
+      display: block;
+      height: var(--height);
+      margin-top: calc(-1 * var(--height));
+    }
+  }
+}
+
+.storybook-sticky-emulation {
+  @apply fixed bottom-0 left-0 right-0 z-30;
+}

.storybook/main.ts

@@ -0,0 +1,17 @@
+import type { StorybookConfig } from '@storybook/nextjs';
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.@(stories.@(mdx|js|jsx|ts|tsx))'],
+  addons: ['@storybook/addon-essentials', '@storybook/addon-interactions'],
+
+  framework: {
+    name: '@storybook/nextjs',
+    options: {},
+  },
+};
+
+export default config;
+
+// To customize your webpack configuration you can use the webpackFinal field.
+// Check https://storybook.js.org/docs/react/builders/webpack#extending-storybooks-webpack-config
+// and https://nx.dev/recipes/storybook/custom-builder-configs

.storybook/manager.ts

@@ -0,0 +1,6 @@
+import { addons } from '@storybook/manager-api';
+import { haqqStorybookTheme } from './theme';
+
+addons.setConfig({
+  theme: haqqStorybookTheme,
+});

.storybook/preview.ts

@@ -0,0 +1,35 @@
+import { INITIAL_VIEWPORTS } from '@storybook/addon-viewport';
+import { Preview } from '@storybook/react';
+import './index.css';
+
+const preview: Preview = {
+  parameters: {
+    backgrounds: {
+      default: 'haqq-black',
+      values: [
+        {
+          name: 'haqq-black',
+          value: '#0d0d0e',
+        },
+        {
+          name: 'white',
+          value: '#fff',
+        },
+      ],
+    },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/,
+      },
+    },
+    viewport: {
+      viewports: INITIAL_VIEWPORTS,
+    },
+    nextjs: {
+      appDirectory: true,
+    },
+  },
+};
+
+export default preview;

.storybook/theme.ts

@@ -0,0 +1,9 @@
+import { create } from '@storybook/theming/create';
+
+export const haqqStorybookTheme = create({
+  base: 'dark',
+  brandTitle: 'HAQQ Storybook',
+  brandUrl: 'https://haqq.network',
+  brandImage: 'https://haqq.network/assets/images/haqq-logo-storybook.svg',
+  brandTarget: '_blank',
+});