Fix upgrade warning being chopped off

The flex box was behaving a bit strange, so we just wrap the content and change `height: 235px` to `max-height: 235px` to get scrollbars.

res/css/views/rooms/_RoomUpgradeWarningBar.scss

@@ -15,17 +15,22 @@ limitations under the License.
 */
 
 .mx_RoomUpgradeWarningBar {
+    max-height: 235px;
+    background-color: $preview-bar-bg-color;
+    padding-left: 20px;
+    padding-right: 20px;
+    overflow: scroll;
+}
+
+.mx_RoomUpgradeWarningBar_wrapped {
+    width: 100%;
+    height: 100%;
+    display: flex;
     text-align: center;
-    height: 235px;
-    background-color: $event-selected-color;
     align-items: center;
     flex-direction: column;
     justify-content: center;
-    display: flex;
-    background-color: $preview-bar-bg-color;
     -webkit-align-items: center;
-    padding-left: 20px;
-    padding-right: 20px;
 }
 
 .mx_RoomUpgradeWarningBar_header {

src/components/views/rooms/RoomUpgradeWarningBar.js

@@ -97,6 +97,7 @@ module.exports = React.createClass({
 
         return (
             <div className="mx_RoomUpgradeWarningBar">
+                <div className="mx_RoomUpgradeWarningBar_wrapped">
                     <div className="mx_RoomUpgradeWarningBar_header">
                         {_t(
                             "This room is running room version <roomVersion />, which this homeserver has " +
@@ -113,6 +114,7 @@ module.exports = React.createClass({
                         {_t("Only room administrators will see this warning")}
                     </div>
                 </div>
+            </div>
         );
     },
 });