fix(client): lighten the ellipsis glyph and adopt the Toast success tone
This commit is contained in:
1 parent
bd0461c894
commit
5474efe890
3 files changed
+5
-18
No files matched your search
@@ -96,9 +96,9 @@ export const IconPanelLeftOutlineMedium = (props: IconProps) => (
|
||||
|
||||
const IconEllipsisOutlineArtwork = ({ size = 16, className, strokeWidth }: WeightedIconProps) => (
|
||||
<svg width={size} height={size} className={className} viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" strokeWidth={strokeWidth}>
|
||||
<path d="M3 9.25C3.69036 9.25 4.25 8.69036 4.25 8C4.25 7.30964 3.69036 6.75 3 6.75C2.30964 6.75 1.75 7.30964 1.75 8C1.75 8.69036 2.30964 9.25 3 9.25Z" fill="currentColor" />
|
||||
<path d="M8 9.25C8.69036 9.25 9.25 8.69036 9.25 8C9.25 7.30964 8.69036 6.75 8 6.75C7.30964 6.75 6.75 7.30964 6.75 8C6.75 8.69036 7.30964 9.25 8 9.25Z" fill="currentColor" />
|
||||
<path d="M13 9.25C13.6904 9.25 14.25 8.69036 14.25 8C14.25 7.30964 13.6904 6.75 13 6.75C12.3096 6.75 11.75 7.30964 11.75 8C11.75 8.69036 12.3096 9.25 13 9.25Z" fill="currentColor" />
|
||||
<path d="M3 9C3.55228 9 4 8.55228 4 8C4 7.44772 3.55228 7 3 7C2.44772 7 2 7.44772 2 8C2 8.55228 2.44772 9 3 9Z" fill="currentColor" />
|
||||
<path d="M8 9C8.55228 9 9 8.55228 9 8C9 7.44772 8.55228 7 8 7C7.44772 7 7 7.44772 7 8C7 8.55228 7.44772 9 8 9Z" fill="currentColor" />
|
||||
<path d="M13 9C13.5523 9 14 8.55228 14 8C14 7.44772 13.5523 7 13 7C12.4477 7 12 7.44772 12 8C12 8.55228 12.4477 9 13 9Z" fill="currentColor" />
|
||||
</svg>
|
||||
)
|
||||
|
||||
|
||||
@@ -556,19 +556,6 @@
|
||||
color: var(--dsw-alias-label-secondary);
|
||||
}
|
||||
|
||||
/* The design's ringed green check for the success toast; the Toast icon seat
|
||||
defaults to the warning tint. */
|
||||
.toastIcon {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border: 1.5px solid var(--dsw-alias-state-success-primary);
|
||||
border-radius: 50%;
|
||||
corner-shape: round;
|
||||
color: var(--dsw-alias-state-success-primary);
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.wide {
|
||||
animation: none;
|
||||
|
||||
@@ -13,7 +13,7 @@ import { type CSSProperties, type ReactNode, useCallback, useEffect, useMemo, us
|
||||
import clsx from 'clsx'
|
||||
import autoAnimate, { type AnimationController, type AutoAnimationPlugin } from '@formkit/auto-animate'
|
||||
import {
|
||||
Button, IconArchiveCheckOutlineRegular, IconArchiveOutlineRegular, IconCheckOutlineRegular,
|
||||
Button, IconArchiveCheckOutlineRegular, IconArchiveOutlineRegular,
|
||||
IconChevronsUpDownOutlineRegular, IconClockOutlineRegular, IconCloseFillRegular,
|
||||
IconFlatListOutlineRegular, IconFolderCloseRegular, IconProjectAddOutlineRegular,
|
||||
IconSearchOutlineRegular, IconSlidersTwoOutlineRegular, IconWarningOutlineRegular,
|
||||
@@ -1697,7 +1697,7 @@ export function WorkspaceBrowser({
|
||||
key={`toast-${String(toast.seq)}`}
|
||||
text={toast.text}
|
||||
{...toast.tone === 'success'
|
||||
? { icon: <span className={css.toastIcon}><IconCheckOutlineRegular size={12} /></span> }
|
||||
? { tone: 'success' as const }
|
||||
: { icon: <IconWarningOutlineRegular /> }}
|
||||
{...toast.actions === undefined ? {} : { actions: toast.actions, holdMs: ARCHIVE_TOAST_HOLD_MS }}
|
||||
onDone={() => { setToast(null) }}
|
||||
|
||||
Reference in new issue
Block a user