ionic-angular/demos/old/loading-bar/style.css

[](https://circleci.com/gh/driftyco/ionic)

.bar.bar-loading {
  display: block;
  height: 24px;
  /* starts right below a normal header */
  top: 44px;
  /* make the text centered vertically and horizontally */
  text-align: center;
  padding: 0;
  line-height: 24px;
  /* transition 'sliding down' (check below)*/
  -webkit-transition: 200ms all;
}
/*
 * make the content's top changes animate.
 * might not always look good, but looks
 * good when our loader is added & removed
 */

.has-header {
  -webkit-transition: 200ms top;
}
.has-header.has-loading {
  /* 44px (header) + 24px */
  top: 68px;
}
/* make loading bar slide up/down */

.bar-loading.ng-enter,
.bar-loading.ng-leave.ng-leave-active {
  height: 0;
  border-width: 0px;
}
.bar-loading.ng-enter.ng-enter-active,
.bar-loading.ng-leave {
  height: 24px;
  border-width: 1px;
}