codeforamerica / rva-screening-ui-prototypes

A repo for sketching and comparing user interface ideas for rva-screener
1 stars 2 forks source link

Search v view patients #19

Closed mapsam closed 9 years ago

mapsam commented 9 years ago

This creates a bunch of new mockups related to #14 and #18

Also includes a new block system for creating columns:

// block sections, to be used within .containers
// all exist on a 12 unit grid and are relative in 
// size to the container element
@mixin width($num) {
  width: 100% * ($num / 12)
}

.block_1,
.block_2,
.block_3,
.block_4,
.block_5,
.block_6,
.block_7,
.block_8,
.block_9,
.block_10,
.block_11,
.block_12 {
  // padding: 1.5em;
  display: block;
  @include bbox();
  @media (min-width: $break) {
    float: left;
  }
  &.block_right {
    float: right;
  }
  &.block_padding {
    padding: 1.5em;
  }
}

@media (min-width: $break) {
  .block_1 { @include width(1); }
  .block_2 { @include width(2); }
  .block_3 { @include width(3); }
  .block_4 { @include width(4); }
  .block_5 { @include width(5); }
  .block_6 { @include width(6); }
  .block_7 { @include width(7); }
  .block_8 { @include width(8); }
  .block_9 { @include width(9); }
  .block_10 { @include width(10); }
  .block_11 { @include width(11); }
  .block_12 { @include width(12); }
}