UI Kit Elements

Recipe of the Month

Join Aviva's Facebook Group

HEALTHYMOMSLOGO jpg

 

What's New

30
Jul 2018

Using Food as a Reward

In my practice as a Kids’ Nutritionist, helping families eliminate mealtime battles is something that I do on a daily basis. A common challe...

01
Jun 2018

Is Your Child Getting Enough Protein?

One of the top concerns for parents is often - is my child getting enough protein?  This can be a particular concern for picky eaters a...

05
May 2018

Why Your Child May Not Be Eating At School

Opening up your child’s lunchbox at the end of the day only to discover that they have eaten little to none of what you thoughtfully prepare...

30
Apr 2018

5 Mistakes You Are Making With Your Picky Eater

As parents, we all make mistakes. Every parent loves their child and wants them to be nourished. Parents can be thoughtful and well intent...

Buttons - Default Size:

Buttons - Mini Size:

Buttons Large size:

Buttons Groups wtih default size buttons:

Buttons Groups wtih large size buttons:

Full width button:

Full width primary button:

Badges:

Success Warning Danger

Alert Messages:

To indicate success or a positive message add the .uk-alert-success class.

To indicate a message containing a warning add the .uk-alert-warning class.

To indicate an important message add the .uk-alert-danger class.

Progress Bars:

Modal Dialogs:

Click Me

Off-canvas Sidebars:

Click Me

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Tooltips:

Hover me

Fade

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Scale up

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Scale down

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Slide top

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Slide bottom

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Slide right

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Slide left

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Delay

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Delay

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Delay

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Delay

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.


Explore All UI KIT Examples