berserker
/
microblog
2
0
Fork 1
Code Issues 12 Pull Requests Projects Releases Wiki Activity

[Glitch] fix buttons showing inconsistent styles

Browse Source 
Port ea10febd25 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
local
Trevor Wolf 10 months ago committed by Claire
parent c3af91ce48
commit 15f6fa8d47
5 changed files with 9 additions and 81 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 8
      app/javascript/flavours/glitch/features/account/components/header.jsx
  2. 10
      app/javascript/flavours/glitch/features/directory/components/account_card.jsx
  3. 4
      app/javascript/flavours/glitch/styles/components/status.scss
  4. 8
      app/javascript/flavours/glitch/styles/mastodon-light/diff.scss
  5. 60
      app/javascript/flavours/glitch/styles/statuses.scss

8
app/javascript/flavours/glitch/features/account/components/header.jsx
Unescape View File

@ -196,14 +196,14 @@ class Header extends ImmutablePureComponent {
if (signedIn && !account.get('relationship')) { // Wait until the relationship is loaded
actionBtn = '';
} else if (account.getIn(['relationship', 'requested'])) {
actionBtn = <Button className={classNames('logo-button', { 'button--with-bell': bellBtn !== '' })} text={intl.formatMessage(messages.cancel_follow_request)} title={intl.formatMessage(messages.requested)} onClick={this.props.onFollow} />;
actionBtn = <Button className={classNames({ 'button--with-bell': bellBtn !== '' })} text={intl.formatMessage(messages.cancel_follow_request)} title={intl.formatMessage(messages.requested)} onClick={this.props.onFollow} />;
} else if (!account.getIn(['relationship', 'blocking'])) {
actionBtn = <Button className={classNames('logo-button', { 'button--destructive': account.getIn(['relationship', 'following']), 'button--with-bell': bellBtn !== '' })} text={intl.formatMessage(account.getIn(['relationship', 'following']) ? messages.unfollow : messages.follow)} onClick={signedIn ? this.props.onFollow : this.props.onInteractionModal} />;
actionBtn = <Button className={classNames({ 'button--destructive': account.getIn(['relationship', 'following']), 'button--with-bell': bellBtn !== '' })} text={intl.formatMessage(account.getIn(['relationship', 'following']) ? messages.unfollow : messages.follow)} onClick={signedIn ? this.props.onFollow : this.props.onInteractionModal} />;
} else if (account.getIn(['relationship', 'blocking'])) {
actionBtn = <Button className='logo-button' text={intl.formatMessage(messages.unblock, { name: account.get('username') })} onClick={this.props.onBlock} />;
actionBtn = <Button text={intl.formatMessage(messages.unblock, { name: account.get('username') })} onClick={this.props.onBlock} />;
}
} else if (profileLink) {
actionBtn = <Button className='logo-button' text={intl.formatMessage(messages.edit_profile)} onClick={this.openEditProfile} />;
actionBtn = <Button text={intl.formatMessage(messages.edit_profile)} onClick={this.openEditProfile} />;
}
if (account.get('moved') && !account.getIn(['relationship', 'following'])) {

10
app/javascript/flavours/glitch/features/directory/components/account_card.jsx
Unescape View File

@ -171,16 +171,16 @@ class AccountCard extends ImmutablePureComponent {
if (!account.get('relationship')) { // Wait until the relationship is loaded
actionBtn = '';
} else if (account.getIn(['relationship', 'requested'])) {
actionBtn = <Button className={classNames('logo-button')} text={intl.formatMessage(messages.cancel_follow_request)} title={intl.formatMessage(messages.requested)} onClick={this.handleFollow} />;
actionBtn = <Button text={intl.formatMessage(messages.cancel_follow_request)} title={intl.formatMessage(messages.requested)} onClick={this.handleFollow} />;
} else if (account.getIn(['relationship', 'muting'])) {
actionBtn = <Button className='logo-button' text={intl.formatMessage(messages.unmute)} onClick={this.handleMute} />;
actionBtn = <Button text={intl.formatMessage(messages.unmute)} onClick={this.handleMute} />;
} else if (!account.getIn(['relationship', 'blocking'])) {
actionBtn = <Button disabled={account.getIn(['relationship', 'blocked_by'])} className={classNames('logo-button', { 'button--destructive': account.getIn(['relationship', 'following']) })} text={intl.formatMessage(account.getIn(['relationship', 'following']) ? messages.unfollow : messages.follow)} onClick={this.handleFollow} />;
actionBtn = <Button disabled={account.getIn(['relationship', 'blocked_by'])} className={classNames({ 'button--destructive': account.getIn(['relationship', 'following']) })} text={intl.formatMessage(account.getIn(['relationship', 'following']) ? messages.unfollow : messages.follow)} onClick={this.handleFollow} />;
} else if (account.getIn(['relationship', 'blocking'])) {
actionBtn = <Button className='logo-button' text={intl.formatMessage(messages.unblock)} onClick={this.handleBlock} />;
actionBtn = <Button text={intl.formatMessage(messages.unblock)} onClick={this.handleBlock} />;
}
} else {
actionBtn = <Button className='logo-button' text={intl.formatMessage(messages.edit_profile)} onClick={this.handleEditProfile} />;
actionBtn = <Button text={intl.formatMessage(messages.edit_profile)} onClick={this.handleEditProfile} />;
}
return (

4
app/javascript/flavours/glitch/styles/components/status.scss
Unescape View File

@ -657,10 +657,6 @@ a.status__display-name,
color: inherit;
}
.detailed-status .button.logo-button {
margin-bottom: 15px;
}
.detailed-status__display-name {
color: $secondary-text-color;
display: block;

8
app/javascript/flavours/glitch/styles/mastodon-light/diff.scss
Unescape View File

@ -627,14 +627,6 @@ html {
}
}
.button.logo-button {
color: $white;
svg {
fill: $white;
}
}
.notification__filter-bar button.active::after,
.account__section-headline a.active::after {
border-color: transparent transparent $white;

60
app/javascript/flavours/glitch/styles/statuses.scss
Unescape View File

@ -73,66 +73,6 @@
}
}
.button.logo-button {
flex: 0 auto;
font-size: 14px;
background: darken($ui-highlight-color, 2%);
color: $primary-text-color;
text-transform: none;
line-height: 1.2;
height: auto;
min-height: 36px;
min-width: 88px;
white-space: normal;
overflow-wrap: break-word;
hyphens: auto;
padding: 0 15px;
border: 0;
svg {
width: 20px;
height: auto;
vertical-align: middle;
margin-inline-end: 5px;
fill: $primary-text-color;
}
&:active,
&:focus,
&:hover {
background: $ui-highlight-color;
}
&:disabled,
&.disabled {
&:active,
&:focus,
&:hover {
background: $ui-primary-color;
}
}
&.button--destructive {
&:active,
&:focus,
&:hover {
background: $error-red;
}
}
@media screen and (max-width: $no-gap-breakpoint) {
svg {
display: none;
}
}
}
a.button.logo-button {
display: inline-flex;
align-items: center;
justify-content: center;
}
.embed {
.status__content[data-spoiler='folded'] {
.e-content {

Write Preview
Loading…
Cancel
Save