Merge branch 'develop' into t3chguy/fix/16622

Author: t3chguy

res/css/views/dialogs/_BetaFeedbackDialog.scss

@@ -16,7 +16,7 @@ limitations under the License.
 
 .mx_BetaFeedbackDialog {
     .mx_BetaFeedbackDialog_subheading {
-        color: $secondary-fg-color;
+        color: $primary-fg-color;
         font-size: $font-14px;
         line-height: $font-20px;
         margin-bottom: 24px;

res/css/views/messages/_MessageActionBar.scss

@@ -85,6 +85,7 @@ limitations under the License.
     left: 0;
     height: 100%;
     width: 100%;
+    mask-size: 18px;
     mask-repeat: no-repeat;
     mask-position: center;
     background-color: $message-action-bar-fg-color;

res/css/views/messages/_ReactionsRow.scss

@@ -17,18 +17,55 @@ limitations under the License.
 .mx_ReactionsRow {
     margin: 6px 0;
     color: $primary-fg-color;
+
+    .mx_ReactionsRow_addReactionButton {
+        position: relative;
+        display: none; // show on hover of the .mx_EventTile
+        width: 24px;
+        height: 24px;
+        vertical-align: middle;
+        margin-left: 4px;
+
+        &::before {
+            content: '';
+            position: absolute;
+            height: 100%;
+            width: 100%;
+            mask-size: 16px;
+            mask-repeat: no-repeat;
+            mask-position: center;
+            background-color: $tertiary-fg-color;
+            mask-image: url('$(res)/img/element-icons/room/message-bar/emoji.svg');
+        }
+
+        &.mx_ReactionsRow_addReactionButton_active {
+            display: inline-block; // keep showing whilst the context menu is shown
+        }
+
+        &:hover, &.mx_ReactionsRow_addReactionButton_active {
+            &::before {
+                background-color: $primary-fg-color;
+            }
+        }
+    }
+}
+
+.mx_EventTile:hover .mx_ReactionsRow_addReactionButton {
+    display: inline-block;
 }
 
 .mx_ReactionsRow_showAll {
     text-decoration: none;
-    font-size: $font-10px;
-    font-weight: 600;
-    margin-left: 6px;
-    vertical-align: top;
-
-    &:hover,
-    &:link,
-    &:visited {
-        color: $accent-color;
+    font-size: $font-12px;
+    line-height: $font-20px;
+    margin-left: 4px;
+    vertical-align: middle;
+
+    &:link, &:visited {
+        color: $tertiary-fg-color;
+    }
+
+    &:hover {
+        color: $primary-fg-color;
     }
 }

res/css/views/messages/_ReactionsRowButton.scss

@@ -16,14 +16,15 @@ limitations under the License.
 
 .mx_ReactionsRowButton {
     display: inline-flex;
-    line-height: $font-21px;
+    line-height: $font-20px;
     margin-right: 6px;
-    padding: 0 6px;
+    padding: 1px 6px;
     border: 1px solid $reaction-row-button-border-color;
     border-radius: 10px;
     background-color: $reaction-row-button-bg-color;
     cursor: pointer;
     user-select: none;
+    vertical-align: middle;
 
     &:hover {
         border-color: $reaction-row-button-hover-border-color;

res/img/element-icons/room/composer/emoji.svg

@@ -451,6 +451,7 @@ const SpaceSetupFirstRooms = ({ space, title, description, onFinished }) => {
             value={roomNames[i]}
             onChange={ev => setRoomName(i, ev.target.value)}
             autoFocus={i === 2}
+            disabled={busy}
         />;
     });
 
@@ -658,6 +659,7 @@ const SpaceSetupPrivateInvite = ({ space, onFinished }) => {
             ref={fieldRefs[i]}
             onValidate={validateEmailRules}
             autoFocus={i === 0}
+            disabled={busy}
         />;
     });
 

res/img/element-icons/room/message-bar/emoji.svg

@@ -59,7 +59,7 @@ const BetaFeedbackDialog: React.FC<IProps> = ({featureId, onFinished}) => {
     return (<QuestionDialog
         className="mx_BetaFeedbackDialog"
         hasCancelButton={true}
-        title={_t("Beta feedback")}
+        title={_t("%(featureName)s beta feedback", { featureName: info.title })}
         description={<React.Fragment>
             <div className="mx_BetaFeedbackDialog_subheading">
                 { _t(info.feedbackSubheading) }
@@ -87,6 +87,7 @@ const BetaFeedbackDialog: React.FC<IProps> = ({featureId, onFinished}) => {
                 onChange={(ev) => {
                     setComment(ev.target.value);
                 }}
+                autoFocus={true}
             />
 
             <StyledCheckbox

src/components/structures/SpaceRoomView.tsx

@@ -116,13 +116,13 @@ const SpaceSettingsDialog: React.FC<IProps> = ({ matrixClient: cli, space, onFin
 
             <SpaceBasicSettings
                 avatarUrl={avatarUrlForRoom(space, 80, 80, "crop")}
-                avatarDisabled={!canSetAvatar}
+                avatarDisabled={busy || !canSetAvatar}
                 setAvatar={setNewAvatar}
                 name={name}
-                nameDisabled={!canSetName}
+                nameDisabled={busy || !canSetName}
                 setName={setName}
                 topic={topic}
-                topicDisabled={!canSetTopic}
+                topicDisabled={busy || !canSetTopic}
                 setTopic={setTopic}
             />