OffHealth component library

Page header component: List 

<!-- RP 240326 List page - Changed classes -->
<!-- RP 240328 Style fixes - Changed style and removed classes -->
<!-- RP 240411 Style fixes - Changed style and added classes -->
<div style="background-image: linear-gradient(rgba(3, 49, 135, 0.92), rgba(3, 49, 135, 0.92)), url(/images/page-header-2.jpg)" class="bg-top bg-no-repeat bg-cover">
    <!-- RP 240326 List page - Changed classes -->
    <!-- RP 240328 Style fixes - Added style -->
    <!-- RP 240411 Style fixes - Removed style and changed classes -->
    <div class="container py-10 lg:py-12 md:pl-10 lg:pl-16 2xl:px-36 grid gap-6">
        <nav class="n7-breadcrumb " aria-label="Breadcrumb">
            <ol class="flex flex-wrap">

                <li>
                    <a class="inline-flex items-center p-1 text-xs text-white hover:underline" href="#">
                        Home

                        <svg class="inline-block align-middle fill-current w-4 h-4 text-white/50 ml-2" aria-hidden="true" focusable="false" role="img">
                            <use xlink:href="../../icons.svg#mini--chevron-right" />
                        </svg>

                    </a>
                </li>

                <li>
                    <a class="inline-flex items-center p-1 text-xs text-white hover:underline" href="#">
                        livello 1

                        <svg class="inline-block align-middle fill-current w-4 h-4 text-white/50 ml-2" aria-hidden="true" focusable="false" role="img">
                            <use xlink:href="../../icons.svg#mini--chevron-right" />
                        </svg>

                    </a>
                </li>

                <li>
                    <a class="inline-flex items-center p-1 text-xs text-white font-bold hover:underline" href="#" aria-current="page">
                        livello 2

                    </a>
                </li>

            </ol>
        </nav>

        <div class="grid lg:grid-flow-col lg:auto-cols-fr gap-x-12 gap-y-6">
            <!-- RP 240326 List page - Changed classes -->
            <h1 class="n7-display-heading-6 lg:n7-heading-1 n7-content-inverse">Attività di ricerca e pubblicazioni scientifiche</h1>
            <div class="grid gap-4 h-fit">
                <p class="text-lg lg:text-xl n7-content-inverse">Questa sezione è dedicata alla divulgazione degli sforzi e dei risultati scientifici di OFFHEALTH nel campo dell'oftalmologia.</p>

            </div>
        </div>
    </div>
</div>
 
<!-- RP 240326 List page - Changed classes -->
<!-- RP 240328 Style fixes - Changed style and removed classes -->
<!-- RP 240411 Style fixes - Changed style and added classes -->
<div style="background-image: {{bkgOverlay}}, url({{bkgImage}})" class="{{ classes }}">
<!-- RP 240326 List page - Changed classes -->
<!-- RP 240328 Style fixes - Added style -->
<!-- RP 240411 Style fixes - Removed style and changed classes -->
    <div class="container py-10 lg:py-12 md:pl-10 lg:pl-16 2xl:px-36 grid gap-6">
        {% render '@breadcrumb', {items: [{label : 'Home'}, { label : 'livello 1'}, { label : 'livello 2'}], reverseColor: true}, true %}
        <div class="grid lg:grid-flow-col lg:auto-cols-fr gap-x-12 gap-y-6">
<!-- RP 240326 List page - Changed classes -->
            <h1 class="n7-display-heading-6 lg:n7-heading-1 n7-content-inverse">{{ title }}</h1>
            <div class="grid gap-4 h-fit">
                {% if description %}<p class="text-lg lg:text-xl n7-content-inverse">{{description|safe}}</p>{% endif %}
                {% if note %}<p class="text-sm font-bold n7-content-inverse">{{note|safe}}</p>{% endif %}
            </div>
        </div>
    </div>
</div>
 
{
  "minisiteHidden": true,
  "bkgImage": "/images/page-header-2.jpg",
  "bkgOverlay": "linear-gradient(rgba(3, 49, 135, 0.92), rgba(3, 49, 135, 0.92))",
  "classes": "bg-top bg-no-repeat bg-cover",
  "title": "Attività di ricerca e pubblicazioni scientifiche",
  "description": "Questa sezione è dedicata alla divulgazione degli sforzi e dei risultati scientifici di OFFHEALTH nel campo dell'oftalmologia."
}

No notes defined.