Павел Радьков

Дизайн начинается с проектирования.
tilda.education/digital-design-basic-course — про все этапы процесса кратко и по-существу.
https://yandex.ru/design-school — про дизайн с точки зрения крупной компании.
bureau.ru/bb/soviet — разбор практических моментов, читать регулярно.

До появления флексов эта проблема решалась костылями и хаками:

1. Колонки на флоатах выравнивались с помощью js. По событию onResize высота колонок пересчитывалась.
2. Колонки на инлайн-блоках, а кнопки в них спозиционированы абсолютно от нижней границы колонок.
3. Имитация таблицы через display: table и table-cell + медиа-запросы, чтобы разобрать таблицу на малых экранах.

Я бы рекомендовал вам не заморачиваться и просто погуглить «блоки одинаковой высоты» и почитать старые статьи для ознакомления, а тренироваться верстать уже на флексах и гридах.

Но если всё же хочется получить подробные комментарии, сделайте демки на codepen и добавьте ссылки в вопрос.

Можно вообще без скриптов сделать через :nth-child() — codepen.io/paulradzkov/pen/VbpNGM?editors=1100

Рассмотрим этот селектор:

table tbody > tr:nth-child(n + 11) {
    display: none;
}

Он выбирает все ряды, начиная с 11-го, внутри tbody и скрывает их.
Шапка таблицы должна лежать в thead, тогда она не учитывается и может иметь любое количество рядов.

В последнюю строку таблицы обычно пишут какой-то суммарный результат, для этого есть тег tfoot.
Если поместить последнюю строку в него, то она будет видна в любом состоянии.

Структура таблицы получится такой:

<table>
    <thead>
        <tr>
            <th></th><th></th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th></th><td></td>
        </tr>
    </tfoot>
    <tbody>
        <tr>
            <th></th><td></td>
        </tr>
        ...
        <tr>
            <th></th><td></td>
        </tr>
    </tbody>
</table>

Про GitHub.

1) Любой проект, даже самый маленький начинаю в новом репозитории. Потому что:
- мало ли что из него вырастет,
- код в Гитхабе это бэкап, не засерается место в Дропбоксе или других облаках,
- мгновенный поиск по коду в репозитории, актуально когда проект уже достаточно большой,
- легче спросить совета у коллег или показать проблему, когда исходники можно посмотреть онлайн,
- проект удобно хоронить, если он заглох, или закинуть в портфолио, если он клевый.

2) Создал себе на Гитхабе две дополнительные организации внутри своего аккаунта.
- «paulradzkov-forks» — для форков чужих проектов.
- «paulradzkov-heaven» — кладбище для старых проектов, куда перемещаются все неактуальные проекты.
Эти две дополнительные организации позволяют очистить основной аккаунт от мусора. В нем теперь только несколько актуальных проектов, в которых легко ориентироваться.

3) Перемещаю все старые проекты из Дропбокса на Гитхаб в «paulradzkov-heaven». Проектов много, это долго, но освободилось уже несколько гигов (т.к. там кроме кода psd-исходники, архивы с инсталляторами и прочее). Место в облаках заканчивается, а на Гитхабе — резиновое.
Это кладбище уже пригодилось, когда у меня попросили поискать исходники проекта, над которым я работал 3 или 4 года назад, а я через минуту ответил им ссылкой на нужный репозиторий. Не пришлось никуда лезть, распаковывать, искать, запаковывать, отправлять почтой или закачивать в облако.
Повторюсь, что на Гитхабе классный поиск по исходникам: если нужно посмотреть, как что-то сделал в старом проекте, но не помнишь в каком — можно довольно быстро найти искомое без возни с архивами.

Итого.
Код должен лежать на Гитхабе.
В том числе старые проекты.
Используйте организации, чтобы рассортировать проекты, если их много.
Порядок там, где у каждой вещи есть своё место. Придумайте себе правила порядка заранее и соблюдайте их, чтобы не тратить время на ликвидацию беспорядка.

У инпутов есть атрибут, с помощью которого можно управляться отображаемой клавиатурой на мобильных девайсах — «inputmode».
https://developer.mozilla.org/en-US/docs/Web/HTML/...

Сам не пробовал, но может это вам поможет.

Меня неожиданно и приятно удивил Dropbox Paper. Там есть Markdown, подсветка кода, to do lists с галочками.
Для черновиков очень подходит: автосохранение, доступ даже с мобильного, не нужно задумываться о коммитах, минималистичный интерфейс как у meduim, возможность поделиться документом и обсудить.

https://paper.dropbox.com/

Ну а потом для финальной публикации, вычитки и поддержки — gitbook или что-то своё.

object-fit для нормальных браузеров.
и полифилл для IE/Edge https://github.com/bfred-it/object-fit-images/

caniuse.com/#feat=object-fit