Merge branches 'develop' and 't3chguy/pretty_Devtools' of github.com:matrix-org/matrix-react-sdk into t3chguy/pretty_Devtools

res/css/_common.scss

@@ -249,12 +249,6 @@ textarea {
     box-shadow: none;
 }
 
-/* View Source Dialog overide */
-.mx_Dialog_wrapper.mx_Dialog_viewsource .mx_Dialog {
-    padding-left: 10px;
-    padding-right: 10px;
-}
-
 .mx_Dialog {
     background-color: $primary-bg-color;
     color: $light-fg-color;

res/css/_components.scss

@@ -150,16 +150,16 @@
 @import "./views/settings/_Notifications.scss";
 @import "./views/settings/_PhoneNumbers.scss";
 @import "./views/settings/_ProfileSettings.scss";
-@import "./views/settings/tabs/_GeneralRoomSettingsTab.scss";
-@import "./views/settings/tabs/_GeneralUserSettingsTab.scss";
-@import "./views/settings/tabs/_HelpSettingsTab.scss";
-@import "./views/settings/tabs/_NotificationSettingsTab.scss";
-@import "./views/settings/tabs/_PreferencesSettingsTab.scss";
-@import "./views/settings/tabs/_RolesRoomSettingsTab.scss";
-@import "./views/settings/tabs/_SecurityRoomSettingsTab.scss";
-@import "./views/settings/tabs/_SecuritySettingsTab.scss";
 @import "./views/settings/tabs/_SettingsTab.scss";
-@import "./views/settings/tabs/_VoiceSettingsTab.scss";
+@import "./views/settings/tabs/room/_GeneralRoomSettingsTab.scss";
+@import "./views/settings/tabs/room/_RolesRoomSettingsTab.scss";
+@import "./views/settings/tabs/room/_SecurityRoomSettingsTab.scss";
+@import "./views/settings/tabs/user/_GeneralUserSettingsTab.scss";
+@import "./views/settings/tabs/user/_HelpUserSettingsTab.scss";
+@import "./views/settings/tabs/user/_NotificationUserSettingsTab.scss";
+@import "./views/settings/tabs/user/_PreferencesUserSettingsTab.scss";
+@import "./views/settings/tabs/user/_SecurityUserSettingsTab.scss";
+@import "./views/settings/tabs/user/_VoiceUserSettingsTab.scss";
 @import "./views/verification/_VerificationShowSas.scss";
 @import "./views/voip/_CallView.scss";
 @import "./views/voip/_IncomingCallbox.scss";

res/css/structures/_ViewSource.scss

@@ -14,6 +14,19 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
+.mx_ViewSource_label_left {
+    float: left;
+}
+
+.mx_ViewSource_label_right {
+    float: right;
+}
+
+.mx_ViewSource_label_bottom {
+    clear: both;
+    border-bottom: 1px solid #e5e5e5;
+}
+
 .mx_ViewSource pre {
     text-align: left;
     font-size: 12px;

res/css/views/rooms/_WhoIsTypingTile.scss

@@ -40,6 +40,7 @@ limitations under the License.
 }
 
 .mx_WhoIsTypingTile_remainingAvatarPlaceholder {
+    position: relative;
     display: inline-block;
     color: #acacac;
     background-color: #ddd;

res/css/views/settings/tabs/user/_HelpUserSettingsTab.scss

@@ -14,11 +14,11 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-.mx_HelpSettingsTab_debugButton {
+.mx_HelpUserSettingsTab_debugButton {
     margin-bottom: 5px;
     margin-top: 5px;
 }
 
-.mx_HelpSettingsTab span.mx_AccessibleButton {
+.mx_HelpUserSettingsTab span.mx_AccessibleButton {
     word-break: break-word;
 }

res/css/views/settings/tabs/user/_NotificationUserSettingsTab.scss

@@ -14,6 +14,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-.mx_NotificationSettingsTab .mx_SettingsTab_heading {
+.mx_NotificationUserSettingsTab .mx_SettingsTab_heading {
     margin-bottom: 10px; // Give some spacing between the title and the first elements
 }

res/css/views/settings/tabs/user/_PreferencesUserSettingsTab.scss

@@ -14,11 +14,11 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-.mx_PreferencesSettingsTab .mx_Field {
+.mx_PreferencesUserSettingsTab .mx_Field {
     margin-right: 100px; // Align with the rest of the controls
 }
 
-.mx_PreferencesSettingsTab .mx_Field input {
+.mx_PreferencesUserSettingsTab .mx_Field input {
     display: block;
 
     // Subtract 10px padding on left and right

res/css/views/settings/tabs/user/_SecurityUserSettingsTab.scss

@@ -14,40 +14,40 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-.mx_SecuritySettingsTab .mx_DevicesPanel {
+.mx_SecurityUserSettingsTab .mx_DevicesPanel {
     // Normally the panel is 880px, however this can easily overflow the container.
     // TODO: Fix the table to not be squishy
     width: auto;
     max-width: 880px;
 }
 
-.mx_SecuritySettingsTab_deviceInfo {
+.mx_SecurityUserSettingsTab_deviceInfo {
     display: table;
     padding-left: 0;
 }
 
-.mx_SecuritySettingsTab_deviceInfo > li {
+.mx_SecurityUserSettingsTab_deviceInfo > li {
     display: table-row;
 }
 
-.mx_SecuritySettingsTab_deviceInfo > li > label,
-.mx_SecuritySettingsTab_deviceInfo > li > span {
+.mx_SecurityUserSettingsTab_deviceInfo > li > label,
+.mx_SecurityUserSettingsTab_deviceInfo > li > span {
     display: table-cell;
     padding-right: 1em;
 }
 
-.mx_SecuritySettingsTab_importExportButtons .mx_AccessibleButton {
+.mx_SecurityUserSettingsTab_importExportButtons .mx_AccessibleButton {
     margin-right: 10px;
 }
 
-.mx_SecuritySettingsTab_importExportButtons {
+.mx_SecurityUserSettingsTab_importExportButtons {
     margin-bottom: 15px;
 }
 
-.mx_SecuritySettingsTab_ignoredUser {
+.mx_SecurityUserSettingsTab_ignoredUser {
     margin-bottom: 5px;
 }
 
-.mx_SecuritySettingsTab_ignoredUser .mx_AccessibleButton {
+.mx_SecurityUserSettingsTab_ignoredUser .mx_AccessibleButton {
     margin-right: 10px;
 }

res/css/views/settings/tabs/user/_VoiceUserSettingsTab.scss

@@ -14,15 +14,15 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-.mx_VoiceSettingsTab .mx_Field select {
+.mx_VoiceUserSettingsTab .mx_Field select {
     width: 100%;
     max-width: 100%;
 }
 
-.mx_VoiceSettingsTab .mx_Field {
+.mx_VoiceUserSettingsTab .mx_Field {
     margin-right: 100px; // align with the rest of the fields
 }
 
-.mx_VoiceSettingsTab_missingMediaPermissions {
+.mx_VoiceUserSettingsTab_missingMediaPermissions {
     margin-bottom: 15px;
 }