hr-design-system-handlebars 1.27.1 → 1.27.2

package/dist/views/components/teaser/ticker/teaser_ticker.hbs

@@ -1,29 +0,0 @@
-<article class="bg-blue-congress rounded-tl-hr rounded-br-hr items-start relative col-span-12 flex {{if this.displayTeaserBodyAsImageOverlay '' 'gap-y-3'}} gap-x-4 
-{{~inline-switch this.teaserSize '["25","33","50"]' '[" md:col-span-3"," md:col-span-4"," md:col-span-6",""]'}}
-{{~#if this.isMobile1to1}} js-is1to1 px-5 sm:px-0 md:flex-col{{else}} flex-col{{/if~}} 
- "
-    x-data="{ avStart: false }"
-    {{#if this.isMobile1to1}}
-            :class="avStart ? 'flex-col' : 'flex-row'"
-    {{/if}}   
-    >
-    {{#if this.teaserImage}}
-        <figure class="{{> components/teaser/utilities/teaser_image_cypress_hook_classes}}relative
-        {{~#if this.isMobile1to1}} basis-2/5 w-2/5 ar-1-1 md:basis-full md:w-full md:ar-16-9{{else}} ar-16-9 w-full{{/if~}}"
-        {{~#if this.isMobile1to1}} :class="{'ar-16-9 w-full basis-full': avStart,'ar-1-1 basis-2/5 w-2/5':!avStart}"{{/if}} >    
-            {{> components/teaser/components/teaser_lead _addClassImg="rounded-tl-hr" _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _teaserType=this.teaserType _aspectRatio=(if this.isMobile1to1 'ar-1-1 md:ar-16-9' (inline-switch this.teaserSize '["25"]' '["ar-1-1 md:ar-16-9", "ar-16-9"]')) }}     
-        </figure>
-        {{#if this.displayTeaserBodyAsImageOverlay}}
-            {{#decorator 'components/teaser/components/teaser_image_overlay' _noOverlayInMobileViewports=true _cssClasses=" relative md:absolute w-full bottom-0"}}
-                <div class="flex flex-col items-center justify-center p-4 border-r border-gray-400 border-dashed basis-1/12">
-                    {{> components/event/instant_dates}}
-                </div>
-                {{> components/teaser/components/teaser_ticker_body _outerCssClasses=(if this.isMobile1to1 'basis-11/12 py-4 sm:px-4 basis-3/5 w-3/5 md:basis-full md:w-full' 'basis-11/12 py-4 sm:px-4')}}
-            {{/decorator}}
-        {{else}}
-            {{> components/teaser/components/teaser_ticker_body _outerCssClasses=(if this.isMobile1to1 'basis-3/5 w-3/5 md:basis-full md:w-full')}}
-        {{/if}}
-    {{else}}
-        {{> components/teaser/components/teaser_ticker_body _outerCssClasses="basis-full"}}
-    {{/if}}
-</article>

package/src/stories/views/components/teaser/components/teaser_ticker_body.hbs

@@ -1,39 +0,0 @@
-<div class="{{#if _outerCssClasses}} {{_outerCssClasses}}{{/if}}" 
-{{~#if this.isMobile1to1}}:class="{'basis-full w-full md:pr-0 pr-10':avStart,'basis-3/5 w-3/5':!avStart}"{{/if}}>
-
-    
-    {{#> components/teaser/components/teaser_header _css=(if this.isMobile1to1 "" "px-5 sm:px-0 mx-4 mb-5")}}
-        {{#>components/base/link _link=this.link _css="cy-teaser-link ds-teaser-focus hover:text-toplineColor" }} 
-            {{#with this.label}}
-                {{#> components/label/label_group}}
-                    {{> components/label/label _type=this.type _text=(loca this.loca)}}
-                    {{> components/label/label_byline _css="ml-2"}}
-                {{/components/label/label_group}}
-            {{/with~}}
-            {{#> components/teaser/components/teaser_headline _headlineTag=this.headlineTag _css="overflow-anywhere hyphens-auto"}}
-                {{#if this.topline}}
-                    {{> components/teaser/components/teaser_topline _css="" _text=this.topline}}
-                {{/if}}
-                {{> components/teaser/components/teaser_title _css="!text-white" _text=this.title _size=this.realTeaserSize _teaserType=this.teaserType _isMobile1to1=this.isMobile1to1}}
-                {{#if this.extendedTitle}}
-                    {{> components/teaser/components/teaser_subline _text=this.extendedTitle}}
-                {{/if}}
-            {{/components/teaser/components/teaser_headline}}
-        {{/components/base/link}} 
-    {{/components/teaser/components/teaser_header}}
-
-    <div class="flex flex-wrap justify-between mx-4 my-5 text-base text-white justify-items-center">
-        {{#if this.hasByline}}
-            <p class="self-center text-xs text-white font-headingSerif empty:hidden overflow-anywhere hyphens-auto">
-                {{~#if this.profiles~}}
-                    <span>{{this.profiles}}</span>
-                {{~/if~}}
-            </p>
-        {{/if}}
-        <a class="underline ds-link" href="{{this.url}}">Zum Ticker</a>
-    </div>
-
-
-
-
-</div>

package/src/stories/views/components/teaser/ticker/teaser_ticker.hbs

@@ -1,29 +0,0 @@
-<article class="bg-blue-congress rounded-tl-hr rounded-br-hr items-start relative col-span-12 flex {{if this.displayTeaserBodyAsImageOverlay '' 'gap-y-3'}} gap-x-4 
-{{~inline-switch this.teaserSize '["25","33","50"]' '[" md:col-span-3"," md:col-span-4"," md:col-span-6",""]'}}
-{{~#if this.isMobile1to1}} js-is1to1 px-5 sm:px-0 md:flex-col{{else}} flex-col{{/if~}} 
- "
-    x-data="{ avStart: false }"
-    {{#if this.isMobile1to1}}
-            :class="avStart ? 'flex-col' : 'flex-row'"
-    {{/if}}   
-    >
-    {{#if this.teaserImage}}
-        <figure class="{{> components/teaser/utilities/teaser_image_cypress_hook_classes}}relative
-        {{~#if this.isMobile1to1}} basis-2/5 w-2/5 ar-1-1 md:basis-full md:w-full md:ar-16-9{{else}} ar-16-9 w-full{{/if~}}"
-        {{~#if this.isMobile1to1}} :class="{'ar-16-9 w-full basis-full': avStart,'ar-1-1 basis-2/5 w-2/5':!avStart}"{{/if}} >    
-            {{> components/teaser/components/teaser_lead _addClassImg="rounded-tl-hr" _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _teaserType=this.teaserType _aspectRatio=(if this.isMobile1to1 'ar-1-1 md:ar-16-9' (inline-switch this.teaserSize '["25"]' '["ar-1-1 md:ar-16-9", "ar-16-9"]')) }}     
-        </figure>
-        {{#if this.displayTeaserBodyAsImageOverlay}}
-            {{#decorator 'components/teaser/components/teaser_image_overlay' _noOverlayInMobileViewports=true _cssClasses=" relative md:absolute w-full bottom-0"}}
-                <div class="flex flex-col items-center justify-center p-4 border-r border-gray-400 border-dashed basis-1/12">
-                    {{> components/event/instant_dates}}
-                </div>
-                {{> components/teaser/components/teaser_ticker_body _outerCssClasses=(if this.isMobile1to1 'basis-11/12 py-4 sm:px-4 basis-3/5 w-3/5 md:basis-full md:w-full' 'basis-11/12 py-4 sm:px-4')}}
-            {{/decorator}}
-        {{else}}
-            {{> components/teaser/components/teaser_ticker_body _outerCssClasses=(if this.isMobile1to1 'basis-3/5 w-3/5 md:basis-full md:w-full')}}
-        {{/if}}
-    {{else}}
-        {{> components/teaser/components/teaser_ticker_body _outerCssClasses="basis-full"}}
-    {{/if}}
-</article>

package/src/stories/views/components/teaser/ticker/teaser_ticker.mdx

@@ -1,10 +0,0 @@
-import { ArgsTable, Meta, Story, Canvas } from '@storybook/blocks'
-import * as TeaserTickerStories from './teaser_ticker.stories'
-
-import ticker from './teaser_ticker.hbs'
-
-<Meta of={TeaserTickerStories} />
-
-<Canvas withToolbar>
-    <Story of={TeaserTickerStories.TickerTeaser100} />
-</Canvas>

package/src/stories/views/components/teaser/ticker/teaser_ticker.stories.js

@@ -1,34 +0,0 @@
-import ticker from './teaser_ticker.hbs'
-import tickerTeaser100Standard from '../fixtures/ticker_teaser_standard_100.json'
-
-const Template = (args, { globals: { customConditionalToolbar } }) => {
-    // You can either use a function to create DOM elements or use a plain html string!
-    // return `<div>${label}</div>`;
-    let brand =
-        undefined !== customConditionalToolbar ? customConditionalToolbar['brands'] : 'hessenschau'
-    return ticker({ brand, ...args })
-}
-
-export default {
-    title: 'Komponenten/Teaser/Ticker',
-
-    parameters: {
-        layout: '',
-    },
-
-    argTypes: {},
-
-    decorators: [
-        (Story) => {
-            return `<div class="grid grid-page"><div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-9.5 sm:col-main">  
-             ${Story()} 
-             </div></div>`
-        },
-    ],
-}
-
-export const TickerTeaser100 = {
-    render: Template.bind({}),
-    name: 'Standard 100',
-    args: tickerTeaser100Standard.logicItem.includeModel,
-}