theme-bulma icon indicating copy to clipboard operation
theme-bulma copied to clipboard

sticky-header on table does not work with theme-bulma

Open urkle opened this issue 3 years ago • 1 comments

adding the sticky-header prop on an o-table when using theme-bulma does nothing as

  1. the configuration does not set a class for stickyHeaderClass
  2. when using "has-sticky-header" it some-what works
    • the first TR in the thead sticks
    • sticky columns, however, do not work

Other usability-questions regarding sticky Headers.

  1. how does one get the filter row to also be sticky?
  2. how does one control the height of the table when in "sticky" mode. It seems odd to fix it at 300px always. (on a per-table basis not globally)

urkle avatar Aug 03 '22 02:08 urkle

I'll take a look at columns.

About height you can override using the scss variable https://github.com/oruga-ui/theme-bulma/blob/278541a5466af4b75c1527fb42f1f3f5388484ad/src/assets/scss/components/_table.scss#L1

jtommy avatar Aug 13 '22 05:08 jtommy

Has anyone found a work-around for this?

robertmarney avatar Jan 06 '23 19:01 robertmarney

app.js

const customBulmaConfig = {
  ...bulmaConfig,
  table: {
    ...bulmaConfig.table,
    stickyHeaderClass: 'has-sticky-header',
  },
};

app.use(router).use(Oruga, customBulmaConfig).mount('#app');

robertmarney avatar Feb 25 '23 19:02 robertmarney

Can you make a PR?

jtommy avatar Feb 25 '23 21:02 jtommy

@robertmarney do note (per my description) that even that configuration tweak does not fully work. As the filter row does not stick.

urkle avatar Feb 27 '23 16:02 urkle