diff --git a/app/javascript/flavours/glitch/components/button.js b/app/javascript/flavours/glitch/components/button.js
index cd6528f5837..b1815c3e190 100644
--- a/app/javascript/flavours/glitch/components/button.js
+++ b/app/javascript/flavours/glitch/components/button.js
@@ -10,17 +10,11 @@ export default class Button extends React.PureComponent {
disabled: PropTypes.bool,
block: PropTypes.bool,
secondary: PropTypes.bool,
- size: PropTypes.number,
className: PropTypes.string,
title: PropTypes.string,
- style: PropTypes.object,
children: PropTypes.node,
};
- static defaultProps = {
- size: 36,
- };
-
handleClick = (e) => {
if (!this.props.disabled) {
this.props.onClick(e);
@@ -44,12 +38,6 @@ export default class Button extends React.PureComponent {
disabled: this.props.disabled,
onClick: this.handleClick,
ref: this.setRef,
- style: {
- padding: `0 ${this.props.size / 2.25}px`,
- height: `${this.props.size}px`,
- lineHeight: `${this.props.size}px`,
- ...this.props.style,
- },
};
if (this.props.title) attrs.title = this.props.title;
diff --git a/app/javascript/flavours/glitch/features/account/components/header.js b/app/javascript/flavours/glitch/features/account/components/header.js
index 9b080a14e3d..15515a99a73 100644
--- a/app/javascript/flavours/glitch/features/account/components/header.js
+++ b/app/javascript/flavours/glitch/features/account/components/header.js
@@ -159,13 +159,17 @@ class Header extends ImmutablePureComponent {
info.push();
}
+ if (account.getIn(['relationship', 'requested']) || account.getIn(['relationship', 'following'])) {
+ bellBtn = ;
+ }
+
if (me !== account.get('id')) {
if (!account.get('relationship')) { // Wait until the relationship is loaded
actionBtn = '';
} else if (account.getIn(['relationship', 'requested'])) {
- actionBtn = ;
+ actionBtn = ;
} else if (!account.getIn(['relationship', 'blocking'])) {
- actionBtn = ;
+ actionBtn = ;
} else if (account.getIn(['relationship', 'blocking'])) {
actionBtn = ;
}
@@ -173,10 +177,6 @@ class Header extends ImmutablePureComponent {
actionBtn = ;
}
- if (account.getIn(['relationship', 'requested']) || account.getIn(['relationship', 'following'])) {
- bellBtn = ;
- }
-
if (account.get('moved') && !account.getIn(['relationship', 'following'])) {
actionBtn = '';
}
diff --git a/app/javascript/flavours/glitch/styles/components/index.scss b/app/javascript/flavours/glitch/styles/components/index.scss
index cfaee655740..40206c696a0 100644
--- a/app/javascript/flavours/glitch/styles/components/index.scss
+++ b/app/javascript/flavours/glitch/styles/components/index.scss
@@ -141,6 +141,11 @@
display: block;
width: 100%;
}
+
+ .layout-multiple-columns &.button--with-bell {
+ font-size: 12px;
+ padding: 0 8px;
+ }
}
.icon-button {
diff --git a/app/javascript/flavours/glitch/styles/containers.scss b/app/javascript/flavours/glitch/styles/containers.scss
index d1c6c33d7bc..e5d95d16f88 100644
--- a/app/javascript/flavours/glitch/styles/containers.scss
+++ b/app/javascript/flavours/glitch/styles/containers.scss
@@ -446,6 +446,11 @@
}
}
+ .logo-button {
+ line-height: 36px;
+ padding: 3px 15px;
+ }
+
&__image {
border-radius: 4px 4px 0 0;
overflow: hidden;
diff --git a/app/javascript/flavours/glitch/styles/rtl.scss b/app/javascript/flavours/glitch/styles/rtl.scss
index 2375bac90bf..f6a90d271d8 100644
--- a/app/javascript/flavours/glitch/styles/rtl.scss
+++ b/app/javascript/flavours/glitch/styles/rtl.scss
@@ -163,6 +163,11 @@ body.rtl {
right: 42px;
}
+ .account__header__tabs__buttons > .icon-button {
+ margin-right: 0;
+ margin-left: 8px;
+ }
+
.account__avatar-overlay-overlay {
right: auto;
left: 0;
diff --git a/app/javascript/flavours/glitch/styles/statuses.scss b/app/javascript/flavours/glitch/styles/statuses.scss
index 58f74f954e6..9c2667bb8b4 100644
--- a/app/javascript/flavours/glitch/styles/statuses.scss
+++ b/app/javascript/flavours/glitch/styles/statuses.scss
@@ -79,9 +79,14 @@
background: $ui-highlight-color;
color: $primary-text-color;
text-transform: none;
- line-height: 36px;
+ line-height: 16px;
height: auto;
- padding: 3px 15px;
+ min-height: 36px;
+ min-width: 88px;
+ white-space: normal;
+ overflow-wrap: break-word;
+ hyphens: auto;
+ padding: 0 15px;
border: 0;
svg {