Highlight the background color of table merge cells (merge left and right, merge up and down) in tiddlers?

Do not count (the contents of the first row and column of the table (this is usually the table title))

The problem arose when I made a 38x10 tiddlywiki table, and it was a difficult process to look at the form data without conforming to the characteristics mentioned in the title,The color of each cell in the table seems to be the same white, which makes me look dazzled

All answers I would appreciate!

key.tid (2.5 KB)

1 Like

I would start the table with:

|tc-center tc-max-width-80 tc-max-width|k
| | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 |h

I would go with styles like this:

.evenRow {
  background: #eeeeee;
}

[colspan="2"] {
  background: lightgreen;
}

[colspan="3"] {
  background: lightyellow;
}

[colspan="4"] {
  background: lightcyan;
}

[rowspan="2"] {
  background: lightcoral;
}

table-colspan-styles.json (2.9 KB)

For rowspan you can use

[rowspan="2"] {
  background: lightcoral;
}
2 Likes

Also have a closer look at:

1 Like

It looks perfect. Thank you so much for the proposal. Good luck

Such a test would be a simple comparison, but to make this comparison depends wholly on how you are building the table. I tend to use list widgets within a html table in cases like this, with the table data being drawn for elsewhere. But you have to supply the logic.

  • One way may be to allow you to select a cell, then save the value in the cell, and regenerate the table now highlighting those with the same value. Then you can enhance this to make a list of values but it will be tricky.
  • CSS may have some special features to assist but I am no expert there.

Personally I would use spreadsheet software for this rather than reinvent it in tiddlywiki, perhaps if possible embedding the document in my tiddlywiki. Google sheets may let you do this. I think @Sunny is the expert in this with a whole shopping site driven by Google Sheets.

1 Like