diff --git a/.storybook/main.js b/.storybook/main.js
index cf45e8ed0..19532941d 100644
--- a/.storybook/main.js
+++ b/.storybook/main.js
@@ -3,6 +3,6 @@ module.exports = {
   addons: [
     '@storybook/addon-links',
     '@storybook/addon-essentials',
-    '@storybook/preset-typescript',
+    // '@storybook/preset-typescript',
   ],
 }
diff --git a/.storybook/webpack.config.js b/.storybook/webpack.config.js
index 1c6556da0..6204804f4 100644
--- a/.storybook/webpack.config.js
+++ b/.storybook/webpack.config.js
@@ -1,20 +1,20 @@
 const path = require('path')
 
 module.exports = ({ config }) => {
-  config.module.rules[0].use[0].loader = require.resolve('babel-loader')
-  config.module.rules[0].use[0].options.presets = [
-    require.resolve('@babel/preset-react'),
-    require.resolve('@babel/preset-env'),
-  ]
+  // config.module.rules[0].use[0].loader = require.resolve('babel-loader')
+  // config.module.rules[0].use[0].options.presets = [
+  //   require.resolve('@babel/preset-react'),
+  //   require.resolve('@babel/preset-env'),
+  // ]
 
-  config.module.rules.push({
-    test: /\.(ts|tsx)$/,
-    loader: require.resolve('babel-loader'),
-    options: {
-      presets: [['react-app', { flow: false, typescript: true }]],
-      plugins: [],
-    },
-  })
+  // config.module.rules.push({
+  //   test: /\.(ts|tsx)$/,
+  //   loader: require.resolve('babel-loader'),
+  //   options: {
+  //     presets: [['react-app', { flow: false, typescript: true }]],
+  //     plugins: [],
+  //   },
+  // })
 
   // Remove the existing css rule
   config.module.rules = config.module.rules.filter(
diff --git a/src/components/Button/index.stories.tsx b/src/components/Button/index.stories.tsx
new file mode 100644
index 000000000..1b75d2467
--- /dev/null
+++ b/src/components/Button/index.stories.tsx
@@ -0,0 +1,60 @@
+import React from 'react'
+// also exported from '@storybook/react' if you can deal with breaking changes in 6.1
+import { Story, Meta } from '@storybook/react'
+
+import Button, { ButtonProps, ButtonSize } from './'
+
+const story: Meta = {
+  title: 'Button',
+  component: Button,
+  argTypes: {
+    disabled: {
+      control: {
+        type: 'boolean',
+      },
+    },
+    size: {
+      defaultValue: ButtonSize.Normal,
+      control: {
+        type: 'select',
+        options: [ButtonSize.Normal, ButtonSize.Small],
+      },
+    },
+    inverted: {
+      defaultValue: false,
+      control: {
+        type: 'boolean',
+      },
+    },
+    onClick: { action: 'click' },
+    onFocus: { action: 'focus' },
+    onBlur: { action: 'blur' },
+  },
+}
+
+const Template: Story<ButtonProps> = (args: ButtonProps) => <Button {...args} />
+
+export const Default = Template.bind({})
+Default.args = {
+  children: 'Button',
+}
+
+export const Inverted = Template.bind({})
+Inverted.args = {
+  children: 'Button',
+  inverted: true,
+}
+
+export const Small = Template.bind({})
+Small.args = {
+  children: 'Button',
+  size: ButtonSize.Small,
+}
+
+export const Disabled = Template.bind({})
+Disabled.args = {
+  children: 'Button',
+  disabled: true,
+}
+
+export default story
diff --git a/src/components/Button/index.tsx b/src/components/Button/index.tsx
index 0f112779f..40bf446f2 100644
--- a/src/components/Button/index.tsx
+++ b/src/components/Button/index.tsx
@@ -2,8 +2,8 @@ import * as React from 'react'
 import * as S from './styles'
 
 export enum ButtonSize {
-  Normal,
-  Small,
+  Normal = 'Normal',
+  Small = 'Small',
 }
 
 export interface StyledButtonProps {
diff --git a/src/components/ButtonAsLink/index.tsx b/src/components/ButtonAsLink/index.tsx
index f05a9bc94..adc8417e3 100644
--- a/src/components/ButtonAsLink/index.tsx
+++ b/src/components/ButtonAsLink/index.tsx
@@ -3,6 +3,11 @@ import styled from 'styled-components'
 import { ButtonSize, StyledButtonProps } from '../Button'
 import { applyButtonStyles } from '../Button/styles'
 
+/**
+ * The component is used where we need to have
+ * a Button which behaves AS a Link
+ */
+
 const StyledButton = styled.a<StyledButtonProps>`
   ${(p) =>
     applyButtonStyles({
diff --git a/src/components/Link/index.stories.tsx b/src/components/Link/index.stories.tsx
new file mode 100644
index 000000000..e9752d008
--- /dev/null
+++ b/src/components/Link/index.stories.tsx
@@ -0,0 +1,55 @@
+import React from 'react'
+// also exported from '@storybook/react' if you can deal with breaking changes in 6.1
+import { Story, Meta } from '@storybook/react'
+
+import Link, { LinkProps } from './'
+import { ButtonSize } from '../Button'
+
+const story: Meta = {
+  title: 'Link',
+  component: Link,
+  argTypes: {
+    href: {
+      defaultValue: 'https://cesko.digital/',
+      control: {
+        type: 'text',
+      },
+    },
+    disabled: {
+      control: {
+        type: 'boolean',
+      },
+    },
+    size: {
+      defaultValue: ButtonSize.Normal,
+      control: {
+        type: 'select',
+        options: [ButtonSize.Normal, ButtonSize.Small],
+      },
+    },
+    onClick: { action: 'click' },
+    onFocus: { action: 'focus' },
+    onBlur: { action: 'blur' },
+  },
+}
+
+const Template: Story<LinkProps> = (args: LinkProps) => <Link {...args} />
+
+export const Default = Template.bind({})
+Default.args = {
+  children: 'Link',
+}
+
+export const Small = Template.bind({})
+Small.args = {
+  children: 'Link',
+  size: ButtonSize.Small,
+}
+
+export const Disabled = Template.bind({})
+Disabled.args = {
+  children: 'Link',
+  disabled: true,
+}
+
+export default story
diff --git a/src/components/LinkAsButton/index.tsx b/src/components/LinkAsButton/index.tsx
index 96de43618..36afc297f 100644
--- a/src/components/LinkAsButton/index.tsx
+++ b/src/components/LinkAsButton/index.tsx
@@ -4,6 +4,11 @@ import styled from 'styled-components'
 import { applyLinkStyles } from '../Link/styles'
 import { StyledLinkProps } from '../Link'
 
+/**
+ * The component is used where we need to have
+ * a Link which behaves AS a Button
+ */
+
 const StyledLink = styled.button<StyledLinkProps>`
   ${(p) => applyLinkStyles({ size: p.size, disabled: p.disabled })}
 `
diff --git a/stories/example/Button.stories.tsx b/stories/example/Button.stories.tsx
deleted file mode 100644
index 3ed7d1248..000000000
--- a/stories/example/Button.stories.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import React from 'react'
-// also exported from '@storybook/react' if you can deal with breaking changes in 6.1
-import { Story, Meta } from '@storybook/react'
-
-import { Button, ButtonProps } from './Button'
-
-const story: Meta = {
-  title: 'Example/Button',
-  component: Button,
-  argTypes: {
-    backgroundColor: { control: 'color' },
-  },
-}
-
-const Template: Story<ButtonProps> = (args: ButtonProps) => <Button {...args} />
-
-export const Primary = Template.bind({})
-Primary.args = {
-  primary: true,
-  label: 'Button',
-}
-
-export const Secondary = Template.bind({})
-Secondary.args = {
-  label: 'Button',
-}
-
-export const Large = Template.bind({})
-Large.args = {
-  size: 'large',
-  label: 'Button',
-}
-
-export const Small = Template.bind({})
-Small.args = {
-  size: 'small',
-  label: 'Button',
-}
-
-export default story
diff --git a/stories/example/Button.tsx b/stories/example/Button.tsx
deleted file mode 100644
index 572c28a52..000000000
--- a/stories/example/Button.tsx
+++ /dev/null
@@ -1,52 +0,0 @@
-import React from 'react'
-import './button.css'
-
-export interface ButtonProps {
-  /**
-   * Is this the principal call to action on the page?
-   */
-  primary?: boolean
-  /**
-   * What background color to use
-   */
-  backgroundColor?: string
-  /**
-   * How large should the button be?
-   */
-  size?: 'small' | 'medium' | 'large'
-  /**
-   * Button contents
-   */
-  label: string
-  /**
-   * Optional click handler
-   */
-  onClick?: () => void
-}
-
-/**
- * Primary UI component for user interaction
- */
-export const Button: React.FC<ButtonProps> = ({
-  primary = false,
-  size = 'medium',
-  backgroundColor,
-  label,
-  ...props
-}: ButtonProps) => {
-  const mode = primary
-    ? 'storybook-button--primary'
-    : 'storybook-button--secondary'
-  return (
-    <button
-      type="button"
-      className={['storybook-button', `storybook-button--${size}`, mode].join(
-        ' '
-      )}
-      style={{ backgroundColor }}
-      {...props}
-    >
-      {label}
-    </button>
-  )
-}
diff --git a/stories/example/button.css b/stories/example/button.css
deleted file mode 100644
index dc91dc763..000000000
--- a/stories/example/button.css
+++ /dev/null
@@ -1,30 +0,0 @@
-.storybook-button {
-  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-  font-weight: 700;
-  border: 0;
-  border-radius: 3em;
-  cursor: pointer;
-  display: inline-block;
-  line-height: 1;
-}
-.storybook-button--primary {
-  color: white;
-  background-color: #1ea7fd;
-}
-.storybook-button--secondary {
-  color: #333;
-  background-color: transparent;
-  box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 0px 1px inset;
-}
-.storybook-button--small {
-  font-size: 12px;
-  padding: 10px 16px;
-}
-.storybook-button--medium {
-  font-size: 14px;
-  padding: 11px 20px;
-}
-.storybook-button--large {
-  font-size: 16px;
-  padding: 12px 24px;
-}
diff --git a/stories/postcss.config.js b/stories/postcss.config.js
deleted file mode 100644
index 4ba52ba2c..000000000
--- a/stories/postcss.config.js
+++ /dev/null
@@ -1 +0,0 @@
-module.exports = {}