diff --git a/CHANGELOG.md b/CHANGELOG.md index 77362c6c6..aa1cfa460 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,3 +13,4 @@ All notable, unreleased changes to this project will be documented in this file. - Add dynamic dashboard settings - #135 by @benekex2 - Fix plugins page translations - #141 by @benekex2 - Add attributes to column picker - #136 by @dominik-zeglen +- Fix table cell padding - #143 by @dominik-zeglen diff --git a/src/attributes/components/AttributeList/AttributeList.tsx b/src/attributes/components/AttributeList/AttributeList.tsx index d3edbcf6e..715a2badb 100644 --- a/src/attributes/components/AttributeList/AttributeList.tsx +++ b/src/attributes/components/AttributeList/AttributeList.tsx @@ -46,7 +46,9 @@ const useStyles = makeStyles((theme: Theme) => ({ colSearchable: { textAlign: "center" }, - colSlug: {}, + colSlug: { + paddingLeft: 0 + }, colVisible: { textAlign: "center" }, diff --git a/src/collections/components/CollectionList/CollectionList.tsx b/src/collections/components/CollectionList/CollectionList.tsx index ff5763b18..3690c39ea 100644 --- a/src/collections/components/CollectionList/CollectionList.tsx +++ b/src/collections/components/CollectionList/CollectionList.tsx @@ -28,7 +28,9 @@ const styles = (theme: Theme) => colAvailability: { width: 240 }, - colName: {}, + colName: { + paddingLeft: 0 + }, colProducts: { width: 240 } diff --git a/src/collections/components/CollectionProducts/CollectionProducts.tsx b/src/collections/components/CollectionProducts/CollectionProducts.tsx index 2fb889616..8cc81be9f 100644 --- a/src/collections/components/CollectionProducts/CollectionProducts.tsx +++ b/src/collections/components/CollectionProducts/CollectionProducts.tsx @@ -35,9 +35,10 @@ const styles = (theme: Theme) => "&:last-child": { paddingRight: 0 }, - width: 48 + theme.spacing.unit / 2 + width: 76 + theme.spacing.unit / 2 }, colName: { + paddingLeft: 0, width: "auto" }, colNameLabel: { diff --git a/src/components/AssignProductDialog/AssignProductDialog.tsx b/src/components/AssignProductDialog/AssignProductDialog.tsx index 255741583..fe8ee4613 100644 --- a/src/components/AssignProductDialog/AssignProductDialog.tsx +++ b/src/components/AssignProductDialog/AssignProductDialog.tsx @@ -45,6 +45,7 @@ const styles = createStyles({ overflowY: "scroll" }, wideCell: { + paddingLeft: 0, width: "100%" } }); diff --git a/src/components/ProductList/ProductList.tsx b/src/components/ProductList/ProductList.tsx index 3d3251203..a0d91d610 100644 --- a/src/components/ProductList/ProductList.tsx +++ b/src/components/ProductList/ProductList.tsx @@ -59,7 +59,8 @@ const styles = (theme: Theme) => colName: { "&$colNameFixed": { width: 250 - } + }, + paddingLeft: 0 }, colNameFixed: {}, colNameHeader: { diff --git a/src/components/Timeline/Timeline.tsx b/src/components/Timeline/Timeline.tsx index 2989dae10..8dbf5060f 100644 --- a/src/components/Timeline/Timeline.tsx +++ b/src/components/Timeline/Timeline.tsx @@ -21,7 +21,7 @@ const styles = (theme: Theme) => width: "100%" }, alignSelf: "flex-start", - marginRight: theme.spacing.unit * 5.5 + marginRight: 28 }, cardActionsExpanded: { maxHeight: theme.spacing.unit * 6 @@ -41,7 +41,8 @@ const styles = (theme: Theme) => }, alignItems: "center", background: theme.palette.background.default, - display: "flex" + display: "flex", + paddingLeft: theme.spacing.unit * 3 }, root: { borderColor: theme.overrides.MuiCard.root.borderColor, diff --git a/src/customers/components/CustomerList/CustomerList.tsx b/src/customers/components/CustomerList/CustomerList.tsx index 084825438..67b3622dd 100644 --- a/src/customers/components/CustomerList/CustomerList.tsx +++ b/src/customers/components/CustomerList/CustomerList.tsx @@ -31,7 +31,9 @@ const styles = (theme: Theme) => } }, colEmail: {}, - colName: {}, + colName: { + paddingLeft: 0 + }, colOrders: { textAlign: "center" }, diff --git a/src/discounts/components/DiscountProducts/DiscountProducts.tsx b/src/discounts/components/DiscountProducts/DiscountProducts.tsx index a39a1ba4c..bb3ec90e2 100644 --- a/src/discounts/components/DiscountProducts/DiscountProducts.tsx +++ b/src/discounts/components/DiscountProducts/DiscountProducts.tsx @@ -42,9 +42,10 @@ const styles = (theme: Theme) => "&:last-child": { paddingRight: 0 }, - width: 48 + theme.spacing.unit / 2 + width: 76 + theme.spacing.unit / 2 }, colName: { + paddingLeft: 0, width: "auto" }, colNameLabel: { diff --git a/src/discounts/components/SaleList/SaleList.tsx b/src/discounts/components/SaleList/SaleList.tsx index 7f07d9d64..5f0a7bb80 100644 --- a/src/discounts/components/SaleList/SaleList.tsx +++ b/src/discounts/components/SaleList/SaleList.tsx @@ -47,7 +47,9 @@ const styles = (theme: Theme) => colEnd: { textAlign: "right" }, - colName: {}, + colName: { + paddingLeft: 0 + }, colStart: { textAlign: "right" }, diff --git a/src/discounts/components/VoucherList/VoucherList.tsx b/src/discounts/components/VoucherList/VoucherList.tsx index 5c30a56c1..50b4eaff7 100644 --- a/src/discounts/components/VoucherList/VoucherList.tsx +++ b/src/discounts/components/VoucherList/VoucherList.tsx @@ -56,7 +56,9 @@ const styles = (theme: Theme) => colMinSpent: { textAlign: "right" }, - colName: {}, + colName: { + paddingLeft: 0 + }, colStart: { textAlign: "right" }, diff --git a/src/home/components/HomeProductListCard/HomeProductListCard.tsx b/src/home/components/HomeProductListCard/HomeProductListCard.tsx index 21e3ad6c9..6b5964d18 100644 --- a/src/home/components/HomeProductListCard/HomeProductListCard.tsx +++ b/src/home/components/HomeProductListCard/HomeProductListCard.tsx @@ -29,8 +29,12 @@ const styles = (theme: Theme) => }, avatarSpacing: { paddingBottom: theme.spacing.unit * 2, + paddingRight: theme.spacing.unit, paddingTop: theme.spacing.unit * 2 }, + label: { + paddingLeft: 0 + }, noProducts: { paddingBottom: 20, paddingTop: 20 @@ -81,7 +85,7 @@ export const HomeProductList = withStyles(styles, { name: "HomeProductList" })( avatarProps={classes.avatarProps} /> - + {variant ? ( <> diff --git a/src/icons/ArrowSort.tsx b/src/icons/ArrowSort.tsx new file mode 100644 index 000000000..8fd77f548 --- /dev/null +++ b/src/icons/ArrowSort.tsx @@ -0,0 +1,16 @@ +import createSvgIcon from "@material-ui/icons/utils/createSvgIcon"; +import React from "react"; + +export const ArrowSort = createSvgIcon( + <> + + + +); +ArrowSort.displayName = "ArrowSort"; +export default ArrowSort; diff --git a/src/navigation/components/MenuList/MenuList.tsx b/src/navigation/components/MenuList/MenuList.tsx index 423efcc0f..3bb49f988 100644 --- a/src/navigation/components/MenuList/MenuList.tsx +++ b/src/navigation/components/MenuList/MenuList.tsx @@ -39,7 +39,9 @@ const styles = (theme: Theme) => colItems: { textAlign: "right" }, - colTitle: {}, + colTitle: { + paddingLeft: 0 + }, row: { cursor: "pointer" } @@ -88,6 +90,7 @@ const MenuList = withStyles(styles, { name: "MenuList" })( id="menuListItems" /> + diff --git a/src/orders/components/OrderDraftDetailsProducts/OrderDraftDetailsProducts.tsx b/src/orders/components/OrderDraftDetailsProducts/OrderDraftDetailsProducts.tsx index 099469372..5d0a40c47 100644 --- a/src/orders/components/OrderDraftDetailsProducts/OrderDraftDetailsProducts.tsx +++ b/src/orders/components/OrderDraftDetailsProducts/OrderDraftDetailsProducts.tsx @@ -36,7 +36,7 @@ const styles = (theme: Theme) => "&:last-child": { paddingRight: 0 }, - width: 48 + theme.spacing.unit / 2 + width: 76 + theme.spacing.unit / 2 }, colName: { width: "auto" diff --git a/src/orders/components/OrderDraftList/OrderDraftList.tsx b/src/orders/components/OrderDraftList/OrderDraftList.tsx index 70946e36d..75203ec14 100644 --- a/src/orders/components/OrderDraftList/OrderDraftList.tsx +++ b/src/orders/components/OrderDraftList/OrderDraftList.tsx @@ -43,7 +43,9 @@ const styles = (theme: Theme) => }, colCustomer: {}, colDate: {}, - colNumber: {}, + colNumber: { + paddingLeft: 0 + }, colTotal: { textAlign: "right" }, diff --git a/src/orders/components/OrderProductAddDialog/OrderProductAddDialog.tsx b/src/orders/components/OrderProductAddDialog/OrderProductAddDialog.tsx index c68b19c2b..e507de50f 100644 --- a/src/orders/components/OrderProductAddDialog/OrderProductAddDialog.tsx +++ b/src/orders/components/OrderProductAddDialog/OrderProductAddDialog.tsx @@ -39,6 +39,12 @@ const styles = (theme: Theme) => avatar: { paddingLeft: 0 }, + colName: { + paddingLeft: 0 + }, + colVariantCheckbox: { + padding: 0 + }, content: { overflowY: "scroll" }, @@ -259,7 +265,7 @@ const OrderProductAddDialog = withStyles(styles, { className={classes.avatar} thumbnail={maybe(() => product.thumbnail.url)} /> - + {maybe(() => product.name)} @@ -267,7 +273,7 @@ const OrderProductAddDialog = withStyles(styles, { (variant, variantIndex) => ( - + - +
{variant.name}
} }, colSlug: {}, - colTitle: {}, + colTitle: { + paddingLeft: 0 + }, colVisibility: {}, link: { cursor: "pointer" diff --git a/src/productTypes/components/ProductTypeList/ProductTypeList.tsx b/src/productTypes/components/ProductTypeList/ProductTypeList.tsx index afb28f5b6..5ba7d21d3 100644 --- a/src/productTypes/components/ProductTypeList/ProductTypeList.tsx +++ b/src/productTypes/components/ProductTypeList/ProductTypeList.tsx @@ -33,7 +33,9 @@ const styles = (theme: Theme) => width: 300 } }, - colName: {}, + colName: { + paddingLeft: 0 + }, colTax: {}, colType: {}, link: { diff --git a/src/products/components/ProductVariantNavigation/ProductVariantNavigation.tsx b/src/products/components/ProductVariantNavigation/ProductVariantNavigation.tsx index 7d198b50d..4d4915cb1 100644 --- a/src/products/components/ProductVariantNavigation/ProductVariantNavigation.tsx +++ b/src/products/components/ProductVariantNavigation/ProductVariantNavigation.tsx @@ -23,6 +23,10 @@ import { ProductVariantDetails_productVariant } from "../../types/ProductVariant const styles = (theme: Theme) => createStyles({ + colName: { + paddingLeft: 0, + textAlign: [["left"], "!important"] as any + }, link: { cursor: "pointer" }, @@ -37,9 +41,6 @@ const styles = (theme: Theme) => width: 2 }, position: "relative" - }, - textLeft: { - textAlign: [["left"], "!important"] as any } }); @@ -92,7 +93,7 @@ const ProductVariantNavigation = withStyles(styles, { fallbackThumbnail )} /> - + {variant ? variant.name || variant.sku : } @@ -114,7 +115,7 @@ const ProductVariantNavigation = withStyles(styles, { className={classes.tabActive} thumbnail={null} /> - + width: ICONBUTTON_SIZE + theme.spacing.unit / 2 }, colCountries: {}, - colName: {}, + colName: { + paddingLeft: 0 + }, row: { cursor: "pointer" } diff --git a/src/storybook/__snapshots__/Stories.test.ts.snap b/src/storybook/__snapshots__/Stories.test.ts.snap index 484755290..1abd81848 100644 --- a/src/storybook/__snapshots__/Stories.test.ts.snap +++ b/src/storybook/__snapshots__/Stories.test.ts.snap @@ -46674,7 +46674,7 @@ exports[`Storyshots Views / HomePage default 1`] = `

Items + Items + Items + New Variant @@ -82942,7 +82954,7 @@ exports[`Storyshots Views / Products / Create product variant default 1`] = ` Cordoba Oro @@ -82970,7 +82982,7 @@ exports[`Storyshots Views / Products / Create product variant default 1`] = ` silver @@ -83024,7 +83036,7 @@ exports[`Storyshots Views / Products / Create product variant default 1`] = ` New Variant @@ -83462,7 +83474,7 @@ exports[`Storyshots Views / Products / Create product variant when loading data New Variant @@ -83890,7 +83902,7 @@ exports[`Storyshots Views / Products / Create product variant with errors 1`] = Cordoba Oro @@ -83918,7 +83930,7 @@ exports[`Storyshots Views / Products / Create product variant with errors 1`] = silver @@ -83972,7 +83984,7 @@ exports[`Storyshots Views / Products / Create product variant with errors 1`] = New Variant @@ -95477,7 +95489,7 @@ exports[`Storyshots Views / Products / Product variant details attribute errors Extended Hard @@ -95505,7 +95517,7 @@ exports[`Storyshots Views / Products / Product variant details attribute errors Extended Soft @@ -95533,7 +95545,7 @@ exports[`Storyshots Views / Products / Product variant details attribute errors Normal Hard @@ -95561,7 +95573,7 @@ exports[`Storyshots Views / Products / Product variant details attribute errors Normal Soft @@ -96160,7 +96172,7 @@ exports[`Storyshots Views / Products / Product variant details when loaded data Extended Hard @@ -96188,7 +96200,7 @@ exports[`Storyshots Views / Products / Product variant details when loaded data Extended Soft @@ -96216,7 +96228,7 @@ exports[`Storyshots Views / Products / Product variant details when loaded data Normal Hard @@ -96244,7 +96256,7 @@ exports[`Storyshots Views / Products / Product variant details when loaded data Normal Soft @@ -96849,7 +96861,7 @@ exports[`Storyshots Views / Products / Product variant details when loading data paddingTop: 8 }, head: { - fontSize: ".875rem", - fontWeight: 400 + fontSize: ".875rem" }, paddingCheckbox: { "&:first-child": { @@ -292,7 +291,7 @@ export default (colors: IThemeColors): Theme => }, borderBottomColor: colors.paperBorder, height: 56, - padding: "4px 24px 4px 0" + padding: "4px 24px" } }, MuiTableRow: {