[x] LC: Add alignment (1st col right aligned, all other center aligned)
[x] LC: Implement the rest of the styling → # List of Styling → below
Tasks after first Review
[x] LC: Add Footer. It is present in tables but not rendered.
[x] LC: Table Head Styling
Increase padding-bottom on Table Name
Reduce line height on Table Description
Increase padding-bottom on Table Description
Reduce padding- top on Table Column Heading
[x] LC: Change orange color to: #FFE082
[x] LC: Change color of first column in case it is a title column to: #BBDEFB
[ ] Change Orange to: or: orange #FFCC80
[ ] LC: Check that this Article renders fine: → Advanced Article Formatting. When done trigger HC for review.
[ ] LC: Add Images Feature
[ ] LC: Add the color and image rows are optional
[ ] LC: Create /nc-codes/ article to demo images
User Story
As a Reader of your Comparison Review I very appreciate the intuitive coloring of cell backgrounds: red = bad, yellow = so so , green = good. This speeds up my table reading significantly! And I can see pattern that otherwise I would have overlooked. These pattern proved most helpful in my decision making process.
- table:
name: ViCase 970-T vs Mac Pro
style: twin-head
caption: >
# ViCase vs Mac Pro
Battle of the GPU Goliath' of Workstations
head: [Features, ViCase-970T, Mac Pro]
data: [OS, Win 10 Pro, Win 10 Pro]
color: [tp, gn, gn]
data: [CPU, i7-6700 (Gen 6), 3.7 GHz Quad (Gen 5) (*1)]
color: [tp, gn, rd]
data: [AiO Conversion, Yes, No]
color: [tp, gn, rd]
footer: (*1) Using an old CPU socket limits upgrading in the future
Color Code
ly: light gray (Super light, like 5%) #FAFAFA
gy: gray (light, like 10%) #F5F5F5
dy: dark gray (light, like 15% #E0E0E0
lw: light yellow #FFFDE7
yw: yellow #FFF9C4
dw: dark yellow #FFF59D
ln: light green #F1F8E9
gn: green #DCEDC8
dn: dark green #C5E1A5
ld: light red #ffebee
rd: red #ffcdd2
dd: dar #ef9a9a
or: orange #FFCC80
bl: blue #BBDEFB
pp: purple: #CE93D8
bk: black (medium gray, like 40%) #BDBDBD
wt: white #FFF
tp: transparent
List of Styling
twin-head: styling as we have now: first row and first column are header
row-head: first row is header, no first column header
col-head: first column is header, no first row header
Tasks
Tasks after first Review
User Story
As a Reader of your Comparison Review I very appreciate the intuitive coloring of cell backgrounds: red = bad, yellow = so so , green = good. This speeds up my table reading significantly! And I can see pattern that otherwise I would have overlooked. These pattern proved most helpful in my decision making process.
Specs
Example Table
Color Code
List of Styling
Reference