chore: adjust styles for alignment and borders

This commit is contained in:
Matthew Russell 2024-02-07 17:15:11 -08:00
parent 619b73212f
commit 96a07b6379
No known key found for this signature in database

View File

@ -29,14 +29,14 @@ export const MobileMarketHeader = () => {
if (!marketId) return null;
return (
<div className="p-2 flex justify-between gap-2 items-center h-10 border-b border-default bg-vega-clight-700 dark:bg-vega-cdark-700">
<div className="pl-3 pr-2 flex justify-between gap-2 h-10 bg-vega-clight-700 dark:bg-vega-cdark-700">
<FullScreenPopover
open={openMarket}
onOpenChange={(x) => {
setOpenMarket(x);
}}
trigger={
<h1 className="flex gap-1 sm:gap-2 md:gap-4 items-center text-lg md:text-lg whitespace-nowrap xl:pr-4 xl:border-r border-default">
<h1 className="flex gap-1 sm:gap-2 md:gap-4 items-center text-lg md:text-lg whitespace-nowrap">
{data
? data.tradableInstrument.instrument.code
: t('Select market')}
@ -64,7 +64,7 @@ export const MobileMarketHeader = () => {
setOpenPrice(x);
}}
trigger={
<span className="flex gap-1 items-center text-sm md:text-md whitespace-nowrap xl:pr-4 xl:border-r border-default">
<span className="flex gap-1 items-center md:text-md whitespace-nowrap">
{data && (
<>
<span className="text-xs">
@ -93,7 +93,7 @@ export const MobileMarketHeader = () => {
}
>
{data && (
<div className="px-2 py-4 text-sm grid grid-cols-2 items-center gap-2">
<div className="p-4 text-sm grid grid-cols-2 items-center gap-4">
<MarketHeaderStats market={data} />
</div>
)}
@ -120,8 +120,8 @@ export const FullScreenPopover = ({
<PopoverPrimitive.Portal>
<PopoverPrimitive.Content
data-testid="popover-content"
className="w-screen bg-vega-clight-800 dark:bg-vega-cdark-800 border border-default"
sideOffset={5}
className="w-screen bg-vega-clight-800 dark:bg-vega-cdark-800 border-y border-default"
sideOffset={0}
>
{children}
</PopoverPrimitive.Content>