diff --git a/res/css/structures/_SpaceHierarchy.scss b/res/css/structures/_SpaceHierarchy.scss
index cdcd0164de..6b71818558 100644
--- a/res/css/structures/_SpaceHierarchy.scss
+++ b/res/css/structures/_SpaceHierarchy.scss
@@ -16,7 +16,6 @@ limitations under the License.
.mx_SpaceRoomView_landing {
.mx_AccessibleButton_kind_link {
- padding: 0;
font-size: inherit;
}
diff --git a/res/css/structures/_ToastContainer.scss b/res/css/structures/_ToastContainer.scss
index e4fe3c1e66..5137aed95a 100644
--- a/res/css/structures/_ToastContainer.scss
+++ b/res/css/structures/_ToastContainer.scss
@@ -159,7 +159,6 @@ limitations under the License.
.mx_AccessibleButton_kind_link {
font-size: inherit;
- padding: 0;
}
a {
diff --git a/res/css/structures/_UserMenu.scss b/res/css/structures/_UserMenu.scss
index aa4e7d6403..351d938995 100644
--- a/res/css/structures/_UserMenu.scss
+++ b/res/css/structures/_UserMenu.scss
@@ -146,7 +146,6 @@ limitations under the License.
.mx_AccessibleButton_kind_link {
font-weight: normal;
font-size: inherit;
- padding: 0;
}
}
}
diff --git a/res/css/structures/auth/_Login.scss b/res/css/structures/auth/_Login.scss
index 2290b6a345..0e6912e435 100644
--- a/res/css/structures/auth/_Login.scss
+++ b/res/css/structures/auth/_Login.scss
@@ -90,7 +90,6 @@ div.mx_AccessibleButton_kind_link.mx_Login_forgot {
margin: 0 auto;
// style it as a link
font-size: inherit;
- padding: 0;
&.mx_AccessibleButton_disabled {
cursor: not-allowed;
diff --git a/res/css/views/dialogs/_AddExistingToSpaceDialog.scss b/res/css/views/dialogs/_AddExistingToSpaceDialog.scss
index 5d53a99661..f82a29c546 100644
--- a/res/css/views/dialogs/_AddExistingToSpaceDialog.scss
+++ b/res/css/views/dialogs/_AddExistingToSpaceDialog.scss
@@ -54,7 +54,6 @@ limitations under the License.
font-size: $font-12px;
line-height: $font-15px;
margin-top: 8px;
- padding: 0;
}
}
@@ -136,10 +135,6 @@ limitations under the License.
left: 0;
}
}
-
- .mx_AccessibleButton_kind_link {
- padding: 0;
- }
}
}
diff --git a/res/css/views/dialogs/_BugReportDialog.scss b/res/css/views/dialogs/_BugReportDialog.scss
index 1920ac33ea..348d9ebb99 100644
--- a/res/css/views/dialogs/_BugReportDialog.scss
+++ b/res/css/views/dialogs/_BugReportDialog.scss
@@ -17,7 +17,7 @@ limitations under the License.
.mx_BugReportDialog {
.mx_BugReportDialog_download {
.mx_AccessibleButton_kind_link {
- padding-left: 0;
+ margin-right: 18px; // Space between "Downloading logs..."
}
}
}
diff --git a/res/css/views/dialogs/_CreateSubspaceDialog.scss b/res/css/views/dialogs/_CreateSubspaceDialog.scss
index 1ed10df35c..bcce6def89 100644
--- a/res/css/views/dialogs/_CreateSubspaceDialog.scss
+++ b/res/css/views/dialogs/_CreateSubspaceDialog.scss
@@ -73,9 +73,5 @@ limitations under the License.
margin-left: 16px;
padding: 8px 36px;
}
-
- .mx_AccessibleButton_kind_link {
- padding: 0;
- }
}
}
diff --git a/res/css/views/dialogs/_FeedbackDialog.scss b/res/css/views/dialogs/_FeedbackDialog.scss
index 9e4cf5e8aa..588f65eb65 100644
--- a/res/css/views/dialogs/_FeedbackDialog.scss
+++ b/res/css/views/dialogs/_FeedbackDialog.scss
@@ -59,7 +59,6 @@ limitations under the License.
}
.mx_AccessibleButton_kind_link {
- padding: 0;
font-size: inherit;
}
diff --git a/res/css/views/dialogs/_GenericFeatureFeedbackDialog.scss b/res/css/views/dialogs/_GenericFeatureFeedbackDialog.scss
index ab7496249d..3898e09756 100644
--- a/res/css/views/dialogs/_GenericFeatureFeedbackDialog.scss
+++ b/res/css/views/dialogs/_GenericFeatureFeedbackDialog.scss
@@ -23,7 +23,6 @@ limitations under the License.
}
.mx_AccessibleButton_kind_link {
- padding: 0;
font-size: inherit;
line-height: inherit;
}
diff --git a/res/css/views/dialogs/_InviteDialog.scss b/res/css/views/dialogs/_InviteDialog.scss
index af64862992..debef30083 100644
--- a/res/css/views/dialogs/_InviteDialog.scss
+++ b/res/css/views/dialogs/_InviteDialog.scss
@@ -96,6 +96,11 @@ limitations under the License.
> span {
color: $primary-content;
}
+
+ .mx_InviteDialog_section_showMore {
+ margin: 7px 18px;
+ display: inline;
+ }
}
.mx_InviteDialog_section_hidden_suggestions_disclaimer {
diff --git a/res/css/views/dialogs/_SpaceSettingsDialog.scss b/res/css/views/dialogs/_SpaceSettingsDialog.scss
index 8f064f6b38..31a544d166 100644
--- a/res/css/views/dialogs/_SpaceSettingsDialog.scss
+++ b/res/css/views/dialogs/_SpaceSettingsDialog.scss
@@ -76,11 +76,12 @@ limitations under the License.
}
.mx_AccessibleButton_hasKind {
- padding: 8px 22px;
+ &.mx_AccessibleButton_kind_link {
+ margin: 7px 18px;
- &.mx_SettingsTab_showAdvanced {
- margin: 16px 0;
- padding: 0;
+ &.mx_SettingsTab_showAdvanced {
+ margin: 18px 0;
+ }
}
}
diff --git a/res/css/views/elements/_AccessibleButton.scss b/res/css/views/elements/_AccessibleButton.scss
index bf5440d682..a411d9c6e0 100644
--- a/res/css/views/elements/_AccessibleButton.scss
+++ b/res/css/views/elements/_AccessibleButton.scss
@@ -16,152 +16,158 @@ limitations under the License.
.mx_AccessibleButton {
cursor: pointer;
-}
-.mx_AccessibleButton_disabled {
- cursor: default;
-}
+ &_disabled {
+ cursor: default;
-.mx_AccessibleButton_hasKind {
- padding: 7px 18px;
- text-align: center;
- border-radius: 8px;
- display: inline-flex;
- align-items: center;
- justify-content: center;
- font-size: $font-14px;
- border: none; // override default styles
-}
+ &.mx_AccessibleButton_kind {
+ &_primary,
+ &_primary_outline,
+ &_primary_sm,
+ &_link,
+ &_link_inline,
+ &_link_sm {
+ opacity: 0.4;
+ }
+ }
+ }
-.mx_AccessibleButton_kind_primary {
- color: $button-primary-fg-color;
- background-color: $accent;
- border: 1px solid $accent; // account for size loss of no border
- font-weight: 600;
-}
+ &_hasKind {
+ padding: 7px 18px;
+ text-align: center;
+ border-radius: 8px;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ font-size: $font-14px;
+ border: none; // override default styles
-.mx_AccessibleButton_kind_primary_outline {
- color: $accent;
- background-color: $button-secondary-bg-color;
- border: 1px solid $accent;
- font-weight: 600;
-}
+ &.mx_AccessibleButton_kind {
+ &_primary_sm,
+ &_danger_sm,
+ &_link_sm {
+ padding: 5px 12px;
+ }
-.mx_AccessibleButton_kind_secondary {
- color: $accent;
- font-weight: 600;
-}
+ &_primary_sm {
+ color: $button-primary-fg-color;
+ background-color: $accent;
+ }
-.mx_AccessibleButton_kind_primary.mx_AccessibleButton_disabled,
-.mx_AccessibleButton_kind_primary_outline.mx_AccessibleButton_disabled {
- opacity: 0.4;
-}
+ &_danger_sm {
+ color: $button-danger-fg-color;
+ background-color: $alert;
+ }
-.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_primary_sm {
- padding: 5px 12px;
- color: $button-primary-fg-color;
- background-color: $accent;
-}
+ &_link_sm {
+ color: $accent;
+ }
-.mx_AccessibleButton_kind_primary_sm.mx_AccessibleButton_disabled {
- opacity: 0.4;
-}
+ &_confirm_sm {
+ background-color: $accent;
-.mx_AccessibleButton_kind_danger {
- color: $button-danger-fg-color;
- background-color: $alert;
-}
+ &::before {
+ mask-image: url('$(res)/img/feather-customised/check.svg');
+ }
+ }
-.mx_AccessibleButton_kind_danger_outline {
- color: $alert;
- background-color: transparent;
- border: 1px solid $alert;
-}
+ &_cancel_sm {
+ background-color: $alert;
-.mx_AccessibleButton_kind_danger.mx_AccessibleButton_disabled {
- color: $button-danger-disabled-fg-color;
- background-color: $button-danger-disabled-bg-color;
-}
+ &::before {
+ mask-image: url('$(res)/img/feather-customised/x.svg');
+ }
+ }
+ }
+ }
-.mx_AccessibleButton_kind_danger_outline.mx_AccessibleButton_disabled {
- color: $button-danger-disabled-bg-color;
- border-color: $button-danger-disabled-bg-color;
-}
+ &_kind {
+ &_primary,
+ &_primary_outline,
+ &_secondary {
+ font-weight: 600;
+ }
-.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_danger_sm {
- padding: 5px 12px;
- color: $button-danger-fg-color;
- background-color: $alert;
-}
+ &_primary,
+ &_primary_outline {
+ border: 1px solid $accent;
+ }
-.mx_AccessibleButton_kind_danger_sm.mx_AccessibleButton_disabled {
- color: $button-danger-disabled-fg-color;
- background-color: $button-danger-disabled-bg-color;
-}
+ &_primary {
+ color: $button-primary-fg-color;
+ background-color: $accent;
+ }
-.mx_AccessibleButton_kind_link {
- color: $accent;
-}
+ &_primary_outline {
+ color: $accent;
+ background-color: $button-secondary-bg-color;
+ }
-.mx_AccessibleButton_kind_link.mx_AccessibleButton_disabled {
- opacity: 0.4;
-}
+ &_secondary {
+ color: $accent;
+ }
-.mx_AccessibleButton_kind_link_inline {
- color: $accent;
- font-size: inherit;
- padding: 0 2px;
-}
+ &_danger {
+ color: $button-danger-fg-color;
+ background-color: $alert;
-.mx_AccessibleButton_kind_link_inline.mx_AccessibleButton_disabled {
- opacity: 0.4;
-}
+ &.mx_AccessibleButton_disabled {
+ color: $button-danger-disabled-fg-color;
+ background-color: $button-danger-disabled-bg-color;
+ }
-.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_link_sm {
- padding: 5px 12px;
- color: $accent;
-}
+ &_outline {
+ color: $alert;
+ background-color: transparent;
+ border: 1px solid $alert;
-.mx_AccessibleButton_kind_link_sm.mx_AccessibleButton_disabled {
- opacity: 0.4;
-}
+ &.mx_AccessibleButton_disabled {
+ color: $button-danger-disabled-bg-color;
+ border-color: $button-danger-disabled-bg-color;
+ }
+ }
-.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_confirm_sm {
- background-color: $accent;
+ &_sm {
+ &.mx_AccessibleButton_disabled {
+ color: $button-danger-disabled-fg-color;
+ background-color: $button-danger-disabled-bg-color;
+ }
+ }
+ }
- &::before {
- mask-image: url('$(res)/img/feather-customised/check.svg');
- }
-}
-
-.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_cancel_sm {
- background-color: $alert;
-
- &::before {
- mask-image: url('$(res)/img/feather-customised/x.svg');
- }
-}
-
-.mx_AccessibleButton_kind_confirm_sm,
-.mx_AccessibleButton_kind_cancel_sm {
- padding: 0px;
- width: 16px;
- height: 16px;
- border-radius: 100%;
- position: relative;
- display: block;
-
- &::before {
- content: "";
- display: block;
- position: absolute;
- top: 0;
- bottom: 0;
- left: 0;
- right: 0;
- background-color: #ffffff;
- mask-repeat: no-repeat;
- mask-position: center;
- mask-size: 80%;
+ &_link {
+ color: $accent;
+ padding: 0;
+
+ &_inline {
+ color: $accent;
+ font-size: inherit;
+ padding: 0 2px;
+ }
+ }
+
+ &_confirm_sm,
+ &_cancel_sm {
+ padding: 0px;
+ width: 16px;
+ height: 16px;
+ border-radius: 100%;
+ position: relative;
+ display: block;
+
+ &::before {
+ content: "";
+ display: block;
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ background-color: #ffffff;
+ mask-repeat: no-repeat;
+ mask-position: center;
+ mask-size: 80%;
+ }
+ }
}
}
diff --git a/res/css/views/right_panel/_RoomSummaryCard.scss b/res/css/views/right_panel/_RoomSummaryCard.scss
index 14e5dc654f..f340883d48 100644
--- a/res/css/views/right_panel/_RoomSummaryCard.scss
+++ b/res/css/views/right_panel/_RoomSummaryCard.scss
@@ -235,7 +235,6 @@ limitations under the License.
}
.mx_AccessibleButton_kind_link {
- padding: 0;
margin-top: 12px;
margin-bottom: 12px;
font-size: $font-13px;
diff --git a/res/css/views/rooms/_NewRoomIntro.scss b/res/css/views/rooms/_NewRoomIntro.scss
index f0e471d384..4770c84adc 100644
--- a/res/css/views/rooms/_NewRoomIntro.scss
+++ b/res/css/views/rooms/_NewRoomIntro.scss
@@ -24,7 +24,6 @@ limitations under the License.
}
.mx_AccessibleButton_kind_link {
- padding: 0;
font-size: inherit;
}
diff --git a/res/css/views/rooms/_PinnedEventTile.scss b/res/css/views/rooms/_PinnedEventTile.scss
index 07978a8f65..3673ae42e9 100644
--- a/res/css/views/rooms/_PinnedEventTile.scss
+++ b/res/css/views/rooms/_PinnedEventTile.scss
@@ -91,7 +91,6 @@ limitations under the License.
}
.mx_AccessibleButton_kind_link {
- padding: 0;
margin-left: 12px;
font-size: inherit;
line-height: inherit;
diff --git a/res/css/views/settings/_ProfileSettings.scss b/res/css/views/settings/_ProfileSettings.scss
index 09509f7d9e..f62b45d1e5 100644
--- a/res/css/views/settings/_ProfileSettings.scss
+++ b/res/css/views/settings/_ProfileSettings.scss
@@ -61,8 +61,6 @@ limitations under the License.
margin-bottom: 28px;
> .mx_AccessibleButton_kind_link {
- padding-left: 0; // to align with left side
- padding-right: 0;
margin-right: 10px;
}
}
diff --git a/res/css/views/settings/tabs/room/_NotificationSettingsTab.scss b/res/css/views/settings/tabs/room/_NotificationSettingsTab.scss
index 97b807863f..3dcd4566a5 100644
--- a/res/css/views/settings/tabs/room/_NotificationSettingsTab.scss
+++ b/res/css/views/settings/tabs/room/_NotificationSettingsTab.scss
@@ -52,7 +52,6 @@ limitations under the License.
margin-right: 32px;
.mx_AccessibleButton_kind_link {
- padding: 0;
font-size: inherit;
}
}
diff --git a/res/css/views/settings/tabs/user/_PreferencesUserSettingsTab.scss b/res/css/views/settings/tabs/user/_PreferencesUserSettingsTab.scss
index 58a2f0b1f1..00691679ee 100644
--- a/res/css/views/settings/tabs/user/_PreferencesUserSettingsTab.scss
+++ b/res/css/views/settings/tabs/user/_PreferencesUserSettingsTab.scss
@@ -34,7 +34,6 @@ limitations under the License.
}
.mx_AccessibleButton_kind_link {
- padding: 0;
font-size: inherit;
}
}
diff --git a/res/css/views/spaces/_SpaceBasicSettings.scss b/res/css/views/spaces/_SpaceBasicSettings.scss
index a8e0e0e2f2..976960f90d 100644
--- a/res/css/views/spaces/_SpaceBasicSettings.scss
+++ b/res/css/views/spaces/_SpaceBasicSettings.scss
@@ -63,8 +63,7 @@ limitations under the License.
> .mx_AccessibleButton_kind_link {
display: inline-block;
- padding: 0;
- margin: auto 16px;
+ margin: auto 18px;
color: #368bd6;
}
@@ -74,7 +73,6 @@ limitations under the License.
}
.mx_AccessibleButton_hasKind {
- padding: 8px 22px;
margin-left: auto;
display: block;
width: min-content;
diff --git a/res/css/views/spaces/_SpaceCreateMenu.scss b/res/css/views/spaces/_SpaceCreateMenu.scss
index 9b5954aecf..3151b35c85 100644
--- a/res/css/views/spaces/_SpaceCreateMenu.scss
+++ b/res/css/views/spaces/_SpaceCreateMenu.scss
@@ -94,7 +94,6 @@ $spacePanelWidth: 68px;
}
.mx_AccessibleButton_kind_link {
- padding: 0;
font-size: inherit;
}
@@ -119,7 +118,6 @@ $spacePanelWidth: 68px;
.mx_AccessibleButton_kind_link {
color: $accent;
position: relative;
- padding: 0;
font-size: inherit;
line-height: inherit;
}
diff --git a/src/components/views/dialogs/InviteDialog.tsx b/src/components/views/dialogs/InviteDialog.tsx
index 35c091be99..36b2bd54e2 100644
--- a/src/components/views/dialogs/InviteDialog.tsx
+++ b/src/components/views/dialogs/InviteDialog.tsx
@@ -1166,9 +1166,11 @@ export default class InviteDialog extends React.PureComponent
- { _t("Show more") }
-
+
+
+ { _t("Show more") }
+
+
);
}