Table view

Follow

Comments

8 comments

  • Avatar
    Francesca G

    Hello, is it possible to hide navigation toolbar without using css?

    I have a three card view, so the pagination is not necessary! Thank you

  • Avatar
    Awesome Table

    Hello Francesca G,

    It is only possible to hide the pagination using CSS but it requires knowledge in code.

    However, we don't recommend to do that because because if we make some changes in native code, it will affect your view.

    Kind regards,
    Thomas

  • Avatar
    Nahdi Lazar

    I encountered a small bug with Table view & RTL support:
    Adding "body {direction: rtl;}" to CSS makes the pagination arrows stop functioning for some reason. This bug doesn't happen in Card view.

    Here's an example sheet:
    https://docs.google.com/spreadsheets/d/18swcXjvYFfTyIXcas1MEU_mE-gA7R76fxIoBEUthlYk/edit?usp=sharing

    And an example table:
    https://awesome-table.com/-LJKvxsm-qovFn6Yd8hk/view

    Any ideas...?
    Thanks!

  • Avatar
    Awesome Table

    Hello Nahdi Lazar,

    Awesome Table is not optimized for the RTL reading direction and therefore we do not recommend to use it especially in the body.

    However, maybe just on the graph, or inside the columns.

    Kind regards,
    Thomas

  • Avatar
    Nahdi Lazar

    Thank you Thomas.

    I understand. However, as I pointed out, adding RTL support raises a problem only with the pagination, and only in Table view. It does not occur in Card view, where RTL support works fine with custom CSS.

    So perhaps it's an easy fix...?

    I'll try switching to Card view instead. Too bad, Table view would have saved me a lot of work :-/

  • Avatar
    Awesome Table

    Hello Nahdi Lazar,

    For now, we have no time to fix this issue. However, I will let you know if this issue is solved.

    kind regards,
    Thomas

  • Avatar
    Nahdi Lazar

    Thank you Thomas, that's understood of course... :-)

    In the meantime I've found a simple CSS solution - instead of adding the RTL support to the body tag, I added it to the table and to the pagination row separately, then fixed the pagination row layout, hid the now-reversed pagination arrows and replaced them with new arrows using pseudo-CSS. Here's the code in case anyone needs it:

    table.google-visualization-table-table, .at-count {
    direction: rtl;
    }

    .at-pagination {
    margin-right: auto;
    margin-left: unset;
    }

    .goog-custom-button-collapse-right, .goog-custom-button-collapse-left {
    visibility: hidden;
    }

    .goog-custom-button-collapse-right:before, .goog-custom-button-collapse-left:before {
    visibility: visible;
    font-size: 18px;
    font-weight: bold;
    position: absolute;
    top: 7px;
    }

    .goog-custom-button-collapse-left:before {
    content: ">";
    }

    .goog-custom-button-collapse-right:before {
    content: "<";
    }
  • Avatar
    Awesome Table

    Hello Nahdi Lazar,

    Thank you very much for sharing your use and your solution.

    Kind regards,
    Thomas

Please sign in to leave a comment.