# Sample Components

This is a list of components I've made for making websites quicker. They're just pre-styled things you commonly need to do HTML first layouts and designs.

## Shapes

I'm a placeholder.

## Grids

0,0 1,0 0,1 1,1

## Blocks & Bars

Use a block to automatically flex content vertically.

Like these two lines are done.

Image

Use a bar to flex things horizontally.

Image You can also combine them in arbitrary ways to layout your content. 1 2 3

## Stack

A stack lets you place multiple elements on top of eachother, like with layers in nearly every single layout composition system in existence for the last 500 years.

I'm on bottom

# Hello

## There

## Code

    if(var != 'string') {
      console.log("test");
    }

You should type `ls -l` to list the directory.

`if(var != 'string')`

## Highlight/Marking

Default This is an aside. You use it to call out something specific.
Info This is an aside. You use it to call out something specific.
Warning A warning aside.
Alert An alert aside.

This is some marked text.

## Details

Details Test
A test of the details thing.

## Forms

Test Form What Fruit?
Name

## Cards

Cards organize information vertically.

Image This shows a top large image with some text in the middle.

## Header/Nav

If you put nav inside header it "just works".

That's an example of a header with a nav bar in it.