Skip to content
This repository was archived by the owner on Dec 11, 2021. It is now read-only.

Conversation

@MichaelArestad
Copy link
Contributor

Super basic v1 of table styling. Looks like this currently and include some fancy overflow styles.

image

Thoughts?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Setting the padding for ths twice (see line 23) seems weird.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It appears that way, but they aren't. The em values are different since the font size of th is smaller.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In that case is there really a point in combining the td and th rules here since they only actually share 2 properties top border and white space. Maybe just add those 2 properties here to the th rule and have above just be td It will make it more clear whats going on to avoid confusion.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will split these up. Probably not worth the combo.

@rohmulan
Copy link
Contributor

@MichaelArestad awesome, I especially love what you did with responsive tables.

@rohmulan
Copy link
Contributor

any specific reasons why headings are less dark and smaller than rest of table by default? I thought it should be other way round?

@MichaelArestad
Copy link
Contributor Author

any specific reasons why headings are less dark and smaller than rest of table by default? I thought it should be other way round?

Yep. The other way around is just a browser default leftover. They are just the labels for the content. The content should be the easiest thing to read. If they are all bold, the th content rows and columns tend to be far more dominant than the table content. If they are all a little lighter and smaller, they still have the visual weight of a label row without overtaking the content visually. Also, labels quite often get lengthier than the table content. Having them smaller allows more to fit in a row.

@arschmitz
Copy link
Contributor

Thought i added this but i don't see it live preview link http://view.css-chassis.com/table/demos/tables.html

@rxaviers
Copy link

👍 looks great

@MichaelArestad
Copy link
Contributor Author

Note: error due to BEM class name.

@arschmitz
Copy link
Contributor

Yup looks like we need to modify our settings

@MichaelArestad
Copy link
Contributor Author

@arschmitz Yep. We should do another PR for fine-tuning the htmllint settings.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Note for later: Remove nowrap on td.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Here"s -> Here's

@MichaelArestad
Copy link
Contributor Author

Fixed a few things and separated overflow styles (fancy gradient) into its own component, overflow-styles. We can iterate on it from there. CC @arschmitz

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"slime" [sic]

Also, the "reimplementing underlines" technique in general seems (a) overcomplicated/overkill (b) not easy to override

@subaha subaha mentioned this pull request Oct 18, 2015
@jzaefferer
Copy link
Contributor

Replaced by #69

@jzaefferer jzaefferer closed this Oct 18, 2015
@rohmulan
Copy link
Contributor

@jzaefferer replaced by #130... you mean?

@jzaefferer
Copy link
Contributor

Yes, copy pasta error.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

8 participants