Biblioteca de componentes

Menu de contenido extenso Menu de tercer nivel alternativo

Es posible incluir fragmentos haciendo uso de la propiedad include.
En este caso llamamos al fragmento '/portal/sistema-diseno/loremExtenso'

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin felis tellus, lacinia sed accumsan non, pretium vel urna. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent felis orci, rhoncus id pulvinar nec, varius ut mi. Ut sed lorem id arcu sagittis iaculis vitae sed augue. Proin quis tellus ac risus aliquet blandit. Cras eleifend venenatis orci a faucibus. Nulla sed egestas nisi. Etiam et placerat eros, ac eleifend risus. Maecenas vel ligula fringilla, placerat erat consequat, vulputate turpis. Quisque sit amet vestibulum felis, eu fringilla enim. Aliquam vehicula ex id blandit tincidunt. Nullam in lacus tempus, tristique risus vel, tristique turpis. Pellentesque ac nisl et nisi vehicula porttitor non vitae dui. Suspendisse sit amet urna eget lectus venenatis interdum. Duis sollicitudin ultrices arcu nec feugiat. Mauris at placerat massa, vitae sodales sem. Aliquam malesuada nibh nec massa posuere ultrices. Praesent eu pulvinar lorem. Pellentesque sed aliquet dolor, vitae maximus eros. Etiam dignissim mattis sapien vel aliquet. Donec ligula velit, tempus id purus quis, faucibus imperdiet tellus. Donec facilisis vel enim vel vestibulum. Proin nec magna pretium magna tincidunt accumsan vitae in orci. Maecenas facilisis, justo at elementum molestie, metus elit molestie nunc, ac imperdiet dui lorem vel nulla. Donec rutrum dignissim tincidunt. Pellentesque arcu neque, rutrum eget semper eget, sollicitudin in ante. Nulla in nibh condimentum, lobortis lacus id, aliquet neque. Nunc sollicitudin dolor dolor, sit amet laoreet enim tincidunt non. Curabitur egestas iaculis finibus. Nam aliquet turpis risus, ac interdum ante dignissim ut. Phasellus vestibulum ornare consectetur. Aliquam imperdiet orci sit amet sem volutpat, vel bibendum tortor luctus. In volutpat risus non purus tempor pellentesque. Cras sodales sapien eu volutpat facilisis. Aenean accumsan vehicula dolor id hendrerit. Fusce rutrum lectus hendrerit massa sollicitudin, eu bibendum magna varius. Phasellus mauris urna, commodo nec enim vitae, tristique suscipit metus. Sed facilisis augue eget sem mollis vulputate. Vestibulum ultrices dolor efficitur lacus vulputate tincidunt. Suspendisse eget orci erat. Morbi at metus nec ante placerat venenatis. Maecenas egestas elit vitae tincidunt ullamcorper. Pellentesque nisi mauris, tristique sed felis ac, varius volutpat nulla. Donec enim ex, suscipit eu venenatis at, imperdiet ut turpis. Sed imperdiet nibh libero, a pulvinar elit hendrerit a. Suspendisse tincidunt urna sem, et pulvinar lorem consequat vel. Suspendisse mattis sapien ac elit ornare, et congue dolor dignissim. Sed sed massa eget sem gravida fermentum. Curabitur molestie vel mauris sed rutrum. Phasellus ut porta tellus, ut mollis nisl. Nunc bibendum sollicitudin urna, eu interdum diam maximus ac. Vestibulum at ultrices dui. Vivamus pretium elit quis hendrerit consequat. Sed tristique lectus sit amet odio dictum consectetur. Sed nec tortor aliquet, sollicitudin turpis vel, semper dui. Proin et urna venenatis, ultrices massa quis, gravida nibh. Donec id laoreet arcu. Etiam at ultrices tellus. Sed elementum sapien nec quam luctus suscipit non ac elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Vestibulum a ligula purus. Curabitur auctor consectetur eros a lacinia. Nulla auctor finibus quam id dapibus. Nullam posuere arcu sed lectus ullamcorper sollicitudin. Fusce aliquam, massa a dapibus faucibus, sem diam mattis est, ut gravida quam erat et turpis. Cras eget posuere purus. Vestibulum at mi in nisl tincidunt dictum. Mauris sed mauris elementum, egestas dolor vel, semper odio.

Es posible manejar índices internos para que la navegación sobre este componente sea mas sencilla

test

elemento interno

Podemos introducir html directamente en la propiedad 'content'

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin felis tellus, lacinia sed accumsan non, pretium vel urna. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent felis orci, rhoncus id pulvinar nec, varius ut mi. Ut sed lorem id arcu sagittis iaculis vitae sed augue. Proin quis tellus ac risus aliquet blandit. Cras eleifend venenatis orci a faucibus. Nulla sed egestas nisi.

Ejemplo:

    
<sede:component 
    fragment="/fragmentos/componentes/collapse-to-tab"
    contentBorder="true"
    json="{'data' : 
    [
        {
            'title': 'Title',
            'include': ''
        },
        {
            'title': 'Title',
            'content': ''
        }
        ]
}">
</sede:component>
Abrir configurador
Globales
Atributo Descripción Valor por defecto
contentBorder Boolean - Especificar si el texto debe ir con borde true
cttColor #hex / color - Color que tomará el menú en activo '#e81b16'
minHeight Number - Tamaño mínimo(en pixels) que debe tomar el contenido. Útil para evitar variaciones de tamaño por distintos tipo de contenido. En el ejemplo de arriba, se puede ver como según el tamaño del texto el contenedor cambia de tamaño. ''
json[data]
Key Descripción Valor por defecto
Title String - Nombre del enlace del menú ' '
Content HTML / string - Define el contenido del cuadro (El HTML debe estar minificado y con las comillas escapadas) ' '
Include URL - Definir la URL de un fragmento, resulta útil cuando se debe trabajar con contenido extenso ''
link URL - Si el elemento debe apuntar a un elemento fuera del propio menú. Ej: Mujer e igualdad >> conocenos >> Plan de igualdad ''
newWindow Boolean - Si el ancla enlaza a un elemento externo a zaragoza.es se debe llamar esta propiedad 'false'
tabID String - Para darle un identificador personalizado al contenido. Útil para trabajar css. Este se incorporará como una clase del contenedor ' '