No puede seleccionar más de 25 temas Los temas deben comenzar con una letra o número, pueden incluir guiones ('-') y pueden tener hasta 35 caracteres de largo.
 
 
 
 

1 línea
15 KiB

  1. "use strict";(self.webpackChunk_ihk24_storybook=self.webpackChunk_ihk24_storybook||[]).push([[3407],{"./stories/components/mini-teaser/MiniTeaserComponent.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Y:()=>createMiniTeaser});__webpack_require__("./node_modules/core-js/modules/es.string.link.js"),__webpack_require__("./node_modules/core-js/modules/es.array.join.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.string.split.js");var injectStylesIntoStyleTag=__webpack_require__("./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),miniteaser=__webpack_require__("./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./stories/components/mini-teaser/miniteaser.scss"),options={insert:"head",singleton:!1};injectStylesIntoStyleTag_default()(miniteaser.Z,options);miniteaser.Z.locals;var helpers=__webpack_require__("./stories/_global/scripts/helpers.js"),ButtonComponent=__webpack_require__("./stories/atoms/button/ButtonComponent.js"),createMiniTeaser=function createMiniTeaser(_ref){var _ref$type=_ref.type,type=void 0===_ref$type?"standard":_ref$type,_ref$category=_ref.category,category=void 0===_ref$category?"IHK Mitgliedschaft":_ref$category,_ref$title=_ref.title,title=void 0===_ref$title?"Werden Sie Teil unseres Netzwerks!":_ref$title,_ref$link=_ref.link,link=void 0===_ref$link?"#":_ref$link,_ref$icon=_ref.icon,icon=void 0===_ref$icon?"Roboter":_ref$icon,_ref$buttonlabel=_ref.buttonlabel,buttonlabel=void 0===_ref$buttonlabel?"IHK-Newsletter sichern":_ref$buttonlabel,_ref$backgroundImage=_ref.backgroundImage,backgroundImage=void 0===_ref$backgroundImage?null:_ref$backgroundImage;if("standard"===type){var tile=(0,helpers.az)("a",["tile","mini-teaser",type],null);tile.href=link;var textBox=(0,helpers.az)("div",["text-box"],null,tile);return(0,helpers.az)("div",["category","like-h5"],category,textBox),(0,helpers.az)("div",["title","like-h4"],title,textBox),tile}var _tile=(0,helpers.az)("a",["tile","mini-teaser",type],null);_tile.href=link,backgroundImage&&backgroundImage.length>0&&(_tile.style="background-image: url("+backgroundImage+");",_tile.classList.add("background-image"));var _textBox=(0,helpers.az)("div",["text-box"],null,_tile);return icon&&icon.length>0?((0,helpers.az)("div",["icon-box","pictogram-"+icon.toLowerCase().split(" ").join("-")],null,_textBox),(0,helpers.az)("div",["title","like-h4"],title,_textBox),_textBox.appendChild((0,ButtonComponent.a)({elementType:"span",color:"white",label:buttonlabel,iconPosition:"icon-right",icon:null,preventClick:!1}))):((0,helpers.az)("div",["title","noicon","like-h4"],title,_textBox),_textBox.appendChild((0,ButtonComponent.a)({elementType:"span",color:"white",label:buttonlabel,iconPosition:"icon-right",icon:null,preventClick:!1}))),_tile}},"./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./stories/components/mini-teaser/miniteaser.scss":(module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Z:()=>__WEBPACK_DEFAULT_EXPORT__});var _node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/css-loader/dist/runtime/cssWithMappingToString.js"),_node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(_node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0__),_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/css-loader/dist/runtime/api.js"),___CSS_LOADER_EXPORT___=__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__)()(_node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default());___CSS_LOADER_EXPORT___.push([module.id,'.mini-teaser{position:relative;background-color:#fff;overflow:hidden;width:100%;border-radius:4px;padding:16px 12px;transition:.25s ease;line-height:1.2;text-align:left;text-decoration:none;background-color:var(--theme-grey-light);display:block}.mini-teaser .title{font-size:22px}.mini-teaser.standard::before{content:"";position:absolute;display:block;top:0;left:0;right:0;height:4px;background-color:var(--theme-color-secondary);transition:.2s ease}.mini-teaser.standard:hover::before{height:8px}.mini-teaser h4{font-size:22px}.mini-teaser .text-box{position:relative}.mini-teaser .text-box .mini-container{width:100%;display:flex;flex-direction:column}.mini-teaser.infoteaser{background:linear-gradient(161deg, rgba(var(--theme-color-primary-rgb), 1) 0%, rgba(var(--theme-color-primary-rgb), 0.2) 100%);position:relative}.mini-teaser.infoteaser:after{content:"";position:absolute;left:0;right:0;top:0;bottom:0;z-index:-1;background:linear-gradient(161deg, var(--theme-color-gradient-01) 40%, var(--theme-color-gradient-02) 80%, var(--theme-color-gradient-03) 120%)}.mini-teaser.infoteaser.background-image{background-size:cover}.mini-teaser.infoteaser.background-image:after{position:absolute;top:0;left:0;bottom:0;right:0;z-index:0;content:"";opacity:.6;background:linear-gradient(87deg, #036 12.55%, rgba(1, 40, 81, 0.86) 56.52%, rgba(0, 51, 102, 0) 94.05%);background-blend-mode:overlay}.mini-teaser.infoteaser.background-image .text-box{position:relative;z-index:1}.mini-teaser.infoteaser .title,.mini-teaser.infoteaser .category,.mini-teaser.infoteaser .btn{color:#fff}.mini-teaser.infoteaser .title{margin-top:0;min-height:48px;text-align:left;line-height:24px;margin-bottom:11px;width:100%}.mini-teaser.infoteaser .title.noicon{padding-left:0;min-height:0}.mini-teaser.infoteaser .title.noicon+.btn{margin-left:0}.mini-teaser.infoteaser .icon-box+.title{padding-left:54px}.mini-teaser.infoteaser .icon-box+.mini-container{padding-left:54px}.mini-teaser.infoteaser .btn{background-color:rgba(0,0,0,0);border:1px solid #fff;margin-left:0;align-self:flex-end;display:inline-block;padding:8px 10px;line-height:22px;border-radius:16px;--button-padding: 8px 10px;min-height:0;font-size:22px}.mini-teaser.infoteaser .btn:after{border-radius:16px}.mini-teaser.infoteaser .icon-box{margin-bottom:19px;margin-top:0;padding-top:0;position:absolute;top:0;left:0}.mini-teaser.infoteaser .text-box{padding:0;display:flex;flex-wrap:wrap}.mini-teaser .icon-box{font-family:"Pictograms",sans-serif;line-height:1;color:#fff;font-size:48px}.mini-teaser .category{text-align:left;padding:0;margin:0;margin-bottom:8px;font-size:16px;text-transform:uppercase;line-height:18px}.mini-teaser .title{text-align:left;padding:0;margin:0}',"",{version:3,sources:["webpack://./stories/components/mini-teaser/miniteaser.scss"],names:[],mappings:"AAGA,aACE,iBAAA,CACA,qBAAA,CACA,eAAA,CACA,UAAA,CAEA,iBAAA,CACA,iBAAA,CACA,oBAAA,CACA,eAAA,CACA,eAAA,CACA,oBAAA,CACA,wCAAA,CACA,aAAA,CACA,oBACE,cAAA,CAEF,8BACE,UAAA,CACA,iBAAA,CACA,aAAA,CACA,KAAA,CACA,MAAA,CACA,OAAA,CACA,UAAA,CACA,6CAAA,CACA,mBAAA,CAEF,oCACE,UAAA,CAEF,gBACE,cAAA,CAEF,uBACE,iBAAA,CAEA,uCACE,UAAA,CACA,YAAA,CACA,qBAAA,CAGJ,wBACE,8HAAA,CACA,iBAAA,CACA,8BACE,UAAA,CACA,iBAAA,CACA,MAAA,CACA,OAAA,CACA,KAAA,CACA,QAAA,CACA,UAAA,CACA,+IAAA,CAEF,yCACE,qBAAA,CACA,+CACE,iBAAA,CACA,KAAA,CACA,MAAA,CACA,QAAA,CACA,OAAA,CACA,SAAA,CACA,UAAA,CACA,UAAA,CACA,wGAAA,CACA,6BAAA,CAGF,mDACE,iBAAA,CACA,SAAA,CAGJ,8FACE,UAAA,CAEF,+BACE,YAAA,CACA,eAAA,CACA,eAAA,CACA,gBAAA,CACA,kBAAA,CACA,UAAA,CACA,sCACE,cAAA,CACA,YAAA,CACA,2CACE,aAAA,CAIN,yCACE,iBAAA,CAEF,kDACE,iBAAA,CAEF,6BACE,8BAAA,CACA,qBAAA,CACA,aAAA,CACA,mBAAA,CACA,oBAAA,CACA,gBAAA,CACA,gBAAA,CACA,kBAAA,CACA,0BAAA,CACA,YAAA,CACA,cAAA,CACA,mCACE,kBAAA,CAGJ,kCACE,kBAAA,CACA,YAAA,CACA,aAAA,CACA,iBAAA,CACA,KAAA,CACA,MAAA,CAGF,kCACE,SAAA,CACA,YAAA,CACA,cAAA,CAIJ,uBACE,mCAAA,CACA,aAAA,CACA,UAAA,CACA,cAAA,CAEF,uBACE,eAAA,CACA,SAAA,CACA,QAAA,CACA,iBAAA,CACA,cAAA,CACA,wBAAA,CACA,gBAAA,CAEF,oBACE,eAAA,CACA,SAAA,CACA,QAAA",sourcesContent:["@import '../../_global/styles/mixins';\n@import '../../_global/styles/vars';\n\n.mini-teaser {\n position: relative;\n background-color: white;\n overflow: hidden;\n width: 100%;\n //max-width: 420px;\n border-radius: 4px;\n padding: 16px 12px;\n transition: 0.25s ease;\n line-height: 1.2;\n text-align: left;\n text-decoration: none;\n background-color: var(--theme-grey-light);\n display: block;\n .title{\n font-size: 22px;\n }\n &.standard::before {\n content: \"\";\n position: absolute;\n display: block;\n top: 0;\n left: 0;\n right: 0;\n height: 4px;\n background-color: var(--theme-color-secondary);\n transition: 0.2s ease;\n }\n &.standard:hover::before {\n height: 8px;\n }\n h4{\n font-size: 22px;\n }\n .text-box{\n position: relative;\n\n .mini-container {\n width: 100%;\n display: flex;\n flex-direction: column;\n }\n }\n &.infoteaser{\n background: linear-gradient(161deg, rgba(var(--theme-color-primary-rgb), 1) 0%, rgba(var(--theme-color-primary-rgb), 0.2) 100%);\n position: relative;\n &:after{\n content:\"\";\n position:absolute;\n left:0;\n right:0;\n top:0;\n bottom:0;\n z-index:-1;\n background: linear-gradient(161deg, var(--theme-color-gradient-01) 40%, var(--theme-color-gradient-02) 80%, var(--theme-color-gradient-03) 120%);\n }\n &.background-image{\n background-size:cover;\n &:after{\n position:absolute;\n top:0;\n left:0;\n bottom:0;\n right:0;\n z-index: 0;\n content:\"\";\n opacity: 0.6;\n background: linear-gradient(87deg, #036 12.55%, rgba(1, 40, 81, 0.86) 56.52%, rgba(0, 51, 102, 0.00) 94.05%);\n background-blend-mode: overlay;\n \n }\n .text-box{\n position: relative;\n z-index: 1;\n }\n }\n .title, .category, .btn{\n color:white;\n }\n .title{\n margin-top: 0;\n min-height: 48px;\n text-align: left;\n line-height: 24px;\n margin-bottom: 11px;\n width: 100%;\n &.noicon{\n padding-left: 0;\n min-height: 0;\n + .btn{\n margin-left: 0;\n }\n }\n }\n .icon-box + .title {\n padding-left: 54px;\n }\n .icon-box + .mini-container {\n padding-left: 54px;\n }\n .btn{\n background-color: transparent;\n border: 1px solid white;\n margin-left: 0;\n align-self: flex-end;\n display: inline-block;\n padding:8px 10px;\n line-height: 22px;\n border-radius:16px;\n --button-padding: 8px 10px;\n min-height: 0;\n font-size: 22px;\n &:after{\n border-radius:16px;\n }\n }\n .icon-box{\n margin-bottom: 19px;\n margin-top: 0;\n padding-top: 0;\n position: absolute;\n top: 0;\n left: 0;\n \n }\n .text-box{\n padding: 0;\n display: flex;\n flex-wrap: wrap;\n }\n }\n\n .icon-box {\n font-family: 'Pictograms', sans-serif;\n line-height: 1;\n color: white;\n font-size:48px\n }\n .category{\n text-align: left;\n padding:0;\n margin:0;\n margin-bottom:8px;\n font-size:16px;\n text-transform: uppercase;\n line-height: 18px;\n }\n .title{\n text-align: left;\n padding:0;\n margin:0;\n }\n}\n\n\n\n\n"],sourceRoot:""}]);const __WEBPACK_DEFAULT_EXPORT__=___CSS_LOADER_EXPORT___},"./stories/components/mini-teaser/MiniTeaser.stories.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{StandardMiniTeaser:()=>StandardMiniTeaser,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__,infobanner:()=>infobanner,infobannerBackground:()=>infobannerBackground,infobannerWithoutIcon:()=>infobannerWithoutIcon});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.function.bind.js"),__webpack_require__("./node_modules/core-js/modules/es.error.cause.js"),__webpack_require__("./node_modules/core-js/modules/es.error.to-string.js");var _MiniTeaserComponent__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./stories/components/mini-teaser/MiniTeaserComponent.js");function _extends(){return _extends=Object.assign?Object.assign.bind():function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_extends.apply(this,arguments)}const __WEBPACK_DEFAULT_EXPORT__={title:"Components/Mini Teaser",parameters:{backgrounds:{default:"white"}},argTypes:{type:{name:"Typ",control:{type:"select"},options:["standard","infoteaser"],defaultValue:"standard"},title:{name:"Titel",control:"text",defaultValue:"Schwerpunktthema Digitalisierung"},link:{name:"Link",control:"text",defaultValue:"#"},icon:{name:"Icon",control:{type:"select"},options:["Roboter","Anker","Blitz","Buch Brille","Brexit","Chart","Rettungsring","Magazin"],defaultValue:"Roboter"}}};var MiniTeaser=function MiniTeaser(_ref){var args=_extends({},(function _objectDestructuringEmpty(obj){if(null==obj)throw new TypeError("Cannot destructure "+obj)}(_ref),_ref));return(0,_MiniTeaserComponent__WEBPACK_IMPORTED_MODULE_4__.Y)(Object.assign({},args))},StandardMiniTeaser=MiniTeaser.bind({});StandardMiniTeaser.args={};var infobanner=MiniTeaser.bind({});infobanner.args={type:"infoteaser"};var infobannerWithoutIcon=MiniTeaser.bind({});infobannerWithoutIcon.args={type:"infoteaser",icon:null};var infobannerBackground=MiniTeaser.bind({});infobannerBackground.args={type:"infoteaser",backgroundImage:"./dummy/placeholder-4-3.svg"};var __namedExportsOrder=["StandardMiniTeaser","infobanner","infobannerWithoutIcon","infobannerBackground"];StandardMiniTeaser.parameters={...StandardMiniTeaser.parameters,docs:{...StandardMiniTeaser.parameters?.docs,source:{originalSource:"({\n ...args\n}) => {\n return createMiniTeaser({\n ...args\n });\n}",...StandardMiniTeaser.parameters?.docs?.source}}},infobanner.parameters={...infobanner.parameters,docs:{...infobanner.parameters?.docs,source:{originalSource:"({\n ...args\n}) => {\n return createMiniTeaser({\n ...args\n });\n}",...infobanner.parameters?.docs?.source}}},infobannerWithoutIcon.parameters={...infobannerWithoutIcon.parameters,docs:{...infobannerWithoutIcon.parameters?.docs,source:{originalSource:"({\n ...args\n}) => {\n return createMiniTeaser({\n ...args\n });\n}",...infobannerWithoutIcon.parameters?.docs?.source}}},infobannerBackground.parameters={...infobannerBackground.parameters,docs:{...infobannerBackground.parameters?.docs,source:{originalSource:"({\n ...args\n}) => {\n return createMiniTeaser({\n ...args\n });\n}",...infobannerBackground.parameters?.docs?.source}}}}}]);