Generated by SassMeister.com.

SassMeister-input-HTML.haml

%header
  .name
    The is the name
  .actions
    These are actions
  .print-only
    Only in Print

SassMeister-input.scss

// ----
// libsass (v3.2.5)
// ----

@import "bourbon/bourbon";
@import "neat/neat";

header {
  @include display(flex);
  @include flex-direction(row);
  @include justify-content(space-between);
  @include align-items(center);
  
  background: green;
  
  .name{
    @include background(blue);
    @include flex(9)
  }
  
  .actions {
    @include background(red);
    @include flex(3)
  }
  
  .print-only {
    @include display(none);
  }
}

SassMeister-output.css

html {
  box-sizing: border-box;
}

*,
*::after,
*::before {
  box-sizing: inherit;
}

header {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -moz-box-orient: horizontal;
  box-orient: horizontal;
  -webkit-box-direction: normal;
  -moz-box-direction: normal;
  box-direction: normal;
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  flex-direction: row;
  -ms-flex-direction: row;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -ms-justify-content: space-between;
  -o-justify-content: space-between;
  justify-content: space-between;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  background: green;
}

header .name {
  background: blue;
  background: blue;
  -webkit-box-flex: 9;
  -moz-box-flex: 9;
  box-flex: 9;
  -webkit-flex: 9;
  -moz-flex: 9;
  -ms-flex: 9;
  flex: 9;
}

header .actions {
  background: red;
  background: red;
  -webkit-box-flex: 3;
  -moz-box-flex: 3;
  box-flex: 3;
  -webkit-flex: 3;
  -moz-flex: 3;
  -ms-flex: 3;
  flex: 3;
}

header .print-only {
  display: none;
}

SassMeister-rendered.html

<header>
  <div class='name'>
    The is the name
  </div>
  <div class='actions'>
    These are actions
  </div>
  <div class='print-only'>
    Only in Print
  </div>
</header>