Added SocialBadge, moved assets
Niklas Schrötler
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 2.8 KiB |
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 7.5 KiB After Width: | Height: | Size: 7.5 KiB |
|
Before Width: | Height: | Size: 3.3 KiB After Width: | Height: | Size: 3.3 KiB |
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 5.2 KiB After Width: | Height: | Size: 5.2 KiB |
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
|
|
@ -1,14 +0,0 @@
|
|||
import React from "react"
|
||||
import Logo from "../../assets/square-logo.svg"
|
||||
|
||||
export interface HeroProps {
|
||||
title?: string
|
||||
}
|
||||
|
||||
export const Hero: React.FC<HeroProps> = () => {
|
||||
return (
|
||||
<div>
|
||||
<h1 className="bg-red-100 dark:bg-red-900">Hallo Jakob</h1>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,16 +1,16 @@
|
|||
import React from "react"
|
||||
import { Story, Meta } from "@storybook/react/types-6-0"
|
||||
import { Hero, HeroProps } from "."
|
||||
import { SocialBadge, SocialBadgeProps } from "."
|
||||
|
||||
export default {
|
||||
title: "Component/Hero",
|
||||
component: Hero,
|
||||
title: "Component/SocialBadge",
|
||||
component: SocialBadge,
|
||||
argTypes: {
|
||||
title: { control: "string" }
|
||||
}
|
||||
} as Meta
|
||||
|
||||
const Template: Story<HeroProps> = (args) => <Hero {...args} />
|
||||
const Template: Story<SocialBadgeProps> = (args) => <SocialBadge {...args} />
|
||||
|
||||
// Default scenario
|
||||
export const Default = Template.bind({})
|
||||
15
src/components/SocialBadge/index.tsx
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
import React from "react"
|
||||
import Logo from "../../assets/square-logo.svg"
|
||||
|
||||
export interface SocialBadgeProps {
|
||||
title?: string
|
||||
}
|
||||
|
||||
export const SocialBadge: React.FC<SocialBadgeProps> = () => {
|
||||
return (
|
||||
<a className="block bg-white rounded-full shadow-lg p-2.5 flex w-max items-center cursor-pointer transition-transform transform hover:scale-105 focus:outline-none focus:ring" href={"https://google.com"}>
|
||||
<img className="flex rounded-full" src={"/assets/icons/github.svg"} />
|
||||
<div className="mx-4 font-semibold text-xl">GitHub</div>
|
||||
</a>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,6 +1,4 @@
|
|||
import Head from "next/head"
|
||||
import "../components/Hero"
|
||||
import { Hero } from "../components/Hero"
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
|
|
@ -8,7 +6,7 @@ export default function Home() {
|
|||
<Head>
|
||||
<title>nwex.de</title>
|
||||
</Head>
|
||||
<Hero />
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
|
|||