diff --git a/gfi-ihk-2024/stories/components/mini-teaser/MiniTeaser.stories.js b/gfi-ihk-2024/stories/components/mini-teaser/MiniTeaser.stories.js index ed912a7..30048ad 100644 --- a/gfi-ihk-2024/stories/components/mini-teaser/MiniTeaser.stories.js +++ b/gfi-ihk-2024/stories/components/mini-teaser/MiniTeaser.stories.js @@ -11,8 +11,8 @@ export default { type: { name: 'Typ', control: {type: 'select'}, - options: ['single-topic'], - defaultValue: 'single-topic', + options: ['standard', 'infobanner'], + defaultValue: 'standard', }, title: { name: 'Titel', @@ -37,5 +37,8 @@ const MiniTeaser = ({...args}) => { return createMiniTeaser({...args}); } -export const SingleMiniTeaser = MiniTeaser.bind({}); -SingleMiniTeaser.args = {}; +export const StandardMiniTeaser = MiniTeaser.bind({}); +StandardMiniTeaser.args = {}; + +export const infobanner = MiniTeaser.bind({}); +infobanner.args = {type:'infobanner'}; diff --git a/gfi-ihk-2024/stories/components/mini-teaser/MiniTeaserComponent.js b/gfi-ihk-2024/stories/components/mini-teaser/MiniTeaserComponent.js index dc42510..1a6f3c9 100644 --- a/gfi-ihk-2024/stories/components/mini-teaser/MiniTeaserComponent.js +++ b/gfi-ihk-2024/stories/components/mini-teaser/MiniTeaserComponent.js @@ -1,18 +1,21 @@ import './miniteaser.scss'; import {createElement} from "../../_global/scripts/helpers"; - +import { createButton } from '../../atoms/button/ButtonComponent'; export const createMiniTeaser = ({ - type = 'single-topic', + type = 'standard', title = 'Hallo Welt', link = '#', icon = 'Eule Doktorhut', + buttonlabel = 'mehr erfahren', }) => { - const tile = createElement(type === 'single-topic' ? 'a' : 'div', ['tile', 'topic-teaser', 'mini-teaser', type], null); + const tile = createElement('div', ['tile', 'topic-teaser', 'mini-teaser', type === 'infobanner' ? 'infob' :'standard', type], null); tile.href = link; createElement('div', ['icon-box', 'pictogram-' + icon.toLowerCase().split(' ').join('-')], null, tile); const textBox = createElement('div', ['text-box'], null, tile); createElement('h4', ['title'], title, textBox); - + if (type === 'infobanner') { + textBox.appendChild(createButton({color: 'white', label: buttonlabel, iconPosition: 'icon-right', icon: null})) + } return tile; } \ No newline at end of file