ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Settings: Fix star icons styling on RTL languages (#4865)

Browse Source
This commit is contained in:
zubiden 2024-08-29 15:52:07 +02:00 committed by Alexander Zinchuk
parent d5d88fc59f
commit f918819810
4 changed files with 7 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/left/settings/Settings.scss
View File

@ -103,10 +103,6 @@
}
}
.settings-main-menu-star .StarIcon {
margin-right: 1.25rem;
}
.settings-main-menu {
padding: 0.5rem;

4
src/components/left/settings/SettingsMain.tsx
View File

@ -162,7 +162,7 @@ const SettingsMain: FC<OwnProps & StateProps> = ({
<div className="settings-main-menu">
{canBuyPremium && (
<ListItem
leftElement={<StarIcon className="icon" type="premium" size="big" />}
leftElement={<StarIcon className="icon ListItem-main-icon" type="premium" size="big" />}
className="settings-main-menu-star"
// eslint-disable-next-line react/jsx-no-bind
onClick={() => openPremiumModal()}
@ -172,7 +172,7 @@ const SettingsMain: FC<OwnProps & StateProps> = ({
)}
{shouldDisplayStars && (
<ListItem
leftElement={<StarIcon className="icon" type="gold" size="big" />}
leftElement={<StarIcon className="icon ListItem-main-icon" type="gold" size="big" />}
className="settings-main-menu-star"
// eslint-disable-next-line react/jsx-no-bind
onClick={() => openStarsBalanceModal({})}

4
src/components/modals/stars/StarsBalanceModal.module.scss
View File

@ -167,13 +167,15 @@
font-weight: 500;
font-size: 1.5rem;
line-height: 1;
white-space: nowrap;
}
.stackedStars {
display: grid;
grid-auto-columns: 0.4375rem;
grid-auto-flow: column;
justify-items: end;
justify-items: center;
margin-left: 0.375rem;
}
.stackedStar {

4
src/components/modals/stars/StarsBalanceModal.tsx
View File

@ -34,12 +34,12 @@ import StarLogo from '../../../assets/icons/StarLogo.svg';
import StarsBackground from '../../../assets/stars-bg.png';
const TRANSACTION_TYPES = ['all', 'inbound', 'outbound'] as const;
const TRANSACTION_TABS: TabWithProperties[] = [
{ title: 'StarsTransactionsAll' },
{ title: 'StarsTransactionsIncoming' },
{ title: 'StarsTransactionsOutgoing' },
];
const MAX_STARS_COUNT = 6;
export type OwnProps = {
modal: TabState['starsBalanceModal'];
@ -101,7 +101,7 @@ const StarsBalanceModal = ({
}
result.push({
option,
starsCount: currentStackedStarsCount,
starsCount: Math.min(currentStackedStarsCount, MAX_STARS_COUNT),
});
});