.currently-online {
  @include position(fixed, null 0 -1.25rem null);
  background-color: $base-border-color;
  padding: $base-spacing;
  width: rem(260);

  &.is-expanded {
    @include position(fixed, null 0 0 null);

    .currently-online--users {
      height: auto;
      visibility: visible;
    }
  }
}

.currently-online--title {
  margin-bottom: $base-spacing;
}

.currently-online--avatar {
  @include size(rem(28));
  background-color: $base-font-color;
  border-radius: 50%;
  display: inline-block;
  margin-right: $small-spacing;
  vertical-align: middle;
}

.currently-online--user {
  padding: $small-spacing 0;
}

.currently-online--users {
  height: 0;
  visibility: hidden;
}

.currently-online {
  @include position(fixed, null 0 -1.25rem null);
  background-color: $base-border-color;
  padding: $base-spacing;
  width: rem(260);

  &.is-expanded {
    @include position(fixed, null 0 0 null);

    .currently-online--users {
      height: auto;
      visibility: visible;
    }
  }

  @include media($mobile) {
    display: none;
  }
}

.currently-online--title {
  margin-bottom: $base-spacing;
}

.currently-online--avatar {
  @include size(rem(28));
  background-color: $base-font-color;
  border-radius: 50%;
  display: inline-block;
  margin-right: $small-spacing;
  vertical-align: middle;
}

.currently-online--user {
  padding: $small-spacing 0;
}

.currently-online--users {
  height: 0;
  visibility: hidden;
}

Hide "currently online" in small screens
[JRO] Hide "currently online" in small screens

When viewing on a small (mobile) screen the currently online div takes
up too much real estate at the bottom. Hiding it is the best option for
now as there is no perfect remedy in the context of a base theme.
