Merge remote-tracking branch 'origin/develop' into travis/voicemessages/timeline

Author: turt2live

res/css/structures/_SpacePanel.scss

@@ -79,6 +79,10 @@ $activeBorderColor: $secondary-fg-color;
     .mx_SpaceItem {
         display: inline-flex;
         flex-flow: wrap;
+
+        &.mx_SpaceItem_narrow {
+            align-self: baseline;
+        }
     }
 
     .mx_SpaceItem.collapsed {
@@ -275,7 +279,7 @@ $activeBorderColor: $secondary-fg-color;
         .mx_SpaceButton:hover,
         .mx_SpaceButton:focus-within,
         .mx_SpaceButton_hasMenuOpen {
-            &:not(.mx_SpaceButton_home) {
+            &:not(.mx_SpaceButton_home):not(.mx_SpaceButton_invite) {
                 // Hide the badge container on hover because it'll be a menu button
                 .mx_SpacePanel_badgeContainer {
                     width: 0;

res/css/views/rooms/_VoiceRecordComposerTile.scss

@@ -40,7 +40,7 @@ limitations under the License.
     height: 18px;
     vertical-align: middle;
     margin-right: 7px; // distance from left edge of waveform container (container has some margin too)
-    background-color: $muted-fg-color;
+    background-color: $voice-record-icon-color;
     mask-repeat: no-repeat;
     mask-size: contain;
     mask-image: url('$(res)/img/element-icons/trashcan.svg');

res/css/views/voice_messages/_PlayPauseButton.scss

@@ -19,12 +19,12 @@ limitations under the License.
     width: 32px;
     height: 32px;
     border-radius: 32px;
-    background-color: $primary-bg-color;
+    background-color: $voice-playback-button-bg-color;
 
     &::before {
         content: '';
         position: absolute; // sizing varies by icon
-        background-color: $muted-fg-color;
+        background-color: $voice-playback-button-fg-color;
         mask-repeat: no-repeat;
         mask-size: contain;
     }

res/themes/dark/css/_dark.scss

@@ -42,6 +42,14 @@ $preview-bar-bg-color: $header-panel-bg-color;
 $groupFilterPanel-bg-color: rgba(38, 39, 43, 0.82);
 $inverted-bg-color: $base-color;
 
+$voice-record-stop-border-color: #6F7882; // "Quarterly"
+$voice-record-waveform-bg-color: #394049; // "Dark Tile"
+$voice-record-waveform-fg-color: $tertiary-fg-color;
+$voice-record-waveform-incomplete-fg-color: #5b646d;
+$voice-record-icon-color: $tertiary-fg-color;
+$voice-playback-button-bg-color: $tertiary-fg-color;
+$voice-playback-button-fg-color: $bg-color;
+
 // used by AddressSelector
 $selected-color: $room-highlight-color;
 

res/themes/legacy-dark/css/_legacy-dark.scss

@@ -124,6 +124,15 @@ $roomsublist-skeleton-ui-bg: linear-gradient(180deg, #3e444c 0%, #3e444c00 100%)
 
 $groupFilterPanel-divider-color: $roomlist-header-color;
 
+// See non-legacy dark for variable information
+$voice-record-stop-border-color: #6F7882;
+$voice-record-waveform-bg-color: #394049;
+$voice-record-waveform-fg-color: $tertiary-fg-color;
+$voice-record-waveform-incomplete-fg-color: #5b646d;
+$voice-record-icon-color: $tertiary-fg-color;
+$voice-playback-button-bg-color: $tertiary-fg-color;
+$voice-playback-button-fg-color: $bg-color;
+
 $roomtile-preview-color: #9e9e9e;
 $roomtile-default-badge-bg-color: #61708b;
 $roomtile-selected-bg-color: #1A1D23;

res/themes/legacy-light/css/_legacy-light.scss

@@ -198,6 +198,9 @@ $voice-record-waveform-bg-color: #E3E8F0;
 $voice-record-waveform-fg-color: $muted-fg-color;
 $voice-record-waveform-incomplete-fg-color: #C1C6CD;
 $voice-record-live-circle-color: #ff4b55;
+$voice-record-icon-color: $muted-fg-color;
+$voice-playback-button-bg-color: $primary-bg-color;
+$voice-playback-button-fg-color: $muted-fg-color;
 
 $roomtile-preview-color: #9e9e9e;
 $roomtile-default-badge-bg-color: #61708b;

res/themes/light/css/_light.scss

@@ -188,6 +188,9 @@ $voice-record-waveform-bg-color: #E3E8F0;
 $voice-record-waveform-fg-color: $muted-fg-color;
 $voice-record-waveform-incomplete-fg-color: #C1C6CD;
 $voice-record-live-circle-color: #ff4b55; // $warning-color, but without letting people change it in themes
+$voice-record-icon-color: $muted-fg-color;
+$voice-playback-button-bg-color: $primary-bg-color;
+$voice-playback-button-fg-color: $muted-fg-color;
 
 $roomtile-preview-color: $secondary-fg-color;
 $roomtile-default-badge-bg-color: #61708b;

src/async-components/views/dialogs/security/CreateKeyBackupDialog.js

@@ -310,7 +310,7 @@ export default class CreateKeyBackupDialog extends React.PureComponent {
         const DialogButtons = sdk.getComponent('views.elements.DialogButtons');
         return <form onSubmit={this._onPassPhraseConfirmNextClick}>
             <p>{_t(
-                "Please enter your Security Phrase a second time to confirm.",
+                "Enter your Security Phrase a second time to confirm it.",
             )}</p>
             <div className="mx_CreateKeyBackupDialog_primaryContainer">
                 <div className="mx_CreateKeyBackupDialog_passPhraseContainer">

src/async-components/views/dialogs/security/CreateSecretStorageDialog.js

@@ -647,15 +647,15 @@ export default class CreateSecretStorageDialog extends React.PureComponent {
         }
         return <form onSubmit={this._onPassPhraseConfirmNextClick}>
             <p>{_t(
-                "Enter your recovery passphrase a second time to confirm it.",
+                "Enter your Security Phrase a second time to confirm it.",
             )}</p>
             <div className="mx_CreateSecretStorageDialog_passPhraseContainer">
                 <Field
                     type="password"
                     onChange={this._onPassPhraseConfirmChange}
                     value={this.state.passPhraseConfirm}
                     className="mx_CreateSecretStorageDialog_passPhraseField"
-                    label={_t("Confirm your recovery passphrase")}
+                    label={_t("Confirm your Security Phrase")}
                     autoFocus={true}
                     autoComplete="new-password"
                 />

src/components/structures/LeftPanel.tsx

@@ -416,7 +416,7 @@ export default class LeftPanel extends React.Component<IProps, IState> {
 
         const roomList = <RoomList
             onKeyDown={this.onKeyDown}
-            resizeNotifier={null}
+            resizeNotifier={this.props.resizeNotifier}
             onFocus={this.onFocus}
             onBlur={this.onBlur}
             isMinimized={this.props.isMinimized}