@import 'colors';
@import 'inputs';
@import 'fonts';
@import 'mixins';
@import 'animations';

$gap: 8px;

$header_height: 64px;
$cell: 250px;
$fluid_cell: $cell; // smaller cell for fluid flow
$cell_tablet: ($fluid_cell + 5) * 3 + 10; // flow breakpoint for tablet
$cell_mobile: ($fluid_cell + 5) * 2 + 10; // flow breakpoint for mobile

$target_flow_cell_width: 225px;
$flow_tablet_cell_count: 3;
$flow_hide_recents: $target_flow_cell_width * $flow_tablet_cell_count +
  ($flow_tablet_cell_count - 1) * $gap;

$lab_gap: $gap * 2;
$lab_gap_mobile: $gap * 2;
$grid_line: 5px;
$content_width: $cell * 5 + $grid_line * 4;
$comment_height: 72px;
$bar_height: 64px;
$page_top_offset: 32px;

$radius: 8px;
$cell_radius: $radius;
$panel_radius: $radius;
$dialog_radius: $radius * 2;
$placeholder_bg: $gray_90;

$info_height: 24px;
$limited_width: 940px;

$panel_size: 64px;
$node_title_height: $panel_size;
$upload_button_height: 52px;

$shadow_depth_1:
  transparentize(black, 0.8) 0 1px,
  inset $gray_90 0 1px;
$shadow_depth_2:
  transparentize(black, 0.8) 0 2px,
  inset $gray_90 0 1px;

$comment_shadow: $shadow_depth_2;
$node_shadow:
  transparentize(black, 0.8) 0 2px,
  transparentize(black, 0.8) 0 2px 4px;

$tag_height: 26px;

$login_dialog_padding: $gap $gap 30px $gap;
$sidebar_border: $gray_90;
