Skip to content

Commit

Permalink
Merge branch 'glitch-soc:main' into maratang
Browse files Browse the repository at this point in the history
  • Loading branch information
@Lastorder-DC
Lastorder-DC authored Feb 17, 2024
2 parents f632e1d + c027938 commit 57bae22
Show file tree
Hide file tree
Showing 4 changed files with 102 additions and 79 deletions.
1 change: 0 additions & 1 deletion app/javascript/flavours/glitch/features/account/components/follow_request_note.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import CheckIcon from '@/material-icons/400-24px/check.svg?react';
import CloseIcon from '@/material-icons/400-24px/close.svg?react';
import { Icon } from 'flavours/glitch/components/icon';


export default class FollowRequestNote extends ImmutablePureComponent {

static propTypes = {
Expand Down
36 changes: 18 additions & 18 deletions app/javascript/flavours/glitch/features/account/components/header.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ import { withRouter } from 'react-router-dom';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';


import CheckIcon from '@/material-icons/400-24px/check.svg?react';
import LockIcon from '@/material-icons/400-24px/lock.svg?react';
import MoreHorizIcon from '@/material-icons/400-24px/more_horiz.svg?react';
Expand Down Expand Up @@ -308,7 +307,7 @@ class Header extends ImmutablePureComponent {
}
}

const content = { __html: account.get('note_emojified') };
const content = { __html: account.get('note_emojified') };
const displayNameHtml = { __html: account.get('display_name_html') };
const fields = account.get('fields');
const isLocal = account.get('acct').indexOf('@') === -1;
Expand Down Expand Up @@ -372,28 +371,29 @@ class Header extends ImmutablePureComponent {
</div>
)}

{signedIn && <AccountNoteContainer account={account} />}

{!(suspended || hidden) && (
<div className='account__header__extra'>
<div className='account__header__bio'>
{ fields.size > 0 && (
<div className='account__header__fields'>
{fields.map((pair, i) => (
<dl key={i}>
<dt dangerouslySetInnerHTML={{ __html: pair.get('name_emojified') }} title={pair.get('name')} />

<dd className={pair.get('verified_at') && 'verified'} title={pair.get('value_plain')}>
{pair.get('verified_at') && <span title={intl.formatMessage(messages.linkVerifiedOn, { date: intl.formatDate(pair.get('verified_at'), dateFormatOptions) })}><Icon id='check' icon={CheckIcon} className='verified__mark' /></span>} <span dangerouslySetInnerHTML={{ __html: pair.get('value_emojified') }} className='translate' />
</dd>
</dl>
))}
</div>
)}
{(account.get('id') !== me && signedIn) && <AccountNoteContainer account={account} />}

{account.get('note').length > 0 && account.get('note') !== '<p></p>' && <div className='account__header__content translate' dangerouslySetInnerHTML={content} />}

<div className='account__header__joined'><FormattedMessage id='account.joined' defaultMessage='Joined {date}' values={{ date: intl.formatDate(account.get('created_at'), { year: 'numeric', month: 'short', day: '2-digit' }) }} /></div>
<div className='account__header__fields'>
<dl>
<dt><FormattedMessage id='account.joined_short' defaultMessage='Joined' /></dt>
<dd>{intl.formatDate(account.get('created_at'), { year: 'numeric', month: 'short', day: '2-digit' })}</dd>
</dl>

{fields.map((pair, i) => (
<dl key={i} className={classNames({ verified: pair.get('verified_at') })}>
<dt dangerouslySetInnerHTML={{ __html: pair.get('name_emojified') }} title={pair.get('name')} className='translate' />

<dd className='translate' title={pair.get('value_plain')}>
{pair.get('verified_at') && <span title={intl.formatMessage(messages.linkVerifiedOn, { date: intl.formatDate(pair.get('verified_at'), dateFormatOptions) })}><Icon id='check' icon={CheckIcon} className='verified__mark' /></span>} <span dangerouslySetInnerHTML={{ __html: pair.get('value_emojified') }} />
</dd>
</dl>
))}
</div>
</div>
</div>
)}
Expand Down
1 change: 0 additions & 1 deletion app/javascript/flavours/glitch/locales/en.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@
"account.disclaimer_full": "Information below may reflect the user's profile incompletely.",
"account.follows": "Follows",
"account.follows_you": "Follows you",
"account.joined": "Joined {date}",
"account.suspended_disclaimer_full": "This user has been suspended by a moderator.",
"account.view_full_profile": "View full profile",
"advanced_options.icon_title": "Advanced options",
Expand Down
143 changes: 84 additions & 59 deletions app/javascript/flavours/glitch/styles/components.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5317,7 +5317,7 @@ a.status-card.compact:hover {
border-bottom: 1px solid lighten($ui-base-color, 8%);
display: flex;
flex-direction: row;
padding: 10px 0;
padding: 8px 0;
}

.language-dropdown {
Expand Down Expand Up @@ -7986,6 +7986,7 @@ noscript {
height: 145px;
position: relative;
background: darken($ui-base-color, 4%);
border-bottom: 1px solid lighten($ui-base-color, 8%);

img {
object-fit: cover;
Expand All @@ -7998,9 +7999,9 @@ noscript {

&__bar {
position: relative;
background: lighten($ui-base-color, 4%);
padding: 5px;
border-bottom: 1px solid lighten($ui-base-color, 12%);
padding: 0 20px;
padding-bottom: 16px; // glitch-soc addition for the different tabs design
border-bottom: 1px solid lighten($ui-base-color, 8%);

.avatar {
display: block;
Expand All @@ -8009,7 +8010,7 @@ noscript {

.account__avatar {
background: darken($ui-base-color, 8%);
border: 2px solid lighten($ui-base-color, 4%);
border: 2px solid $ui-base-color;
}
}
}
Expand All @@ -8028,8 +8029,8 @@ noscript {
display: flex;
align-items: flex-start;
justify-content: space-between;
padding: 7px 10px;
margin-top: -55px;
padding-top: 10px;
gap: 8px;
overflow: hidden;
margin-inline-start: -2px; // aligns the pfp with content below
Expand Down Expand Up @@ -8064,25 +8065,26 @@ noscript {
}

&__name {
padding: 5px 10px;
margin-top: 16px;
margin-bottom: 16px;

.emojione {
width: 22px;
height: 22px;
}

h1 {
font-size: 16px;
line-height: 24px;
font-size: 17px;
line-height: 22px;
color: $primary-text-color;
font-weight: 500;
font-weight: 700;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;

small {
display: block;
font-size: 14px;
font-size: 15px;
color: $darker-text-color;
font-weight: 400;
overflow: hidden;
Expand All @@ -8108,63 +8110,97 @@ noscript {
}

&__bio {
overflow: hidden;
margin: 0 -5px;

.account__header__content {
padding: 20px 15px;
padding-bottom: 5px;
color: $primary-text-color;
}

.account__header__joined {
font-size: 14px;
padding: 5px 15px;
color: $darker-text-color;
.account__header__fields {
margin: 0;
margin-top: 16px;
border-radius: 4px;
background: darken($ui-base-color, 4%);
border: 0;

.columns-area--mobile & {
padding-inline-start: 20px;
padding-inline-end: 20px;
dl {
display: block;
padding: 8px 16px; // glitch-soc: padding purposefuly reduced
border-bottom-color: lighten($ui-base-color, 4%);
}
}

.account__header__fields {
margin: 0;
border-top: 1px solid lighten($ui-base-color, 12%);
dd,
dt {
font-size: 13px;
line-height: 18px;
padding: 0;
text-align: initial;
}

a {
color: lighten($ui-highlight-color, 8%);
dt {
width: auto;
background: transparent;
text-transform: uppercase;
color: $dark-text-color;
}

dd {
color: $darker-text-color;
}

dl:first-child .verified {
border-radius: 0 4px 0 0;
a {
color: lighten($ui-highlight-color, 8%);
}

.icon {
width: 18px;
height: 18px;
vertical-align: middle;
}

dd {
display: flex;
align-items: center;
gap: 4px;
}
.verified {
border: 1px solid rgba($valid-value-color, 0.5);
margin-top: -1px;

&:first-child {
border-top-left-radius: 4px;
border-top-right-radius: 4px;
margin-top: 0;
}

&:last-child {
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}

dt,
dd {
color: $valid-value-color;
}

dd {
display: flex;
align-items: center;
gap: 4px;

span {
display: flex;
}
}

.verified a {
color: $valid-value-color;
a {
color: $valid-value-color;
}
}
}
}

&__extra {
margin-top: 4px;
margin-top: 16px;

&__links {
font-size: 14px;
color: $darker-text-color;
padding: 10px 0;
margin: 0 -10px;
padding-top: 16px;
padding-bottom: 10px;

a {
display: inline-block;
Expand All @@ -8182,14 +8218,10 @@ noscript {
}

&__account-note {
margin: 0 -5px;
padding: 10px 15px;
display: flex;
flex-direction: column;
color: $primary-text-color;
font-size: 14px;
font-weight: 400;
border-top: 1px solid lighten($ui-base-color, 12%);
border-bottom: 1px solid lighten($ui-base-color, 12%);
margin-bottom: 10px;

label {
display: block;
Expand All @@ -8200,23 +8232,12 @@ noscript {
margin-bottom: 5px;
}

&__content {
white-space: pre-wrap;
padding: 10px 0;
}

strong {
font-size: 12px;
font-weight: 500;
text-transform: uppercase;
}

textarea {
display: block;
box-sizing: border-box;
width: calc(100% + 20px);
color: $secondary-text-color;
background: $ui-base-color;
background: transparent;
padding: 10px;
margin: 0 -10px;
font-family: inherit;
Expand All @@ -8230,6 +8251,10 @@ noscript {
color: $dark-text-color;
opacity: 1;
}

&:focus {
background: $ui-base-color;
}
}
}
}
Expand Down

0 comments on commit 57bae22

Please sign in to comment.