Update the overlaybar* syntax to overlaybar-*.

src/styles/global/_overlaybar.scss

@@ -58,7 +58,7 @@
 }
 
 .overlaybar {
-  .overlaybarbutton {
+  .overlaybar-button {
     font-size: 20px;
     vertical-align: middle;
     position: absolute;
@@ -71,7 +71,7 @@
     opacity: .7;
     pointer-events: auto;
   }
-  .overlaybarcontent {
+  .overlaybar-content {
     display: inline-block;
     margin-left: .5em;
     margin-bottom: 0;
@@ -83,7 +83,7 @@
       max-width: 160px;
     }
   }
-  .overlaybaroverlay {
+  .overlaybar-overlay {
     display: none;
     opacity: .7;
     text-align: left;
@@ -91,10 +91,10 @@
     padding-top: 2px;
   }
   &.notvisible {
-    .overlaybarcontent {
+    .overlaybar-content {
       display: none;
     }
-    .overlaybaroverlay {
+    .overlaybar-overlay {
       display: block;
     }
   }

static/partials/roombar.html

@@ -1,6 +1,6 @@
 <div class="roombar overlaybar form-horizontal" ng-class="{notvisible: hideRoomBar}">
-	<a class="overlaybarbutton" ng-model="hideRoomBar" btn-checkbox btn-checkbox-true="0" btn-checkbox-false="1" title="{{_('Change room')}}"><i class="fa fa-th-list"></i></a>
+	<a class="overlaybar-button" ng-model="hideRoomBar" btn-checkbox btn-checkbox-true="0" btn-checkbox-false="1" title="{{_('Change room')}}"><i class="fa fa-th-list"></i></a>
-	<form name="roombarform" class="overlaybarcontent form-group">
+	<form name="roombarform" class="overlaybar-content form-group">
 		<label class="pull-left control-label hidden-xs">{{_('Room')}}</label>
 		<div class="pull-left">
 			<div class="input-group">
@@ -11,5 +11,5 @@
 			<social-share/>
 		</div>
 	</form>
-	<label class="control-label overlaybaroverlay" title="{{_('Current room')}}">{{roomid}}</label>
+	<label class="control-label overlaybar-overlay" title="{{_('Current room')}}">{{roomid}}</label>
 </div>

static/partials/screenshare.html

@@ -1,8 +1,8 @@
 <div class="screenshare" ng-class="{remotesize: !fitScreen}">
 	<div class="screensharepane nicescroll"></div>
 	<div class="overlaybar form-horizontal" ng-class="{notvisible: hideOptionsBar}">
-		<a class="overlaybarbutton" ng-model="hideOptionsBar" btn-checkbox btn-checkbox btn-checkbox-true="0" btn-checkbox-false="1" title="{{_('Screen sharing options')}}"><i class="fa fa-cogs"></i></a>
+		<a class="overlaybar-button" ng-model="hideOptionsBar" btn-checkbox btn-checkbox btn-checkbox-true="0" btn-checkbox-false="1" title="{{_('Screen sharing options')}}"><i class="fa fa-cogs"></i></a>
-		<form class="overlaybarcontent form-group">
+		<form class="overlaybar-content form-group">
 			<div class="checkbox">
 		        <label class="control-label pull-left">
 		          <input type="checkbox" ng-model="fitScreen"> {{_('Fit screen.')}}
@@ -10,4 +10,4 @@
 	      	</div>
 		</form>
 	</div>
-</div>
+</div>