Букмарклет для табличек таблицы YugabyteDB

Вы могли видеть в этом блоге, что скриншоты, которые я делаю из консоли YugabyteDB, могут содержать меньше столбцов. Пример:
Это:

, а не это:

Я делаю это для наглядности, удаляя столбцы, которые не имеют значения для статьи в блоге. Это помогает при очень низком разрешении dev.to image. Я также использую это для презентаций, где лучше показать только важную информацию крупным шрифтом.

Я делаю это просто с помощью некоторых CSS и в этом посте я поделюсь букмарклетами, которые я использую. Например, для приведенного выше примера просто создайте закладку следующего содержания

javascript:(function()%7Bdocument.querySelectorAll('.table-striped%3Anth-child(4)%20tr%3E*%3Anth-child(n%2B3)%3Anth-child(-n%2B6)').forEach(el%20%3D%3E%20el.style.display%20%3D%20'none')%3Bdocument.getElementsByClassName(%22yb-main%20container-fluid%22)%5B0%5D.style.marginLeft%3D%2288px%22%3Bdocument.getElementsByClassName(%22sidebar-wrapper%22)%5B0%5D.style.width%3D%2299px%22%7D)()

Войти в полноэкранный режим Выйти из полноэкранного режима

и она удалит колонки с 3 по 6 на 4-й таблице, которая является списком планшетов из главной веб-консоли.

Это делается следующим образом:

document.querySelectorAll(
    '.table-striped:nth-child(4) tr>*:nth-child(n+3):nth-child(-n+6)'
    ).forEach(el => el.style
    .display = 'none');
document.getElementsByClassName("yb-main container-fluid")[0].style.marginLeft="88px";
document.getElementsByClassName("sidebar-wrapper")[0].style.width="99px";

Войти в полноэкранный режим Выход из полноэкранного режима

Короче говоря:

наконец, я изменил размер бокового меню.

Я преобразовал его в букмарклет с помощью https://mrcoles.com/bookmarklet/.