ericberman / MyFlightbookWeb

The website and service for MyFlightbook
49 stars 18 forks source link

Feature: Improve style for table flight view #1044

Closed cristobal-io closed 1 year ago

cristobal-io commented 1 year ago

When we use the view to see more flights than the default ones, or we use the show all option to view all the flights, as you scroll, you lose the headers and it becomes difficult to know which field corresponds to each column.

I propose two changes to the styles:

Here is a sample GIF of how it would look:

feature_header

Here are the changes needed for the different sections:

For the cell:

td {
    border: 1px solid;
}

For the header:

thead {
    position: sticky;
    background-color: #00bcd4;
    top: 0;
}

Thank you for this amazing app


Edit:

The header would work if we use the following:

.gvhDefault {
    position: sticky;
    background-color: #00bcd4;
    top: 0;
}

The previously proposed won't work on the normal logbook page.

ericberman commented 1 year ago

Wow, I never knew about position: sticky, that's completely awesome. Probably need to find other places to do that as well. Not wild about the turquise header - it's heavy. Ditto the solid black vertical lines, but lighter ones do work (though the menu chevron is a bit odd). Anyhow, I love this, check-in coming shortly.

cristobal-io commented 1 year ago

Wow, Eric! you work fast!

Love the changes!!! Thank you!!! 🎉 🎉 🎉