import * as React from "react";
import { GRP } from "storybook/GRP";
import { withKnobs, text, boolean, number } from "@storybook/addon-knobs";

export default {
  title: "Plugins|Web Layouts/Blog",
};
export const Blog01: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="https://assets.website-files.com/5d4fd160326ec183bf464939/5d4fd160326ec12752464a2e_Blog%2015.jpg"
        />
      )}
    </>
  );
};

export const Blog02: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="https://assets.website-files.com/5d4fd160326ec183bf464939/5d4fd160326ec11b73464a65_Blog%2012.jpg"
        />
      )}
    </>
  );
};

export const Blog03: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="https://assets.website-files.com/5d4fd160326ec183bf464939/5d4fd160326ec1386d464a2c_Blog%2014.jpg"
        />
      )}
    </>
  );
};

export const Blog04: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="https://assets.website-files.com/5d4fd160326ec183bf464939/5d4fd160326ec17925464a35_Blog%2018.jpg"
        />
      )}
    </>
  );
};

export const Blog05: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="https://assets.website-files.com/5d4fd160326ec183bf464939/5d4fd160326ec12086464a3f_Blog%2011.jpg"
        />
      )}
    </>
  );
};

export const Blog06: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="https://assets.website-files.com/5d4fd160326ec183bf464939/5d4fd160326ec16991464a48_Blog%209.jpg"
        />
      )}
    </>
  );
};

export const Blog07: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="https://assets.website-files.com/5d4fd160326ec183bf464939/5d4fd160326ec179a0464a32_Blog%2013.jpg"
        />
      )}
    </>
  );
};

export const Blog08: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="https://assets.website-files.com/5d4fd160326ec183bf464939/5d4fd160326ec14525464a36_Blog%204.jpg"
        />
      )}
    </>
  );
};

export const Blog09: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="https://assets.website-files.com/5d4fd160326ec183bf464939/5d4fd160326ec17a23464a39_Blog%2010.jpg"
        />
      )}
    </>
  );
};

export const Blog10: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="https://assets.website-files.com/5d4fd160326ec183bf464939/5d4fd160326ec1dce1464a4a_Blog%208.jpg"
        />
      )}
    </>
  );
};

export const Blog11: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="https://assets.website-files.com/5d4fd160326ec183bf464939/5d4fd160326ec1e206464a3a_Blog%201.jpg"
        />
      )}
    </>
  );
};

export const Blog12: React.FC = () => {
  return (
    <>
      {boolean("Show inspiration", false) && (
        <GRP
          title="Inspiration"
          src="http://ambid-backups.s3.amazonaws.com/screenshots/sandcastle/placeholders/Blog/12.png"
        />
      )}
    </>
  );
};

export const All: React.FC = () => <div />;