Hubertformin / electron-pos-printer

Electron-pos-printer is a plugin that works to ease paper formatting and printing to thermal printers. it currently supports 80mm, 78mm, 76mm, 58mm, 57mm and 44mm printers thermal printers. it is built with Electron.js and Node.js
Apache License 2.0
318 stars 102 forks source link

Not able to hide the Border between Row with type = TABLE #95

Open chintan-beecept opened 1 year ago

chintan-beecept commented 1 year ago

When print a Table even I set border to 0, it still prints the border.

const data_new = [
  {
    type: 'table',
    style: { 'border': '0'},             // style the table   //table box border
    // list of the columns to be rendered in the table header
    tableHeader: [{type: 'text', value: 'People'}, {type: 'text', value: 'People'}],
    // multi-dimensional array depicting the rows and columns of the table body
    tableBody: [
        [{type: 'text', value: 'Marcus', style: {'border': '0'}}, {type: 'text', value: 'Marcus', style: {'border': '0'}}],
        [{type: 'text', value: 'Boris', style: {'border': '0'}}, {type: 'text', value: 'Marcus', style: {'border': '0'}}],
        [{type: 'text', value: 'Andrew', style: {'border': '0'}}, {type: 'text', value: 'Marcus', style: {'border': '0'}}],
        [{type: 'text', value: 'Tyresse', style: {'border': '0'}}, {type: 'text', value: 'Marcus', style: {'border': '0'}}],
    ],
    // list of columns to be rendered in the table footer
    tableFooter: [{type: 'text', value: 'People'}, 'Image'],
    // custom style for the table header
    tableHeaderStyle: { backgroundColor: 'red', color: 'white'},
    // custom style for the table body
    tableBodyStyle: {'border': '0'}, ///// Header border
    // custom style for the table footer
    tableFooterStyle: {backgroundColor: '#000', color: 'white'},
  },
]

If above syntax is incorrect then can you please suggest correct one?

niro121 commented 1 year ago

Hi any help you can give, I also cant remove the border of the row.

hiagodotme commented 1 year ago

@niro121 @chintan-beecept the border is added in this .css file, programmatically there is not yet an implementation to remove it.

https://github.com/Hubertformin/electron-pos-printer/blob/d01e9614c0cdb056143fbe6172124908878a0a78/src/renderer/index.css#L21

Pradnyana28 commented 10 months ago

@hiagodotme @chintan-beecept I found a workaround for this by overriding the borderCollapse to unset.

const data_new = [
  {
    type: 'table',
    style: { 
          border: 'none',
          borderCollapse: 'unset',
    },
    ...
]

Hope this helps.