Variables

$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
  xxl: 1600px,
  xxxl: 1660px,
)

$spacers: (
  0: 0,
  1: $spacer,
  2: $spacer * 2,
  3: $spacer * 3,
  4: $spacer * 4,
  5: $spacer * 5,
  6: $spacer * 6,
)
Buttons
lg-default-a
lg-default-b
lg-disabled-a
lg-disabled-b
lg-secondary-a
lg-secondary-b
lg-secondary-disabled-a
lg-secondary-disabled-b
lg-contrast-a
lg-contrast-b
lg-contrast-disabled-a
lg-contrast-disabled-b
md-default-a
md-default-b
md-disabled-a
md-disabled-b
md-secondary-a
md-secondary-b
md-secondary-disabled-a
md-secondary-disabled-b
md-contrast-a
md-contrast-b
md-contrast-disabled-a
md-contrast-disabled-b
sm-default-a
sm-default-b
sm-disabled-a
sm-disabled-b
sm-secondary-a
sm-secondary-b
sm-secondary-disabled-a
sm-secondary-disabled-b
sm-contrast-a
sm-contrast-b
sm-contrast-disabled-a
sm-contrast-disabled-b
Buttons - text
lg-default-a
lg-default-b
lg-selected-a
lg-selected-b
lg-secondary-a
lg-secondary-b
lg-contrast-a
lg-contrast-b
lg-secondary-contrast-a
lg-secondary-contrast-b
sm-default-a
sm-default-b
sm-selected-a
sm-selected-b
sm-secondary-a
sm-secondary-b
sm-contrast-a
sm-contrast-b
sm-secondary-contrast-a
sm-secondary-contrast-b
Grid .u-mt-1 l-row
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-1
.l-col-2
.l-col-2
.l-col-2
.l-col-2
.l-col-2
.l-col-2
.l-col-2
.l-col-2
.l-col-2
.l-col-2
.l-col-4
.l-col-4
.l-col-4
.l-col-4
.l-col-4
.l-col-5
.l-col-5
.l-col-5
.l-col-5
.l-col-10
.l-col-10
.l-col-20
.l-col-1
.l-col-19
.l-col-2
.l-col-18
.l-col-3
.l-col-17
.l-col-4
.l-col-16
.l-col-5
.l-col-15
.l-col-6
.l-col-14
.l-col-7
.l-col-13
.l-col-8
.l-col-12
.l-col-9
.l-col-11
.l-col-10
.l-col-10
.l-col-11
.l-col-9
.l-col-12
.l-col-8
.l-col-13
.l-col-7
.l-col-14
.l-col-6
.l-col-15
.l-col-5
.l-col-16
.l-col-4
.l-col-17
.l-col-3
.l-col-18
.l-col-2
.l-col-19
.l-col-1
.l-col-20
Util třídy
Vnější odsazení (margin)
.u-mt-0 margin-top: 0px
.u-mt-1 margin-top: 8px
.u-mt-2 margin-top: 16px
.u-mt-3 margin-top: 24px
.u-mt-4 margin-top: 32px
.u-mt-5 margin-top: 40px
.u-mt-6 margin-top: 48px
.u-mr-0 margin-top: 0px
.u-mr-1 margin-top: 8px
.u-mr-2 margin-top: 16px
.u-mr-3 margin-top: 24px
.u-mr-4 margin-top: 32px
.u-mr-5 margin-top: 40px
.u-mr-6 margin-top: 48px
.u-mb-0 margin-top: 0px
.u-mb-1 margin-top: 8px
.u-mb-2 margin-top: 16px
.u-mb-3 margin-top: 24px
.u-mb-4 margin-top: 32px
.u-mb-5 margin-top: 40px
.u-mb-6 margin-top: 48px
.u-ml-0 margin-top: 0px
.u-ml-1 margin-top: 8px
.u-ml-2 margin-top: 16px
.u-ml-3 margin-top: 24px
.u-ml-4 margin-top: 32px
.u-ml-5 margin-top: 40px
.u-ml-6 margin-top: 48px
Vnitřní odsazení (padding)
.u-pt-0 margin-top: 0px
.u-pt-1 margin-top: 8px
.u-pt-2 margin-top: 16px
.u-pt-3 margin-top: 24px
.u-pt-4 margin-top: 32px
.u-pt-5 margin-top: 40px
.u-pt-6 margin-top: 48px
.u-pr-0 margin-top: 0px
.u-pr-1 margin-top: 8px
.u-pr-2 margin-top: 16px
.u-pr-3 margin-top: 24px
.u-pr-4 margin-top: 32px
.u-pr-5 margin-top: 40px
.u-pr-6 margin-top: 48px
.u-pb-0 margin-top: 0px
.u-pb-1 margin-top: 8px
.u-pb-2 margin-top: 16px
.u-pb-3 margin-top: 24px
.u-pb-4 margin-top: 32px
.u-pb-5 margin-top: 40px
.u-pb-6 margin-top: 48px
.u-pl-0 margin-top: 0px
.u-pl-1 margin-top: 8px
.u-pl-2 margin-top: 16px
.u-pl-3 margin-top: 24px
.u-pl-4 margin-top: 32px
.u-pl-5 margin-top: 40px
.u-pl-6 margin-top: 48px
Barvy
black - color: color('black', 50);
black 100%
black 75%
black 50%
black 25%
white - color: color('white', 50);
white 100%
white 75%
white 50%
white 25%
gray - color: color('gray', 50);
gray 100
gray 90
gray 80
gray 70
gray 60
gray 50
gray 40
gray 30
gray 20
gray 10
primary - color: color('primary', 50);
primary 100
primary 90
primary 80
primary 70
primary 60
primary 50
primary 40
primary 30
primary 20
primary 10
secondary - color: color('secondary', 50);
secondary 100
secondary 90
secondary 80
secondary 70
secondary 60
secondary 50
secondary 40
secondary 30
secondary 20
secondary 10
success - color: color('success', 50);
success 80
success 60
success 20
warning - color: color('warning', 50);
warning 80
warning 60
warning 20
alert - color: color('alert', 50);
alert 80
alert 60
alert 20
orange - color: color('orange', 50);
orange 100
red - color: color('red', 50);
red 100
green - color: color('green', 50);
green 100
blue - color: color('blue', 50);
blue 100
purple - color: color('purple', 50);
purple 100
yellow - color: color('yellow', 50);
yellow 100
Písmo
headline-1
@include typography('headline-1');
The Quick Brown Fox
headline-2
@include typography('headline-2');
The Quick Brown Fox
headline-3
@include typography('headline-3');
The Quick Brown Fox
headline-4
@include typography('headline-4');
The Quick Brown Fox
headline-5
@include typography('headline-5');
The Quick Brown Fox
title
@include typography('title');
The Quick Brown Fox
title-medium
@include typography('title-medium');
The Quick Brown Fox
title-small
@include typography('title-small');
The Quick Brown Fox
body-perex
@include typography('body-perex');
The Quick Brown Fox
body-default
@include typography('body-default');
The Quick Brown Fox
body-small
@include typography('body-small');
The Quick Brown Fox
body-bold
@include typography('body-bold');
The Quick Brown Fox
label-big
@include typography('label-big');
The Quick Brown Fox
label
@include typography('label');
The Quick Brown Fox
description
@include typography('description');
The Quick Brown Fox
footnote
@include typography('footnote');
The Quick Brown Fox
label-bold
@include typography('label-bold');
The Quick Brown Fox
button-small
@include typography('button-small');
The Quick Brown Fox
button-large
@include typography('button-large');
The Quick Brown Fox
button-large-red
@include typography('button-large-red');
The Quick Brown Fox
headline-1---mobile
@include typography('headline-1---mobile');
The Quick Brown Fox
headline-2---mobile
@include typography('headline-2---mobile');
The Quick Brown Fox
headline-3---mobile
@include typography('headline-3---mobile');
The Quick Brown Fox
headline-4---mobile
@include typography('headline-4---mobile');
The Quick Brown Fox
headline-5---mobile
@include typography('headline-5---mobile');
The Quick Brown Fox
title-medium---mobile
@include typography('title-medium---mobile');
The Quick Brown Fox
Icons
8x8
ic8-plus.svg
ic8-close.svg
ic8-point-small.svg
16x16
ic16-chevron-down.svg
ic16-eye-close.svg
ic16-google-calendar.svg
ic16-rotate-left.svg
ic16-facebook-colour.svg
ic16-filter-applied.svg
ic16-divider-vertical.svg
ic16-eye.svg
ic16-herbal box.svg
ic16-minus.svg
ic16-filter.svg
ic16-google-colour.svg
ic16-plus.svg
ic16-symbol.svg
ic16-rotate-right.svg
ic16-content-article.svg
ic16-notification.svg
ic16-user.svg
ic16-asion-food.svg
ic16-vegetable-carrot.svg
ic16-close.svg
ic16-star-solid.svg
ic16-point-small.svg
ic16-locked.svg
ic16-content-kitchen.svg
ic16-point-large.svg
ic16-lock.svg
ic16-reply.svg
ic16-flip-vertical.svg
ic16-google.svg
ic16-czech-flag.svg
ic16-turtle.svg
ic16-placeholder.svg
ic16-hint.svg
ic16-plant-root.svg
ic16-heart.svg
ic16-upload.svg
ic16-plus-1.svg
ic16-flip-horizontal.svg
ic16-collapse.svg
ic216-content-cosmetic.svg
ic16-chevron-up.svg
ic16-copy.svg
ic16-book.svg
ic16-expand.svg
ic16-check-color.svg
ic16-facebook.svg
ic16-check.svg
ic16-thermometer.svg
ic16-unlocked.svg
ic16-calendar.svg
ic16-star-outline.svg
ic16-delete.svg
ic16-error.svg
ic16-menu.svg
ic16-search.svg
ic16-drag&drop.svg
ic16-check-1.svg
ic16-sound.svg
ic16-paperclip.svg
ic16-star.svg
ic16-horizontal-menu.svg
ic16-arrow-left.svg
ic16-ribbon-2.svg
ic16-apple-logo.svg
ic16-mushroom.svg
ic16-cross.svg
ic16-chevron-right.svg
ic16-home.svg
ic16-ribbon.svg
ic16-arrow-down.svg
ic16-arrow-up.svg
ic16-arrow-right.svg
ic16-tea-box-herbal.svg
ic16-edit.svg
20x20
ic20-reply.svg
ic20-discussion.svg
ic20-delete.svg
ic20-heart.svg
ic20-chevron-down.svg
ic20-divider.svg
ic20-arrow-right.svg
ic20-play.svg
ic20-like.svg
ic20-dislike.svg
ic20-checkbox-checked.svg
24x24
ic24-twitter.svg
ic24-facebook.svg
ic24-construction.svg
ic24-content-webinary.svg
ic24-content-video.svg
ic24-heart-red.svg
ic24-messenger.svg
ic24-content-exercise.svg
ic24-sync.svg
ic24-content-podcast.svg
ic24-heart.svg
ic24-link.svg
ic24-whatsapp.svg
ic24-competition.svg
ic24-email.svg
ic24-content-article.svg
ic24-warning.svg
ic24-check.svg
ic24-content-record.svg
ic24-gift.svg
ic24-instagram.svg
ic24-event-indicator.svg
ic24-content-kitchen.svg
ic24-search.svg
ic24-arrow-right.svg
ic24-discussion.svg
Forms
Input text
0/70

This default version is missing a wrapper with position: relative for validation messages

Input textarea
0/250

This default version is missing a wrapper with position: relative for validation messages

Input text - floating label

Input description

Select - default
Select - disabled
Input date
Input text - invalid
0/70

For validation messages to work, we need a wrapper with position: relative around the input element.

Input textarea - invalid
0/250

For validation messages to work, we need a wrapper with position: relative around the input element.

Input text - floating label

Input description

Komponenty

Budování imunity během roku podle TČM

Poslední aktualizace:
Prevence, imunita
120
chip
badge-author
Jan Omáčka
badge-length
20 min
article-item
Zdraví, Léčba, Teorie TCM

Bolesti zad a psychika

Zobrazit Článek

Jana Dedková Jana Dedková
Bolesti zad a psychika
4 min
Chinese,Puer,Tea,From,Yunnan,Province,Of,China,In,The
Fitness,Sport,Girl,In,Fashion,Sportswear,Doing,Yoga,Fitness,Exercise
Herbs,For,The,Preparation,Of,Fees,,The,Use,Of,Additives
Different,Kind,Of,Teas,On,White,Background:,Green,Tea,,Red
Child,With,Pollen,Allergy.,Boy,Sneezing,Because,Of,Seasonal,Allergy
Little,Sea,Turtle,Cub,,Crawls,Along,The,Sandy,Shore,In
Používáme cookies, protože vám chceme nabídnout to nejlepší.
VŽDY AKTIVNÍ
Pro klíčové funkce webových stránek jako je zabezpečení, správa sítě, přístupnost a základní statistiky o návštěvnících.
S tímto nastavením je stránka výkonnější a osobnější, protože nám umožňují ukládat vaše nastavení a preference.
Umožňují nám zlepšovat fungování webových stránek díky tomu že víme, jak je používáte. Nejsou spojeny s přímou identifikací osoby.
Tyto cookies vám zobrazují personalizované nabídky, obsah a reklamy na základě vašich zájmů.
Upravit nastavení