Naming conventions

skins/base/views/atoms/create_room/Presets.js

@@ -30,7 +30,7 @@ module.exports = React.createClass({
 
     render: function() {
         return (
-            <select className="mx_PresetOption" onChange={this.onValueChanged} defaultValue={this.state.preset}>
+            <select className="mx_Presets" onChange={this.onValueChanged} defaultValue={this.state.preset}>
                 <option value="private_chat">Private Chat</option>
                 <option value="public_chat">Public Chat</option>
             </select>

skins/base/views/atoms/create_room/RoomNameTextbox.js

@@ -21,7 +21,7 @@ var React = require('react');
 var RoomNameTextboxController = require("../../../../../src/controllers/atoms/create_room/RoomNameTextbox");
 
 module.exports = React.createClass({
-    displayName: 'CreateRoomButton',
+    displayName: 'RoomNameTextbox',
     mixins: [RoomNameTextboxController],
 
     onValueChanged: function(ev) {

skins/base/views/molecules/UserSelector.js

@@ -31,13 +31,13 @@ module.exports = React.createClass({
     render: function() {
         return (
             <div>
-                <ul className="mx_UserIdList" ref="list">
+                <ul className="mx_UserSelector_UserIdList" ref="list">
                     {this.state.selected_users.map(function(user_id, i) {
                         return <li key={user_id}>{user_id}</li>
                     })}
                 </ul>
-                <input type="text" ref="user_id_input" className="mx_UserIdInput" placeholder="ex. @bob:example.com"/>
-                <button onClick={this.onAddUserId} className="mx_AddUserId">Add User</button>
+                <input type="text" ref="user_id_input" className="mx_UserSelector_userIdInput" placeholder="ex. @bob:example.com"/>
+                <button onClick={this.onAddUserId} className="mx_UserSelector_AddUserId">Add User</button>
             </div>
         );
     }