mirror_maker
/
soapbox
mirror of https://gitlab.com/soapbox-pub/soapbox
1
0
Fork 1
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'styles' into 'develop'

Browse Source 
Minor visual improvements

See merge request soapbox-pub/soapbox-fe!1637
environments/review-develop-3zknud/deployments/600
marcin mikołajczak 2 years ago
parent 2d425f7a26 b294769dfe
commit f6fcbc80af
15 changed files with 24 additions and 28 deletions
Show Stats Download Patch File Download Diff File

2
app/soapbox/components/autosuggest_textarea.tsx
Unescape View File

@ -260,7 +260,7 @@ class AutosuggestTextarea extends ImmutablePureComponent<IAutosuggesteTextarea>
<Textarea
ref={this.setTextarea}
className={classNames('transition-[min-height] motion-reduce:transition-none dark:bg-slate-800 px-0 mt-1 border-0 text-gray-800 dark:text-white placeholder:text-gray-400 dark:placeholder:text-gray-500 resize-none w-full focus:shadow-none focus:border-0 focus:ring-0', {
className={classNames('transition-[min-height] motion-reduce:transition-none dark:bg-slate-800 px-0 border-0 text-gray-800 dark:text-white placeholder:text-gray-400 dark:placeholder:text-gray-500 resize-none w-full focus:shadow-none focus:border-0 focus:ring-0', {
'min-h-[40px]': condensed,
'min-h-[100px]': !condensed,
})}

11
app/soapbox/features/account_gallery/index.tsx
Unescape View File

@ -1,4 +1,4 @@
import React, { useEffect, useRef, useState } from 'react';
import React, { useEffect, useState } from 'react';
import { FormattedMessage } from 'react-intl';
import { useParams } from 'react-router-dom';
@ -66,8 +66,11 @@ const AccountGallery = () => {
const isLoading = useAppSelector((state) => state.timelines.get(`account:${accountId}:media`)?.isLoading);
const hasMore = useAppSelector((state) => state.timelines.get(`account:${accountId}:media`)?.hasMore);
const ref = useRef<HTMLDivElement>(null);
const [width] = useState(323);
const [width, setWidth] = useState(323);
const handleRef = (c: HTMLDivElement) => {
if (c) setWidth(c.offsetWidth);
};
const handleScrollToBottom = () => {
if (hasMore) {
@ -138,7 +141,7 @@ const AccountGallery = () => {
return (
<Column label={`@${accountUsername}`} transparent withHeader={false}>
<div role='feed' className='account-gallery__container' ref={ref}>
<div role='feed' className='account-gallery__container' ref={handleRef}>
{attachments.map((attachment, index) => attachment === null ? (
<LoadMoreMedia key={'more:' + attachments.get(index + 1)?.id} maxId={index > 0 ? (attachments.get(index - 1)?.id || null) : null} onLoadMore={handleLoadMore} />
) : (

2
app/soapbox/features/auth_login/components/login_form.tsx
Unescape View File

@ -25,7 +25,7 @@ const LoginForm: React.FC<ILoginForm> = ({ isLoading, handleSubmit }) => {
return (
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'><FormattedMessage id='login_form.header' defaultMessage='Sign In' /></h1>
</div>

2
app/soapbox/features/auth_login/components/otp_auth_form.tsx
Unescape View File

@ -48,7 +48,7 @@ const OtpAuthForm: React.FC<IOtpAuthForm> = ({ mfa_token }) => {
return (
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'>
<FormattedMessage id='login.otp_log_in' defaultMessage='OTP Login' />
</h1>

2
app/soapbox/features/auth_login/components/password_reset_confirm.tsx
Unescape View File

@ -58,7 +58,7 @@ const PasswordResetConfirm = () => {
return (
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'>
<FormattedMessage id='reset_password.header' defaultMessage='Set New Password' />
</h1>

8
app/soapbox/features/compose/components/compose_form.js
Unescape View File

@ -11,7 +11,7 @@ import { length } from 'stringz';
import AutosuggestInput from 'soapbox/components/autosuggest_input';
import AutosuggestTextarea from 'soapbox/components/autosuggest_textarea';
import Icon from 'soapbox/components/icon';
import { Button } from 'soapbox/components/ui';
import { Button, Stack } from 'soapbox/components/ui';
import { isMobile } from 'soapbox/is_mobile';
import PollForm from '../components/polls/poll-form';
@ -290,7 +290,7 @@ class ComposeForm extends ImmutablePureComponent {
}
return (
<div className='w-full' ref={this.setForm} onClick={this.handleClick}>
<Stack className='w-full' space={1} ref={this.setForm} onClick={this.handleClick}>
{scheduledStatusCount > 0 && (
<Warning
message={(
@ -335,7 +335,7 @@ class ComposeForm extends ImmutablePureComponent {
onSuggestionSelected={this.onSpoilerSuggestionSelected}
searchTokens={[':']}
id='cw-spoiler-input'
className='mb-2 border-none shadow-none px-0 py-2 text-base'
className='border-none shadow-none px-0 py-2 text-base'
autoFocus
/>
</div>
@ -395,7 +395,7 @@ class ComposeForm extends ImmutablePureComponent {
<Button theme='primary' text={publishText} onClick={this.handleSubmit} disabled={disabledButton} />
</div>
</div>
</div>
</Stack>
);
}

2
app/soapbox/features/onboarding/steps/bio-step.tsx
Unescape View File

@ -45,7 +45,7 @@ const BioStep = ({ onNext }: { onNext: () => void }) => {
<Card variant='rounded' size='xl'>
<CardBody>
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<Stack space={2}>
<Text size='2xl' align='center' weight='bold'>
<FormattedMessage id='onboarding.note.title' defaultMessage='Write a short bio' />

2
app/soapbox/features/onboarding/steps/cover-photo-selection-step.tsx
Unescape View File

@ -75,7 +75,7 @@ const CoverPhotoSelectionStep = ({ onNext }: { onNext: () => void }) => {
<Card variant='rounded' size='xl'>
<CardBody>
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<Stack space={2}>
<Text size='2xl' align='center' weight='bold'>
<FormattedMessage id='onboarding.header.title' defaultMessage='Pick a cover image' />

2
app/soapbox/features/onboarding/steps/display-name-step.tsx
Unescape View File

@ -52,7 +52,7 @@ const DisplayNameStep = ({ onNext }: { onNext: () => void }) => {
<Card variant='rounded' size='xl'>
<CardBody>
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<Stack space={2}>
<Text size='2xl' align='center' weight='bold'>
<FormattedMessage id='onboarding.display_name.title' defaultMessage='Choose a display name' />

2
app/soapbox/features/onboarding/steps/suggested-accounts-step.tsx
Unescape View File

@ -76,7 +76,7 @@ const SuggestedAccountsStep = ({ onNext }: { onNext: () => void }) => {
<Card variant='rounded' size='xl'>
<CardBody>
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<Stack space={2}>
<Text size='2xl' align='center' weight='bold'>
<FormattedMessage id='onboarding.suggestions.title' defaultMessage='Suggested accounts' />

2
app/soapbox/features/verification/registration.tsx
Unescape View File

@ -94,7 +94,7 @@ const Registration = () => {
return (
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'>
<FormattedMessage id='registration.header' defaultMessage='Register your account' />
</h1>

2
app/soapbox/features/verification/steps/age-verification.tsx
Unescape View File

@ -50,7 +50,7 @@ const AgeVerification = () => {
return (
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'>
<FormattedMessage id='age_verification.header' defaultMessage='Enter your birth date' />
</h1>

2
app/soapbox/features/verification/steps/email-verification.tsx
Unescape View File

@ -108,7 +108,7 @@ const EmailVerification = () => {
return (
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'>{intl.formatMessage({ id: 'email_verification.header', defaultMessage: 'Enter your email address' })}</h1>
</div>

4
app/soapbox/features/verification/steps/sms-verification.tsx
Unescape View File

@ -95,7 +95,7 @@ const SmsVerification = () => {
if (status === Statuses.REQUESTED) {
return (
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'>
{intl.formatMessage({ id: 'sms_verification.sent.header', defaultMessage: 'Verification code' })}
</h1>
@ -135,7 +135,7 @@ const SmsVerification = () => {
return (
<div>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 border-solid -mx-4 sm:-mx-10'>
<div className='pb-4 sm:pb-10 mb-4 border-b border-gray-200 dark:border-gray-600 border-solid -mx-4 sm:-mx-10'>
<h1 className='text-center font-bold text-2xl'>{intl.formatMessage({ id: 'sms_verification.header', defaultMessage: 'Enter your phone number' })}</h1>
</div>

7
app/styles/accounts.scss
Unescape View File

@ -67,13 +67,6 @@
.account__avatar-wrapper {
float: left;
margin-right: 12px;
.emoji-react__emoji {
position: absolute;
top: 36px;
left: 32px;
z-index: 1;
}
}
.account__avatar {

Write Preview
Loading…
Cancel
Save