02.30 Boxy "ukaž více"

Zdrojové CSS:
/src/css/molecules/box/_showMore.scss

Defaultní

Výchozí molekula pro box typu "zobraz více". Skládá se ze dvou prvků – tlačíka, které box ovládá, a samotného boxu. Tlačítko musí mít třídu .btn-showmore a odkazovat na box přes href="#id-boxu". Box pak musí mít třídu .box-showmore a atribut id.

Ukaž více

Cras varius. Vivamus laoreet. Praesent ac sem eget est egestas volutpat. Suspendisse non nisl sit amet velit hendrerit rutrum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Integer tincidunt. Duis leo. Aenean ut eros et nisl sagittis vestibulum. Maecenas nec odio et ante tincidunt tempus.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam adipiscing. Curabitur suscipit suscipit tellus. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. Pellentesque auctor neque nec urna.

S částečným skrytím obsahu

Oproti defaultní variantě přidává na .box-showmore modifikátor .box-showmore--partial, který nastaví výšku zobrazeného obsahu na 250px.

Pokud je viditelný všechen obsah hned na začátku, tlačítko se skryje.

Cras varius. Vivamus laoreet. Praesent ac sem eget est egestas volutpat. Suspendisse non nisl sit amet velit hendrerit rutrum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Integer tincidunt. Duis leo. Aenean ut eros et nisl sagittis vestibulum. Maecenas nec odio et ante tincidunt tempus.

Ukaž více