feat: add start section

src/shared/.gitkeep

@@ -1 +0,0 @@
-reusable components

src/shared/ui/button/button.module.scss

@@ -0,0 +1,46 @@
+.Button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 13px 33px;
+  border-radius: 28px;
+
+  font-family: $font-open-sans;
+  font-weight: $font-regular;
+  font-size: 24px;
+  line-height: 1;
+
+  transition: all 0.15s linear;
+  white-space: nowrap;
+
+
+  svg {
+    width: 18px;
+    height: 18px;
+    //fill: var(--text-primary);
+
+    margin-right: 18px;
+  }
+
+  &:hover {
+    cursor: pointer;
+  }
+
+  &:hover svg {
+    fill: var(--white);
+  }
+
+  &_default {
+    background: $color-lightgray;
+    color: $color-text;
+  }
+
+  &_orange {
+    background: $color-orange;
+    color: $color-white;
+  }
+
+  &_disabled {
+    cursor: not-allowed;
+  }
+}

src/shared/ui/button/button.tsx

@@ -0,0 +1,39 @@
+import s from './button.module.scss';
+import { FunctionComponent, HTMLAttributes, ReactNode, SVGProps } from 'react';
+import { clsx } from 'clsx';
+
+type ButtonProps = {
+  className?: string;
+  children?: ReactNode;
+  disabled?: boolean;
+  Icon?: FunctionComponent<SVGProps<SVGSVGElement>>;
+  onClick?: () => void;
+  variant?: 'default' | 'orange' | 'ghost';
+} & HTMLAttributes<HTMLButtonElement>;
+
+export default function Button({
+  className,
+  children,
+  onClick,
+  Icon,
+  disabled,
+  variant = 'default',
+  ...props
+}: ButtonProps) {
+  return (
+    <button
+      className={clsx(
+        s.Button,
+        disabled && s.Button_disabled,
+        s['Button_' + variant],
+        className,
+      )}
+      onClick={onClick}
+      disabled={disabled}
+      {...props}
+    >
+      {Icon && <Icon />}
+      {children}
+    </button>
+  );
+}

src/shared/ui/button/index.ts

@@ -0,0 +1 @@
+export { default as Button } from './button';

src/shared/ui/index.ts

@@ -0,0 +1 @@
+export { Button } from './button';