Kirjanurk

Logo

Kirjanurk

Colors

.bg-primary (#00a6ca)
.bg-secondary (#1c2252)
.bg-gray (#ccc)
.bg-success (#48bf3d)
.bg-info (#ffd23d)
.bg-warning (#1376e0)
.bg-danger (#ea3e2e)

Grid

Text sizes & variations

Headline / H1 .h1
Volutpat mauris laoreet egestas molestie vel.
Headline / H2 .h2
Volutpat mauris laoreet egestas molestie vel.
Headline / H3 .h3
Volutpat mauris laoreet egestas molestie vel.
Headline / H4 .h4
Volutpat mauris laoreet egestas molestie vel.
Headline / H5 .h5
Volutpat mauris laoreet egestas molestie vel. Volutpat mauris laoreet egestas molestie vel.
Lead (subtitle) .lead
Volutpat mauris laoreet egestas molestie vel.
Body / Normal

Volutpat mauris laoreet egestas molestie vel.

Body / Bold .font-weight-bold
Volutpat mauris laoreet egestas molestie vel.
Body / Italic .font-italic
Volutpat mauris laoreet egestas molestie vel.
Body / Muted .text-muted
Volutpat mauris laoreet egestas molestie vel.
Body alternative .font-serif .font-italic

Volutpat mauris laoreet egestas molestie vel.

Small small
Volutpat mauris laoreet egestas molestie vel.
Blockqoute blockqoute .blockqoute

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Alerts

This is error message

.alert .alert-danger

This is error message

.alert .alert-success

This is error message

.alert .alert-warning

This is error message

.alert .alert-info

Form

Buttons

btn-primary .btn .btn-primary
btn-primary .disabled
btn-secondary .btn .btn-secondary
btn-secondary .disabled
btn-outline .btn .btn-outline
btn-outline .disabled

Checks & Radios

Fields

This is a helper text for the form field.
Looks good!
Please choose a username.
.form-control-sm | .border-primary
This is a helper text for the form field.
Looks good!
Please choose a username.
This is a helper text for the form field.
Looks good!
Please choose a username.

Tables

# Column heading Column heading Column heading
1 Column content Column content Column content
1 Column content Column content Column content
1 Column content Column content Column content
1 Column content Column content Column content
.table

Lists

  • Text
  • Text on multiple rows Text on multiple rows Text on multiple rows
  • First level
    • Second level
    • Text
    • Text on multiple rows Text on multiple rows Text on multiple rows
  1. Text
  2. Text on multiple rows Text on multiple rows Text on multiple rows
  3. First level
    1. Second level
    2. Text
    3. Text on multiple rows Text on multiple rows Text on multiple rows

Modal

Modal demo