mirror of
https://github.com/mountain-loop/yaak.git
synced 2026-03-18 15:33:52 +01:00
Some minor tweaks
This commit is contained in:
@@ -214,34 +214,27 @@ export function GrpcConnectionLayout({ style }: Props) {
|
||||
}}
|
||||
alignItems="center"
|
||||
className={classNames(
|
||||
'px-2 py-1 font-mono text-xs opacity-70',
|
||||
m === activeMessage && 'bg-highlight !opacity-100',
|
||||
'px-2 py-1 font-mono',
|
||||
m === activeMessage && 'bg-highlight',
|
||||
)}
|
||||
>
|
||||
<Icon
|
||||
className={m.isServer ? 'text-blue-600' : 'text-green-600'}
|
||||
icon={m.isServer ? 'arrowBigDownDash' : 'arrowBigUpDash'}
|
||||
/>
|
||||
<div className="w-full truncate">{m.message}</div>
|
||||
<div>{format(m.time, 'HH:mm:ss')}</div>
|
||||
<div className="w-full truncate text-gray-800 text-xs">{m.message}</div>
|
||||
<div className="text-gray-600 text-2xs" title={m.time.toISOString()}>
|
||||
{format(m.time, 'HH:mm:ss')}
|
||||
</div>
|
||||
</HStack>
|
||||
))}
|
||||
</div>
|
||||
<div
|
||||
className={classNames(
|
||||
'transition-all',
|
||||
activeMessage ? 'opacity-100 translate-y-0' : 'opacity-0 translate-y-[100%]',
|
||||
)}
|
||||
>
|
||||
<div className={classNames(activeMessage ? 'block' : 'hidden')}>
|
||||
<div className="pb-1 px-2">
|
||||
<Separator />
|
||||
</div>
|
||||
<div className="pl-2 pb-1">
|
||||
<JsonAttributeTree
|
||||
depth={0}
|
||||
attrValue={JSON.parse(activeMessage?.message ?? '{}')}
|
||||
attrKey={''}
|
||||
/>
|
||||
<div className="pl-2 pb-1 h-[6rem]">
|
||||
<JsonAttributeTree attrValue={JSON.parse(activeMessage?.message ?? '{}')} />
|
||||
</div>
|
||||
{/*<Editor*/}
|
||||
{/* className="bg-gray-50 dark:bg-gray-100 max-h-30"*/}
|
||||
|
||||
@@ -12,7 +12,7 @@ export function CountBadge({ count, className }: Props) {
|
||||
aria-hidden
|
||||
className={classNames(
|
||||
className,
|
||||
'opacity-70 border border-highlight text-3xs rounded mb-0.5 px-1 ml-1 h-4 font-mono',
|
||||
'opacity-70 border border-highlight text-4xs rounded mb-0.5 px-1 ml-1 h-4 font-mono',
|
||||
)}
|
||||
>
|
||||
{count}
|
||||
|
||||
@@ -81,7 +81,7 @@ export const JsonAttributeTree = ({ depth = 0, attrKey, attrValue, attrKeyJsonPa
|
||||
<div className={classNames(/*depth === 0 && '-ml-4',*/ 'font-mono text-xs')}>
|
||||
<div className="flex items-center">
|
||||
{isExpandable ? (
|
||||
<button className="group relative flex items-center pl-4" onClick={toggleExpanded}>
|
||||
<button className="group relative flex items-center pl-4 w-full" onClick={toggleExpanded}>
|
||||
<Icon
|
||||
size="xs"
|
||||
icon="chevronRight"
|
||||
|
||||
@@ -56,7 +56,7 @@ export const VStack = forwardRef(function VStack(
|
||||
type BaseStackProps = HTMLAttributes<HTMLElement> & {
|
||||
as?: ComponentType | 'ul' | 'label' | 'form';
|
||||
space?: keyof typeof gapClasses;
|
||||
alignItems?: 'start' | 'center' | 'stretch';
|
||||
alignItems?: 'start' | 'center' | 'stretch' | 'end';
|
||||
justifyContent?: 'start' | 'center' | 'end' | 'between';
|
||||
};
|
||||
|
||||
@@ -75,6 +75,7 @@ const BaseStack = forwardRef(function BaseStack(
|
||||
alignItems === 'center' && 'items-center',
|
||||
alignItems === 'start' && 'items-start',
|
||||
alignItems === 'stretch' && 'items-stretch',
|
||||
alignItems === 'end' && 'items-end',
|
||||
justifyContent === 'start' && 'justify-start',
|
||||
justifyContent === 'center' && 'justify-center',
|
||||
justifyContent === 'end' && 'justify-end',
|
||||
|
||||
Reference in New Issue
Block a user