Fix space creation menu shade width

res/css/views/spaces/_SpaceCreateMenu.scss

@@ -14,10 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-// TODO: the space panel currently does not have a fixed width,
-// just the headers at each level have a max-width of 150px
-// so this will look slightly off for now. We should probably use css grid for the whole main layout...
-$spacePanelWidth: 200px;
+$spacePanelWidth: 71px;
 
 .mx_SpaceCreateMenu_wrapper {
     // background blur everything except SpacePanel

src/components/views/spaces/SpacePanel.tsx

@@ -220,13 +220,19 @@ const SpacePanel = () => {
                     <SpaceButton
                         className={newClasses}
                         tooltip={menuDisplayed ? _t("Cancel") : _t("Create a space")}
-                        onClick={menuDisplayed ? closeMenu : openMenu}
+                        onClick={menuDisplayed ? closeMenu : () => {
+                            openMenu();
+                            if (!isPanelCollapsed) setPanelCollapsed(true);
+                        }}
                         isNarrow={isPanelCollapsed}
                     />
                 </AutoHideScrollbar>
                 <AccessibleTooltipButton
                     className={classNames("mx_SpacePanel_toggleCollapse", {expanded: !isPanelCollapsed})}
-                    onClick={evt => setPanelCollapsed(!isPanelCollapsed)}
+                    onClick={() => {
+                        setPanelCollapsed(!isPanelCollapsed);
+                        if (menuDisplayed) closeMenu();
+                    }}
                     title={expandCollapseButtonTitle}
                 />
                 { contextMenu }