Hey guys,
yesterday I was at a clients-training to teach a new employee how to use the MODX Manager and how to update the (big) site with lots of MIGX.
Within that meeting, she mentioned that she has really big problems in seeing the MIGX-Tables as editable areas - and as table in general, because there is no border around it (like it was in the past -> MODX 2.X).
I've mentioned that also after the launch of 2.3, but for me, as experienced MODX'er it was not a big deal, because I know how to use it.
But after yesterday, I've coded a small CSS-FIX, that styles up the MIGX-TV-overview-tables in the Manager and adds a hover-effect, to get a better user experience. And here is the result.
Please test it for your own if you want - and if you are thinking that this would be a great enhancement, we can discuss if this should be delivered by default with future MODX-Versions.
Hey guys, yesterday I was at a clients-training to teach a new employee how to use the MODX Manager and how to update the (big) site with lots of MIGX. Within that meeting, she mentioned that she has really big problems in seeing the MIGX-Tables as editable areas - and as table in general, because there is no border around it (like it was in the past -> MODX 2.X). I've mentioned that also after the launch of 2.3, but for me, as experienced MODX'er it was not a big deal, because I know how to use it. But after yesterday, I've coded a small CSS-FIX, that styles up the MIGX-TV-overview-tables in the Manager and adds a hover-effect, to get a better user experience. And here is the result. Please test it for your own if you want - and if you are thinking that this would be a great enhancement, we can discuss if this should be delivered by default with future MODX-Versions.
BEFORE:
AFTER:
FILE: /manager/templates/default/css/index.css
ADD THIS: .x-grid3-scroller{ border: 1px #E4E4E4 solid; }
.x-grid3-body table.x-grid3-row-table{ border-bottom: 1px solid #DFDFDF !important; }
.x-grid3-body table.x-grid3-row-table{ width: 102.6% !important; background: #F5F6F9 !important; }
.x-grid3-body .x-grid3-row-alt table.x-grid3-row-table { background: #FFF !important; }
.x-panel-body-noheader .x-grid3-row-alt{ border: 0 !important; }
.x-grid3-body table.x-grid3-row-table:hover{ background: #E8F0F8 !important; }
.x-grid3-row { border-bottom: 0 !important; }