Update copy and use svg for ellipsis

res/css/views/right_panel/_WidgetCard.scss

@@ -34,6 +34,26 @@ limitations under the License.
             }
         }
     }
+
+    .mx_WidgetCard_optionsButton {
+        position: relative;
+        height: 18px;
+        width: 26px;
+
+        &::before {
+            content: "";
+            position: absolute;
+            width: 18px;
+            height: 18px;
+            top: 7px;
+            left: 18px;
+            mask-repeat: no-repeat;
+            mask-position: center;
+            mask-size: contain;
+            mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
+            background-color: $secondary-fg-color;
+        }
+    }
 }
 
 .mx_WidgetCard_maxPinnedTooltip {

res/img/element-icons/room/ellipsis.svg

@@ -0,0 +1,5 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="14.5" cy="9" r="1.5" transform="rotate(180 14.5 9)" fill="#A9B2BC"/>
+<circle cx="9" cy="9" r="1.5" transform="rotate(180 9 9)" fill="#A9B2BC"/>
+<circle cx="3.5" cy="9" r="1.5" transform="rotate(180 3.5 9)" fill="#A9B2BC"/>
+</svg>

src/components/views/right_panel/RoomSummaryCard.tsx

@@ -158,7 +158,7 @@ const AppsSection: React.FC<IAppsSectionProps> = ({ room }) => {
         }) }
 
         <AccessibleButton kind="link" onClick={onManageIntegrations}>
-            { apps.length > 0 ? _t("Edit apps") : _t("Add apps") }
+            { apps.length > 0 ? _t("Edit apps, bridges & bots") : _t("Add apps, bridges & bots") }
         </AccessibleButton>
     </Group>;
 };

src/components/views/right_panel/WidgetCard.tsx

@@ -167,14 +167,12 @@ const WidgetCard: React.FC<IProps> = ({ room, widgetId, onClose }) => {
         { pinButton }
         <ContextMenuButton
             kind="secondary"
-            className={""}
+            className="mx_WidgetCard_optionsButton"
             inputRef={handle}
             onClick={openMenu}
             isExpanded={menuDisplayed}
             label={_t("Options")}
-        >
-            ...
-        </ContextMenuButton>
+        />
 
         { contextMenu }
     </React.Fragment>;

src/i18n/strings/en_EN.json

@@ -1286,8 +1286,8 @@
     "Room Info": "Room Info",
     "Apps": "Apps",
     "Unpin app": "Unpin app",
-    "Edit apps": "Edit apps",
-    "Add apps": "Add apps",
+    "Edit apps, bridges & bots": "Edit apps, bridges & bots",
+    "Add apps, bridges & bots": "Add apps, bridges & bots",
     "Not encrypted": "Not encrypted",
     "About": "About",
     "%(count)s people|other": "%(count)s people",