🔹 Card-mod - Super-charge your themes!

[Ildar_Gabdullin]

“Sidebar” view: allow to scroll “main” area w/o scrolling a sidebar

Currently in a “Sidebar view” the whole page is scrolling down if needed.
This mod allows to scroll the “main area” independently of a “sidebar area”.
Available only if the “main area” is NOT in one column with the “sidebar area”.
This is mainly useful for tablets (ofc for desktops as well).

Tested on 1920x1200 desktop, iPad Air 2, iPhone 5S (real devices).

Here captured gifs (emulator in Chrome):

  card-mod-view-yaml: |
    hui-sidebar-view:
      $: |
        {% set MAX_HEIGHT = 'calc(100vh - var(--header-height) - 4px)' -%}
        .container div#main {
          /* background-color: cyan; */
          max-height: {{MAX_HEIGHT}};
          overflow-y: auto;
        }
        .container div#sidebar {
          /* background-color: lightgreen; */
          max-height: {{MAX_HEIGHT}};
          overflow-y: auto;
        }
        @media (max-width: 760px) {
          .container div#main {
            /* background-color: yellow;*/
            max-height: unset;
            overflow-y: unset;
          }
        }

Note: not recommended for use in a “storage mode” dashboard.

---

PR was proposed as well:

"sidebar" view: allow to scroll "main" area w/o scrolling a sidebar