Column menu hidden on mobile

[dgillier]

Hello,

I'm looking for a way to hiden the column menu (and row line count menu) on mobile.
I did not find a CSS class for these two...

Any way to to do it (without publishing the blade templates) ?
Thanks for any suggestion.

Denis

[alukardua1]

public function configure(): void
{
  // Takes a callback that gives you the current column.
  $this->setThAttributes(function(Column $column) {
    if ($column->isField('name')) {
      return [
        'class' => 'bg-green-500',
      ];
    }

    return [];
  });
}

and you can read the markup here https://getbootstrap.com/docs/5.3/layout/containers/

[lrljoe]

Good suggestion, I'll take a look at the codebase this weekend and see if I can implement this in a reasonable fashion. Due to the number of tests that there are that may need adjusting, it's a bit more complex than just a simple code dump I'm afraid!

However, you should be able to target 'wire:key="column-select-button-table"' in the interim and hide it for lower-res devices.
Or make a call to the "setColumnSelectStatus" function in LiveWire based on resolution (bit more janky and results in a reload)

[dgillier]

Thanks :)) Can some css do the trick (“hidden md:block”) ?

…

On 26 Jan 2023, at 04:38, lrljoe ***@***.***> wrote: Good suggestion, I'll take a look at the codebase this weekend and see if I can implement this in a reasonable fashion. Due to the number of tests that there are that may need adjusting, it's a bit more complex than just a simple code dump I'm afraid! However, you should be able to target 'wire:key="column-select-button-table"' in the interim and hide it for lower-res devices. — Reply to this email directly, view it on GitHub <#1028 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AJBTUDCT7GCXJF6XO6VCHKDWUHWUPANCNFSM6AAAAAAUE6RIBE>. You are receiving this because you authored the thread.

[lrljoe]

I've got some functionality working in a test branch for setColumnSelectHiddenOnTablet/setColumnSelectHiddenOnMobile as a configure() function, but need to write the tests & documentation for usage etc.

In the interim, you could publish the views and add a "hidden sm:block" code to the components > tools > toolbar.blade.php and it'll do the job, just remember to remove the unrequired views. This isn't recommended practice as you won't get any updates to that toolbar.blade.php in future releases, so only as an interim measure!

Note that sm is considered a large mobile/small tablet, and md is considered a regular tablet (typically speaking - your mileage may vary, different devices have different resolutions).

I've opened a Pull Request for this, but I have stuck it together quite quickly, so it may need a bit of a rethink before it gets into core.

[dgillier]

Thanks a lot @lrljoe :)

[lrljoe]

Reminder to self to issue a PR for this after the next release.

[lrljoe]

This should be in the next release I believe.

[lrljoe]

Is in v2.12.0, please confirm that this working for you!

[dgillier]

Working, but was already there on 2.11 I think...