diff --git a/res/css/views/room_settings/_AliasSettings.scss b/res/css/views/room_settings/_AliasSettings.scss
index 294902a1f0..8ae3acbbd3 100644
--- a/res/css/views/room_settings/_AliasSettings.scss
+++ b/res/css/views/room_settings/_AliasSettings.scss
@@ -29,4 +29,12 @@ limitations under the License.
 
 .mx_AliasSettings summary {
     cursor: pointer;
+    color: $accent-color;
+    font-weight: 600;
+    list-style: none;
+
+    // list-style doesn't do it for webkit
+    &::-webkit-details-marker {
+        display: none;
+    }
 }
diff --git a/src/components/views/room_settings/AliasSettings.js b/src/components/views/room_settings/AliasSettings.js
index 435dd9b7a3..0f2e3ad4eb 100644
--- a/src/components/views/room_settings/AliasSettings.js
+++ b/src/components/views/room_settings/AliasSettings.js
@@ -98,6 +98,7 @@ export default class AliasSettings extends React.Component {
             canonicalAlias: null, // #canonical:domain.tld
             updatingCanonicalAlias: false,
             localAliasesLoading: false,
+            detailsOpen: false,
         };
 
         if (props.canonicalAliasEvent) {
@@ -262,6 +263,7 @@ export default class AliasSettings extends React.Component {
                 this.loadLocalAliases();
             }
         }
+        this.setState({detailsOpen: event.target.open});
     };
 
     onCanonicalAliasChange = (event) => {
@@ -380,7 +382,7 @@ export default class AliasSettings extends React.Component {
                 <span className='mx_SettingsTab_subheading'>{_t("Local Addresses")}</span>
                 <p>{_t("Set addresses for this room so users can find this room through your homeserver (%(localDomain)s)", {localDomain})}</p>
                 <details onToggle={this.onLocalAliasesToggled}>
-                    <summary>{_t('Local addresses (unmoderated content)')}</summary>
+                    <summary>{ this.state.detailsOpen ? _t('Show less') : _t("Show more")}</summary>
                     {localAliasesList}
                 </details>
             </div>