styleguide

Buttons

.button
.button
.button--primary
.button
.button--secondary
.button
.button--small
.button
.disabled
.button
.button--with-icon
.button
.button--with-icon
.button--error
.button
.button--icon
  • .button
    .button--link
    • Link as button.button
    .button--default

    Heading

    Title h1

    Title h2

    Title h3

    Title h4

    Body

    Body

    .font-light

    Body small

    .font-small

    Prod Detail Title

    .font-secondary

    Font secondary small

    (When font-size is less than 20px)
    .font-secondary--small

    Error message

    .error

    Links

    Navigation link .link .nav-animation .uppercase
    Navigation link with fixed width (avoid if possible).link .nav-animation
    Navigation link on two lines
    (this is ok)    .link .nav-animation

    Icons

    icon-account
    icon-arrow
    Icon Arrow --> icon-arrow light
    icon-arrow-back
    icon-arrow-link
    icon-caret
    icon-cart
    icon-checkmark
    icon-close
    icon-close-small
    icon-double-circle
    icon-facebook
    Button Filters compressed icon-filter
    Icon Flag icon-flag
    Icon hot-spot icon-hot-spot
    icon-instagram
    icon-list
    Icon Envelope icon-message
    icon-plus
    Icon Ruler icon-ruler
    icon-search
    icon-signin
    icon-share
    icon-sort
    icon-splash
    Icon blackstar icon-star
    icon-variant
    icon-wishlist
    icon-wishlist, icon: 'full'
    icon-youtube