Untitled
unknown
plain_text
6 months ago
2.1 kB
4
Indexable
const { widget } = figma; const { AutoLayout, Frame, Text } = widget; import Avatar from './components/Avatar'; import Button from './components/Button'; import SocialButton from './components/SocialButton'; const UserProfileScreen = () => ( <AutoLayout direction="vertical" padding={20} spacing={20} horizontalAlignItems="center" verticalAlignItems="center" > {/* First User Profile */} <AutoLayout direction="horizontal" spacing={10} horizontalAlignItems="center" verticalAlignItems="center" > <Avatar size="m" style="solid-bg" /> <Button label="Follow" style="filled" theme="primary" size="small" onClick={() => console.log('Follow button clicked')} /> <SocialButton label="Facebook" icon="<svg ... />" // Replace with actual Facebook SVG icon state="default" /> </AutoLayout> {/* Second User Profile */} <AutoLayout direction="horizontal" spacing={10} horizontalAlignItems="center" verticalAlignItems="center" > <Avatar size="m" style="memoji" /> <Button label="Message" style="outline" theme="neutral" size="small" onClick={() => console.log('Message button clicked')} /> <SocialButton label="Twitter" icon="<svg ... />" // Replace with actual Twitter SVG icon state="default" /> </AutoLayout> {/* Third User Profile */} <AutoLayout direction="horizontal" spacing={10} horizontalAlignItems="center" verticalAlignItems="center" > <Avatar size="m" style="illustration" /> <Button label="Add Friend" style="filled" theme="error" size="small" onClick={() => console.log('Add Friend button clicked')} /> <SocialButton label="LinkedIn" icon="<svg ... />" // Replace with actual LinkedIn SVG icon state="default" /> </AutoLayout> </AutoLayout> ); export default UserProfileScreen;
Editor is loading...
Leave a Comment