feat(ui): change icons to phosphor-icons #467 (#469)

* change icons to phosphor-icons

* feat(ui): change icons to phosphor-icons

* feat(ui): change icons to phosphor-icons

* feat(ui): correct icon sizes, weights, and colors

* feat(ui): change arrow-up-right sizes to 16px
This commit is contained in:
Preston Cook
2024-12-31 13:36:08 -06:00
committed by GitHub
parent 918f4e419c
commit 37bd7e79d9
25 changed files with 112 additions and 141 deletions

View File

@@ -1,11 +1,10 @@
import { ArrowsVertical } from '@phosphor-icons/react';
import type { Meta, StoryObj } from '@storybook/react';
import { Button } from '@views/components/common/Button';
import DialogProvider, { usePrompt } from '@views/components/common/DialogProvider/DialogProvider';
import Text from '@views/components/common/Text/Text';
import React, { useState } from 'react';
import MaterialSymbolsExpandAllRoundedIcon from '~icons/material-symbols/expand-all-rounded';
const meta = {
title: 'Components/Common/DialogProvider',
component: DialogProvider,
@@ -46,7 +45,13 @@ const InnerComponent = () => {
};
return (
<Button variant='filled' color='ut-burntorange' icon={MaterialSymbolsExpandAllRoundedIcon} onClick={myShow}>
<Button
variant='filled'
color='ut-burntorange'
icon={ArrowsVertical}
iconProps={{ className: 'h-4 w-4' }}
onClick={myShow}
>
Open Dialog
</Button>
);
@@ -86,7 +91,7 @@ const FiveDialogsInnerComponent = () => {
};
return (
<Button variant='filled' color='ut-burntorange' icon={MaterialSymbolsExpandAllRoundedIcon} onClick={myShow}>
<Button variant='filled' color='ut-burntorange' icon={ArrowsVertical} onClick={myShow}>
Open Dialogs
</Button>
);
@@ -121,7 +126,7 @@ const NestedDialogsInnerComponent = () => {
};
return (
<Button variant='filled' color='ut-burntorange' icon={MaterialSymbolsExpandAllRoundedIcon} onClick={myShow}>
<Button variant='filled' color='ut-burntorange' icon={ArrowsVertical} onClick={myShow}>
Open Next Dialog
</Button>
);
@@ -161,7 +166,7 @@ const DialogWithOnCloseInnerComponent = () => {
<h1>
You closed the button below {timesClosed} {timesClosed === 1 ? 'time' : 'times'}
</h1>
<Button variant='filled' color='ut-burntorange' icon={MaterialSymbolsExpandAllRoundedIcon} onClick={myShow}>
<Button variant='filled' color='ut-burntorange' icon={ArrowsVertical} onClick={myShow}>
Open Dialog
</Button>
</>