Верхняя панель

Строка Верхней панели располагается над всеми остальными панелями Редактора дизайна и содержит элементы управления проектом.

Видео: Верхняя панель

https://vk.com/video-219751701_456239132

VK Видео | YouTube

Левая часть Верхней панели

В левой части Верхней панели находятся:

• Опция перехода к Панели управления (Go to dashboard) или к Настройкам проекта (Project settings). Меню открывается по клику на логотипе Taptop. Подробнее — Панель управления и Настройки проекта.

• Кнопка переименования проекта (Rename). По клику на текущее название проекта можно задать ему новое название.

• Опции переключения в Режим клиента (Client mode), Режим дизайнера (Design mode) или Режим предварительного просмотра (Preview).

Центральная часть Верхней панели

В центре Верхней панели находятся:

• Кнопка создания компонента (Create component). Позволяет создать компонент из элемента или группы элементов для последующего использования в проекте. Подробнее о компонентах — Компоненты.

• Опция масштаба (Zoom). Позволяет изменять масштаб отображения холста. Можно выбрать значение из предложенного списка или ввести свое значение в пределах от 25% до 200%.

• Опция ширины холста (Canvas width).

Можно ввести свое значение или выбрать из предложенного списка следующие параметры экранов:

• 1920px (Full HD)
• 1440px (Laptop extra large)
• 1366px (Laptop large)
• 1280px (Laptop small)
• 1024px (iPad Pro)
• 768px (iPad)
• 414px (iPhone 6/7/8 Plus)
• 375px (iPhone X)
• 320px (iPhone 5/SE)

• Опция Breakpoints. Позволяет установить размеры экрана, при которых будут меняться стили элементов. Это дает возможность сделать несколько вариантов отображения сайта, обеспечив таким образом его адаптивность для различных устройств. Подробнее — Адаптация под разные устройства.

Доступны следующие Breakpoints:

• Компьютер — Базовый breakpoint (Desktop — Base breakpoint)
• Планшет — 991px и меньше (Tablet — 991px and down)
• Мобильный телефон горизонтальный режим — 767px и меньше (Mobile landscape — 767px and down)
• Мобильный телефон портретный режим — 478px и меньше (Mobile portrait — 478px and down)

Нажав кнопку Добавить большие брейкпоинты, можно также добавить дополнительные брейкпоинты:

• 1280px и больше (1280px and up)
• 1440px и больше (1440px and up)
• 1920px и больше (1920px and up)

Правая часть Верхней панели

В правой части Верхней панели находятся:

• Кнопки Отменить (Undo) и Повторить (Redo).

• Статус сохранения изменений (Сhanges saved/Unsaved changes). Показывает, сохранены или не сохранены последние изменения.

• Кнопка экспорт кода. Позволяет скопировать код текущей страницы для экспорта.

• Кнопка публикации проекта (Publish project). Позволяет опубликовать проект в Интернете с предложенным адресом домена или выбрать для публикации свой домен.

При нажатии кнопки публикации проекта открывается всплывающее окно, в котором отображается статус опубликованных изменений. Чтобы все необходимые страницы сайта были опубликованы, нужно нажать кнопку Опубликовать (Publish) рядом с каждой страницей в списке неопубликованных изменений (Unpublished changes). При нажатии кнопки происходит переключение на соответствующую страницу.