From a5606c72de1383069c8846218fd61b5e6164f453 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Wed, 28 Jul 2021 17:56:57 +0100 Subject: [PATCH] Update feedback prompt to match designs --- res/css/structures/_SpaceRoomView.scss | 12 +--- res/css/views/spaces/_SpaceCreateMenu.scss | 70 +++++-------------- src/components/structures/SpaceRoomView.tsx | 17 +---- .../views/spaces/SpaceCreateMenu.tsx | 45 ++++++------ 4 files changed, 42 insertions(+), 102 deletions(-) diff --git a/res/css/structures/_SpaceRoomView.scss b/res/css/structures/_SpaceRoomView.scss index f8c0a5c262..58a4b426c2 100644 --- a/res/css/structures/_SpaceRoomView.scss +++ b/res/css/structures/_SpaceRoomView.scss @@ -340,18 +340,12 @@ $SpaceRoomViewInnerWidth: 428px; flex: 0; } - .mx_SpaceFeedbackPrompt_topRight { + .mx_SpaceFeedbackPrompt { padding: 7px; // 8px - 1px border border: 1px solid $menu-border-color; border-radius: 8px; - color: $secondary-fg-color; - font-size: $font-15px; - line-height: $font-24px; - float: right; - - & + .mx_BaseAvatar { - clear: both; - } + width: max-content; + margin: 0 0 -40px auto; // collapse its own height to not push other components down } .mx_SpaceRoomDirectory_list { diff --git a/res/css/views/spaces/_SpaceCreateMenu.scss b/res/css/views/spaces/_SpaceCreateMenu.scss index 7ed71e454c..e44e16916f 100644 --- a/res/css/views/spaces/_SpaceCreateMenu.scss +++ b/res/css/views/spaces/_SpaceCreateMenu.scss @@ -104,61 +104,23 @@ $spacePanelWidth: 71px; margin-top: 18px; margin-bottom: 12px; - > hr { - border: none; - border-top: 1px solid $input-border-color; - margin-bottom: 12px; + font-size: $font-15px; + line-height: $font-24px; + + > span { + color: $secondary-fg-color; + position: relative; + font-size: inherit; + line-height: inherit; + margin-right: auto; } - > div { - display: flex; - flex-direction: row; - font-size: $font-15px; - line-height: $font-24px; - - > span { - color: $secondary-fg-color; - position: relative; - padding-left: 32px; - font-size: inherit; - line-height: inherit; - margin-right: auto; - - &::before { - content: ''; - position: absolute; - left: 0; - top: 2px; - height: 20px; - width: 20px; - background-color: $secondary-fg-color; - mask-repeat: no-repeat; - mask-size: contain; - mask-image: url('$(res)/img/element-icons/room/room-summary.svg'); - mask-position: center; - } - } - - .mx_AccessibleButton_kind_link { - color: $accent-color; - position: relative; - padding: 0 0 0 24px; - margin-left: 8px; - font-size: inherit; - line-height: inherit; - - &::before { - content: ''; - position: absolute; - left: 0; - height: 16px; - width: 16px; - background-color: $accent-color; - mask-repeat: no-repeat; - mask-size: contain; - mask-image: url('$(res)/img/element-icons/chat-bubbles.svg'); - mask-position: center; - } - } + .mx_AccessibleButton_kind_link { + color: $accent-color; + position: relative; + padding: 0; + margin-left: 8px; + font-size: inherit; + line-height: inherit; } } diff --git a/src/components/structures/SpaceRoomView.tsx b/src/components/structures/SpaceRoomView.tsx index 7a1d501767..b47eb12c74 100644 --- a/src/components/structures/SpaceRoomView.tsx +++ b/src/components/structures/SpaceRoomView.tsx @@ -62,9 +62,8 @@ import IconizedContextMenu, { import AccessibleTooltipButton from "../views/elements/AccessibleTooltipButton"; import { BetaPill } from "../views/beta/BetaCard"; import { UserTab } from "../views/dialogs/UserSettingsDialog"; -import Modal from "../../Modal"; -import BetaFeedbackDialog from "../views/dialogs/BetaFeedbackDialog"; import { EffectiveMembership, getEffectiveMembership } from "../../utils/membership"; +import { SpaceFeedbackPrompt } from "../views/spaces/SpaceCreateMenu"; interface IProps { space: Room; @@ -393,19 +392,7 @@ const SpaceLanding = ({ space }) => { }; return
-
- { _t("Spaces are a new feature.") }  - { - Modal.createTrackedDialog("Beta Feedback", "feature_spaces", BetaFeedbackDialog, { - featureId: "feature_spaces", - }); - }} - > - { _t("Give feedback.") } - -
+
diff --git a/src/components/views/spaces/SpaceCreateMenu.tsx b/src/components/views/spaces/SpaceCreateMenu.tsx index ee01984db0..86999547b7 100644 --- a/src/components/views/spaces/SpaceCreateMenu.tsx +++ b/src/components/views/spaces/SpaceCreateMenu.tsx @@ -66,33 +66,30 @@ const nameToAlias = (name: string, domain: string): string => { }; // XXX: Temporary for the Spaces release only -const SpaceFeedbackPrompt = ({ onClick }: { onClick?: () => void }) => { +export const SpaceFeedbackPrompt = ({ onClick }: { onClick?: () => void }) => { if (!SdkConfig.get().bug_report_endpoint_url) return null; return
-
-
- { _t("Spaces are a new feature.") } - { - if (onClick) onClick(); - Modal.createTrackedDialog("Spaces Feedback", "", GenericFeatureFeedbackDialog, { - title: _t("Spaces feedback"), - subheading: _t("Thank you for trying Spaces. " + - "Your feedback will help inform the next versions."), - rageshakeLabel: "spaces-feedback", - rageshakeData: Object.fromEntries([ - "feature_spaces.all_rooms", - "feature_spaces.space_member_dms", - "feature_spaces.space_dm_badges", - ].map(k => [k, SettingsStore.getValue(k)])), - }); - }} - > - { _t("Give feedback.") } - -
+ { _t("Spaces are a new feature.") } + { + if (onClick) onClick(); + Modal.createTrackedDialog("Spaces Feedback", "", GenericFeatureFeedbackDialog, { + title: _t("Spaces feedback"), + subheading: _t("Thank you for trying Spaces. " + + "Your feedback will help inform the next versions."), + rageshakeLabel: "spaces-feedback", + rageshakeData: Object.fromEntries([ + "feature_spaces.all_rooms", + "feature_spaces.space_member_dms", + "feature_spaces.space_dm_badges", + ].map(k => [k, SettingsStore.getValue(k)])), + }); + }} + > + { _t("Give feedback.") } +
; };