Bringing CSS up to this decade's standards. #231

Merged
merged 4 commits into from Jul 22, 2013

Conversation

Projects
None yet
6 participants
Contributor

cviebrock commented Nov 8, 2012

Here are some tweaks to the CSS styling for phpinfo(), since this really hasn't been touched in almost a decade:

  • color codes are shortened (e.g. #000000 is now #000)
  • table width is bigger and handled via CSS instead of HTML attributes
  • fix so that long INI entries don't make the layout super wide
  • bgcolor for "Additional Modules" wasn't set
  • the .vr class has been removed since I can't find any use of it in the entire source tree
  • fixed my email address

Signed-off-by: Colin Viebrock colin@viebrock.ca

Bringing CSS up to this decade's standards.
Here are some tweaks to the phpinfo() styling, since this really hasn't
been touched in almost a decade:
- color codes are shortened
- table width is bigger and handled via CSS
- fix so that long INI entries don't make the layout super wide
- bgcolor for "Additional Modules" wasn't set
- fix my email address

Signed-off-by: Colin Viebrock <colin@viebrock.ca>
Contributor

cviebrock commented Nov 8, 2012

It would appear that there was some end-of-line trailing whitespace cleanup as well.

I am not sure about the fixed width. should we use x% instead? since various resolution monitors now.

Owner

cviebrock replied Nov 9, 2012

The fixed width here was to match the table width above. But, I get your point.

I have two problems with percentage width tables. First is that if you have a big monitor, then your table is huge, and your columns are huge, which reduces readability (lots of studies on this). Second, is I couldn't get a good combination of a %-width table and still achieve the goals of:

  • consistent table widths down the entire page
  • preferably consistent TD widths down the page
  • y-scrolling in TDs with long data

That said, I've bumped the table width a bit more and fixed the columns appropriately. The end result looks like this: http://dabblet.com/gist/4046561

hmm, you are right.
the huge table is ugly.:)

Owner

laruence commented Nov 25, 2012

hey, in my chrome, after this patch, scroll bar shows up in the tds..

could you re-view this?

Contributor

cviebrock commented Nov 25, 2012

That was the point: making the TDs scrollable if the content is long ... Rather than forcing the entire table (and page) to be wider than the screen.

  • Colin

On 2012-11-24, at 10:13 PM, Xinchen Hui notifications@github.com wrote:

hey, in my chrome, after this patch, scroll bar shows up in the tds..

could you re-view this?


Reply to this email directly or view it on GitHub.

I think laurence is referring to the vertical scroll bars that appear in every cell, in addition to the horizontal scroll bars that only appear if the content is too long.

Useless scroll bars

Replacing overflow-y: scroll with overflow-x: auto keeps the horizontal scroll bars where needed and removes the vertical scroll bars.

Contributor

cviebrock commented Dec 4, 2012

Thanks @clamburger ... I've changed the overflow as suggested. And added a few other minor tweaks.

I've also noticed that the Zend Logo is probably out-of-date, so I've asked the folks there if there is a more recent one to use.

Contributor

lstrojny commented Jan 14, 2013

@laruence, @cviebrock what’s the status?

Contributor

cviebrock commented Jan 14, 2013

I'm done making changes (unless there are bug fixes). It tests well in all browsers I have access to (Safari, FF, Chrome). I suppose someone should check in MSIE.

Owner

dsp commented Mar 19, 2013

whats the status of this?

@php-pulls php-pulls merged commit 98a3d5a into php:master Jul 22, 2013

1 check failed

default The Travis build failed
Details
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment