@angular2-material/toolbar/toolbar.css

Angular 2 Material toolbar

/**
 * Mixin that creates a new stacking context.
 * see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context
 */
/**
 * This mixin hides an element visually.
 * That means it's still accessible for screen-readers but not visible in view.
 */
/**
 * Forces an element to grow to fit floated contents; used as as an alternative to
 * `overflow: hidden;` because it doesn't cut off contents.
 */
/**
 * A mixin, which generates temporary ink ripple on a given component.
 * When $bindToParent is set to true, it will check for the focused class on the same selector as you included
 * that mixin.
 * It is also possible to specify the color palette of the temporary ripple. By default it uses the
 * accent palette for its background.
 */
md-toolbar {
  display: flex;
  box-sizing: border-box;
  width: 100%;
  min-height: 64px;
  font-size: 20px;
  font-weight: 400;
  font-family: Roboto, "Helvetica Neue", sans-serif;
  padding: 0 16px;
  flex-direction: column;
  background: whitesmoke;
  color: rgba(0, 0, 0, 0.87); }
  md-toolbar.md-primary {
    background: #009688;
    color: white; }
  md-toolbar.md-accent {
    background: #9c27b0;
    color: rgba(255, 255, 255, 0.870588); }
  md-toolbar.md-warn {
    background: #f44336;
    color: white; }
  md-toolbar md-toolbar-row {
    display: flex;
    box-sizing: border-box;
    width: 100%;
    height: 64px;
    flex-direction: row;
    align-items: center; }

/*# sourceMappingURL=toolbar.css.map */