search

Serhioromano / cobalt-9

Cobalt 9 Beta Test Group
11 stars 2 forks source link

Frontend UI - Tabs and parameter columns #45

Closed pepperstreet closed 5 years ago

pepperstreet commented 8 years ago

Cobalt tabs and parameter columns need some work: I have noticed that it does not fit into the default (fixed) Protostar layout. The tab's parameter columns have max-width in pixels. Additionally a 20px margin-right. Does the Joomla backend use two different approaches and markup? Usually I see the bootstrap SPANs, but Cobalt makes use of FLOATs without any CSS-grid relation!? Maybe the "left floating divs" were a workaround to easily achieve more than 2 columns of parameters in horizontal direction... (not sure though. Sergey?) Anyways, those FLOATS have to be adjusted or even made into flexible SPANs. One important detail with SPANs: They might limit the max-amount of horizontal columns. I mean, you can't have 2 columns on a medium sized screen... and get 3 or even 4 on a very large screen. Due to BSv2 grid system! But in most cases 2 columns should be enough, right?

Modal windows content has similar issues: Columns do not fit. Label cells are very in-consistent in size!

EDIT: Just did some temporary tests in browser dev tools. Bootstrap2 SPANs seem to work very well. The right margin can be dropped, because of the default grid-gutter. For examples, simply browse J! core backend ISIS template with several examples. ISIS uses the full browser-width, tab panes have either 2 columns for inner content, sometimes one big table. You may know the sidebar-toggle: It seems to utilize a script to change the SPANs dynamically! Otherwise this layout switch is impossible with BSv2.

Unusual, but it could be interesting to keep that max-width inline CSS. Why? Imagine the final result in a fullwidth template or fullwidth cpanel. Stretching eye-strain ;) So a max-width keeps everything in a readable, not too much stretched layout. (optional, J! core ISIS does not care about it either.)

Screenshots (todo)

Serhioromano commented 5 years ago

Do you mean those tabs?

2019-08-27_19-23-00

Anyway, I will change the look & feel of cobalt and probably use cobalt attached CSS library without relying on Joomla library. I think that would be BS4. Easiest shift.