View Issue Details

IDProjectCategoryView StatusLast Update
0020790MMW 5Generalpublic2024-04-22 11:39
Reporterzvezdan Assigned To 
PrioritynoneSeverityminorReproducibilityN/A
Status resolvedResolutionfixed 
Fixed in Version5.1 
Summary0020790: Margins of Grid view cannot be skinned properly
DescriptionI want Grid view of my skin to look similarly to Windows File Explorer with margins between borders of listview and contained items. I spent I don't know how many hours on this, but it seems it cannot be done properly, simply because you are settings the size of listview in JS.

I tried all possible combinations of margin and padding for listview, llvBody, lvFill, lvCanvas and lvViewport, but every attempt has some drawback. Here are my best solutions:
1. causes unnecessary appearance of vertical scrollbar when all tracks are visible:
.listview.viewControl[data-id$=Grid] > .lvBody {
    .padding;
}

2. causes truncated right side of the rightmost items and the bottom side of the last row:
.listview.viewControl[data-id$=Grid] .lvViewport {
    .padding;
}

3. causes truncated display of the bottom side of the last row:
.listview.viewControl[data-id$=Grid] {
    .paddingSides;
    & > .lvBody > .lvFill > .lvCanvas > .lvViewport {
        .marginsColumn;
    }
}

Could you please take in account the margins and/or padding of listviews when you determine their sizes in JS?
TagsNo tags attached.
Attached Files
Grid view in File Explorer.png (51,888 bytes)   
Grid view in File Explorer.png (51,888 bytes)   
Fixed in build3016

Relationships

related to 0020801 closedmichal listview classes or data attributes for grid views and simplified lists needed 

Activities

michal

2024-04-21 16:33

developer   ~0075186

Fixed in build 3016. Grid views (list views using grid items) now receive also class "grid" for better styling. Problem with scrollbar fixed, so now it should be possible to use something like:
.grid > .lvBody {
    .padding;
}

zvezdan

2024-04-22 04:35

updater   ~0075188

Thank you!

It will also help that you added the grid class, which I requested in 0020801 issue. I am just wondering if you did that for all listviews having griditem's, even those within e.g. Browser view, Grid (Folders) and Grid (Playlists) view elements.

michal

2024-04-22 11:39

developer   ~0075190

Described in 0020801.