Files
pwap/pezkuwi-sdk-ui/packages/react-components/src/AvatarItem.tsx
T
pezkuwichain 971df8edba Rebrand: Remove 3rd party chains, update domains to PezkuwiChain
- Remove all 3rd party parachain configurations from endpoints:
  - productionRelayPolkadot.ts: Keep only system parachains
  - productionRelayDicle.ts: Keep only system parachains
  - testingRelayZagros.ts: Keep only system parachains
  - testingRelayTeyrChain.ts: Keep only system parachains

- Update domain references:
  - polkadot.js.org → pezkuwichain.app
  - wiki.polkadot.network → wiki.pezkuwichain.io
  - dotapps.io → pezkuwichain.app
  - statement.polkadot.network → docs.pezkuwichain.io/statement
  - support.polkadot.network → docs.pezkuwichain.io

- Update repository references:
  - github.com/pezkuwi-js/apps → github.com/pezkuwichain/pwap

- Rename system parachains to Pezkuwi ecosystem:
  - PolkadotAssetHub → PezkuwiAssetHub
  - polkadotBridgeHub → pezkuwiBridgeHub
  - polkadotCollectives → pezkuwiCollectives
  - polkadotCoretime → pezkuwiCoretime
  - polkadotPeople → pezkuwiPeople

- Update network name in claims utility:
  - Polkadot → Pezkuwi
2026-01-09 03:08:11 +03:00

84 lines
1.7 KiB
TypeScript

// Copyright 2017-2026 @pezkuwi/react-components authors & contributors
// SPDX-License-Identifier: Apache-2.0
import React from 'react';
import { styled } from './styled.js';
interface Props {
children?: React.ReactNode;
className?: string;
color?: string;
icon: React.ReactNode;
isBig?: boolean;
title: React.ReactNode;
subtitle: React.ReactNode;
}
function AvatarItem ({ children, className = '', icon, isBig, subtitle, title }: Props): React.ReactElement<Props> {
return (
<StyledDiv className={['ui--AvatarItem', className, isBig && 'big'].join(' ')}>
<div className='ui--AvatarItem-icon'>
{icon}
</div>
<div className='ui--AvatarItem-details'>
<div className='ui--AvatarItem-title'>
{title}
</div>
<div className='ui--AvatarItem-subtitle'>
{subtitle}
</div>
</div>
{children}
</StyledDiv>
);
}
const StyledDiv = styled.div`
& {
display: flex;
align-items: center;
.ui--AvatarItem-icon {
margin-right: 0.5rem;
display: flex;
align-items: center;
justify-content: center;
}
}
.ui--AvatarItem-details {
.ui--AvatarItem-title {
font-weight: 600;
font-size: var(--font-size-base);
}
.ui--AvatarItem-subtitle {
font-weight: var(--font-weight-normal);
font-size: var(--font-size-base);
}
}
&.big {
.ui--AvatarItem-icon {
width: 3.4rem;
height: 3.4rem;
margin-right: 0.6rem;
> .ui--Icon {
font-size: 1.6rem;
line-height: 3.4rem;
}
}
.ui--AvatarItem-details {
.ui--AvatarItem-name {
font-size: 1.4rem;
line-height: 1.4rem;
}
}
}
`;
export default React.memo(AvatarItem);