Talke Component Library

Textbox: Masked 

<div class="my-12 mask-top" id="c107">
    <div class="mask-bottom
    bg-white
    
  ">
        <div class="px-8 py-mask">
            <div class="mb-12">
                <div class="mx-auto text-center max-w-teaser-intro
  text-talke-blue
  
">
                    <h1 class="mb-3 text-xl font-talke-semibold">
                        Quis speciosus
                    </h1>
                    <h2 class="mb-3 text-2xl uppercase font-talke-semibold">
                        Acceptus averto arguo nihil
                    </h2>
                    <p class="text-sm font-talke-regular text-talke-text-gray">
                        Velut somnus bonus sum campana chirographum aduro cui tempore tunc velum sodalitas talio coma titulus decumbo credo despecto creptio ceno.
                    </p>
                </div>

            </div>
            <div class="flex justify-around">

                <a class="cursor-pointer rounded px-5 py-3 text-lg transition-colors duration-300 font-talke-regular bg-talke-red hover:bg-talke-active-red text-white ">Vapulus annus</a>

            </div>
        </div>
    </div>
</div>
 
{{#ifCond _self.name "==" "simple"}}
<div class="px-8 my-12"
  id="{{id}}">
  {{> text}}
</div>
{{/ifCond}}

{{#ifCond _self.name "==" "masked"}}
{{#> @mask--white}}
<div class="px-8 py-mask">
  {{> text}}
</div>
{{/@mask--white}}
{{/ifCond}}

{{#*inline "text"}}
<div class="mb-12">
  {{#if intro}}
  {{render "@teaser-intro"}}
  {{/if}}
</div>
<div class="flex justify-around">
  {{#if button}}
  {{render "@button--red"}}
  {{/if}}
</div>
{{/inline}}
 
{
  "id": "c107",
  "intro": true,
  "button": true
}

No notes defined.