fix(admin-ui): fix height of Bulk Editor cells to always be 40px (#5737)

This commit is contained in:
Kasper Fabricius Kristensen
2023-11-27 16:34:53 +00:00
committed by GitHub
parent 547b16ead5
commit d5526736ec
3 changed files with 13 additions and 8 deletions

View File

@@ -0,0 +1,5 @@
---
"@medusajs/admin-ui": patch
---
fix(admin-ui): Fix height of Bulk Editor cells when product has few variants"

View File

@@ -1,10 +1,10 @@
import React, { forwardRef, useEffect, useRef, useState } from "react"
import { ProductVariant } from "@medusajs/client-types"
import AmountField from "react-currency-input-field"
import clsx from "clsx"
import React, { forwardRef, useEffect, useRef, useState } from "react"
import AmountField from "react-currency-input-field"
import { currencies as CURRENCY_MAP } from "../../../../utils/currencies"
import { useAdminRegions } from "medusa-react"
import { currencies as CURRENCY_MAP } from "../../../../utils/currencies"
/**
* Return currency metadata or metadata of region's currency
@@ -197,7 +197,7 @@ function CurrencyCell(props: CurrencyCellProps) {
<td
onMouseOver={() => onColumnOver(currencyCode || region)}
onMouseDown={onCellMouseDown}
className={clsx("relative cursor-pointer border pr-2 pl-4", {
className={clsx("relative h-10 cursor-pointer border pl-4 pr-2", {
"bg-blue-100": isSelected && !isAnchor,
})}
style={{

View File

@@ -677,12 +677,12 @@ function EditPricesTable(props: EditPricesTableProps) {
(e) => e.preventDefault()
}
style={{ fontSize: 13, borderCollapse: "collapse" }}
className="h-full w-full table-auto"
className="w-full table-auto"
>
<thead>
<tr
style={{ height: 42 }}
className="tw-text-medusa-text-subtle h-2 text-left font-normal"
className="tw-text-medusa-text-subtle h-10 text-left font-normal"
>
<th className="h-2 border border-t-0 pl-4 font-medium text-gray-400">
Product
@@ -734,7 +734,7 @@ function EditPricesTable(props: EditPricesTableProps) {
</tr>
</thead>
<tbody>
<tr style={{ lineHeight: 3, background: "#f9fafb" }}>
<tr style={{ lineHeight: 3, background: "#f9fafb" }} className="">
<td className="border pl-4 pr-4">
<div className="text-black-800 flex items-center gap-2 overflow-hidden">
{props.product.thumbnail && (
@@ -768,7 +768,7 @@ function EditPricesTable(props: EditPricesTableProps) {
onMouseEnter={() => onMouseRowEnter(variant.id)}
style={{ lineHeight: 3 }}
>
<td className="whitespace-nowrap border pl-10 pr-4 text-gray-600">
<td className="h-10 whitespace-nowrap border pl-10 pr-4 text-gray-600">
{variant.title} {variant.sku && `${variant.sku}`}
</td>