Kimera - Ui kit library for the web coding

The tester theme of official project in github

➜ CARDS CONCEPT:

simple explandible cards.

❯❯ Full area cliccable elements

The basic of card is a full area div clickable. So, if you put link into card and click on card... you go on the url.

Be attention: link valid is only the card > direct child last link

My Clickable Card!

return to index

❯❯ Expandible Card

Same class and structure but... try to click...

My Expansive Card!

The contents box will appear and disappear with the expansion of the card

from hidden to show

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit sit amet lectus in mattis. Nullam mollis, ipsum ut posuere congue, enim risus auctor est, id varius nulla erat at metus. Nunc finibus odio sed sapien lacinia accumsan. Sed a venenatis elit. Duis luctus scelerisque enim, rutrum dictum nisi tincidunt ut. Donec nibh elit, sodales quis placerat a, condimentum vitae est. Phasellus eu tempus nulla, sed feugiat neque.

Interdum et malesuada fames ac ante ipsum primis in faucibus. Vivamus eu vehicula nulla. Fusce ultrices magna sapien, nec commodo ipsum pulvinar eu. In nec dolor tincidunt, commodo dui nec, imperdiet erat. Nulla vestibulum pellentesque nisl, ac commodo lectus pulvinar ac. Donec at ex eget ex condimentum lacinia ut eget neque. Maecenas sit amet consectetur dolor. Fusce nec mattis justo. Nunc nisl tortor, hendrerit nec diam ac, eleifend imperdiet dui. Duis porta quis justo ut interdum. Nulla volutpat, ligula a ultrices suscipit, ligula ante ultricies ipsum, ut porttitor ipsum mauris et tortor. Aenean ut ullamcorper dui, non dapibus eros. Pellentesque tincidunt hendrerit turpis, commodo malesuada ante porttitor nec. Cras eu vehicula urna. Proin nisl tortor, blandit sed orci ac, pulvinar interdum felis.

Nam ut nunc lacus. Proin non hendrerit nisi. Maecenas id finibus purus. Nullam vehicula et mi eget fringilla. Aliquam augue ex, eleifend et augue in, dapibus fermentum libero. Quisque sed ullamcorper ante. Curabitur rhoncus enim id nisi interdum, sed pulvinar libero semper. Vestibulum nec nisl in lectus dictum ultricies. Phasellus et metus tempus purus laoreet ultrices a a tortor. Nullam ultrices mattis enim eu maximus. Aliquam erat volutpat. Vivamus et cursus augue. Nulla finibus consequat lorem, vel pretium ligula tincidunt quis. Nullam vitae odio porta, ullamcorper nisi quis, laoreet erat. Nam vitae nisi maximus, feugiat risus a, viverra ipsum.

Sed ultricies justo nec scelerisque pretium. Sed iaculis nunc diam, ut sagittis orci aliquam ut. Sed at viverra tortor. Duis finibus placerat dui at egestas. Praesent accumsan sem vitae ante imperdiet pretium nec sed metus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Donec dapibus sapien in accumsan maximus. Donec mollis, ligula sed iaculis auctor, orci nisi varius eros, et consectetur metus nisl at lacus. Proin quis fermentum mauris. Aenean at arcu erat. Morbi at turpis porta, cursus urna accumsan, fermentum dui. Vestibulum fermentum et odio sed vehicula. Maecenas quis sem tincidunt sapien tempor imperdiet sed et tortor. Donec vestibulum posuere ultrices. Nunc nunc lacus, hendrerit sit amet varius eu, congue eget lectus. Vestibulum vel lorem nisi.

Mauris tellus urna, condimentum non magna non, euismod sodales ligula. Suspendisse placerat felis vel mauris pulvinar, et volutpat erat consectetur. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Sed convallis ornare erat, tincidunt lobortis dui auctor quis. Praesent at nibh euismod, feugiat mi eget, tincidunt leo. Cras vestibulum rhoncus lectus ac feugiat. Fusce quam erat, consectetur et blandit eget, lobortis posuere eros. Sed sollicitudin mi in interdum convallis. Etiam vestibulum quis dolor sed vehicula. Maecenas at commodo urna, eget dapibus tortor.

Sed vel pretium nibh. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut efficitur lorem sed risus luctus, eget vulputate risus rutrum. Morbi tortor nisl, condimentum ac augue sit amet, dignissim commodo neque. Cras eget consectetur lorem. Donec fermentum risus turpis, at placerat elit semper in. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Proin euismod felis placerat euismod pharetra. Nunc viverra congue maximus. Vivamus placerat sapien eu venenatis mollis. Ut vitae ornare nibh, vitae mollis tortor. Mauris dignissim suscipit ante eget laoreet.

It's simpel switch of logic with a "expander" wrap.

if first child is expander, it's expandible card, else is a clickable.